Add Shared Media drawer and harden same-room navigation.

Widen the media panel, support skinny full-page mode, keep jump-to-latest and return-to-previous reliable, and stop same-room event jumps from remounting the outlet or yanking the sidebar.
This commit is contained in:
2026-07-23 14:52:01 +10:00
parent 61d41900cc
commit 9509a9705e
30 changed files with 1749 additions and 168 deletions

View File

@@ -259,24 +259,35 @@ body.stationery-dark-theme {
transition: width 0.2s ease;
}
/* Scrollbar styling */
/* Scrollbar styling — transparent until hover so Folds Hover/hideTrack
scroll areas (e.g. message composer) don't show a permanent side bar */
.twilight-theme ::-webkit-scrollbar {
width: 10px;
height: 10px;
}
.twilight-theme ::-webkit-scrollbar-track {
background: rgba(20, 18, 31, 0.5);
background: transparent;
}
.twilight-theme ::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, #3E3A6A 0%, #565096 100%);
background: transparent;
border-radius: 5px;
border: 2px solid rgba(20, 18, 31, 0.5);
transition: background 0.2s ease;
border: 2px solid transparent;
background-clip: padding-box;
transition: background 0.2s ease, border-color 0.2s ease;
}
.twilight-theme ::-webkit-scrollbar-thumb:hover {
.twilight-theme *:hover::-webkit-scrollbar-track {
background: rgba(20, 18, 31, 0.5);
}
.twilight-theme *:hover::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, #3E3A6A 0%, #565096 100%);
border-color: rgba(20, 18, 31, 0.5);
}
.twilight-theme *:hover::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, #4A4580 0%, #625BAC 100%);
}
@@ -357,24 +368,34 @@ body.stationery-dark-theme {
transition: width 0.2s ease;
}
/* Scrollbar styling */
/* Scrollbar styling — transparent until hover (see twilight note above) */
.mocha-theme ::-webkit-scrollbar {
width: 10px;
height: 10px;
}
.mocha-theme ::-webkit-scrollbar-track {
background: rgba(26, 22, 20, 0.5);
background: transparent;
}
.mocha-theme ::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, #54493F 0%, #706151 100%);
background: transparent;
border-radius: 5px;
border: 2px solid rgba(26, 22, 20, 0.5);
transition: background 0.2s ease;
border: 2px solid transparent;
background-clip: padding-box;
transition: background 0.2s ease, border-color 0.2s ease;
}
.mocha-theme ::-webkit-scrollbar-thumb:hover {
.mocha-theme *:hover::-webkit-scrollbar-track {
background: rgba(26, 22, 20, 0.5);
}
.mocha-theme *:hover::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, #54493F 0%, #706151 100%);
border-color: rgba(26, 22, 20, 0.5);
}
.mocha-theme *:hover::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, #625548 0%, #7E6D5A 100%);
}
@@ -1762,16 +1783,26 @@ body.stationery-dark-theme {
}
.stationery ::-webkit-scrollbar-track {
background: color-mix(in srgb, var(--manila) 45%, transparent);
background: transparent;
}
.stationery ::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, var(--manila-deep) 0%, var(--manila-edge) 100%);
background: transparent;
border-radius: 2px;
border: 2px solid color-mix(in srgb, var(--manila) 45%, transparent);
border: 2px solid transparent;
background-clip: padding-box;
}
.stationery ::-webkit-scrollbar-thumb:hover {
.stationery *:hover::-webkit-scrollbar-track {
background: color-mix(in srgb, var(--manila) 45%, transparent);
}
.stationery *:hover::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, var(--manila-deep) 0%, var(--manila-edge) 100%);
border-color: color-mix(in srgb, var(--manila) 45%, transparent);
}
.stationery *:hover::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, var(--manila-edge) 0%, var(--manila-dark) 100%);
}