Beter layouting

This commit is contained in:
2026-08-14 22:54:00 +02:00
parent 40ad35b418
commit c54216fae2
9 changed files with 463 additions and 83 deletions
+35 -17
View File
@@ -15,13 +15,8 @@
<div id="connection-status" class="connection-status hidden" role="status"></div>
<div id="app">
<aside id="sidebar">
<div class="brand">Racket Wiki</div>
<div id="user-box"></div>
<div class="sidebar-actions">
<button id="todo-button" data-tr="todo">Todo</button>
<button id="translations-button" class="admin-only hidden" data-tr="translations">Translations</button>
<button id="admin-button" class="admin-only hidden" data-tr="users">Users</button>
</div>
<a id="wiki-brand" class="brand" href="#">Racket Wiki</a>
<a id="todo-link" class="sidebar-primary-link" href="#">* <span data-tr="todo-list">Todo list</span></a>
<form id="search-form" class="wiki-search" role="search">
<input id="search-input" type="search" placeholder="Search wiki" data-tr-placeholder="search-wiki" autocomplete="off" aria-label="Search wiki">
</form>
@@ -36,7 +31,25 @@
</aside>
<main id="main">
<nav id="breadcrumbs" class="breadcrumbs hidden" aria-label="Breadcrumb"></nav>
<div id="top-chrome" class="top-chrome">
<div id="account-bar" class="account-bar">
<span id="account-name"></span>
<span class="account-separator" aria-hidden="true">·</span>
<span id="account-role" class="muted"></span>
<span class="account-separator" aria-hidden="true">·</span>
<a id="logout-link" href="#" data-tr="sign-out">Sign out</a>
<span class="account-separator admin-only hidden" aria-hidden="true">·</span>
<a id="admin-link" class="admin-only hidden" href="#" data-tr="admin">Admin</a>
</div>
<div class="navigation-row">
<nav id="breadcrumbs" class="breadcrumbs hidden" aria-label="Breadcrumb"></nav>
<div id="page-action-links" class="page-action-links hidden">
<a id="edit-page" class="editor-only hidden" href="#" data-tr="edit">Edit</a>
<a id="history-page" href="#" data-tr="history">History</a>
<a id="delete-page" class="editor-only danger hidden" href="#" data-tr="delete">Delete</a>
</div>
</div>
</div>
<section id="page-view" class="hidden">
<header class="page-header">
@@ -44,11 +57,6 @@
<h1 id="page-title"></h1>
<div id="page-meta" class="muted"></div>
</div>
<div class="toolbar">
<button id="edit-page" class="editor-only hidden" data-tr="edit">Edit</button>
<button id="history-page" data-tr="history">History</button>
<button id="delete-page" class="editor-only danger hidden" data-tr="delete">Delete</button>
</div>
</header>
<article id="markdown-preview" class="markdown-body"></article>
<footer id="page-details" class="page-details"></footer>
@@ -109,18 +117,28 @@
</section>
<section id="admin-view" class="hidden">
<header class="page-header">
<h1 data-tr="admin">Admin</h1>
</header>
<nav class="admin-menu">
<a id="admin-users-link" href="#" data-tr="users">Users</a>
<a id="admin-translations-link" href="#" data-tr="translations">Translations</a>
</nav>
</section>
<section id="user-admin-view" class="hidden">
<header class="page-header">
<h1 data-tr="user-administration">User administration</h1>
<button id="close-admin" data-tr="back">Back</button>
<a id="close-user-admin" href="#" data-tr="back">Back</a>
</header>
<form id="new-user-form" class="user-form">
<input id="new-username" placeholder="Username" data-tr-placeholder="username" required>
<input id="new-display-name" placeholder="Display name" data-tr-placeholder="display-name">
<input id="new-password" type="password" placeholder="Initial password" data-tr-placeholder="initial-password" required>
<select id="new-role">
<option value="reader">reader</option>
<option value="editor">editor</option>
<option value="admin">admin</option>
<option value="reader" data-tr="role-reader">reader</option>
<option value="editor" data-tr="role-editor">editor</option>
<option value="admin" data-tr="role-admin">admin</option>
</select>
<button type="submit" data-tr="create-user">Create user</button>
</form>