jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Various stylesheet fixes for background image support

Browse Source
This commit is contained in:
Johannes Zellner
2025-03-25 16:11:59 +01:00
parent 5953fd71d3
commit d8373bc488
3 changed files with 42 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
dashboard/src/components/Headerbar.vue
View File

@@ -112,6 +112,18 @@ onMounted(async () => {
gap: 15px;
}
body.has-background .headerbar {
background-color: rgba(255,255,255,0.2);
filter: drop-shadow(0px 0px 14px white);
}
@media (prefers-color-scheme: dark) {
body.has-background .headerbar {
background-color: rgba(0,0,0,0.2);
filter: drop-shadow(0px 0px 14px black);
}
}
.headerbar a {
display: flex;
align-items: center;

20
dashboard/src/components/Section.vue
View File

@@ -35,10 +35,18 @@ export default {
body.has-background .section {
background-color: rgba(255,255,255,0.2);
backdrop-filter: blur(10px);
filter: drop-shadow(0px 0px 14px white);
border-radius: 10px;
}
@media (prefers-color-scheme: dark) {
body.has-background .section {
background-color: rgba(0,0,0,0.2);
filter: drop-shadow(0px 0px 14px black);
border-radius: 10px;
}
}
.section-header {
display: flex;
flex-wrap: wrap;
@@ -47,7 +55,7 @@ body.has-background .section {
gap: 5px;
padding-left: 15px;
padding-right: 15px;
margin-top: 10px;
padding-top: 25px;
}
.section-divider {
@@ -63,15 +71,21 @@ body.has-background .section {
}
}
body.has-background .section-divider {
border: none;
}
.section-body {
position: relative;
margin-bottom: 15px;
padding: 10px 15px;
border-radius: 10px;
padding-bottom: 25px;
}
.section-extra-padding .section-body {
padding: 10px 25px;
padding-left: 25px;
padding-right: 25px;
}
</style>