kibi/f0ckm
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

gfsd

Browse Source
This commit is contained in:
kibi
2026-09-11 15:49:06 +02:00
parent 118eda1de0
commit d0bae284ec
11 changed files with 394 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/s/css/f0ckm.css
+142 -86
View File
@@ -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;
}