From 3f5fbd32e314fe9819d7d9b0b258dd476229fa1b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Fri, 22 Sep 2023 12:25:36 +0200 Subject: [PATCH] Fixed search popout icon alignements --- TangerineUI-purple.css | 25 +++++++++++++------ TangerineUI.css | 25 +++++++++++++------ .../layout-single-column.scss | 25 +++++++++++++------ .../tangerineui/layout-single-column.scss | 25 +++++++++++++------ 4 files changed, 68 insertions(+), 32 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index 7c7c659..df2bea2 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -2668,17 +2668,26 @@ body.layout-single-column { .layout-single-column .search__popout__menu__item { color: var(--color-content-fg); } +.layout-single-column .search__popout__menu__item { + align-items: initial; +} .layout-single-column .search__popout__menu__item mark { color: var(--color-content-fg-bold); } -.search__popout__menu__item.selected, -.search__popout__menu__item:active, -.search__popout__menu__item:focus, -.search__popout__menu__item:hover, -.search__popout__menu__item.selected mark, -.search__popout__menu__item:active mark, -.search__popout__menu__item:focus mark, -.search__popout__menu__item:hover mark { +.layout-single-column .search__popout__menu__item .icon-button:active, +.layout-single-column .search__popout__menu__item .icon-button:focus, +.layout-single-column .search__popout__menu__item .icon-button:hover { + background-color: transparent; + color: var(--color-accent-fg); +} +.layout-single-column .search__popout__menu__item.selected, +.layout-single-column .search__popout__menu__item:active, +.layout-single-column .search__popout__menu__item:focus, +.layout-single-column .search__popout__menu__item:hover, +.layout-single-column .search__popout__menu__item.selected mark, +.layout-single-column .search__popout__menu__item:active mark, +.layout-single-column .search__popout__menu__item:focus mark, +.layout-single-column .search__popout__menu__item:hover mark { background-color: var(--color-accent); color: var(--color-accent-fg); } diff --git a/TangerineUI.css b/TangerineUI.css index f038b39..a4f19ce 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -2668,17 +2668,26 @@ body.layout-single-column { .layout-single-column .search__popout__menu__item { color: var(--color-content-fg); } +.layout-single-column .search__popout__menu__item { + align-items: initial; +} .layout-single-column .search__popout__menu__item mark { color: var(--color-content-fg-bold); } -.search__popout__menu__item.selected, -.search__popout__menu__item:active, -.search__popout__menu__item:focus, -.search__popout__menu__item:hover, -.search__popout__menu__item.selected mark, -.search__popout__menu__item:active mark, -.search__popout__menu__item:focus mark, -.search__popout__menu__item:hover mark { +.layout-single-column .search__popout__menu__item .icon-button:active, +.layout-single-column .search__popout__menu__item .icon-button:focus, +.layout-single-column .search__popout__menu__item .icon-button:hover { + background-color: transparent; + color: var(--color-accent-fg); +} +.layout-single-column .search__popout__menu__item.selected, +.layout-single-column .search__popout__menu__item:active, +.layout-single-column .search__popout__menu__item:focus, +.layout-single-column .search__popout__menu__item:hover, +.layout-single-column .search__popout__menu__item.selected mark, +.layout-single-column .search__popout__menu__item:active mark, +.layout-single-column .search__popout__menu__item:focus mark, +.layout-single-column .search__popout__menu__item:hover mark { background-color: var(--color-accent); color: var(--color-accent-fg); } diff --git a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss index 7c7c659..df2bea2 100644 --- a/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss @@ -2668,17 +2668,26 @@ body.layout-single-column { .layout-single-column .search__popout__menu__item { color: var(--color-content-fg); } +.layout-single-column .search__popout__menu__item { + align-items: initial; +} .layout-single-column .search__popout__menu__item mark { color: var(--color-content-fg-bold); } -.search__popout__menu__item.selected, -.search__popout__menu__item:active, -.search__popout__menu__item:focus, -.search__popout__menu__item:hover, -.search__popout__menu__item.selected mark, -.search__popout__menu__item:active mark, -.search__popout__menu__item:focus mark, -.search__popout__menu__item:hover mark { +.layout-single-column .search__popout__menu__item .icon-button:active, +.layout-single-column .search__popout__menu__item .icon-button:focus, +.layout-single-column .search__popout__menu__item .icon-button:hover { + background-color: transparent; + color: var(--color-accent-fg); +} +.layout-single-column .search__popout__menu__item.selected, +.layout-single-column .search__popout__menu__item:active, +.layout-single-column .search__popout__menu__item:focus, +.layout-single-column .search__popout__menu__item:hover, +.layout-single-column .search__popout__menu__item.selected mark, +.layout-single-column .search__popout__menu__item:active mark, +.layout-single-column .search__popout__menu__item:focus mark, +.layout-single-column .search__popout__menu__item:hover mark { background-color: var(--color-accent); color: var(--color-accent-fg); } diff --git a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss index f038b39..a4f19ce 100644 --- a/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss +++ b/mastodon/app/javascript/styles/tangerineui/layout-single-column.scss @@ -2668,17 +2668,26 @@ body.layout-single-column { .layout-single-column .search__popout__menu__item { color: var(--color-content-fg); } +.layout-single-column .search__popout__menu__item { + align-items: initial; +} .layout-single-column .search__popout__menu__item mark { color: var(--color-content-fg-bold); } -.search__popout__menu__item.selected, -.search__popout__menu__item:active, -.search__popout__menu__item:focus, -.search__popout__menu__item:hover, -.search__popout__menu__item.selected mark, -.search__popout__menu__item:active mark, -.search__popout__menu__item:focus mark, -.search__popout__menu__item:hover mark { +.layout-single-column .search__popout__menu__item .icon-button:active, +.layout-single-column .search__popout__menu__item .icon-button:focus, +.layout-single-column .search__popout__menu__item .icon-button:hover { + background-color: transparent; + color: var(--color-accent-fg); +} +.layout-single-column .search__popout__menu__item.selected, +.layout-single-column .search__popout__menu__item:active, +.layout-single-column .search__popout__menu__item:focus, +.layout-single-column .search__popout__menu__item:hover, +.layout-single-column .search__popout__menu__item.selected mark, +.layout-single-column .search__popout__menu__item:active mark, +.layout-single-column .search__popout__menu__item:focus mark, +.layout-single-column .search__popout__menu__item:hover mark { background-color: var(--color-accent); color: var(--color-accent-fg); }