cjw/Oxicloud
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

refactor(css): maximize usage of variables (1st part, to simplify CSS & style)

Browse Source 
note: there is still work to do, but has there are risks to conflict I prefer to commit this first part now
This commit is contained in:
Edouard Vanbelle
2026-04-08 11:03:20 +02:00
parent 904aca5edf
commit 94b36e41e0
35 changed files with 2957 additions and 2535 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/css/layout/content.css
+12 -12
View File
@@ -10,7 +10,7 @@
font-size: 24px;
font-weight: bold;
margin-bottom: 20px;
color: #2d3748;
color: var(--color-text);
}
.page-sticky-header {
@@ -42,7 +42,7 @@
justify-content: center;
padding: 40px;
text-align: center;
color: #888;
color: var(--color-content-muted);
width: 100%;
height: 300px;
grid-column: 1 / -1;
@@ -66,7 +66,7 @@
overflow: hidden;
border-radius: 10px;
width: 100%;
/*box-shadow: 0 1px 3px rgba(0,0,0,0.05);*/
/*box-shadow: 0 1px 3px var(--color-shadow-xs);*/
}
.dragged-items .file-item {
@@ -74,9 +74,9 @@
grid-template-columns: var(--dragged-files-list-columns);
column-gap: 12px;
padding: 12px 15px;
/*border-bottom: 1px solid #f0f0f0;*/
/*border-bottom: 1px solid var(--color-border-xfaint);*/
align-items: center;
background-color: white;
background-color: var(--color-bg-surface);
}
.dragged-items .file-item {
@@ -94,7 +94,7 @@
}
.dragged-items .file-item .file-icon {
background-color: #ffeaa7;
background-color: var(--color-warning-bg);
position: relative;
width: 36px;
height: 36px;
@@ -102,7 +102,7 @@
}
.dragged-items .file-item .file-icon.folder-icon {
background-color: #ffeaa7;
background-color: var(--color-warning-bg);
position: relative;
width: 36px;
height: 36px;
@@ -115,7 +115,7 @@
left: 0;
right: 0;
height: 8px;
background-color: #fdcb6e;
background-color: var(--color-warning-bg-dark);
border-radius: 8px 8px 0 0;
}
@@ -125,8 +125,8 @@
}
.dragged-items div.fading {
-webkit-mask-image: linear-gradient(to bottom, white 10%, transparent);
mask-image: linear-gradient(to bottom, white 10%, transparent);
-webkit-mask-image: linear-gradient(to bottom, var(--color-bg-surface) 10%, transparent);
mask-image: linear-gradient(to bottom, var(--color-bg-surface) 10%, transparent);
}
.dragged-items-badge {
@@ -136,8 +136,8 @@
transform: translate(50%, -50%);
background: red;
color: white;
background: var(--color-content-debug-bg);
color: var(--color-content-debug-text);
border-radius: 50%;
min-width: 20px;