From bbfb7309bddf7bd56964dc034091da9cff9f0089 Mon Sep 17 00:00:00 2001
From: Guy Sandler <guy@sandler.co.il>
Date: Mon, 26 Jan 2026 13:30:52 -0800
Subject: [PATCH] started card settings

---
 README.md        |  6 +++++-
 html/popup.html  | 27 +++++++++++++++++++++++++++
 js/background.js |  2 +-
 js/popup.js      | 14 +++++++++++++-
 4 files changed, 46 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index fe467d7..9d56aae 100644
--- a/README.md
+++ b/README.md
@@ -62,7 +62,7 @@ Better Canvas introduces improvements to the Canvas user interface:
 - custom side logo
 - widgets (music, timer)
 - fix darkmode fixer
-- more card settings (Image Size, Roundness, Width, Space Between)
+- more card settings (Image Size, Roundness, Width, Space Between) (in progress, to be theme compatible)
 - calender sync
 - update better todo list
 - better sidebar
@@ -321,6 +321,10 @@ here is some proof the lisence was changed and this is based on the reverted MIT
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
+[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC_BY--NC--SA_4.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/)
+
+You can fork, modify, and use this code however you like with attributes, but no commercial use.
+
 ![Better Canvas](/icon/icon-48.png)
 
 Copyright (c) 2026 Guy Sandler
diff --git a/html/popup.html b/html/popup.html
index 069a09b..a535a24 100644
--- a/html/popup.html
+++ b/html/popup.html
@@ -669,6 +669,33 @@
             <div id="advanced-current"></div>
             <div id="advanced-past"></div>
         </div>
+        <div class="option-container">
+            <h3 class="header-small">More Card Styles</h3>
+            <!-- Image Size, Roundness, Width, Space Between -->
+            <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px;">
+                <div class="sub-option">
+                    <div style="margin-top: 5px;display: flex;gap: 8px;align-items: center">
+                        <span class="sub-text" style="width:75px;">Image Size</span>
+                        <input type="number" id="imageSize" class="card-input" min="0" max="300" value="1" style="width:80px;">
+                        <span class="sub-text">px</span>
+                    </div>
+                </div>
+                <div class="sub-option">
+                    <div style="margin-top: 5px;display: flex;gap: 8px;align-items: center">
+                        <span class="sub-text" style="width:75px;">Card Roundness</span>
+                        <input type="number" id="cardRoundness" class="card-input" min="0" max="300" value="1" style="width:80px;">
+                        <span class="sub-text">px</span>
+                    </div>
+                </div>
+                <div class="sub-option">
+                    <div style="margin-top: 5px;display: flex;gap: 8px;align-items: center">
+                        <span class="sub-text" style="width:75px;">Card Spacing</span>
+                        <input type="number" id="cardSpacing" class="card-input" min="0" max="300" value="1" style="width: 80px;">
+                        <span class="sub-text">px</span>
+                    </div>
+                </div>
+            </div>
+        </div>
         <div class="option-container">
             <h3 class="header-small">Missing cards?</h3>
             <div style="display: flex; gap: 10px; align-items: center;">
diff --git a/js/background.js b/js/background.js
index 84d7c26..1b84016 100644
--- a/js/background.js
+++ b/js/background.js
@@ -128,4 +128,4 @@ chrome.runtime.onInstalled.addListener(function () {
     });
 });
 
-chrome.runtime.setUninstallURL("https://diditupe.dev/bettercanvas/goodbye");
+// chrome.runtime.setUninstallURL("https://diditupe.dev/bettercanvas/goodbye");
diff --git a/js/popup.js b/js/popup.js
index 274cf85..c87802d 100644
--- a/js/popup.js
+++ b/js/popup.js
@@ -623,7 +623,19 @@ function setup() {
             "F": { "cutoff": 0, "gpa": 0 }
         });
     });
-
+    
+    document.getElementById("imageSize").addEventListener("input", (e) => {
+        chrome.storage.sync.set({"imageSize": parseInt(e.target.value)});
+        sendFromPopup("updateCardStyles", { imageSize: parseInt(e.target.value) });
+    })
+    document.getElementById("cardRoundness").addEventListener("input", (e) => {
+        chrome.storage.sync.set({"cardRoundness": parseInt(e.target.value)});
+        sendFromPopup("updateCardStyles", { cardRoundness: parseInt(e.target.value) });
+    })
+    document.getElementById("cardSpacing").addEventListener("input", (e) => {
+        chrome.storage.sync.set({"cardSpacing": parseInt(e.target.value)});
+        sendFromPopup("updateCardStyles", { cardSpacing: parseInt(e.target.value) });
+    })
 }
 
 function applyGPAPreset(bounds) {