retoor
1ebb54efc4
Introduce a <file-browser> web component with pagination, breadcrumb navigation, and grid-based file tiles. Implement RepositoryView that serves repository contents by walking the git commit tree, sorting entries by type and name, and rendering them via the repository.html template with folder/file icons and size display.
42 lines
882 B
CSS
42 lines
882 B
CSS
.file-manager {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
|
|
gap: 16px;
|
|
padding: 20px;
|
|
background: #111;
|
|
color: #ddd;
|
|
font-family: Arial, sans-serif;
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
border-radius: 8px;
|
|
}
|
|
.file-tile {
|
|
background-color: #1a1a1a;
|
|
border: 1px solid #333;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
text-align: center;
|
|
padding: 10px;
|
|
transition: transform 0.2s;
|
|
}
|
|
.file-tile:hover {
|
|
transform: translateY(-5px);
|
|
}
|
|
.file-icon {
|
|
font-size: 40px;
|
|
margin-bottom: 10px;
|
|
color: #888;
|
|
}
|
|
.file-name {
|
|
font-size: 14px;
|
|
overflow-wrap: break-word;
|
|
}
|
|
.file-tile img {
|
|
max-width: 80%;
|
|
height: auto;
|
|
margin-bottom: 10px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
|