| 1 | <div class="container vb-page">
|
|---|
| 2 | <div class="vb-card">
|
|---|
| 3 | <div class="vb-ico" aria-hidden="true">👁️</div>
|
|---|
| 4 | <h1 class="vb-title"><%= t('vblk.title') %></h1>
|
|---|
| 5 | <p class="vb-text">
|
|---|
| 6 | <%= t('vblk.text_before') %>
|
|---|
| 7 | <strong><%= t('vblk.text_strong') %></strong> <%= t('vblk.text_after') %>
|
|---|
| 8 | </p>
|
|---|
| 9 | <div class="vb-actions">
|
|---|
| 10 | <button type="button" class="vb-btn vb-btn-primary" data-back>← <%= t('vblk.back') %></button>
|
|---|
| 11 | <a class="vb-btn" href="/"><%= t('vblk.to_home') %></a>
|
|---|
| 12 | </div>
|
|---|
| 13 | </div>
|
|---|
| 14 | </div>
|
|---|
| 15 |
|
|---|
| 16 | <style>
|
|---|
| 17 | .vb-page { max-width: 540px; margin: 3rem auto 4rem; padding: 0 1rem; }
|
|---|
| 18 | .vb-card {
|
|---|
| 19 | text-align: center;
|
|---|
| 20 | background: var(--paper);
|
|---|
| 21 | border: 1px solid var(--rule);
|
|---|
| 22 | border-radius: 16px;
|
|---|
| 23 | padding: 2.5rem 1.75rem;
|
|---|
| 24 | }
|
|---|
| 25 | .vb-ico {
|
|---|
| 26 | width: 64px; height: 64px; margin: 0 auto 1rem;
|
|---|
| 27 | display: flex; align-items: center; justify-content: center;
|
|---|
| 28 | font-size: 1.8rem; border-radius: 50%;
|
|---|
| 29 | background: color-mix(in srgb, var(--accent) 14%, var(--paper-2));
|
|---|
| 30 | }
|
|---|
| 31 | .vb-title { font-family: var(--font-display, serif); font-size: 1.6rem; margin: 0 0 0.5rem; }
|
|---|
| 32 | .vb-text { color: var(--ink-muted, var(--ink-soft)); font-size: 0.95rem; line-height: 1.55; margin: 0 auto 1.5rem; max-width: 42ch; }
|
|---|
| 33 | .vb-actions { display: flex; gap: 0.6rem; justify-content: center; flex-wrap: wrap; }
|
|---|
| 34 | .vb-btn {
|
|---|
| 35 | display: inline-flex; align-items: center; justify-content: center;
|
|---|
| 36 | padding: 0.6rem 1.1rem; min-height: 42px;
|
|---|
| 37 | border: 1px solid var(--rule); border-radius: 8px;
|
|---|
| 38 | background: var(--paper-2); color: var(--ink);
|
|---|
| 39 | font-family: var(--font-ui, system-ui), sans-serif; font-size: 0.9rem; font-weight: 600;
|
|---|
| 40 | text-decoration: none; cursor: pointer; transition: border-color 120ms, opacity 120ms;
|
|---|
| 41 | }
|
|---|
| 42 | .vb-btn:hover { border-color: var(--accent); }
|
|---|
| 43 | .vb-btn-primary { background: var(--accent); color: #fff; border-color: var(--accent); }
|
|---|
| 44 | .vb-btn-primary:hover { opacity: 0.92; }
|
|---|
| 45 | </style>
|
|---|