Fix navigation styles
This commit is contained in:
parent
57ac6bd92e
commit
188454667a
@ -65,11 +65,6 @@
|
|||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
transform: translateX(-100%);
|
|
||||||
transition: transform 0.2s;
|
|
||||||
}
|
|
||||||
#sidebar.open {
|
|
||||||
transform: translateX(0);
|
|
||||||
}
|
}
|
||||||
#sidebar a {
|
#sidebar a {
|
||||||
color: #aaa;
|
color: #aaa;
|
||||||
@ -105,13 +100,36 @@
|
|||||||
background: #444;
|
background: #444;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
#sidebar-toggle {
|
||||||
|
position: fixed;
|
||||||
|
top: 12px;
|
||||||
|
left: 280px;
|
||||||
|
z-index: 200;
|
||||||
|
font-size: 24px;
|
||||||
|
color: rgba(255, 255, 255, 0.7);
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: none;
|
||||||
|
padding: 6px 10px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: left 0.2s;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#sidebar-toggle.collapsed {
|
||||||
|
left: 12px;
|
||||||
|
}
|
||||||
|
#sidebar-toggle:hover {
|
||||||
|
color: #fff;
|
||||||
|
background: rgba(0, 0, 0, 0.7);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="sidebar" class="hidden">
|
<div id="sidebar" class="$sidebar_class">
|
||||||
$folder_index
|
$folder_index
|
||||||
</div>
|
</div>
|
||||||
<div id="container">
|
<a id="sidebar-toggle" href="#" title="Toggle index (i)">☰</a>
|
||||||
|
<div id="container" class="$container_class">
|
||||||
<a href="$image_click_url"><div id="img" title="$filename" data-hash="$file_hash" data-path="$file_path"></div></a>
|
<a href="$image_click_url"><div id="img" title="$filename" data-hash="$file_hash" data-path="$file_path"></div></a>
|
||||||
<a href="$prev_url" class="chevron left" id="prev-btn">‹</a>
|
<a href="$prev_url" class="chevron left" id="prev-btn">‹</a>
|
||||||
<a href="$next_url" class="chevron right" id="next-btn">›</a>
|
<a href="$next_url" class="chevron right" id="next-btn">›</a>
|
||||||
@ -169,6 +187,20 @@
|
|||||||
document.getElementById('sidebar').classList.toggle('hidden');
|
document.getElementById('sidebar').classList.toggle('hidden');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Show sidebar toggle button when there is folder index content
|
||||||
|
(function() {
|
||||||
|
var sidebar = document.getElementById('sidebar');
|
||||||
|
var toggle = document.getElementById('sidebar-toggle');
|
||||||
|
if (sidebar && sidebar.textContent.trim()) {
|
||||||
|
toggle.style.display = 'block';
|
||||||
|
toggle.addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
sidebar.classList.toggle('hidden');
|
||||||
|
toggle.classList.toggle('collapsed');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})();
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
6
main.py
6
main.py
@ -393,6 +393,7 @@ def _render_page(
|
|||||||
|
|
||||||
# Build folder index sidebar if in navigate mode
|
# Build folder index sidebar if in navigate mode
|
||||||
folder_index = ""
|
folder_index = ""
|
||||||
|
sidebar_class = "hidden"
|
||||||
if navigate_enabled and use_navigate_urls:
|
if navigate_enabled and use_navigate_urls:
|
||||||
current_path = file_path
|
current_path = file_path
|
||||||
folder_index = _render_folder_index_html(
|
folder_index = _render_folder_index_html(
|
||||||
@ -400,6 +401,7 @@ def _render_page(
|
|||||||
current_order=current_order,
|
current_order=current_order,
|
||||||
current_delay=current_delay,
|
current_delay=current_delay,
|
||||||
)
|
)
|
||||||
|
sidebar_class = ""
|
||||||
|
|
||||||
content = template.substitute(
|
content = template.substitute(
|
||||||
img_url="/api/{file_hash}/data".format(file_hash=navigation_data["file_hash"]),
|
img_url="/api/{file_hash}/data".format(file_hash=navigation_data["file_hash"]),
|
||||||
@ -413,6 +415,8 @@ def _render_page(
|
|||||||
extra_meta=extra_meta,
|
extra_meta=extra_meta,
|
||||||
play_button=play_button,
|
play_button=play_button,
|
||||||
folder_index=folder_index,
|
folder_index=folder_index,
|
||||||
|
sidebar_class=sidebar_class,
|
||||||
|
container_class="",
|
||||||
)
|
)
|
||||||
|
|
||||||
return HTMLResponse(content=content)
|
return HTMLResponse(content=content)
|
||||||
@ -838,6 +842,8 @@ def _render_folder_index_page(
|
|||||||
extra_meta="",
|
extra_meta="",
|
||||||
play_button="",
|
play_button="",
|
||||||
folder_index=folder_index_html,
|
folder_index=folder_index_html,
|
||||||
|
sidebar_class="",
|
||||||
|
container_class="hidden",
|
||||||
)
|
)
|
||||||
|
|
||||||
return HTMLResponse(content=content)
|
return HTMLResponse(content=content)
|
||||||
|
|||||||
@ -92,6 +92,51 @@ class TestNavigatePage:
|
|||||||
response = await client_zip_navigate.get("/navigate/folder/")
|
response = await client_zip_navigate.get("/navigate/folder/")
|
||||||
assert "breadcrumb" in response.text
|
assert "breadcrumb" in response.text
|
||||||
|
|
||||||
|
async def test_folder_index_shows_subfolder_links(
|
||||||
|
self, client_zip_navigate: AsyncClient
|
||||||
|
) -> None:
|
||||||
|
"""Root folder index shows subfolder links."""
|
||||||
|
response = await client_zip_navigate.get("/navigate/")
|
||||||
|
assert "/navigate/folder/" in response.text
|
||||||
|
|
||||||
|
async def test_folder_index_shows_file_links(
|
||||||
|
self, client_zip_navigate: AsyncClient
|
||||||
|
) -> None:
|
||||||
|
"""Folder index shows file links."""
|
||||||
|
response = await client_zip_navigate.get("/navigate/")
|
||||||
|
assert "/navigate/top.txt" in response.text
|
||||||
|
|
||||||
|
async def test_file_page_has_sidebar(
|
||||||
|
self, client_zip_navigate: AsyncClient
|
||||||
|
) -> None:
|
||||||
|
"""File page in navigate mode has folder index sidebar."""
|
||||||
|
response = await client_zip_navigate.get("/navigate/top.txt")
|
||||||
|
assert "sidebar" in response.text
|
||||||
|
assert "index-item" in response.text
|
||||||
|
|
||||||
|
async def test_hash_page_has_no_sidebar(
|
||||||
|
self, client_zip_navigate: AsyncClient
|
||||||
|
) -> None:
|
||||||
|
"""Hash page does not show folder index sidebar content."""
|
||||||
|
# Get a valid hash from the zip
|
||||||
|
response = await client_zip_navigate.get("/navigate/top.txt")
|
||||||
|
assert response.status_code == 200
|
||||||
|
# Extract hash from the response
|
||||||
|
import re
|
||||||
|
|
||||||
|
match = re.search(r'data-hash="([^"]+)"', response.text)
|
||||||
|
assert match is not None
|
||||||
|
file_hash = match.group(1)
|
||||||
|
|
||||||
|
# Now visit the hash page
|
||||||
|
hash_response = await client_zip_navigate.get(f"/{file_hash}")
|
||||||
|
assert hash_response.status_code == 200
|
||||||
|
# Sidebar should be hidden on hash pages
|
||||||
|
assert 'id="sidebar" class="hidden"' in hash_response.text
|
||||||
|
# No folder index content in sidebar
|
||||||
|
assert "📁" not in hash_response.text
|
||||||
|
assert "📄" not in hash_response.text
|
||||||
|
|
||||||
async def test_returns_404_on_directory_indexer(
|
async def test_returns_404_on_directory_indexer(
|
||||||
self, client_dir: AsyncClient
|
self, client_dir: AsyncClient
|
||||||
) -> None:
|
) -> None:
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user