Finish moving to hbs

This commit is contained in:
Jackzie 2025-04-14 22:40:52 -05:00
parent 3147da7643
commit 7ff6e3cab4
7 changed files with 113 additions and 16 deletions

View file

@ -2,15 +2,16 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="/favicon.png" />
<link rel="icon" href="/static/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>storage-app</title>
<!-- TODO: use static -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.2/css/bulma.min.css"
>
<link href="/static/css/main.css" rel="stylesheet" />
<link rel="stylesheet" href="/static/css/bulma.min.css">
<link href="/static/icons/css/fontawesome.css" rel="stylesheet" />
<link href="/static/icons/css/regular.css" rel="stylesheet" />
<link href="/static/icons/css/brands.css" rel="stylesheet" />
</head>
<body>
{{> partials/nav }}

View file

@ -0,0 +1,38 @@
{{#> layouts/main }}
<div class="">
<h4 class="title is-4 is-inline">{{ library.name }} > Files</h4>
<div class="is-pulled-right is-inline-block">
<div class="buttons">
<div class="button is-small">
Display
</div>
<div class="button is-small">
Sort
</div>
</div>
</div>
<hr class="my-2">
<table class="table is-fullwidth">
<thead>
<tr>
<td>Name </td>
<td>Size </td>
<td>Last Updated </td>
<td>Owner </td>
</tr>
</thead>
<tbody>
{{#each files }}
<tr>
<td class="px-4 py-4">
<a href="{{ file_name }}">{{ file_name }}</a>
</td>
<td></td>
<td></td>
<td>Me</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
{{/layouts/main}}

View file

@ -1,9 +1,9 @@
<aside class="sidebar pl-0 mb-0">
<p class="sidebar-header">Workspace</p>
<ul class="sidebar-list">
<li class="is-active"><button><Icon icon="akar-icons:copy"></Icon> Files</button></li>
<li><button><Icon icon="akar-icons:heart"></Icon> Favorites</button></li>
<li><button><Icon icon="akar-icons:clock"></Icon> Activities</button></li>
<li class="is-active"><button><i class="fa fa-file"></i> Files</button></li>
<li><button><i class="fas fa-heart"></i> Favorites</button></li>
<li><button><i class="fas fa-clock"></i> Activities</button></li>
</ul>
<p class="sidebar-header">Help</p>
<ul class="sidebar-list">
@ -12,11 +12,6 @@
</ul>
</aside>
<script lang="ts">
import Icon from "@iconify/svelte";
</script>
<style>
.sidebar {
@ -41,6 +36,9 @@
width: 100%;
text-align: left;
}
.sidebar i {
margin-left: 2px;
}
.sidebar-list li button:hover, .sidebar-list li button.is-active {
background-color: lightgray;
}