From 8846eb4d7a16bd905547fa7567f539aa901dd92a Mon Sep 17 00:00:00 2001 From: elioat Date: Sun, 22 Dec 2024 21:29:35 -0500 Subject: * --- html/file-system/index.html | 162 ++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 158 insertions(+), 4 deletions(-) (limited to 'html') diff --git a/html/file-system/index.html b/html/file-system/index.html index 397427f..45bfaaf 100644 --- a/html/file-system/index.html +++ b/html/file-system/index.html @@ -427,6 +427,81 @@ .folder.editing input:focus { border-color: #0078fa; } + + #viewControls { + position: absolute; + top: 1em; + right: 1em; + } + + .view-toggle { + padding: 0.5em; + border: 1px solid #ccc; + border-radius: 4px; + background: white; + cursor: pointer; + transition: background-color 0.2s; + } + + .view-toggle:hover { + background-color: #f0f0f0; + } + + #breadcrumbs { + padding: 0.5em; + margin-bottom: 1em; + border-bottom: 1px solid #e0e0e0; + display: none; /* Hidden in tree view */ + } + + .breadcrumb-item { + display: inline-block; + cursor: pointer; + padding: 0.2em 0.5em; + border-radius: 3px; + } + + .breadcrumb-item:hover { + background-color: rgba(0, 0, 0, 0.05); + } + + .breadcrumb-separator { + margin: 0 0.5em; + color: #666; + } + + /* Grid view styles */ + .grid-view { + display: none; /* Hidden by default */ + grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); + gap: 1em; + padding: 1em; + } + + .grid-folder { + display: flex; + flex-direction: column; + align-items: center; + padding: 1em; + cursor: pointer; + border-radius: 4px; + text-align: center; + } + + .grid-folder:hover { + background-color: rgba(0, 0, 0, 0.05); + } + + .grid-folder-icon { + font-size: 2em; + margin-bottom: 0.5em; + } + + .grid-folder-name { + font-size: 0.9em; + word-break: break-word; + max-width: 100%; + } @@ -443,6 +518,7 @@

+ +

+ -- cgit 1.4.1-2-gfad0