diff --git a/public/hhivp-mark.svg b/public/hhivp-mark.svg index 2f8187a..3b3e504 100644 --- a/public/hhivp-mark.svg +++ b/public/hhivp-mark.svg @@ -1,6 +1,5 @@ - - - + + diff --git a/src/components/Footer.astro b/src/components/Footer.astro index 4c0e80a..248ef08 100644 --- a/src/components/Footer.astro +++ b/src/components/Footer.astro @@ -14,9 +14,11 @@ const year = new Date().getFullYear();
- - - Разработка — hhivp.com + + + Сделано в hhivp.com
@@ -41,26 +43,40 @@ const year = new Date().getFullYear(); .footer-nav a:hover { color: var(--accent); } .dev-credit { margin-top: 0.75rem; - font-size: 0.74rem; color: var(--muted); - opacity: 0.7; text-align: center; } - .dev-credit-link { + .hhivp-credit { display: inline-flex; align-items: center; - gap: 0.45rem; - color: inherit; + vertical-align: middle; text-decoration: none; + color: inherit; + border: 1px solid currentColor; + border-radius: 999px; + padding: 3px; + gap: 0; + line-height: 1; + opacity: 0.6; + transition: gap 240ms ease, padding-right 240ms ease, opacity 240ms ease; } - .dev-credit-link:hover { color: var(--accent); } - .dev-credit-link:hover span { border-bottom-color: var(--accent); } - .dev-credit-link span { - border-bottom: 1px dashed currentColor; + .hhivp-credit:hover, + .hhivp-credit:focus-visible { + opacity: 1; + gap: 8px; + padding-right: 12px; + outline: none; } - .dev-credit-mark { - flex-shrink: 0; - display: block; - color: currentColor; + .hhivp-credit-mark { display: inline-flex; flex-shrink: 0; } + .hhivp-credit-mark img { display: block; width: 20px; height: 20px; } + .hhivp-credit-text { + display: inline-block; + overflow: hidden; + white-space: nowrap; + max-width: 0; + font-size: 0.74rem; + transition: max-width 240ms ease; } + .hhivp-credit:hover .hhivp-credit-text, + .hhivp-credit:focus-visible .hhivp-credit-text { max-width: 200px; }