From 353fc382de49939c6b95013f16fb987a9eaf9fa5 Mon Sep 17 00:00:00 2001
From: Kibi Kelburton <git@f0ck.it>
Date: Thu, 16 Jul 2026 22:46:25 +0200
Subject: [PATCH] banner stuff

---
 public/s/css/f0ckm.css  |  4 ++--
 public/s/js/settings.js | 10 +++++-----
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/public/s/css/f0ckm.css b/public/s/css/f0ckm.css
index 4f2ef8c..677dd6f 100644
--- a/public/s/css/f0ckm.css
+++ b/public/s/css/f0ckm.css
@@ -13903,8 +13903,8 @@ i.iconset#a_oc {
   position: absolute;
   inset: 0;
   background-image: var(--author-banner, none);
-  background-size: cover;
-  background-position: center;
+  background-size: var(--author-banner-size, cover);
+  background-position: var(--author-banner-position, center);
   opacity: 0.3;
   z-index: -1;
   border-radius: inherit;
diff --git a/public/s/js/settings.js b/public/s/js/settings.js
index b1bab93..1bc81f3 100644
--- a/public/s/js/settings.js
+++ b/public/s/js/settings.js
@@ -387,7 +387,7 @@
         const canvas = document.createElement('canvas');
         canvas.className = 'banner-crop-canvas';
         canvas.width = 400;
-        canvas.height = 140;
+        canvas.height = 120;
         canvasWrapper.appendChild(canvas);
 
         const controls = document.createElement('div');
@@ -450,7 +450,7 @@
         const clamp = (val, min, max) => Math.min(Math.max(val, min), max);
 
         const draw = () => {
-            ctx.clearRect(0, 0, 400, 140);
+            ctx.clearRect(0, 0, 400, 120);
             ctx.drawImage(img, panX, panY, img.naturalWidth * zoom, img.naturalHeight * zoom);
             
             // Update hint with live coords/zoom
@@ -460,7 +460,7 @@
         const getBounds = (z) => {
             return {
                 minX: 400 - img.naturalWidth * z,
-                minY: 140 - img.naturalHeight * z
+                minY: 120 - img.naturalHeight * z
             };
         };
 
@@ -603,7 +603,7 @@
         confirmBtn.addEventListener('click', () => {
             // Target output dimensions (3x the preview for high-res)
             const outW = 1200;
-            const outH = 420;
+            const outH = 360;
             const outCanvas = document.createElement('canvas');
             outCanvas.width = outW;
             outCanvas.height = outH;
@@ -688,7 +688,7 @@
                             const newDiv = document.createElement('div');
                             newDiv.id = 'banner-preview';
                             newDiv.className = 'banner-preview-img';
-                            newDiv.style.cssText = `width:100%;aspect-ratio:400/140;border-radius:4px;border:1px solid var(--nav-border-color);background-image:url('/a/${res.banner_file}?t=${Date.now()}');background-size:${payload.banner_size};background-position:${payload.banner_position};background-repeat:no-repeat;`;
+                            newDiv.style.cssText = `width:100%;aspect-ratio:400/120;border-radius:4px;border:1px solid var(--nav-border-color);background-image:url('/a/${res.banner_file}?t=${Date.now()}');background-size:${payload.banner_size};background-position:${payload.banner_position};background-repeat:no-repeat;`;
                             a.appendChild(newDiv);
                             bannerPreview.replaceWith(a);
                         } else {