ensuring tags dropdown is visible

This commit is contained in:
2026-02-04 19:56:04 -05:00
parent c95896693f
commit 079f1c1d49
4 changed files with 60 additions and 170 deletions
+23 -4
View File
@@ -168,10 +168,10 @@ header {
left: 50%;
transform: translateX(-50%);
min-width: 150px;
background: var(--surface);
border: 1px solid var(--border);
background: rgba(0, 0, 0, 0.7);
border: 1px solid rgba(255, 255, 255, 0.5);
border-radius: 6px;
box-shadow: 0 4px 12px rgba(0,0,0,0.3);
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
z-index: 1001;
padding: 0.5rem 0;
margin-top: 0.25rem;
@@ -187,7 +187,7 @@ header {
}
.nav-dropdown-menu a:hover {
background: var(--hover);
background: rgba(255, 255, 255, 0.15);
}
.nav-dropdown:hover .nav-dropdown-menu,
@@ -1255,6 +1255,25 @@ header {
background: rgba(255,255,255,0.15);
}
/* Dropdown within showcase nav */
.showcase-nav .nav-dropdown {
position: relative;
display: inline-block;
pointer-events: auto;
}
.showcase-nav .nav-dropdown-trigger {
cursor: pointer;
border: none;
background: transparent;
font-family: inherit;
}
.showcase-nav .nav-dropdown-menu {
left: 50%;
transform: translateX(-50%);
}
.showcase-nav .nav-hint {
color: rgba(255,255,255,0.4);
font-size: 0.8rem;
+13 -8
View File
@@ -2,16 +2,20 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ImageRepo - {% block title %}{% endblock %}</title>
<link rel="icon" href="{{ url_for('static', filename='favicon.svg') }}" type="image/svg+xml">
<link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}" sizes="any">
<link rel="apple-touch-icon" href="{{ url_for('static', filename='apple-touch-icon.png') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
{% block head %}{% endblock %}
</head>
<body>
<body{% block body_attrs %}{% endblock %}>
{% block body %}
<div class="mainview">
{% block header %}
<header>
<nav class="navbar">
<a class="nav-button" href="{{ url_for('main.index') }}">Showcase</a>
@@ -34,9 +38,9 @@
<a class="nav-button" href="{{ url_for('main.settings') }}">Settings</a>
</nav>
</header>
{% endblock %}
<!-- FLASH MESSAGES -->
<!-- FLASH MESSAGES -->
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<div class="flash-container">
@@ -47,12 +51,13 @@
{% endif %}
{% endwith %}
<!-- MAIN CONTENT -->
<div class="content">
{% block content %}{% endblock %}
</div>
<!-- MAIN CONTENT -->
<div class="content">
{% block content %}{% endblock %}
</div>
</div>
{% endblock %}
{% block scripts %}{% endblock %}
</body>
</html>
+24 -13
View File
@@ -1,20 +1,30 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ImageRepo - Showcase</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body class="showcase-body">
{% extends "layout.html" %}
{% block title %}Showcase{% endblock %}
{% block body_attrs %} class="showcase-body"{% endblock %}
{% block body %}
<!-- Floating navbar overlay -->
<nav class="showcase-nav">
<div class="showcase-nav-links">
<a class="nav-link" href="{{ url_for('main.index') }}">Showcase</a>
<a class="nav-link" href="{{ url_for('main.gallery') }}">Gallery</a>
<a class="nav-link" href="{{ url_for('main.tag_list', kind='artist') }}">Artists</a>
<a class="nav-link" href="{{ url_for('main.tag_list') }}">Tags</a>
<div class="nav-dropdown">
<button class="nav-link nav-dropdown-trigger">Tags</button>
<div class="nav-dropdown-menu">
<a href="{{ url_for('main.tag_list') }}">All Tags</a>
<a href="{{ url_for('main.tag_list', kind='artist') }}">Artists</a>
<a href="{{ url_for('main.tag_list', kind='character') }}">Characters</a>
<a href="{{ url_for('main.tag_list', kind='series') }}">Series</a>
<a href="{{ url_for('main.tag_list', kind='fandom') }}">Fandoms</a>
<a href="{{ url_for('main.tag_list', kind='rating') }}">Ratings</a>
<a href="{{ url_for('main.tag_list', kind='archive') }}">Archives</a>
<a href="{{ url_for('main.tag_list', kind='source') }}">Sources</a>
<a href="{{ url_for('main.tag_list', kind='post') }}">Posts</a>
<a href="{{ url_for('main.tag_list', kind='user') }}">User Tags</a>
</div>
</div>
<a class="nav-link" href="{{ url_for('main.settings') }}">Settings</a>
</div>
<span class="nav-hint">Press R to shuffle</span>
@@ -63,8 +73,9 @@
</div>
</div>
</div>
{% endblock %}
{% block scripts %}
<script src="{{ url_for('static', filename='js/view-modal.js') }}"></script>
<script src="{{ url_for('static', filename='js/showcase.js') }}"></script>
</body>
</html>
{% endblock %}