cottongin/reddit-tweaks-ffe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add card layout controls to extension popup

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
cottongin
2026-08-26 21:15:40 -04:00
parent 5521e39a66
commit 7b0c80c0a4
2 changed files with 30 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
popup/popup.html
View File

@@ -28,6 +28,27 @@
</select> </select>
</div> </div>
<div class="section">
<h2>Card Layout</h2>
<label class="toggle-row">
<span>Enable card layout</span>
<input type="checkbox" id="cardLayout">
</label>
<label for="cardBackground">Background Style</label>
<select id="cardBackground">
<option value="reddit">Reddit Default</option>
<option value="shadcn">shadcn Style</option>
</select>
<label for="cardGap">Card Spacing</label>
<select id="cardGap">
<option value="8">8px</option>
<option value="12">12px</option>
<option value="16">16px</option>
<option value="24">24px</option>
<option value="32">32px</option>
</select>
</div>
<div class="section"> <div class="section">
<h2>Light Mode Colors</h2> <h2>Light Mode Colors</h2>
<fieldset> <fieldset>

9
popup/popup.js
View File

@@ -70,6 +70,9 @@
document.getElementById("enabled").checked = settings.enabled; document.getElementById("enabled").checked = settings.enabled;
document.getElementById("badgeLayout").checked = settings.badgeLayout; document.getElementById("badgeLayout").checked = settings.badgeLayout;
document.getElementById("darkMode").value = settings.darkMode; document.getElementById("darkMode").value = settings.darkMode;
document.getElementById("cardLayout").checked = settings.cardLayout;
document.getElementById("cardBackground").value = settings.cardBackground;
document.getElementById("cardGap").value = String(settings.cardGap);
COLOR_KEYS.forEach(function (key) { COLOR_KEYS.forEach(function (key) {
var el = document.getElementById(key); var el = document.getElementById(key);
@@ -283,6 +286,9 @@
enabled: document.getElementById("enabled").checked, enabled: document.getElementById("enabled").checked,
badgeLayout: document.getElementById("badgeLayout").checked, badgeLayout: document.getElementById("badgeLayout").checked,
darkMode: document.getElementById("darkMode").value, darkMode: document.getElementById("darkMode").value,
cardLayout: document.getElementById("cardLayout").checked,
cardBackground: document.getElementById("cardBackground").value,
cardGap: parseInt(document.getElementById("cardGap").value, 10),
subredditColors: collectSubredditOverrides(), subredditColors: collectSubredditOverrides(),
}; };
@@ -305,6 +311,9 @@
document.getElementById("enabled").addEventListener("change", saveFromControls); document.getElementById("enabled").addEventListener("change", saveFromControls);
document.getElementById("badgeLayout").addEventListener("change", saveFromControls); document.getElementById("badgeLayout").addEventListener("change", saveFromControls);
document.getElementById("darkMode").addEventListener("change", saveFromControls); document.getElementById("darkMode").addEventListener("change", saveFromControls);
document.getElementById("cardLayout").addEventListener("change", saveFromControls);
document.getElementById("cardBackground").addEventListener("change", saveFromControls);
document.getElementById("cardGap").addEventListener("change", saveFromControls);
COLOR_KEYS.forEach(function (key) { COLOR_KEYS.forEach(function (key) {
var el = document.getElementById(key); var el = document.getElementById(key);