diff --git a/shared/components/rstack-identity.ts b/shared/components/rstack-identity.ts
index 793d631..7991d4e 100644
--- a/shared/components/rstack-identity.ts
+++ b/shared/components/rstack-identity.ts
@@ -382,6 +382,10 @@ export class RStackIdentity extends HTMLElement {
+
+
+
+
☀️
@@ -431,6 +435,16 @@ export class RStackIdentity extends HTMLElement {
this.#showSpacesModal();
} else if (action === "my-wallets") {
this.#showWalletsModal();
+ } else if (action === "notifications") {
+ (document.querySelector("rstack-notification-bell") as any)?.toggle();
+ } else if (action === "share") {
+ if (navigator.share) {
+ navigator.share({ url: location.href, title: document.title }).catch(() => {});
+ } else {
+ (document.querySelector("rstack-share-panel") as any)?.toggle();
+ }
+ } else if (action === "settings") {
+ (document.getElementById("settings-btn") as HTMLElement)?.click();
}
});
});
@@ -1530,6 +1544,13 @@ const STYLES = `
.dropdown-divider { height: 1px; margin: 4px 0; }
.dropdown-divider { background: var(--rs-border-subtle); }
+/* Mobile-only items — hidden on desktop, shown on mobile */
+.mobile-only { display: none; }
+@media (max-width: 640px) {
+ .mobile-only { display: flex; }
+ .mobile-only.dropdown-divider { display: block; }
+}
+
/* Theme toggle in dropdown */
.dropdown-theme-row {
display: flex; align-items: center; justify-content: center;
diff --git a/shared/components/rstack-notification-bell.ts b/shared/components/rstack-notification-bell.ts
index b82f0e8..83ca47f 100644
--- a/shared/components/rstack-notification-bell.ts
+++ b/shared/components/rstack-notification-bell.ts
@@ -282,6 +282,9 @@ export class RStackNotificationBell extends HTMLElement {
}
}
+ /** Public toggle — called from identity dropdown on mobile */
+ toggle() { this.#togglePanel(); }
+
#togglePanel() {
this.#open = !this.#open;
if (this.#open && this.#notifications.length === 0) {
@@ -623,4 +626,16 @@ const STYLES = `
.notif-dismiss:hover {
color: var(--rs-text-primary, #e2e8f0);
}
+
+@media (max-width: 640px) {
+ .bell-btn { display: none; }
+ .panel {
+ position: fixed;
+ top: 60px;
+ right: 8px;
+ left: 8px;
+ width: auto;
+ max-height: calc(100vh - 80px);
+ }
+}
`;
diff --git a/shared/components/rstack-share-panel.ts b/shared/components/rstack-share-panel.ts
index 1c539bd..73d5c18 100644
--- a/shared/components/rstack-share-panel.ts
+++ b/shared/components/rstack-share-panel.ts
@@ -31,6 +31,9 @@ export class RStackSharePanel extends HTMLElement {
return document.body?.dataset?.spaceSlug || "";
}
+ /** Public toggle — called from identity dropdown on mobile */
+ toggle() { this.#togglePanel(); }
+
#togglePanel() {
this.#open = !this.#open;
this.#render();
@@ -359,4 +362,15 @@ label {
.btn-blue:hover {
background: #2563eb;
}
+
+@media (max-width: 640px) {
+ .share-btn { display: none; }
+ .panel {
+ position: fixed;
+ top: 60px;
+ right: 8px;
+ left: 8px;
+ width: auto;
+ }
+}
`;
diff --git a/website/public/shell.css b/website/public/shell.css
index 76c8d4a..6ddccad 100644
--- a/website/public/shell.css
+++ b/website/public/shell.css
@@ -413,6 +413,8 @@ body.rstack-sidebar-open #toolbar {
flex-wrap: wrap;
gap: 6px;
}
+ /* Hide settings gear on mobile — accessible via identity dropdown */
+ .rstack-header__settings-btn { display: none; }
/* Sidebar overlays on mobile — no push offsets */
body.rstack-sidebar-open .rstack-tab-row { left: 0; }
body.rstack-sidebar-open #app { margin-left: 0; }