alterminal/alterdb
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixup

Browse Source
This commit is contained in:
chenyunda218
2026-10-02 13:12:49 +08:00
parent 2d4bdd0f85
commit a8ab1dfcc6
38 changed files with 10385 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/_shell.html
+136
View File
@@ -0,0 +1,136 @@
{% extends "base.html" %}
{% block layout_style %}
<style>
/* 應用外殼：左側固定側邊欄 + 右側主內容區；窄屏折疊為頂欄 */
.shell { display: flex; min-height: 100vh; min-height: 100dvh; }
.sidebar {
box-sizing: border-box;
position: sticky;
top: 0;
height: 100vh;
height: 100dvh;
width: 15rem;
flex-shrink: 0;
display: flex;
flex-direction: column;
gap: 1.5rem;
padding: 1.4rem 1rem;
overflow-y: auto;
border-right: 1px solid color-mix(in srgb, currentColor 20%, transparent);
background: color-mix(in srgb, currentColor 4%, transparent);
}
.sidebar .brand h1 { margin: 0; font-size: 1.35rem; line-height: 1.2; }
.sidebar .brand a { color: inherit; text-decoration: none; }
.sidebar .brand p { margin: .25rem 0 0; font-size: .78rem; opacity: .65; }
.sidebar nav { display: flex; flex-direction: column; gap: .25rem; }
.sidebar nav a {
padding: .5rem .8rem;
border-radius: 6px;
color: inherit;
text-decoration: none;
}
.sidebar nav a:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.sidebar nav a[aria-current="page"] {
font-weight: 600;
background: color-mix(in srgb, currentColor 14%, transparent);
}
.sidebar-footer {
margin-top: auto;
display: flex;
flex-direction: column;
gap: .6rem;
padding-top: 1rem;
border-top: 1px solid color-mix(in srgb, currentColor 15%, transparent);
font-size: .85rem;
}
.sidebar-footer form { margin: 0; }
.sidebar-footer .footer-actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: .6rem;
}
.sidebar-footer .footer-actions a {
font: inherit;
padding: .3rem .9rem;
border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
border-radius: 6px;
color: inherit;
text-decoration: none;
}
.sidebar-footer .footer-actions a:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.sidebar-footer button {
font: inherit;
padding: .3rem .9rem;
border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
border-radius: 6px;
background: transparent;
color: inherit;
cursor: pointer;
}
.sidebar-footer button:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.main {
box-sizing: border-box;
flex: 1;
min-width: 0;
max-width: 56rem;
padding: 2.5rem 3rem;
}
@media (max-width: 48rem) {
.shell { display: block; min-height: auto; }
.sidebar {
position: static;
height: auto;
width: auto;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
gap: .75rem 1.25rem;
padding: .8rem 1rem;
border-right: none;
border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent);
overflow: visible;
}
.sidebar .brand p { display: none; }
.sidebar nav { flex-direction: row; gap: .25rem; }
.sidebar-footer {
margin-top: 0;
margin-left: auto;
flex-direction: row;
align-items: center;
gap: .8rem;
padding-top: 0;
border-top: none;
font-size: .8rem;
}
.main { padding: 1.5rem 1rem; }
}
</style>
{% endblock %}
{% block content %}
<div class="shell">
<aside class="sidebar">
<div class="brand">
<h1><a href="/">alterdb</a></h1>
<p>以 SQLite 為底層存儲的自定義數據庫引擎</p>
</div>
<nav aria-label="主導航">
<a href="/"{% if nav_active == "index" %} aria-current="page"{% endif %}>首頁</a>
<a href="/databases"{% if nav_active == "databases" %} aria-current="page"{% endif %}>數據庫</a>
</nav>
<div class="sidebar-footer">
<span>已登入：<strong>{{ user_display_name }}</strong>{% if user_display_name != user_username %} <code>{{ user_username }}</code>{% endif %}</span>
<div class="footer-actions">
<button type="button" class="theme-toggle" data-theme-toggle>深色模式</button>
<a href="/password">變更密碼</a>
<form method="post" action="/logout">
<button type="submit">登出</button>
</form>
</div>
</div>
</aside>
<main class="main">
{% block page %}{% endblock %}
</main>
</div>
{% endblock %}