Frontend basics
This commit is contained in:
parent
8565ce19fe
commit
e310930d9e
10 changed files with 607 additions and 58 deletions
|
|
@ -4,36 +4,63 @@
|
|||
<meta charset="utf-8"/>
|
||||
<title>{{ title }}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<style>
|
||||
body {
|
||||
font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
|
||||
margin: 2rem;
|
||||
}
|
||||
|
||||
code {
|
||||
background: #f4f4f4;
|
||||
padding: 0.2rem 0.4rem;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #0b5fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="/static/css/style.css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>{{ title }}</h1>
|
||||
<p>To jest prosta strona Jinja2 serwowana przez FastAPI.</p>
|
||||
<ul>
|
||||
<li>UI OpenAPI: <a href="/docs">/docs</a></li>
|
||||
<li>OpenAPI JSON: <a href="/openapi.json">/openapi.json</a></li>
|
||||
<li>API v1: <a href="/api/v1/">/api/v1/</a></li>
|
||||
</ul>
|
||||
<p>Uruchamianie serwera lokalnie: <code>uv run app</code> lub <code>uv run uvicorn app.main:app --reload</code></p>
|
||||
<div class="layout">
|
||||
<div class="left">
|
||||
<div class="toolbar">
|
||||
<button id="btn-refresh">Odśwież</button>
|
||||
<button id="btn-add-group">Nowa grupa</button>
|
||||
<button id="btn-add-entry">Nowy wpis</button>
|
||||
</div>
|
||||
<div id="tree"></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="toolbar">
|
||||
<select id="entry-kind">
|
||||
<option value="simple">Prosty (klucz:wartość)</option>
|
||||
<option value="complex">Złożony</option>
|
||||
</select>
|
||||
<button id="btn-save-all">Zapisz do bazy</button>
|
||||
</div>
|
||||
|
||||
<div class="section" id="editor-simple" style="display:none;">
|
||||
<div class="row"><label class="mono" style="width:140px;">Klucz</label><input id="s-key" type="text"/></div>
|
||||
<div class="row"><label class="mono" style="width:140px;">Wartość</label><input id="s-value"
|
||||
type="password"/></div>
|
||||
<div class="row" style="justify-content:flex-end; gap:8px;">
|
||||
<button id="s-save">Zapisz wpis</button>
|
||||
<button id="s-delete" class="danger">Usuń</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section" id="editor-complex" style="display:none;">
|
||||
<div class="row"><label style="width:140px;">Tytuł</label><input id="c-title" type="text"/></div>
|
||||
<div class="row"><label style="width:140px;">Użytkownik</label><input id="c-username" type="text"/></div>
|
||||
<div class="row"><label style="width:140px;">Hasło</label><input id="c-password" type="password"/></div>
|
||||
<div class="row"><label style="width:140px;">URL</label><input id="c-url" type="url"/></div>
|
||||
<div class="row"><label style="width:140px;">Notatka</label><textarea id="c-notes" rows="5"></textarea>
|
||||
</div>
|
||||
<div class="row" style="justify-content:flex-end; gap:8px;">
|
||||
<button id="c-save">Zapisz wpis</button>
|
||||
<button id="c-delete" class="danger">Usuń</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<div class="row">
|
||||
<label style="width:140px;">Docelowa grupa</label>
|
||||
<input id="target-group" type="text" placeholder="/Ścieżka/Grupy"/>
|
||||
<button id="btn-move-entry">Przenieś wpis</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
Aktualna ścieżka: <span id="current-path" class="mono">/</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/static/js/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue