WIP 02: style adjustments to match eh22 styleguide

This commit is contained in:
kritzl 2025-02-20 22:03:16 +01:00
commit 0501598d41
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
75 changed files with 957 additions and 317 deletions

View file

@ -13,9 +13,7 @@
p.toggleSearch a,
button[type="submit"] {
.fontello();
.hide-text-show-before();
.icon-search();
position: relative;
width: @icon-size;
@ -26,25 +24,35 @@
border: solid 1px transparent;
padding: 0;
transition: @transition color, @transition background-color, @transition border-color;
display: flex;
align-items: center;
&:hover,
&:focus,
&:active {
min-height: @icon-size;
background-color: @ini_button_color;
border: solid 1px @ini_button_background;
.fnActiveButton();
&::after {
background-color: @ini_button_background;
&::after{
background-color: var(--color-glow-primary);
}
}
&::before {
width: 100%;
color: inherit;
width: @icon-size;
height: 0.8em;
font-size: @icon-search_font-size;
text-align: center;
margin: 0;
color: var(--color-foreground);
content: '';
display: block;
mask-size: contain;
mask-position: center;
mask-repeat: no-repeat;
background-color: currentColor;
mask-image: url('img/search.svg');
}
}
@ -78,7 +86,7 @@
&:focus,
&:active {
background-color: @ini_nav_menu_hover_bg;
border-color: @ini_nav_menu_hover_color;
border-color: var(--color-shade-4);
color: @ini_nav_menu_hover_color;
}
}
@ -92,17 +100,6 @@
height: auto;
min-height: (@icon-size - .2);
color: @quicksearch-button-color;
&:hover,
&:focus,
&:active {
top: 0;
bottom: 0;
min-height: @icon-size;
background-color: @ini_button_color;
border: solid 1px @ini_button_background;
color: @ini_button_background;
}
}
/* + + + form + + + */
@ -128,7 +125,7 @@
button[type="submit"] {
border: solid 1px transparent;
border-right-color: @ini_border;
border-right-color: var(--color-shade-4);
margin-left: -(@icon-size);
&::after {
@ -138,7 +135,7 @@
bottom: 15%;
width: 1px;
left: -1px;
background-color: @ini_border;
background-color: var(--color-shade-4);
transition: @transition background-color;
}
}