kikimor/scalesApp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added print, download as pdf. no puppeteer, we'll see

Browse Source
This commit is contained in:
kikimor
2026-09-22 22:06:06 +03:00
parent 122480cd46
commit 6f614270e7
37 changed files with 3955 additions and 473 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/Header.css
+48 -23
View File
@@ -1,8 +1,8 @@
.app-header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
background: var(--header-bg);
color: var(--header-text);
padding: 0;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
box-shadow: var(--shadow-raised);
position: sticky;
top: 0;
z-index: 100;
@@ -32,10 +32,10 @@
.nav-button {
width: 42px;
height: 42px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
border-radius: var(--radius);
background: var(--header-chrome);
border: 1px solid var(--header-chrome-border);
color: var(--header-text);
font-size: 20px;
cursor: pointer;
transition: background 0.2s, transform 0.2s;
@@ -46,7 +46,7 @@
}
.nav-button:hover {
background: rgba(255, 255, 255, 0.3);
background: var(--header-chrome-hover);
transform: scale(1.05);
}
@@ -70,9 +70,9 @@
left: 0;
z-index: 101;
min-width: 220px;
background: #fff;
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
background: var(--surface);
border-radius: var(--radius);
box-shadow: var(--shadow-overlay);
overflow: hidden;
}
@@ -84,16 +84,16 @@
border: none;
text-align: left;
cursor: pointer;
color: #333;
color: var(--text);
font-family: inherit;
}
.nav-dropdown-menu button + button {
border-top: 1px solid #eee;
border-top: 1px solid var(--border);
}
.nav-dropdown-menu button:hover {
background: #f2f3fa;
background: var(--surface-hover);
}
.nav-dropdown-menu strong {
@@ -106,7 +106,7 @@
display: block;
margin-top: 2px;
font-size: 11px;
color: #777;
color: var(--text-muted);
}
.header-right {
@@ -142,8 +142,8 @@
width: 42px;
height: 42px;
border-radius: 50%;
background: white;
color: #667eea;
background: var(--header-avatar-bg);
color: var(--header-avatar-text);
display: flex;
align-items: center;
justify-content: center;
@@ -151,19 +151,19 @@
font-size: 16px;
cursor: pointer;
transition: transform 0.2s, box-shadow 0.2s;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
box-shadow: var(--shadow-card);
}
.avatar:hover {
transform: scale(1.05);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
box-shadow: var(--shadow-raised);
}
.logout-button {
padding: 8px 16px;
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
background: var(--header-chrome);
border: 1px solid var(--header-chrome-border);
color: var(--header-text);
border-radius: 6px;
font-size: 14px;
font-weight: 500;
@@ -172,7 +172,7 @@
}
.logout-button:hover {
background: rgba(255, 255, 255, 0.3);
background: var(--header-chrome-hover);
}
@media (max-width: 768px) {
@@ -196,3 +196,28 @@
margin-right: 0;
}
}
/* Theme toggle — same chrome as the nav buttons, so it reads as part of the
header furniture rather than a feature being advertised. */
.theme-toggle {
width: 38px;
height: 38px;
border-radius: var(--radius-sm);
background: var(--header-chrome);
border: 1px solid var(--header-chrome-border);
color: var(--header-text);
font-size: 17px;
line-height: 1;
cursor: pointer;
transition: background 0.2s, transform 0.2s;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
flex-shrink: 0;
}
.theme-toggle:hover {
background: var(--header-chrome-hover);
transform: scale(1.05);
}