gfdsgfds

public/s/css/f0ckm.css

@@ -14,6 +14,7 @@
   --gray: #262626;
   --accent: #9f0;
   --accent-rgb: 153, 255, 0;
+  --sidebar-w: 300px;
   --emoji-fav-color: #f5c518;
   --nav-bg: #2b2b2b;
   --nav-brand-border: inset 1px #242424;
@@ -10388,19 +10389,43 @@ div.favs div.posts {
   top: 0;
   left: 0;
   bottom: 0;
-  right: 0;
-  width: 100%;
+  width: calc(100vw - var(--sidebar-w, 300px));
   height: 100%;
   transform: translate3d(0, 0, 0) scale(var(--bg-canvas-zoom, 1.12));
   transform-origin: center center;
   z-index: -2;
-  transition: opacity 1.5s cubic-bezier(0.4, 0, 0.2, 1);
+  transition: opacity 1.5s cubic-bezier(0.4, 0, 0.2, 1), width 0.3s ease-in-out;
   opacity: var(--bg-canvas-opacity, 1.0);
   filter: var(--bg-canvas-filter, none);
   -webkit-filter: var(--bg-canvas-filter, none);
   background-color: var(--bg-canvas-color, transparent);
 }
 
+body.sidebar-right-hidden,
+body:not(:has(.global-sidebar-right)):not(:has(.item-sidebar-right)):not(:has(.index-sidebar-right)) {
+  --sidebar-w: 0px !important;
+}
+
+body.sidebar-right-hidden #bg,
+body:not(:has(.global-sidebar-right)):not(:has(.item-sidebar-right)):not(:has(.index-sidebar-right)) #bg {
+  width: 100vw !important;
+}
+
+@media (min-width: 600px) and (max-width: 999px) {
+  :root {
+    --sidebar-w: min(280px, 80vw);
+  }
+}
+
+@media (max-width: 599px) {
+  :root {
+    --sidebar-w: 0px !important;
+  }
+  #bg {
+    width: 100vw !important;
+  }
+}
+
 button#togglebg {
   display: inline;
   cursor: pointer;
@@ -20863,7 +20888,7 @@ body.onara-modal-open #bg.fader-out,
 body.onara-modal-open #bg.fast-fade {
   z-index: 51 !important;
   cursor: pointer !important;
-  transition: none !important;
+  transition: width 0.3s ease-in-out !important;
   animation: none !important;
   opacity: var(--bg-canvas-opacity, 1.0) !important;
 }
@@ -20916,7 +20941,7 @@ body.onara-modal-open .admin-bar.open {
   top: var(--navbar-h, 50px) !important;
   bottom: 0 !important;
   left: 0 !important;
-  right: 300px !important;
+  right: var(--sidebar-w, 300px) !important;
   width: auto !important;
   height: calc(100vh - var(--navbar-h, 50px)) !important;
   z-index: 10050 !important;