@@ -166,7 +179,8 @@ withDefaults(
top: calc(var(--top-bar-height, 3rem) + 1.5rem);
right: 1.5rem;
z-index: 200;
- width: 400px;
+ width: 520px;
+ max-width: calc(100vw - 3rem);
display: flex;
flex-direction: column;
gap: 0.75rem;
@@ -179,6 +193,7 @@ withDefaults(
@media screen and (max-width: 500px) {
.popup-notification-group {
width: calc(100% - 1.5rem);
+ max-width: none;
right: 0.75rem;
}
}
diff --git a/packages/ui/src/components/servers/index.ts b/packages/ui/src/components/servers/index.ts
index e14e47cd2..e8f4f5d45 100644
--- a/packages/ui/src/components/servers/index.ts
+++ b/packages/ui/src/components/servers/index.ts
@@ -5,6 +5,8 @@ export * from './icons'
export { default as InstallingBanner } from './InstallingBanner.vue'
export * from './labels'
export * from './marketing'
+export { default as ModrinthHostingLogo } from './ModrinthServersIcon.vue'
+export { default as ModrinthServersIcon } from './ModrinthServersIcon.vue'
export { default as SaveBanner } from './SaveBanner.vue'
export * from './server-header'
export { default as ServerListEmpty } from './server-list-empty/ServerListEmpty.vue'
diff --git a/packages/ui/src/providers/popup-notifications.ts b/packages/ui/src/providers/popup-notifications.ts
index 5cd049c1e..f9dff9bf5 100644
--- a/packages/ui/src/providers/popup-notifications.ts
+++ b/packages/ui/src/providers/popup-notifications.ts
@@ -1,8 +1,11 @@
+import type { Component } from 'vue'
+
import { createContext } from '.'
export interface PopupNotificationButton {
label: string
action: () => void
+ icon?: Component
color?: 'brand' | 'red' | 'orange' | 'green' | 'blue' | 'standard'
keepOpen?: boolean
}
@@ -18,6 +21,9 @@ export interface PopupNotificationProgressItem {
export interface PopupNotification {
id: string | number
title: string
+ titleLogo?: Component
+ bodyComponent?: Component
+ bodyProps?: Record
text?: string
type?: 'error' | 'warning' | 'success' | 'info' | 'download'
progress?: number