Stack sidebar navigation vertically
This commit is contained in:
@@ -1,5 +1,9 @@
|
|||||||
# Changelog
|
# Changelog
|
||||||
|
|
||||||
|
## 0.35.1 - 2026-05-23
|
||||||
|
|
||||||
|
- Changed the shared sidebar navigation to a vertical one-link-per-line stack so the menu stays balanced after adding the dedicated Queue page.
|
||||||
|
|
||||||
## 0.35.0 - 2026-05-22
|
## 0.35.0 - 2026-05-22
|
||||||
|
|
||||||
- Split the download queue out of the Search page into a dedicated `/queue` page so searching and queue management are separate workflows.
|
- Split the download queue out of the Search page into a dedicated `/queue` page so searching and queue management are separate workflows.
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
Small local web UI for a system-wide `ani-cli` install.
|
Small local web UI for a system-wide `ani-cli` install.
|
||||||
|
|
||||||
Current version: `0.35.0`
|
Current version: `0.35.1`
|
||||||
|
|
||||||
## Project Layout
|
## Project Layout
|
||||||
|
|
||||||
@@ -147,6 +147,7 @@ Highlights:
|
|||||||
- Search stays focused on finding shows, loading episodes, and queueing new downloads.
|
- Search stays focused on finding shows, loading episodes, and queueing new downloads.
|
||||||
- Added-to-queue notices now point to the dedicated Queue page for progress tracking.
|
- Added-to-queue notices now point to the dedicated Queue page for progress tracking.
|
||||||
- Search request guards still avoid stale responses overwriting newer results.
|
- Search request guards still avoid stale responses overwriting newer results.
|
||||||
|
- The shared sidebar menu now shows one navigation entry per line for cleaner balance across all pages.
|
||||||
|
|
||||||
### Queue Page
|
### Queue Page
|
||||||
|
|
||||||
|
|||||||
+4
-4
@@ -169,18 +169,18 @@ CONFIG_HTML = r"""<!doctype html>
|
|||||||
}
|
}
|
||||||
.row > * { flex: 1; }
|
.row > * { flex: 1; }
|
||||||
.page-links {
|
.page-links {
|
||||||
display: flex;
|
display: grid;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
flex-wrap: wrap;
|
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
border: 1px solid var(--line);
|
border: 1px solid var(--line);
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
background: rgba(255, 255, 255, 0.03);
|
background: rgba(255, 255, 255, 0.03);
|
||||||
}
|
}
|
||||||
.page-link {
|
.page-link {
|
||||||
display: inline-flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: flex-start;
|
||||||
|
width: 100%;
|
||||||
min-height: 40px;
|
min-height: 40px;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
|||||||
+4
-4
@@ -139,18 +139,18 @@ QUEUE_HTML = r"""<!doctype html>
|
|||||||
}
|
}
|
||||||
.row > * { flex: 1; }
|
.row > * { flex: 1; }
|
||||||
.page-links {
|
.page-links {
|
||||||
display: flex;
|
display: grid;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
flex-wrap: wrap;
|
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
border: 1px solid var(--line);
|
border: 1px solid var(--line);
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
background: rgba(255, 255, 255, 0.03);
|
background: rgba(255, 255, 255, 0.03);
|
||||||
}
|
}
|
||||||
.page-link {
|
.page-link {
|
||||||
display: inline-flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: flex-start;
|
||||||
|
width: 100%;
|
||||||
min-height: 40px;
|
min-height: 40px;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
|||||||
+4
-4
@@ -183,18 +183,18 @@ INDEX_HTML = r"""<!doctype html>
|
|||||||
backdrop-filter: blur(18px);
|
backdrop-filter: blur(18px);
|
||||||
}
|
}
|
||||||
.page-links {
|
.page-links {
|
||||||
display: flex;
|
display: grid;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
flex-wrap: wrap;
|
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
border: 1px solid var(--line);
|
border: 1px solid var(--line);
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
background: rgba(255, 255, 255, 0.03);
|
background: rgba(255, 255, 255, 0.03);
|
||||||
}
|
}
|
||||||
.page-link {
|
.page-link {
|
||||||
display: inline-flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: flex-start;
|
||||||
|
width: 100%;
|
||||||
min-height: 40px;
|
min-height: 40px;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
|||||||
+1
-1
@@ -86,4 +86,4 @@ def render_page_links(active_page):
|
|||||||
for key, label, href in PAGE_LINKS:
|
for key, label, href in PAGE_LINKS:
|
||||||
class_name = "page-link active" if key == active_page else "page-link"
|
class_name = "page-link active" if key == active_page else "page-link"
|
||||||
links.append(f' <a class="{class_name}" href="{href}">{label}</a>')
|
links.append(f' <a class="{class_name}" href="{href}">{label}</a>')
|
||||||
return " <div class=\"page-links\">\n" + "\n".join(links) + "\n </div>\n"
|
return " <nav class=\"page-links\" aria-label=\"Primary navigation\">\n" + "\n".join(links) + "\n </nav>\n"
|
||||||
|
|||||||
+4
-4
@@ -150,18 +150,18 @@ WATCHLIST_HTML = r"""<!doctype html>
|
|||||||
max-width: 28ch;
|
max-width: 28ch;
|
||||||
}
|
}
|
||||||
.page-links {
|
.page-links {
|
||||||
display: flex;
|
display: grid;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
flex-wrap: wrap;
|
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
border: 1px solid var(--line);
|
border: 1px solid var(--line);
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
background: rgba(255, 255, 255, 0.03);
|
background: rgba(255, 255, 255, 0.03);
|
||||||
}
|
}
|
||||||
.page-link {
|
.page-link {
|
||||||
display: inline-flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: flex-start;
|
||||||
|
width: 100%;
|
||||||
min-height: 40px;
|
min-height: 40px;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
|||||||
Reference in New Issue
Block a user