mi/sunday
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

♿ main content link

Browse Source
This commit is contained in:
mi
2025-11-14 18:47:02 +10:00
parent f31383800e
commit 04fa2073a6
2 changed files with 26 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
static/css/style.css
View File

@@ -78,6 +78,28 @@ body {
border-width: 0; border-width: 0;
} }
/* Skip to main content link - hidden until focused */
.skip-to-main {
position: absolute;
top: -100px;
left: 0;
z-index: 9999;
padding: var(--space-md) var(--space-lg);
background-color: var(--color-primary);
color: var(--color-background);
text-decoration: none;
font-weight: bold;
text-transform: uppercase;
letter-spacing: var(--letter-spacing-tight);
border: var(--border-width-thick) solid var(--color-primary);
}
.skip-to-main:focus {
top: 0;
outline: 3px solid var(--color-primary);
outline-offset: 2px;
}
/* Focus indicators for accessibility */ /* Focus indicators for accessibility */
a:focus, a:focus,
button:focus, button:focus,

5
templates/base.html
View File

@@ -33,6 +33,9 @@
{% block extra_css %}{% endblock %} {% block extra_css %}{% endblock %}
</head> </head>
<body> <body>
<!-- Skip to main content link for keyboard navigation -->
<a href="#main-content" class="skip-to-main">Skip to main content</a>
{% if header_image %} {% if header_image %}
<div class="site-header-image"> <div class="site-header-image">
<img src="{{ url_for('static', filename='images/' + header_image) }}" alt="{{ comic_name }} Header"> <img src="{{ url_for('static', filename='images/' + header_image) }}" alt="{{ comic_name }} Header">
@@ -77,7 +80,7 @@
</nav> </nav>
</header> </header>
<main> <main id="main-content">
<div class="container"> <div class="container">
{% block content %}{% endblock %} {% block content %}{% endblock %}
</div> </div>