hippie/source/view/demo/examples/ui/explorer.liquid
sthag b67a8a893a feat: Change file structure
- Move return object to named export for 11ty config
- screens is now view
- 11ty data files moved to view/_data
- templates is now view/_includes
- Both are the default directories
- data is now used as intended, for user data
- Update index to reflect filenames and structure
2026-04-05 14:13:32 +02:00

145 lines
No EOL
2.8 KiB
Text

---
title: Explorer
tags:
- ui
---
{% assign bodyClass = 'body_frame' -%}
{% layout 'hippie/app.liquid' %}
{% block body %}
{% render 'hippie/partials/frame-header.liquid' %}
<main class="io">
<aside class="io">
<nav>
<span>location-pane</span>
<ul class="vertical">
<li>
<a class="a_button" href="">
<span>Start/Home</span>
<i class="bi bi-pin-fill"></i>
</a>
</li>
<li>
<a class="a_button" href="">
<span>System</span>
<i class="bi bi-pin-fill"></i>
</a>
</li>
</ul>
</nav>
<hr>
<nav>
<ul class="vertical">
<li>
<a class="a_button" href="">
<span>💽 disc link</span>
</a>
</li>
<li>
<a class="a_button" href="">
<span>📁 folder link</span>
</a>
</li>
<li>
<a class="a_button" href="">
<span>🔗 location link</span>
</a>
</li>
</ul>
</nav>
</aside>
<section>
<header class="io">
<nav>
<button title="back">
<i class="bi bi-caret-left"></i>
</button>
<button title="up">
<i class="bi bi-caret-up"></i>
</button>
<button title="forward">
<i class="bi bi-caret-right"></i>
</button>
<button title="reload">
<i class="bi bi-arrow-clockwise"></i>
</button>
<input placeholder="//" type="text">
</nav>
<nav>
<span>location-bar</span>
<hr class="vertical">
<button title="search">
<i class="bi bi-search"></i>
</button>
<input placeholder="*" type="text">
</nav>
</header>
<header class="io">
<nav>
<button title="add">
<i class="bi bi-plus-circle"></i>
</button>
<div class="spacer a"></div>
<button title="cut">
<i class="bi bi-scissors"></i>
</button>
<button title="copy">
<i class="bi bi-copy"></i>
</button>
<button title="paste">
<i class="bi bi-clipboard-check-fill"></i>
</button>
<div class="spacer b"></div>
<button title="delete">
<i class="bi bi-trash"></i>
</button>
</nav>
<hr class="vertical">
<nav>
<ul>
<li>
<button title="collapse">
<i class="bi bi-arrows-collapse"></i>
</button>
</li>
<li>
<button title="expand">
<i class="bi bi-arrows-expand-vertical"></i>
</button>
</li>
</ul>
<span>options-bar</span>
</nav>
<nav></nav>
</header>
<div id="content">
<table>
<thead>
<tr>
<th>name</th>
<th>date</th>
<th>type</th>
<th>size</th>
</tr>
</thead>
<tbody>
<tr>
<td>folder</td>
<td>YYYY-MM-DD</td>
<td>folder</td>
<td>4KB</td>
</tr>
<tr>
<td>file</td>
<td>YYYY-MM-DD</td>
<td>folder</td>
<td>1B</td>
</tr>
</tbody>
</table>
</div>
{% render 'hippie/partials/frame-status.liquid' %}
</section>
</main>
{% render 'hippie/partials/frame-mode.liquid' %}
{% endblock %}