iot/spore-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: improve header

Browse Source
This commit is contained in:
0x1d
2025-08-24 21:36:07 +02:00
parent cac61ddc9d
commit 70889b99b1
2 changed files with 30 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/ui.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 236 KiB

After

Width:  |  Height:  |  Size: 186 KiB

37
public/styles.css
View File

@@ -18,13 +18,17 @@ body {
} }
.header { .header {
text-align: center; display: flex;
margin-bottom: 3rem; justify-content: space-between;
align-items: center;
margin-bottom: 2rem;
padding: 1.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
} }
h1 { h1 {
font-size: 3rem; font-size: 2.5rem;
margin-bottom: 1rem; margin: 0;
font-weight: 700; font-weight: 700;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
} }
@@ -37,11 +41,12 @@ p {
.status { .status {
background: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.2);
padding: 1rem 2rem; padding: 0.75rem 1.5rem;
border-radius: 50px; border-radius: 25px;
font-weight: 500; font-weight: 500;
display: inline-block; display: inline-block;
margin-bottom: 2rem; margin: 0;
font-size: 1rem;
} }
.cluster-section { .cluster-section {
@@ -279,3 +284,21 @@ p {
margin-bottom: 1rem; margin-bottom: 1rem;
opacity: 0.5; opacity: 0.5;
} }
/* Responsive design for smaller screens */
@media (max-width: 768px) {
.header {
flex-direction: column;
gap: 1rem;
text-align: center;
}
h1 {
font-size: 2rem;
}
.status {
padding: 0.5rem 1rem;
font-size: 0.9rem;
}
}