refactor(css): change css grouping fileType & filesView

- fileType.css for filetype to icons representation
 - filesViews.css for grid and list view (merge of previous cards.css & fileList.css)
This commit is contained in:
Edouard Vanbelle
2026-04-12 02:23:22 +02:00
parent b95cf8dee9
commit 4862c17e11
7 changed files with 468 additions and 506 deletions
+8 -13
View File
@@ -76,6 +76,10 @@
/* Sidebar */
--color-sidebar-bg-from: #0f172a;
--color-sidebar-bg-to: #0c1322;
/* Items */
--color-item-selected: #1a1520;
--color-item-hover-accent: #1f1926;
}
/* ------------ */
@@ -234,6 +238,7 @@
}
/* ── cards.css ── */
/* FIXME
[data-theme="dark"] .files-grid-view .file-item {
background-color: var(--color-bg-surface);
border-color: var(--color-border);
@@ -244,11 +249,6 @@
box-shadow: 0 4px 12px var(--color-shadow-3xl);
}
[data-theme="dark"] .files-grid-view .file-item.selected {
border-color: var(--color-accent);
background: var(--color-item-selected-dark);
}
[data-theme="dark"] .files-grid-view .file-item .checkbox-cell {
background: var(--color-bg-surface);
border-color: var(--color-border-medium);
@@ -274,6 +274,7 @@
[data-theme="dark"] .files-grid-view .file-item.drop-target {
background-color: var(--color-warning-ring-xs);
}
*/
/* ── csp-utilities.css ── */
[data-theme="dark"] .empty-state-icon {
@@ -627,6 +628,7 @@
}
/* ── fileList.css ── */
/* FIXME
[data-theme="dark"] .files-list-view {
background-color: var(--color-bg-surface);
box-shadow: 0 1px 3px var(--color-shadow-xs);
@@ -647,14 +649,6 @@
background-color: var(--color-bg-hover);
}
[data-theme="dark"] .files-list-view .file-item.selected {
background-color: var(--color-item-selected);
}
[data-theme="dark"] .files-list-view .file-item.selected:hover {
background-color: var(--color-item-hover-accent);
}
[data-theme="dark"] .files-list-view .file-item .name-cell {
color: var(--color-text-heading);
}
@@ -684,6 +678,7 @@
background: var(--color-border);
color: var(--color-text-heading);
}
*/
/* ── languageSelector.css ── */
[data-theme="dark"] .language-selector-toggle {