aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2026-01-25 17:54:45 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor: migrate sidebar.css to Tailwind color palette

Browse Source
This commit is contained in:
Gigi
2025-10-13 23:07:53 +02:00
parent 930de76d1f
commit 524b5e1559
1 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/styles/layout/sidebar.css
View File

@@ -1,6 +1,6 @@
/* Bookmarks and sidebar layout */
.bookmarks-container {
background: #1a1a1a;
background: rgb(24 24 27); /* zinc-900 */
display: flex;
flex-direction: column;
height: 100%;
@@ -20,7 +20,7 @@
.bookmarks-container .view-mode-controls {
margin-top: auto;
padding: 1rem;
border-top: 1px solid #333;
border-top: 1px solid rgb(63 63 70); /* zinc-700 */
background: transparent;
border-radius: 0;
}
@@ -41,15 +41,15 @@
justify-content: space-between;
gap: 0.75rem;
padding: 0.75rem 1rem;
background: #1a1a1a;
border-bottom: 1px solid #333;
background: rgb(24 24 27); /* zinc-900 */
border-bottom: 1px solid rgb(63 63 70); /* zinc-700 */
margin-bottom: 0;
}
/* Mobile: add borders and rounded corners */
@media (max-width: 768px) {
.sidebar-header-bar {
border: 1px solid #333;
border: 1px solid rgb(63 63 70); /* zinc-700 */
border-radius: 12px 12px 0 0;
}
}
@@ -95,10 +95,10 @@
display: flex;
align-items: center;
justify-content: center;
background: #2a2a2a;
border: 1px solid #444;
background: rgb(39 39 42); /* zinc-800 */
border: 1px solid rgb(82 82 91); /* zinc-600 */
flex-shrink: 0;
color: #ddd;
color: rgb(228 228 231); /* zinc-200 */
box-sizing: border-box;
padding: 0;
}
@@ -108,8 +108,8 @@
.sidebar-header-bar .toggle-sidebar-btn {
background: transparent;
color: #ddd;
border: 1px solid #444;
color: rgb(228 228 231); /* zinc-200 */
border: 1px solid rgb(82 82 91); /* zinc-600 */
padding: 0;
border-radius: 6px;
cursor: pointer;
@@ -123,7 +123,7 @@
box-sizing: border-box;
}
.sidebar-header-bar .toggle-sidebar-btn:hover { background: #2a2a2a; color: #fff; }
.sidebar-header-bar .toggle-sidebar-btn:hover { background: rgb(39 39 42); /* zinc-800 */ color: rgb(255 255 255); /* white */ }
.sidebar-header-bar .toggle-sidebar-btn:active { transform: translateY(1px); }
.bookmarks-container.collapsed {
@@ -136,8 +136,8 @@
}
.bookmarks-container.collapsed .toggle-sidebar-btn {
background: #2a2a2a;
color: #ddd;
background: rgb(39 39 42); /* zinc-800 */
color: rgb(228 228 231); /* zinc-200 */
border: none;
padding: 0;
border-radius: 0;
@@ -151,22 +151,22 @@
flex-shrink: 0;
}
.bookmarks-container.collapsed .toggle-sidebar-btn:hover { background: #333; color: #fff; }
.bookmarks-container.collapsed .toggle-sidebar-btn:hover { background: rgb(63 63 70); /* zinc-700 */ color: rgb(255 255 255); /* white */ }
.bookmarks-container.collapsed .toggle-sidebar-btn:active { transform: translateY(1px); }
.bookmarks-container.collapsed .toggle-sidebar-btn.with-icon { width: auto; padding: 0 0.5rem; gap: 0.5rem; }
.bookmarks-container.collapsed .toggle-sidebar-btn .glow-blue { color: #646cff; filter: drop-shadow(0 0 4px rgba(100, 108, 255, 0.6)); }
.bookmarks-container.collapsed .toggle-sidebar-btn .glow-blue { color: rgb(99 102 241); /* indigo-500 */ filter: drop-shadow(0 0 4px rgba(99, 102, 241, 0.6)); }
.user-info { margin: 0.5rem 0 0 0; color: #888; font-size: 0.9rem; font-family: monospace; }
.bookmark-count { color: #666; font-size: 0.9rem; margin: 0.5rem 0; }
.event-link { color: #8ab4f8; text-decoration: none; font-weight: 500; }
.user-info { margin: 0.5rem 0 0 0; color: rgb(161 161 170); /* zinc-400 */ font-size: 0.9rem; font-family: monospace; }
.bookmark-count { color: rgb(113 113 122); /* zinc-500 */ font-size: 0.9rem; margin: 0.5rem 0; }
.event-link { color: rgb(96 165 250); /* blue-400 */ text-decoration: none; font-weight: 500; }
.event-link:hover { text-decoration: underline; }
.bookmark-urls { margin: 0.75rem 0; }
.bookmark-url { display: block; margin: 0.25rem 0; color: #007bff; text-decoration: none; word-break: break-all; background: none; border: none; padding: 0; font: inherit; cursor: pointer; text-align: left; width: 100%; }
.bookmark-url { display: block; margin: 0.25rem 0; color: rgb(59 130 246); /* blue-500 */ text-decoration: none; word-break: break-all; background: none; border: none; padding: 0; font: inherit; cursor: pointer; text-align: left; width: 100%; }
.bookmark-url:hover { text-decoration: underline; }
.url-row { display: flex; align-items: center; gap: 0.5rem; }
.read-inline-btn { background: #28a745; color: white; border: none; padding: 0.25rem 0.5rem; border-radius: 4px; cursor: pointer; }
.read-inline-btn:hover { background: #218838; }
.read-inline-btn { background: rgb(34 197 94); /* green-500 */ color: white; border: none; padding: 0.25rem 0.5rem; border-radius: 4px; cursor: pointer; }
.read-inline-btn:hover { background: rgb(22 163 74); /* green-600 */ }