Шапка одной высоты с админкой, ховер кнопок как у остальных
- на сайте логотип лежит внутри ссылки и как строчный элемент добавлял 7px: шапка была 70px против 63px в админке. Теперь логотип блочный, а ссылка — inline-flex: обе шапки 63px (и min-height layout сходится точно); - выход и «Админка» при наведении только меняют цвет (тёмно-красный и синий соответственно), без подъёма, тени и transform — как остальные кнопки проекта.
This commit is contained in:
@@ -112,7 +112,10 @@ a:hover { color: var(--accent-red); }
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.topbar-brand > a { display: inline-flex; }
|
||||
|
||||
.topbar-logo {
|
||||
display: block;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
flex-shrink: 0;
|
||||
@@ -166,12 +169,11 @@ a:hover { color: var(--accent-red); }
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: filter .15s ease, transform .15s ease;
|
||||
transition: background .15s ease, border-color .15s ease;
|
||||
}
|
||||
.topbar-admin:hover { filter: brightness(1.1); transform: translateY(-1px); }
|
||||
.topbar-admin:active { transform: none; }
|
||||
.topbar-admin:hover { background: var(--accent-blue); border-color: var(--accent-blue); }
|
||||
|
||||
/* красная кнопка выхода: при наведении темнеет, приподнимается и даёт тень */
|
||||
/* красная кнопка выхода: при наведении темнеет, как остальные кнопки */
|
||||
.topbar-logout {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -183,15 +185,9 @@ a:hover { color: var(--accent-red); }
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
|
||||
transition: background .15s ease, border-color .15s ease;
|
||||
}
|
||||
.topbar-logout:hover {
|
||||
background: var(--accent-red);
|
||||
border-color: var(--accent-red);
|
||||
box-shadow: 0 4px 12px color-mix(in srgb, var(--accent-red-bright) 35%, transparent);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
.topbar-logout:active { transform: none; box-shadow: none; }
|
||||
.topbar-logout:hover { background: var(--accent-red); border-color: var(--accent-red); }
|
||||
.theme-toggle .icon { width: 18px; height: 18px; }
|
||||
|
||||
.icon-sun { display: none; }
|
||||
|
||||
Reference in New Issue
Block a user