thePR0M3TH3AN/bitvid
1
0 Fork 0
mirror of https://github.com/PR0M3TH3AN/bitvid.git synced 2026-10-27 07:52:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Tighten collapsed sidebar rail spacing

Browse Source
This commit is contained in:
thePR0M3TH3AN committed 2025-10-06 17:46:02 -04:00
1 parent 2bafecfb50
commit 58fd6ef7d5
9 files changed
+29 -28
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

AGENTS.md
+1
View File
@@ -72,6 +72,7 @@ Document the run in PR descriptions so QA can cross-reference results.
* **Sidebar layering:** Keep the fixed sidebar below every modal and overlay. Respect the `--z-sidebar*` tokens so dialogs always render on top of the navigation.
* **Static asset cache busting:** The CDN aggressively caches `components/sidebar.html` and CSS/JS bundles. Update `config/asset-version.js` and keep the `?v=` query strings in `index.html` (and iframe form shells) in sync whenever you change sidebar markup, scripts, or styles. The fetch helpers in `js/index.js` already append `cache: "no-store"`; reuse them for new partials so desktop collapses ship immediately without waiting on manual cache clears.
* **Sidebar overflow styling:** Desktop media queries in `css/style.css` used to force `overflow-x: hidden` on `#sidebar`, which clipped the navigation panel’s drop shadow. When adjusting rail dimensions, update both the base `#sidebar` rule and the desktop override so the gradient card can bleed over the white canvas. `#sidebarContainer` now keeps overflow visible while `.sidebar__inner` handles scrolling; stick with that division when extending the layout.
* **Collapsed rail padding:** The collapsed rail keeps icons full-size by pairing reduced padding on `.sidebar__inner`, `.sidebar-panel`, and `.sidebar-nav-link`. Update the trio together so 4 rem still fits the 2.75 rem toggle button and 1.5 rem glyphs without squishing the gradients.
---
components/iframe_forms/iframe-application-form.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<title>bitvid Whitelist Application Form</title>
<!-- Link to your main stylesheet -->
<link rel="stylesheet" href="../../css/style.css?v=2024.10.12" />
<link rel="stylesheet" href="../../css/style.css?v=2024.10.13" />
<style>
/* Override for form page to match modal field styling */
components/iframe_forms/iframe-bug-fix-form.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<title>bitvid Bug Report Form</title>
<!-- Link to your main stylesheet -->
<link rel="stylesheet" href="../../css/style.css?v=2024.10.12" />
<link rel="stylesheet" href="../../css/style.css?v=2024.10.13" />
<style>
/* Override for form page to match modal field styling */
components/iframe_forms/iframe-content-appeals-form.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<title>bitvid Content Appeals Form</title>
<!-- Link to your main stylesheet -->
<link rel="stylesheet" href="../../css/style.css?v=2024.10.12" />
<link rel="stylesheet" href="../../css/style.css?v=2024.10.13" />
<style>
/* Override for form page to match modal field styling */
components/iframe_forms/iframe-feedback-form.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<title>bitvid General Feedback Form</title>
<!-- Link to your main stylesheet -->
<link rel="stylesheet" href="../../css/style.css?v=2024.10.12" />
<link rel="stylesheet" href="../../css/style.css?v=2024.10.13" />
<style>
/* Override for form page to match modal field styling */
components/iframe_forms/iframe-request-form.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<title>bitvid Feature Request Form</title>
<!-- Link to your main stylesheet -->
<link rel="stylesheet" href="../../css/style.css?v=2024.10.12" />
<link rel="stylesheet" href="../../css/style.css?v=2024.10.13" />
<style>
/* Override for form page to match modal field styling */
config/asset-version.js
+1 -1
View File
@@ -1 +1 @@
export const ASSET_VERSION = "2024.10.12";
export const ASSET_VERSION = "2024.10.13";
css/style.css
+8 -8
View File
@@ -1781,10 +1781,10 @@ body.sidebar-open #sidebarOverlay {
body.sidebar-collapsed #sidebar .sidebar-nav-link,
#sidebar.sidebar-collapsed .sidebar-nav-link {
/*
Center the icon rail in collapsed mode without altering icon sizing so
the glyphs remain consistent between states.
Keep icons centered in the collapsed rail without resizing them.
*/
justify-content: center;
padding-inline: 0.5rem;
}
body.sidebar-expanded #sidebar .sidebar-nav-link,
@@ -1800,19 +1800,19 @@ body.sidebar-open #sidebarOverlay {
body.sidebar-collapsed #sidebar .sidebar__inner,
#sidebar.sidebar-collapsed .sidebar__inner {
/*
Trim horizontal padding aggressively enough for the icon rail to remain
visible inside the 4rem track while still giving the panel breathing room.
Keep enough breathing room for the panel shadow while widening the
interior track so 2.75rem controls stay perfectly round.
*/
padding-inline: 0.625rem;
padding-inline: 0.25rem;
}
body.sidebar-collapsed #sidebar .sidebar-panel,
#sidebar.sidebar-collapsed .sidebar-panel {
/*
Match the outer adjustment while keeping the rounded gradient card
intact. This spacing ensures 1.5rem icons can render without being clipped.
Mirror the outer adjustment so the gradient card retains its rounded
edges without squeezing the icon rail.
*/
padding-inline: 0.375rem;
padding-inline: 0.25rem;
}
#sidebar .sidebar-toggle-icon--rotated {
index.html
+14 -14
View File
@@ -50,10 +50,10 @@
so browsers pick up the latest sidebar markup and styling without
hard-refreshing around CDN caches.
-->
<script src="js/tracking.js?v=2024.10.12" defer></script>
<link href="css/tailwind.generated.css?v=2024.10.12" rel="stylesheet" />
<link href="css/style.css?v=2024.10.12" rel="stylesheet" />
<link href="css/markdown.css?v=2024.10.12" rel="stylesheet" />
<script src="js/tracking.js?v=2024.10.13" defer></script>
<link href="css/tailwind.generated.css?v=2024.10.13" rel="stylesheet" />
<link href="css/style.css?v=2024.10.13" rel="stylesheet" />
<link href="css/markdown.css?v=2024.10.13" rel="stylesheet" />
</head>
<body>
<!--
@@ -211,16 +211,16 @@
<!-- Additional Scripts -->
<!-- Bootstraps nostr-tools before other modules rely on nostrToolsReady -->
<script type="module" src="js/nostrToolsBootstrap.js?v=2024.10.12"></script>
<script type="module" src="js/config.js?v=2024.10.12"></script>
<script type="module" src="js/lists.js?v=2024.10.12"></script>
<script type="module" src="js/accessControl.js?v=2024.10.12"></script>
<script type="module" src="js/webtorrent.js?v=2024.10.12"></script>
<script type="module" src="js/nostr.js?v=2024.10.12"></script>
<script type="module" src="js/viewManager.js?v=2024.10.12"></script>
<script type="module" src="js/bootstrap.js?v=2024.10.12"></script>
<script type="module" src="js/disclaimer.js?v=2024.10.12"></script>
<script type="module" src="js/index.js?v=2024.10.12"></script>
<script type="module" src="js/nostrToolsBootstrap.js?v=2024.10.13"></script>
<script type="module" src="js/config.js?v=2024.10.13"></script>
<script type="module" src="js/lists.js?v=2024.10.13"></script>
<script type="module" src="js/accessControl.js?v=2024.10.13"></script>
<script type="module" src="js/webtorrent.js?v=2024.10.13"></script>
<script type="module" src="js/nostr.js?v=2024.10.13"></script>
<script type="module" src="js/viewManager.js?v=2024.10.13"></script>
<script type="module" src="js/bootstrap.js?v=2024.10.13"></script>
<script type="module" src="js/disclaimer.js?v=2024.10.13"></script>
<script type="module" src="js/index.js?v=2024.10.13"></script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
</body>