chinwag/ChinwagUI
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Search dropdown now fades in

Browse source
This commit is contained in:
Niléane 2023-10-13 23:32:47 +02:00
commit a4adda2d8b
No known key found for this signature in database
4 changed files with 64 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

18
TangerineUI-purple.css
View file

@ -2640,7 +2640,6 @@ body.layout-single-column {
} }
.layout-single-column .search__input:focus { .layout-single-column .search__input:focus {
border: 1px solid var(--color-accent); border: 1px solid var(--color-accent);
box-shadow: inset 0 0 0 1px var(--color-accent);
} }
.layout-single-column .compose-panel .fa-search, .layout-single-column .compose-panel .fa-search,
.layout-single-column .compose-panel .fa.active { .layout-single-column .compose-panel .fa.active {
@ -2731,11 +2730,26 @@ body.layout-single-column {
.layout-single-column .account .account__details .verified-badge { .layout-single-column .account .account__details .verified-badge {
color: var(--color-accent); color: var(--color-accent);
} }
@keyframes fadein-short {
from {
transform: translate(0, -10px);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
}
.layout-single-column .search__popout { .layout-single-column .search__popout {
background-color: var(--color-content-bg); background-color: var(--color-content-bg);
border-radius: 8px; border-radius: 8px;
box-shadow: 0 4px 6px rgba(0,0,0,.1); box-shadow: none;
margin-top: 10px; margin-top: 10px;
border: 1px solid var(--color-lines);
animation: .3s fadein-short 1;
}
.layout-single-column .search__popout h4 {
font-weight: bold;
} }
.layout-single-column .search__popout h4, .layout-single-column .search__popout h4,
.layout-single-column .search__popout__menu__message, .layout-single-column .search__popout__menu__message,

18
TangerineUI.css
View file

@ -2640,7 +2640,6 @@ body.layout-single-column {
} }
.layout-single-column .search__input:focus { .layout-single-column .search__input:focus {
border: 1px solid var(--color-accent); border: 1px solid var(--color-accent);
box-shadow: inset 0 0 0 1px var(--color-accent);
} }
.layout-single-column .compose-panel .fa-search, .layout-single-column .compose-panel .fa-search,
.layout-single-column .compose-panel .fa.active { .layout-single-column .compose-panel .fa.active {
@ -2731,11 +2730,26 @@ body.layout-single-column {
.layout-single-column .account .account__details .verified-badge { .layout-single-column .account .account__details .verified-badge {
color: var(--color-accent); color: var(--color-accent);
} }
@keyframes fadein-short {
from {
transform: translate(0, -10px);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
}
.layout-single-column .search__popout { .layout-single-column .search__popout {
background-color: var(--color-content-bg); background-color: var(--color-content-bg);
border-radius: 8px; border-radius: 8px;
box-shadow: 0 4px 6px rgba(0,0,0,.1); box-shadow: none;
margin-top: 10px; margin-top: 10px;
border: 1px solid var(--color-lines);
animation: .3s fadein-short 1;
}
.layout-single-column .search__popout h4 {
font-weight: bold;
} }
.layout-single-column .search__popout h4, .layout-single-column .search__popout h4,
.layout-single-column .search__popout__menu__message, .layout-single-column .search__popout__menu__message,

18
mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss
View file

@ -2640,7 +2640,6 @@ body.layout-single-column {
} }
.layout-single-column .search__input:focus { .layout-single-column .search__input:focus {
border: 1px solid var(--color-accent); border: 1px solid var(--color-accent);
box-shadow: inset 0 0 0 1px var(--color-accent);
} }
.layout-single-column .compose-panel .fa-search, .layout-single-column .compose-panel .fa-search,
.layout-single-column .compose-panel .fa.active { .layout-single-column .compose-panel .fa.active {
@ -2731,11 +2730,26 @@ body.layout-single-column {
.layout-single-column .account .account__details .verified-badge { .layout-single-column .account .account__details .verified-badge {
color: var(--color-accent); color: var(--color-accent);
} }
@keyframes fadein-short {
from {
transform: translate(0, -10px);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
}
.layout-single-column .search__popout { .layout-single-column .search__popout {
background-color: var(--color-content-bg); background-color: var(--color-content-bg);
border-radius: 8px; border-radius: 8px;
box-shadow: 0 4px 6px rgba(0,0,0,.1); box-shadow: none;
margin-top: 10px; margin-top: 10px;
border: 1px solid var(--color-lines);
animation: .3s fadein-short 1;
}
.layout-single-column .search__popout h4 {
font-weight: bold;
} }
.layout-single-column .search__popout h4, .layout-single-column .search__popout h4,
.layout-single-column .search__popout__menu__message, .layout-single-column .search__popout__menu__message,

18
mastodon/app/javascript/styles/tangerineui/layout-single-column.scss
View file

@ -2640,7 +2640,6 @@ body.layout-single-column {
} }
.layout-single-column .search__input:focus { .layout-single-column .search__input:focus {
border: 1px solid var(--color-accent); border: 1px solid var(--color-accent);
box-shadow: inset 0 0 0 1px var(--color-accent);
} }
.layout-single-column .compose-panel .fa-search, .layout-single-column .compose-panel .fa-search,
.layout-single-column .compose-panel .fa.active { .layout-single-column .compose-panel .fa.active {
@ -2731,11 +2730,26 @@ body.layout-single-column {
.layout-single-column .account .account__details .verified-badge { .layout-single-column .account .account__details .verified-badge {
color: var(--color-accent); color: var(--color-accent);
} }
@keyframes fadein-short {
from {
transform: translate(0, -10px);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
}
.layout-single-column .search__popout { .layout-single-column .search__popout {
background-color: var(--color-content-bg); background-color: var(--color-content-bg);
border-radius: 8px; border-radius: 8px;
box-shadow: 0 4px 6px rgba(0,0,0,.1); box-shadow: none;
margin-top: 10px; margin-top: 10px;
border: 1px solid var(--color-lines);
animation: .3s fadein-short 1;
}
.layout-single-column .search__popout h4 {
font-weight: bold;
} }
.layout-single-column .search__popout h4, .layout-single-column .search__popout h4,
.layout-single-column .search__popout__menu__message, .layout-single-column .search__popout__menu__message,