bivashy/Blitz-Proxy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add sticky card-header with bokeh effect for improved UI

Browse Source
This commit is contained in:
Seyed Mahdi
2025-07-08 18:07:59 +03:30
parent aa442d13d5
commit 237aff39c4
1 changed files with 13 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
core/scripts/webpanel/assets/css/custom.css
View File

@ -136,6 +136,13 @@ body:not(.dark-mode) .card-header {
border-bottom: 1px solid var(--border-color-light); border-bottom: 1px solid var(--border-color-light);
padding: 0.75rem 1.25rem; padding: 0.75rem 1.25rem;
color: var(--text-dark); /* Ensure header text is dark */ color: var(--text-dark); /* Ensure header text is dark */
position: sticky;
top: 0;
z-index: 10;
background: rgba(255, 255, 255, 0.75); /* semi-transparent for bokeh */
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px); /* Safari support */
transition: background 0.3s;
} }
body:not(.dark-mode) .card-title { body:not(.dark-mode) .card-title {
font-weight: 600; font-weight: 600;
@ -305,6 +312,12 @@ body.dark-mode .card-header {
border-bottom: 1px solid var(--dark-navy-border) !important; border-bottom: 1px solid var(--dark-navy-border) !important;
color: var(--dark-text-primary); color: var(--dark-text-primary);
padding: 0.75rem 1.25rem; padding: 0.75rem 1.25rem;
position: sticky;
top: 0;
z-index: 10;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px); /* Safari support */
transition: background 0.3s;
} }
body.dark-mode .card-body { padding: 1.25rem; } body.dark-mode .card-body { padding: 1.25rem; }