ensuring tags dropdown is visible
This commit is contained in:
+23
-4
@@ -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;
|
||||
|
||||
@@ -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
@@ -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 %}
|
||||
|
||||
Reference in New Issue
Block a user