Basic styling for breadcrumbs

This commit is contained in:
jaina heartles 2022-12-14 03:13:09 -08:00
parent ee059ac36c
commit a6b928b42b
2 changed files with 19 additions and 4 deletions

View file

@ -1,10 +1,20 @@
<div class="drive"> <div class="drive">
<ol class="breadcrumbs"> <ol class="breadcrumbs">
<li><a href="{.mount_path}/{.base_drive_path}/">/</a></li> <li>
<a href="{.mount_path}/{.base_drive_path}/">
<i class="fa-solid fa-cloud"></i>
<span class="directory">/</span>
</a>
</li>
{#for .breadcrumbs |$crumb, $i| =} {#for .breadcrumbs |$crumb, $i| =}
<li><a href="{.mount_path}/{.base_drive_path} <i class="fa-solid fa-chevron-right"></i>
<li>
<a href="{.mount_path}/{.base_drive_path}
{= #for @slice(.breadcrumbs, 0, $i) |$c|}/{$c}{/for =} {= #for @slice(.breadcrumbs, 0, $i) |$c|}/{$c}{/for =}
/{$crumb}">{$crumb}</a></li> /{$crumb}">
{$crumb}
</a>
</li>
{/for =} {/for =}
</ol> </ol>
<table class="directory-listing"> <table class="directory-listing">

View file

@ -218,6 +218,11 @@ button:hover, a.button:hover {
} }
} }
.drive .breadcrumbs {
list-style: none;
display: flex;
}
.drive .icons { .drive .icons {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;