gfsd
This commit is contained in:
+142
-86
@@ -3226,7 +3226,12 @@ body.sidebar-right-hidden #sidebar-drag-zone {
|
||||
#main:fullscreen .item-layout-container .item-main-content>.item_title,
|
||||
#main:fullscreen .item-layout-container .item-main-content>.content,
|
||||
#main:fullscreen .item-layout-container .item-main-content>.metadata,
|
||||
#main:fullscreen .item-layout-container .item-main-content #comments-container {
|
||||
#main:fullscreen .item-layout-container .item-main-content #comments-container,
|
||||
#onara-modal:fullscreen .item-layout-container .item-main-content>._204863,
|
||||
#onara-modal:fullscreen .item-layout-container .item-main-content>.item_title,
|
||||
#onara-modal:fullscreen .item-layout-container .item-main-content>.content,
|
||||
#onara-modal:fullscreen .item-layout-container .item-main-content>.metadata,
|
||||
#onara-modal:fullscreen .item-layout-container .item-main-content #comments-container {
|
||||
z-index: auto;
|
||||
}
|
||||
|
||||
@@ -5060,10 +5065,25 @@ html[res="fullscreen"] span#favs {
|
||||
}
|
||||
|
||||
/* Linux Firefox "thin" is often too small and hard to see. Use auto there. */
|
||||
html.is-linux.is-firefox * {
|
||||
html.is-linux.is-firefox *:not(html):not(body) {
|
||||
scrollbar-width: auto;
|
||||
}
|
||||
|
||||
/* Strictly hide root body and html scrollbar everywhere - eliminates gutter spacing */
|
||||
html,
|
||||
body {
|
||||
scrollbar-gutter: auto !important;
|
||||
scrollbar-width: none !important;
|
||||
-ms-overflow-style: none !important;
|
||||
}
|
||||
|
||||
html::-webkit-scrollbar,
|
||||
body::-webkit-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
|
||||
*,
|
||||
::before,
|
||||
::after {
|
||||
@@ -5092,12 +5112,16 @@ body {
|
||||
line-height: 2;
|
||||
overflow-x: hidden;
|
||||
font-size: medium;
|
||||
scrollbar-width: none !important;
|
||||
-ms-overflow-style: none !important;
|
||||
}
|
||||
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
scrollbar-gutter: stable;
|
||||
scrollbar-gutter: auto !important;
|
||||
scrollbar-width: none !important;
|
||||
-ms-overflow-style: none !important;
|
||||
}
|
||||
|
||||
|
||||
@@ -5877,15 +5901,56 @@ body.layout-modern.sidebar-right-hidden .pagination-container-fluid {
|
||||
padding-left: 5px;
|
||||
} */
|
||||
|
||||
/* ===== Viewport Locking for Index/Feed Page Layout ===== */
|
||||
html:has(.index-container),
|
||||
body:has(.index-container) {
|
||||
height: 100vh !important;
|
||||
height: 100dvh !important;
|
||||
max-height: 100vh !important;
|
||||
max-height: 100dvh !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
.pagewrapper:has(.index-container),
|
||||
body:has(.index-container) > .pagewrapper {
|
||||
height: calc(100vh - var(--navbar-h, 50px)) !important;
|
||||
height: calc(100dvh - var(--navbar-h, 50px)) !important;
|
||||
max-height: calc(100vh - var(--navbar-h, 50px)) !important;
|
||||
max-height: calc(100dvh - var(--navbar-h, 50px)) !important;
|
||||
overflow: hidden !important;
|
||||
padding: 0 !important;
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
}
|
||||
|
||||
#main:has(.index-container),
|
||||
body:has(.index-container) > .pagewrapper > #main {
|
||||
height: 100% !important;
|
||||
max-height: 100% !important;
|
||||
overflow: hidden !important;
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
flex: 1 1 auto !important;
|
||||
min-height: 0 !important;
|
||||
}
|
||||
|
||||
/* Index page layout with sidebar */
|
||||
.index-layout-wrapper {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: calc(100vh - var(--navbar-h, 50px)) !important;
|
||||
height: calc(100dvh - var(--navbar-h, 50px)) !important;
|
||||
max-height: calc(100vh - var(--navbar-h, 50px)) !important;
|
||||
max-height: calc(100dvh - var(--navbar-h, 50px)) !important;
|
||||
min-height: 0 !important;
|
||||
flex: 1 1 auto !important;
|
||||
overflow: hidden !important;
|
||||
box-sizing: border-box;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.index-layout-wrapper .index-container {
|
||||
flex: 1;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
@@ -5909,8 +5974,19 @@ body.layout-modern.sidebar-right-hidden .pagination-container-fluid {
|
||||
|
||||
.index-container {
|
||||
width: 100%;
|
||||
padding: 5px;
|
||||
margin: 0px 20px 0px 20px;
|
||||
height: calc(100vh - var(--navbar-h, 50px)) !important;
|
||||
height: calc(100dvh - var(--navbar-h, 50px)) !important;
|
||||
max-height: calc(100vh - var(--navbar-h, 50px)) !important;
|
||||
max-height: calc(100dvh - var(--navbar-h, 50px)) !important;
|
||||
min-height: 0 !important;
|
||||
flex: 1 1 auto !important;
|
||||
overflow-y: auto !important;
|
||||
overflow-x: hidden !important;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overscroll-behavior-y: contain;
|
||||
box-sizing: border-box;
|
||||
padding: 5px 20px 75px 20px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 361px) {
|
||||
@@ -6767,8 +6843,9 @@ a.removetag i {
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.index-container {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11181,6 +11258,7 @@ html[theme="orange"] .image-brand {
|
||||
text-align: left;
|
||||
max-width: 100vw;
|
||||
overflow-x: clip;
|
||||
scrollbar-width: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11194,12 +11272,6 @@ html[theme="orange"] .image-brand {
|
||||
|
||||
|
||||
|
||||
.navbar {
|
||||
border-bottom: none;
|
||||
/* padding: 5px; */
|
||||
/* testing if it works good */
|
||||
}
|
||||
|
||||
.image-brand {
|
||||
width: 4cm;
|
||||
}
|
||||
@@ -11248,35 +11320,7 @@ html[theme="orange"] .image-brand {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 1056px) {
|
||||
.navigation-links {
|
||||
display: grid;
|
||||
grid-row: 1;
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
grid-row: 1;
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
#navbarSupportedContent {
|
||||
grid-row: 1;
|
||||
grid-column: 3;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
grid-template-columns: 0fr 1fr auto !important;
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
.navbar-nav {
|
||||
display: grid !important;
|
||||
grid-template-rows: auto;
|
||||
grid-template-columns: auto auto 1fr;
|
||||
grid-gap: 0.25em;
|
||||
}
|
||||
}
|
||||
/* Navbar grid layout removed for modern-navbar compatibility */
|
||||
|
||||
.bg-black {
|
||||
background: #0000008a !important;
|
||||
@@ -11321,48 +11365,40 @@ div.sbt {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.navigation-links {
|
||||
display: grid;
|
||||
grid-row: 1;
|
||||
grid-column: 2;
|
||||
grid-template-columns: auto auto 1fr;
|
||||
}
|
||||
|
||||
.navigation-links-guest,
|
||||
ol {
|
||||
margin: 5px;
|
||||
margin-block-start: 0;
|
||||
margin-block-end: 0;
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
|
||||
/* === VIEW-SPECIFIC STYLES === */
|
||||
|
||||
/* === NAVBAR STYLES === */
|
||||
|
||||
/* ── Desktop layout: single flex row ── */
|
||||
.navbar {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1005;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
/* allows motd-container to wrap to its own full-width row */
|
||||
/* ── Always-visible sticky navbar ── */
|
||||
.navbar,
|
||||
body > nav.navbar {
|
||||
position: sticky !important;
|
||||
top: 0 !important;
|
||||
z-index: 1005 !important;
|
||||
width: 100% !important;
|
||||
display: flex !important;
|
||||
flex-direction: row !important;
|
||||
align-items: center !important;
|
||||
flex-wrap: wrap !important;
|
||||
flex-shrink: 0 !important;
|
||||
min-height: 42px !important;
|
||||
box-sizing: border-box !important;
|
||||
font-family: var(--font);
|
||||
border-bottom: 1px solid var(--nav-border-color);
|
||||
background: var(--nav-bg);
|
||||
background: var(--nav-bg) !important;
|
||||
visibility: visible !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
/* Brand: always visible, flush left */
|
||||
.navbar-brand {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
flex-shrink: 0 !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
height: 40px !important;
|
||||
max-width: 180px;
|
||||
visibility: visible !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
/* Nav collapse: fills middle, always visible on desktop */
|
||||
@@ -12619,12 +12655,6 @@ div.posts>a::after {
|
||||
}
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
border-bottom: 1px solid var(--nav-bg);
|
||||
box-shadow: 1px 1px 1px #000;
|
||||
}
|
||||
|
||||
body.layout-modern .navbar-header,
|
||||
body.layout-legacy .navbar-header {
|
||||
background: transparent;
|
||||
@@ -12647,8 +12677,8 @@ body.layout-legacy .navbar-header {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* Viewport lock to enable full app view and prevent scrollbars */
|
||||
body.layout-modern:has(.item-layout-container) {
|
||||
/* Viewport lock to enable full app view and prevent scrollbars (standalone item view only) */
|
||||
body.layout-modern:not(.onara-modal-open):has(> .pagewrapper .item-layout-container) {
|
||||
overflow: hidden;
|
||||
height: 100vh;
|
||||
}
|
||||
@@ -12665,15 +12695,15 @@ body.layout-legacy .navbar-header {
|
||||
/* overridden to 300px by sidebar rule below for generic pages */
|
||||
}
|
||||
|
||||
body.layout-modern:has(.item-layout-container)>.pagewrapper {
|
||||
body.layout-modern:not(.onara-modal-open):has(> .pagewrapper .item-layout-container)>.pagewrapper {
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
height: calc(100vh - var(--navbar-h, 50px));
|
||||
}
|
||||
|
||||
|
||||
body.layout-modern:has(.item-layout-container)>.pagewrapper>#main,
|
||||
body.layout-modern:has(.item-layout-container)>#main {
|
||||
body.layout-modern:not(.onara-modal-open):has(> .pagewrapper .item-layout-container)>.pagewrapper>#main,
|
||||
body.layout-modern:not(.onara-modal-open):has(> .pagewrapper .item-layout-container)>#main {
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
@@ -18701,7 +18731,12 @@ a.lazy-thumb.filtered-upload-ghost:hover::after {
|
||||
/* Prevent scrolling on background document when Onara modal is active */
|
||||
body.onara-modal-open {
|
||||
overflow: hidden !important;
|
||||
scrollbar-gutter: stable !important;
|
||||
}
|
||||
|
||||
/* Override html's scrollbar-gutter: stable so the page fills full viewport width */
|
||||
html:has(body.onara-modal-open) {
|
||||
overflow: hidden !important;
|
||||
scrollbar-gutter: auto !important;
|
||||
}
|
||||
|
||||
/* Background main page elements (outside posts) are dimmed and softly blurred */
|
||||
@@ -18756,9 +18791,16 @@ body.onara-modal-open nav.navbar {
|
||||
z-index: 10060 !important;
|
||||
position: sticky !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* Ensure hamburger dropdown is interactive and above the Onara modal */
|
||||
body.onara-modal-open nav.navbar .nav-collapse {
|
||||
z-index: 10065 !important;
|
||||
pointer-events: auto !important;
|
||||
}
|
||||
|
||||
body.onara-modal-open .global-sidebar-right {
|
||||
opacity: 1 !important;
|
||||
filter: none !important;
|
||||
@@ -18983,4 +19025,18 @@ body.onara-modal-open #upload-drag-modal,
|
||||
body.onara-modal-open #rethumb-capture-modal,
|
||||
body.onara-modal-open #gchat-img-modal {
|
||||
z-index: 100100 !important;
|
||||
}
|
||||
|
||||
#onara-modal:fullscreen {
|
||||
overflow: hidden !important;
|
||||
background: #000 !important;
|
||||
}
|
||||
|
||||
#onara-modal:fullscreen .onara-backdrop {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#onara-modal:fullscreen .onara-modal-content {
|
||||
overflow: hidden !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
+12
-11
@@ -14,15 +14,10 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.v0ck.v0ck_fullscreen {
|
||||
max-width: none;
|
||||
max-height: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
#main:fullscreen .v0ck.v0ck_fullscreen {
|
||||
.v0ck:fullscreen,
|
||||
.v0ck.v0ck_fullscreen,
|
||||
#main:fullscreen .v0ck.v0ck_fullscreen,
|
||||
#onara-modal:fullscreen .v0ck.v0ck_fullscreen {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@@ -39,7 +34,10 @@
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#main:fullscreen .v0ck.v0ck_fullscreen video {
|
||||
.v0ck:fullscreen video,
|
||||
.v0ck.v0ck_fullscreen video,
|
||||
#main:fullscreen .v0ck.v0ck_fullscreen video,
|
||||
#onara-modal:fullscreen .v0ck.v0ck_fullscreen video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
@@ -47,7 +45,10 @@
|
||||
}
|
||||
|
||||
/* Audio in fullscreen: hide the invisible audio element, show cover art via background */
|
||||
#main:fullscreen .v0ck.v0ck_fullscreen audio {
|
||||
.v0ck:fullscreen audio,
|
||||
.v0ck.v0ck_fullscreen audio,
|
||||
#main:fullscreen .v0ck.v0ck_fullscreen audio,
|
||||
#onara-modal:fullscreen .v0ck.v0ck_fullscreen audio {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user