From e03696eed720e822034678aa0a871bdfd784eb2d Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Mon, 13 Oct 2025 22:37:20 +0200
Subject: [PATCH] style: make sidebars extend edge-to-edge on desktop

---
 src/styles/layout/app.css        |  8 ++++----
 src/styles/layout/highlights.css | 17 +++++++++++++++--
 src/styles/layout/sidebar.css    | 19 +++++++++++++++++--
 3 files changed, 36 insertions(+), 8 deletions(-)

diff --git a/src/styles/layout/app.css b/src/styles/layout/app.css
index bda3d5bc..17e43615 100644
--- a/src/styles/layout/app.css
+++ b/src/styles/layout/app.css
@@ -39,8 +39,8 @@
 @media (min-width: 769px) {
   .pane.sidebar {
     position: sticky;
-    top: 1rem;
-    max-height: calc(100vh - 2rem);
+    top: 0;
+    max-height: 100vh;
     overflow-y: auto;
     align-self: start;
   }
@@ -55,8 +55,8 @@
   
   .pane.highlights {
     position: sticky;
-    top: 1rem;
-    max-height: calc(100vh - 2rem);
+    top: 0;
+    max-height: 100vh;
     overflow-y: auto;
     align-self: start;
   }
diff --git a/src/styles/layout/highlights.css b/src/styles/layout/highlights.css
index 01b8a599..bd2d83a8 100644
--- a/src/styles/layout/highlights.css
+++ b/src/styles/layout/highlights.css
@@ -1,14 +1,20 @@
 /* Highlights panel layout and interactions */
 .highlights-container {
   background: #1a1a1a;
-  border: 1px solid #333;
-  border-radius: 12px;
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow: hidden;
 }
 
+/* Desktop: no border or rounded corners for edge-to-edge sidebars */
+@media (min-width: 769px) {
+  .highlights-container {
+    border: none;
+    border-radius: 0;
+  }
+}
+
 .highlights-container.collapsed {
   display: flex;
   align-items: flex-start;
@@ -47,6 +53,13 @@
   border-radius: 12px 12px 0 0;
 }
 
+/* Desktop: no rounded corners for edge-to-edge header */
+@media (min-width: 769px) {
+  .highlights-header {
+    border-radius: 0;
+  }
+}
+
 .highlights-actions { display: flex; align-items: center; justify-content: space-between; width: 100%; }
 .highlights-actions-left { display: flex; align-items: center; gap: 0.5rem; }
 
diff --git a/src/styles/layout/sidebar.css b/src/styles/layout/sidebar.css
index 55566228..c52b10df 100644
--- a/src/styles/layout/sidebar.css
+++ b/src/styles/layout/sidebar.css
@@ -1,8 +1,6 @@
 /* Bookmarks and sidebar layout */
 .bookmarks-container {
   background: #1a1a1a;
-  border: 1px solid #333;
-  border-radius: 12px;
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -11,6 +9,14 @@
   padding: 0;
 }
 
+/* Desktop: no border or rounded corners for edge-to-edge sidebars */
+@media (min-width: 769px) {
+  .bookmarks-container {
+    border: none;
+    border-radius: 0;
+  }
+}
+
 .bookmarks-container .view-mode-controls {
   margin-top: auto;
   padding: 1rem;
@@ -41,6 +47,15 @@
   margin-bottom: 0;
 }
 
+/* Desktop: no border or rounded corners for edge-to-edge header */
+@media (min-width: 769px) {
+  .sidebar-header-bar {
+    border: none;
+    border-radius: 0;
+    border-bottom: 1px solid #333;
+  }
+}
+
 .sidebar-header-right {
   display: flex;
   align-items: center;