Files
blog.pyaqa.ru/app/presentation/templates/partials/header.html
Sergey Vanyushkin 2aed9f5c8a refactor(ui): improve UI/UX design and spacing
- Increase card padding and gaps for better visual hierarchy
- Add hover lift effect to cards with smooth transitions
- Improve typography with larger headings and better line-height
- Darken meta text colors for better readability
- Add checkbox styling with accent color
- Make tags interactive with hover effects
- Add mobile responsive styles for forms and footer
- Replace Unicode arrows with SVG icons
- Improve focus styles for accessibility
- Increase badge padding and font-weight
- Add subtle shadow to cards by default
2026-05-02 15:03:20 +03:00

36 lines
2.0 KiB
HTML

<header class="site-header" data-testid="site-header">
<div class="container" data-testid="header-container">
<a href="/" class="site-logo" data-testid="nav-logo">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" data-testid="logo-icon">
<rect width="32" height="32" rx="6" fill="var(--color-primary)"/>
<path d="M8 12h16M8 16h12M8 20h8" stroke="white" stroke-width="2" stroke-linecap="round"/>
</svg>
<span data-testid="logo-text">Blog</span>
</a>
{% include "partials/nav.html" %}
<div class="header-actions" data-testid="header-actions">
<button
type="button"
class="theme-toggle"
data-testid="theme-toggle"
aria-label="Toggle dark mode"
title="Toggle dark mode"
>
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" data-testid="theme-light-icon" style="display: none;">
<path d="M10 2v2M10 16v2M4.22 4.22l1.42 1.42M14.36 14.36l1.42 1.42M2 10h2M16 10h2M4.22 15.78l1.42-1.42M14.36 5.64l1.42-1.42" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="10" cy="10" r="3" stroke="currentColor" stroke-width="2"/>
</svg>
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" data-testid="theme-dark-icon" style="display: none;">
<path d="M17.293 13.293A8 8 0 116.707 2.707a8.003 8.003 0 0010.586 10.586z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</button>
<a href="/posts/new" class="btn btn-primary btn-sm" data-testid="btn-create-post">
New Post
</a>
</div>
</div>
</header>