From 6989b83fc927ee8820b9091dad830ae7cc796a59 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Sat, 15 Jul 2023 01:06:28 +0200 Subject: [PATCH] " " --- TangerineUI-purple.css | 180 ++++++++++++++++++++--------------------- TangerineUI.css | 180 ++++++++++++++++++++--------------------- 2 files changed, 180 insertions(+), 180 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index 82adaa9..f2cb1fe 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -3,9 +3,9 @@ A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/ - + by @nileane@nileane.fr - + Last Mastodon compatibility check: v4.1.4 stable ✅ */ @@ -41,7 +41,7 @@ --color-fg-muted: #655e6e; --color-secondary-bg: #0c0c0d; --color-secondary-separator: #26232e; - + --color-content-bg: #0b0b0b; --color-content-fg: #f2f2f2; --color-content-fg-bold: #ffffff; @@ -49,7 +49,7 @@ --color-content-secondary-bg: #1f1b22; --color-content-secondary-separator: rgba(64, 62, 89, 0.4); --color-content-bg-focus: #151515; - + --color-accent: #7a7af9; --color-accent-focus: #5a47ff; --color-accent-bg: #261f3c; @@ -204,31 +204,31 @@ body.layout-single-column { } /* 💨 Loading bar */ -.layout-single-column .loading-bar { +.layout-single-column .loading-bar { background-color: var(--color-accent); } /* Resetting borders */ -.layout-single-column .column>.scrollable, -.layout-single-column .error-column, -.layout-single-column .getting-started, +.layout-single-column .column>.scrollable, +.layout-single-column .error-column, +.layout-single-column .getting-started, .layout-single-column .regeneration-indicator, -.layout-single-column .audio-player, -.layout-single-column .compose-form .spoiler-input__input, -.layout-single-column .compose-form__autosuggest-wrapper, -.layout-single-column .compose-form__poll-wrapper select, -.layout-single-column .poll__option input[type=text], -.layout-single-column .report-dialog-modal__textarea, -.layout-single-column .search__input, +.layout-single-column .audio-player, +.layout-single-column .compose-form .spoiler-input__input, +.layout-single-column .compose-form__autosuggest-wrapper, +.layout-single-column .compose-form__poll-wrapper select, +.layout-single-column .poll__option input[type=text], +.layout-single-column .report-dialog-modal__textarea, +.layout-single-column .search__input, .layout-single-column .setting-text, .layout-single-column .compose-form .compose-form__buttons-wrapper, .layout-single-column .about__section__body { border: 0; } -.layout-single-column .column-inline-form, -.layout-single-column .column>.scrollable, -.layout-single-column .error-column, -.layout-single-column .getting-started, +.layout-single-column .column-inline-form, +.layout-single-column .column>.scrollable, +.layout-single-column .error-column, +.layout-single-column .getting-started, .layout-single-column .regeneration-indicator { background: transparent; } @@ -394,7 +394,7 @@ body.layout-single-column { .layout-single-column .fa-group.column-header__icon:before, .layout-single-column .fa-users.column-header__icon:before { content: var(--icon-users-column-link-active); -} +} /* Explore icon */ .layout-single-column .column-link .fa-hashtag::before { content: var(--icon-hashtag); @@ -488,7 +488,7 @@ body.layout-single-column { top: 2px; right: -5px; } - + /* Unfollow hashtag icon */ .layout-single-column .column-header__button .column-header__icon.fa-user-times::before { content: var(--icon-unfollow-hashtag); @@ -496,7 +496,7 @@ body.layout-single-column { top: 2px; right: -5px } - + @@ -512,7 +512,7 @@ body.layout-single-column { .layout-single-column .navigation-bar strong { color: var(--color-content-fg-bold); } -.layout-single-column .compose-form .autosuggest-textarea__suggestions, +.layout-single-column .compose-form .autosuggest-textarea__suggestions, .layout-single-column .compose-form .autosuggest-textarea__textarea, .layout-single-column .compose-form .autosuggest-textarea__suggestions__item, .layout-single-column .compose-form .compose-form__buttons-wrapper, @@ -674,7 +674,7 @@ body.layout-single-column { .layout-single-column .status__avatar { margin-bottom: -10px; } -.layout-single-column .reply-indicator__content, +.layout-single-column .reply-indicator__content, .layout-single-column .status__content { line-height: 19px; } @@ -745,7 +745,7 @@ body.layout-single-column { .layout-single-column .detailed-status__wrapper.focusable:focus, .layout-single-column .focusable:focus .detailed-status, .layout-single-column .focusable:focus .detailed-status__action-bar, -.layout-single-column .status__wrapper.focusable:focus .detailed-status, +.layout-single-column .status__wrapper.focusable:focus .detailed-status, .layout-single-column .focusable:focus .detailed-status__action-bar { outline: 0; background: var(--color-content-bg-focus); @@ -846,7 +846,7 @@ body.layout-single-column { .layout-single-column .status-card.compact { background-color: var(--color-content-secondary-bg); border: none; - box-shadow: + box-shadow: 0 1px 4px rgba(0, 0, 0, .08); } .layout-single-column .status-card__title, @@ -1022,7 +1022,7 @@ body.layout-single-column { .layout-single-column .tabs-bar__wrapper { background-color: transparent; border-radius: 7px 7px 0 0; - box-shadow: + box-shadow: inset 0 10px var(--color-bg), 0 -30px var(--color-bg); } @@ -1096,7 +1096,7 @@ body.layout-single-column { padding: 0 0 0 15px; line-height: 48px; font-weight: bold; -} +} .layout-single-column .column-header__icon { vertical-align: middle; display: inline-block; @@ -1122,9 +1122,9 @@ body.layout-single-column { .layout-single-column .columns-area--mobile { border-radius: 7px; } - .layout-single-column .column-header, + .layout-single-column .column-header, .layout-single-column .column-back-button, - .layout-single-column .column-header__button, + .layout-single-column .column-header__button, .layout-single-column .column-header__back-button { background-color: transparent; height: 55px; @@ -1172,9 +1172,9 @@ body.layout-single-column { border-radius: 7px; margin-bottom: 10px; } -.layout-single-column .account__section-headline a, -.layout-single-column .account__section-headline button, -.layout-single-column .notification__filter-bar a, +.layout-single-column .account__section-headline a, +.layout-single-column .account__section-headline button, +.layout-single-column .notification__filter-bar a, .layout-single-column .notification__filter-bar button { background-color: var(--color-accent-bg); color: var(--color-accent); @@ -1182,32 +1182,32 @@ body.layout-single-column { border-radius: 9px; transition: all .2s; } -.layout-single-column .account__section-headline a:hover, -.layout-single-column .account__section-headline button:hover, -.layout-single-column .notification__filter-bar a:hover, +.layout-single-column .account__section-headline a:hover, +.layout-single-column .account__section-headline button:hover, +.layout-single-column .notification__filter-bar a:hover, .layout-single-column .notification__filter-bar button:hover { background-color: var(--color-content-bg); color: var(--color-content-fg); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } -.layout-single-column .account__section-headline a.active, -.layout-single-column .account__section-headline button.active, -.layout-single-column .notification__filter-bar a.active, +.layout-single-column .account__section-headline a.active, +.layout-single-column .account__section-headline button.active, +.layout-single-column .notification__filter-bar a.active, .layout-single-column .notification__filter-bar button.active { background-color: var(--color-content-bg); color: var(--color-content-fg); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } -.layout-single-column .account__section-headline a.active:after, +.layout-single-column .account__section-headline a.active:after, .layout-single-column .account__section-headline a.active:before, -.layout-single-column .account__section-headline button.active:after, -.layout-single-column .account__section-headline button.active:before, -.layout-single-column .notification__filter-bar a.active:after, -.layout-single-column .notification__filter-bar a.active:before, -.layout-single-column .notification__filter-bar button.active:after, +.layout-single-column .account__section-headline button.active:after, +.layout-single-column .account__section-headline button.active:before, +.layout-single-column .notification__filter-bar a.active:after, +.layout-single-column .notification__filter-bar a.active:before, +.layout-single-column .notification__filter-bar button.active:after, .layout-single-column .notification__filter-bar button.active:before { display: none; -} +} .layout-single-column .account__section-headline button, .layout-single-column .notification__filter-bar button { background-color: transparent; @@ -1231,9 +1231,9 @@ body.layout-single-column { display: none; } @media (prefers-color-scheme: dark) { - .layout-single-column .account__section-headline a.active, - .layout-single-column .account__section-headline button.active, - .layout-single-column .notification__filter-bar a.active, + .layout-single-column .account__section-headline a.active, + .layout-single-column .account__section-headline button.active, + .layout-single-column .notification__filter-bar a.active, .layout-single-column .notification__filter-bar button.active { background-color: var(--color-bg); } @@ -1250,7 +1250,7 @@ body.layout-single-column { margin-left: 4px; } -.layout-single-column .column-link.column-link--logo, +.layout-single-column .column-link.column-link--logo, .layout-single-column .ui__header__logo { display: inline-flex; padding: 0; @@ -1295,7 +1295,7 @@ body.layout-single-column { top: -4px; font-weight: bold; border: 0; -} +} .layout-single-column .compose-panel hr, .navigation-panel hr { display: none; } @@ -1355,9 +1355,9 @@ body.layout-single-column { background-color: rgba(255, 255, 255, 0.5); border-left: 0; } - .layout-single-column .navigation-panel .column-link, + .layout-single-column .navigation-panel .column-link, .layout-single-column .navigation-panel .navigation-panel__legal, - .layout-single-column a.column-link--transparent.active, + .layout-single-column a.column-link--transparent.active, .layout-single-column a.column-link--transparent.active:hover, .layout-single-column .column-link--transparent:hover { flex: 0 0 18vw; @@ -1370,7 +1370,7 @@ body.layout-single-column { box-sizing: border-box; background-color: transparent; } - .layout-single-column a.column-link--transparent.active, + .layout-single-column a.column-link--transparent.active, .layout-single-column a.column-link--transparent.active:hover, .layout-single-column a.column-link--transparent:active { margin: 6px 0 7px; @@ -1414,8 +1414,8 @@ body.layout-single-column { background-color: rgba(24, 24, 25, 0.7); border: 0; } - .layout-single-column a.column-link--transparent.active, - .layout-single-column a.column-link--transparent.active:hover, + .layout-single-column a.column-link--transparent.active, + .layout-single-column a.column-link--transparent.active:hover, .layout-single-column a.column-link--transparent:active { background-color: var(--color-bg); } @@ -1603,7 +1603,7 @@ body.layout-single-column { margin: 0 0 10px; background-color: var(--color-content-bg); border-radius: 7px; -} +} .layout-single-column .account-card__header { padding: 0; border-radius: 7px 7px 0 0; @@ -1629,7 +1629,7 @@ body.layout-single-column { margin: 0 0 10px; background-color: var(--color-content-bg); border-radius: 7px; -} +} .layout-single-column .account-card__header { padding: 0; border-radius: 7px 7px 0 0; @@ -1753,13 +1753,13 @@ body.layout-single-column { .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.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.selected mark, +.search__popout__menu__item:active mark, +.search__popout__menu__item:focus mark, .search__popout__menu__item:hover mark { background-color: var(--color-accent); color: var(--color-accent-fg); @@ -1775,11 +1775,11 @@ body.layout-single-column { .layout-single-column .search__input { padding: 13px; } - .layout-single-column i.fa-search, + .layout-single-column i.fa-search, .layout-single-column i.fa.active { transform: scale(1); top: 13px; - } + } .layout-single-column .explore__search-header { padding: 0 0 10px; } @@ -1999,11 +1999,11 @@ body.layout-single-column { } .layout-single-column .icon-button, .layout-single-column .icon-button.inverted, -.layout-single-column .reply-indicator__content .status__content__spoiler-link, +.layout-single-column .reply-indicator__content .status__content__spoiler-link, .layout-single-column .status__content .status__content__spoiler-link { color: var(--color-content-fg); } -.layout-single-column .reply-indicator__content .status__content__spoiler-link, +.layout-single-column .reply-indicator__content .status__content__spoiler-link, .layout-single-column .status__content .status__content__spoiler-link { background-color: var(--color-accent-bg); } @@ -2017,8 +2017,8 @@ body.layout-single-column { background-color: var(--color-accent-bg); color: var(--color-accent); } -.layout-single-column .icon-button:active, -.layout-single-column .icon-button:focus, +.layout-single-column .icon-button:active, +.layout-single-column .icon-button:focus, .layout-single-column .icon-button:hover { background-color: var(--color-accent-bg); color: var(--color-accent); @@ -2103,9 +2103,9 @@ body.layout-single-column { background-color: var(--color-accent); color: var(--color-accent-fg); } -.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content, -.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content strong, -.layout-single-column .privacy-dropdown__option:hover .privacy-dropdown__option__content, +.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content, +.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content strong, +.layout-single-column .privacy-dropdown__option:hover .privacy-dropdown__option__content, .layout-single-column .privacy-dropdown__option:hover .privacy-dropdown__option__content strong, .layout-single-column .privacy-dropdown.active .privacy-dropdown__value.active .icon-button, .layout-single-column .privacy-dropdown .icon-button.inverted.active { @@ -2117,19 +2117,19 @@ body.layout-single-column { .layout-single-column .button.button-tertiary.button--destructive { background-color: transparent; } -.layout-single-column .button.button-tertiary.button--confirmation:active, -.layout-single-column .button.button-tertiary.button--confirmation:focus, +.layout-single-column .button.button-tertiary.button--confirmation:active, +.layout-single-column .button.button-tertiary.button--confirmation:focus, .layout-single-column .button.button-tertiary.button--confirmation:hover { background-color: #79bd9a; } -.layout-single-column .button.button-tertiary.button--destructive:active, -.layout-single-column .button.button-tertiary.button--destructive:focus, +.layout-single-column .button.button-tertiary.button--destructive:active, +.layout-single-column .button.button-tertiary.button--destructive:focus, .layout-single-column .button.button-tertiary.button--destructive:hover { background-color: #df405a; } -.layout-single-column .app-body .block-modal__cancel-button, -.layout-single-column .app-body .confirmation-modal__cancel-button, -.layout-single-column .app-body .confirmation-modal__secondary-button, +.layout-single-column .app-body .block-modal__cancel-button, +.layout-single-column .app-body .confirmation-modal__cancel-button, +.layout-single-column .app-body .confirmation-modal__secondary-button, .layout-single-column .app-body .mute-modal__cancel-button { background-color: transparent; } @@ -2395,13 +2395,13 @@ body.layout-single-column { .layout-single-column .about__section:nth-child(3) .about__section__body { padding-bottom: 4em; } -.layout-single-column .about__meta, +.layout-single-column .about__meta, .layout-single-column .about__section__title { color: var(--color-accent); background-color: var(--color-content-secondary-bg); border: 0; border-radius: 7px; -} +} .layout-single-column .about__section.active .about__section__title { border-radius: 7px 7px 0 0; } @@ -2413,13 +2413,13 @@ body.layout-single-column { .layout-single-column .prose, .layout-single-column .prose p, -.layout-single-column .prose b, -.layout-single-column .prose h1, -.layout-single-column .prose h2, -.layout-single-column .prose h3, -.layout-single-column .prose h4, -.layout-single-column .prose h5, -.layout-single-column .prose h6, +.layout-single-column .prose b, +.layout-single-column .prose h1, +.layout-single-column .prose h2, +.layout-single-column .prose h3, +.layout-single-column .prose h4, +.layout-single-column .prose h5, +.layout-single-column .prose h6, .layout-single-column .prose strong, .layout-single-column .rules-list, .layout-single-column .about__domain-blocks__domain h6, @@ -2484,4 +2484,4 @@ body.layout-single-column { .layout-single-column .getting-started__trends h4, /* Hide Trending header in sidebar */ .layout-single-column .account__header__bio .account__header__fields > dl:first-child /* Hide "Joined" field on profiles */ { display: none; -} \ No newline at end of file +} diff --git a/TangerineUI.css b/TangerineUI.css index dd5cc47..6567fbf 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -3,9 +3,9 @@ A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/ - + by @nileane@nileane.fr - + Last Mastodon compatibility check: v4.1.4 stable ✅ */ @@ -41,7 +41,7 @@ --color-fg-muted: #6e635e; --color-secondary-bg: #0d0c0c; --color-secondary-separator: #25201c; - + --color-content-bg: #0b0b0b; --color-content-fg: #f2f2f2; --color-content-fg-bold: #ffffff; @@ -49,7 +49,7 @@ --color-content-secondary-bg: #292623; --color-content-secondary-separator: rgba(77, 73, 70, 0.4); --color-content-bg-focus: #222222; - + --color-accent: #e68933; --color-accent-focus: #ffa047; --color-accent-bg: #3c2a1f; @@ -204,31 +204,31 @@ body.layout-single-column { } /* 💨 Loading bar */ -.layout-single-column .loading-bar { +.layout-single-column .loading-bar { background-color: var(--color-accent); } /* Resetting borders */ -.layout-single-column .column>.scrollable, -.layout-single-column .error-column, -.layout-single-column .getting-started, +.layout-single-column .column>.scrollable, +.layout-single-column .error-column, +.layout-single-column .getting-started, .layout-single-column .regeneration-indicator, -.layout-single-column .audio-player, -.layout-single-column .compose-form .spoiler-input__input, -.layout-single-column .compose-form__autosuggest-wrapper, -.layout-single-column .compose-form__poll-wrapper select, -.layout-single-column .poll__option input[type=text], -.layout-single-column .report-dialog-modal__textarea, -.layout-single-column .search__input, +.layout-single-column .audio-player, +.layout-single-column .compose-form .spoiler-input__input, +.layout-single-column .compose-form__autosuggest-wrapper, +.layout-single-column .compose-form__poll-wrapper select, +.layout-single-column .poll__option input[type=text], +.layout-single-column .report-dialog-modal__textarea, +.layout-single-column .search__input, .layout-single-column .setting-text, .layout-single-column .compose-form .compose-form__buttons-wrapper, .layout-single-column .about__section__body { border: 0; } -.layout-single-column .column-inline-form, -.layout-single-column .column>.scrollable, -.layout-single-column .error-column, -.layout-single-column .getting-started, +.layout-single-column .column-inline-form, +.layout-single-column .column>.scrollable, +.layout-single-column .error-column, +.layout-single-column .getting-started, .layout-single-column .regeneration-indicator { background: transparent; } @@ -394,7 +394,7 @@ body.layout-single-column { .layout-single-column .fa-group.column-header__icon:before, .layout-single-column .fa-users.column-header__icon:before { content: var(--icon-users-column-link-active); -} +} /* Explore icon */ .layout-single-column .column-link .fa-hashtag::before { content: var(--icon-hashtag); @@ -488,7 +488,7 @@ body.layout-single-column { top: 2px; right: -5px; } - + /* Unfollow hashtag icon */ .layout-single-column .column-header__button .column-header__icon.fa-user-times::before { content: var(--icon-unfollow-hashtag); @@ -496,7 +496,7 @@ body.layout-single-column { top: 2px; right: -5px } - + @@ -512,7 +512,7 @@ body.layout-single-column { .layout-single-column .navigation-bar strong { color: var(--color-content-fg-bold); } -.layout-single-column .compose-form .autosuggest-textarea__suggestions, +.layout-single-column .compose-form .autosuggest-textarea__suggestions, .layout-single-column .compose-form .autosuggest-textarea__textarea, .layout-single-column .compose-form .autosuggest-textarea__suggestions__item, .layout-single-column .compose-form .compose-form__buttons-wrapper, @@ -674,7 +674,7 @@ body.layout-single-column { .layout-single-column .status__avatar { margin-bottom: -10px; } -.layout-single-column .reply-indicator__content, +.layout-single-column .reply-indicator__content, .layout-single-column .status__content { line-height: 19px; } @@ -745,7 +745,7 @@ body.layout-single-column { .layout-single-column .detailed-status__wrapper.focusable:focus, .layout-single-column .focusable:focus .detailed-status, .layout-single-column .focusable:focus .detailed-status__action-bar, -.layout-single-column .status__wrapper.focusable:focus .detailed-status, +.layout-single-column .status__wrapper.focusable:focus .detailed-status, .layout-single-column .focusable:focus .detailed-status__action-bar { outline: 0; background: var(--color-content-bg-focus); @@ -846,7 +846,7 @@ body.layout-single-column { .layout-single-column .status-card.compact { background-color: var(--color-content-secondary-bg); border: none; - box-shadow: + box-shadow: 0 1px 4px rgba(0, 0, 0, .08); } .layout-single-column .status-card__title, @@ -1022,7 +1022,7 @@ body.layout-single-column { .layout-single-column .tabs-bar__wrapper { background-color: transparent; border-radius: 7px 7px 0 0; - box-shadow: + box-shadow: inset 0 10px var(--color-bg), 0 -30px var(--color-bg); } @@ -1096,7 +1096,7 @@ body.layout-single-column { padding: 0 0 0 15px; line-height: 48px; font-weight: bold; -} +} .layout-single-column .column-header__icon { vertical-align: middle; display: inline-block; @@ -1122,9 +1122,9 @@ body.layout-single-column { .layout-single-column .columns-area--mobile { border-radius: 7px; } - .layout-single-column .column-header, + .layout-single-column .column-header, .layout-single-column .column-back-button, - .layout-single-column .column-header__button, + .layout-single-column .column-header__button, .layout-single-column .column-header__back-button { background-color: transparent; height: 55px; @@ -1172,9 +1172,9 @@ body.layout-single-column { border-radius: 7px; margin-bottom: 10px; } -.layout-single-column .account__section-headline a, -.layout-single-column .account__section-headline button, -.layout-single-column .notification__filter-bar a, +.layout-single-column .account__section-headline a, +.layout-single-column .account__section-headline button, +.layout-single-column .notification__filter-bar a, .layout-single-column .notification__filter-bar button { background-color: var(--color-accent-bg); color: var(--color-accent); @@ -1182,32 +1182,32 @@ body.layout-single-column { border-radius: 9px; transition: all .2s; } -.layout-single-column .account__section-headline a:hover, -.layout-single-column .account__section-headline button:hover, -.layout-single-column .notification__filter-bar a:hover, +.layout-single-column .account__section-headline a:hover, +.layout-single-column .account__section-headline button:hover, +.layout-single-column .notification__filter-bar a:hover, .layout-single-column .notification__filter-bar button:hover { background-color: var(--color-content-bg); color: var(--color-content-fg); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } -.layout-single-column .account__section-headline a.active, -.layout-single-column .account__section-headline button.active, -.layout-single-column .notification__filter-bar a.active, +.layout-single-column .account__section-headline a.active, +.layout-single-column .account__section-headline button.active, +.layout-single-column .notification__filter-bar a.active, .layout-single-column .notification__filter-bar button.active { background-color: var(--color-content-bg); color: var(--color-content-fg); box-shadow: 0 0 0 4px var(--color-accent-bg) inset; } -.layout-single-column .account__section-headline a.active:after, +.layout-single-column .account__section-headline a.active:after, .layout-single-column .account__section-headline a.active:before, -.layout-single-column .account__section-headline button.active:after, -.layout-single-column .account__section-headline button.active:before, -.layout-single-column .notification__filter-bar a.active:after, -.layout-single-column .notification__filter-bar a.active:before, -.layout-single-column .notification__filter-bar button.active:after, +.layout-single-column .account__section-headline button.active:after, +.layout-single-column .account__section-headline button.active:before, +.layout-single-column .notification__filter-bar a.active:after, +.layout-single-column .notification__filter-bar a.active:before, +.layout-single-column .notification__filter-bar button.active:after, .layout-single-column .notification__filter-bar button.active:before { display: none; -} +} .layout-single-column .account__section-headline button, .layout-single-column .notification__filter-bar button { background-color: transparent; @@ -1231,9 +1231,9 @@ body.layout-single-column { display: none; } @media (prefers-color-scheme: dark) { - .layout-single-column .account__section-headline a.active, - .layout-single-column .account__section-headline button.active, - .layout-single-column .notification__filter-bar a.active, + .layout-single-column .account__section-headline a.active, + .layout-single-column .account__section-headline button.active, + .layout-single-column .notification__filter-bar a.active, .layout-single-column .notification__filter-bar button.active { background-color: var(--color-bg); } @@ -1250,7 +1250,7 @@ body.layout-single-column { margin-left: 4px; } -.layout-single-column .column-link.column-link--logo, +.layout-single-column .column-link.column-link--logo, .layout-single-column .ui__header__logo { display: inline-flex; padding: 0; @@ -1295,7 +1295,7 @@ body.layout-single-column { top: -4px; font-weight: bold; border: 0; -} +} .layout-single-column .compose-panel hr, .navigation-panel hr { display: none; } @@ -1355,9 +1355,9 @@ body.layout-single-column { background-color: rgba(255, 255, 255, 0.5); border-left: 0; } - .layout-single-column .navigation-panel .column-link, + .layout-single-column .navigation-panel .column-link, .layout-single-column .navigation-panel .navigation-panel__legal, - .layout-single-column a.column-link--transparent.active, + .layout-single-column a.column-link--transparent.active, .layout-single-column a.column-link--transparent.active:hover, .layout-single-column .column-link--transparent:hover { flex: 0 0 18vw; @@ -1370,7 +1370,7 @@ body.layout-single-column { box-sizing: border-box; background-color: transparent; } - .layout-single-column a.column-link--transparent.active, + .layout-single-column a.column-link--transparent.active, .layout-single-column a.column-link--transparent.active:hover, .layout-single-column a.column-link--transparent:active { margin: 6px 0 7px; @@ -1414,8 +1414,8 @@ body.layout-single-column { background-color: rgba(24, 24, 25, 0.7); border: 0; } - .layout-single-column a.column-link--transparent.active, - .layout-single-column a.column-link--transparent.active:hover, + .layout-single-column a.column-link--transparent.active, + .layout-single-column a.column-link--transparent.active:hover, .layout-single-column a.column-link--transparent:active { background-color: var(--color-bg); } @@ -1603,7 +1603,7 @@ body.layout-single-column { margin: 0 0 10px; background-color: var(--color-content-bg); border-radius: 7px; -} +} .layout-single-column .account-card__header { padding: 0; border-radius: 7px 7px 0 0; @@ -1629,7 +1629,7 @@ body.layout-single-column { margin: 0 0 10px; background-color: var(--color-content-bg); border-radius: 7px; -} +} .layout-single-column .account-card__header { padding: 0; border-radius: 7px 7px 0 0; @@ -1753,13 +1753,13 @@ body.layout-single-column { .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.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.selected mark, +.search__popout__menu__item:active mark, +.search__popout__menu__item:focus mark, .search__popout__menu__item:hover mark { background-color: var(--color-accent); color: var(--color-accent-fg); @@ -1775,11 +1775,11 @@ body.layout-single-column { .layout-single-column .search__input { padding: 13px; } - .layout-single-column i.fa-search, + .layout-single-column i.fa-search, .layout-single-column i.fa.active { transform: scale(1); top: 13px; - } + } .layout-single-column .explore__search-header { padding: 0 0 10px; } @@ -1999,11 +1999,11 @@ body.layout-single-column { } .layout-single-column .icon-button, .layout-single-column .icon-button.inverted, -.layout-single-column .reply-indicator__content .status__content__spoiler-link, +.layout-single-column .reply-indicator__content .status__content__spoiler-link, .layout-single-column .status__content .status__content__spoiler-link { color: var(--color-content-fg); } -.layout-single-column .reply-indicator__content .status__content__spoiler-link, +.layout-single-column .reply-indicator__content .status__content__spoiler-link, .layout-single-column .status__content .status__content__spoiler-link { background-color: var(--color-accent-bg); } @@ -2017,8 +2017,8 @@ body.layout-single-column { background-color: var(--color-accent-bg); color: var(--color-accent); } -.layout-single-column .icon-button:active, -.layout-single-column .icon-button:focus, +.layout-single-column .icon-button:active, +.layout-single-column .icon-button:focus, .layout-single-column .icon-button:hover { background-color: var(--color-accent-bg); color: var(--color-accent); @@ -2103,9 +2103,9 @@ body.layout-single-column { background-color: var(--color-accent); color: var(--color-accent-fg); } -.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content, -.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content strong, -.layout-single-column .privacy-dropdown__option:hover .privacy-dropdown__option__content, +.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content, +.layout-single-column .privacy-dropdown__option.active .privacy-dropdown__option__content strong, +.layout-single-column .privacy-dropdown__option:hover .privacy-dropdown__option__content, .layout-single-column .privacy-dropdown__option:hover .privacy-dropdown__option__content strong, .layout-single-column .privacy-dropdown.active .privacy-dropdown__value.active .icon-button, .layout-single-column .privacy-dropdown .icon-button.inverted.active { @@ -2117,19 +2117,19 @@ body.layout-single-column { .layout-single-column .button.button-tertiary.button--destructive { background-color: transparent; } -.layout-single-column .button.button-tertiary.button--confirmation:active, -.layout-single-column .button.button-tertiary.button--confirmation:focus, +.layout-single-column .button.button-tertiary.button--confirmation:active, +.layout-single-column .button.button-tertiary.button--confirmation:focus, .layout-single-column .button.button-tertiary.button--confirmation:hover { background-color: #79bd9a; } -.layout-single-column .button.button-tertiary.button--destructive:active, -.layout-single-column .button.button-tertiary.button--destructive:focus, +.layout-single-column .button.button-tertiary.button--destructive:active, +.layout-single-column .button.button-tertiary.button--destructive:focus, .layout-single-column .button.button-tertiary.button--destructive:hover { background-color: #df405a; } -.layout-single-column .app-body .block-modal__cancel-button, -.layout-single-column .app-body .confirmation-modal__cancel-button, -.layout-single-column .app-body .confirmation-modal__secondary-button, +.layout-single-column .app-body .block-modal__cancel-button, +.layout-single-column .app-body .confirmation-modal__cancel-button, +.layout-single-column .app-body .confirmation-modal__secondary-button, .layout-single-column .app-body .mute-modal__cancel-button { background-color: transparent; } @@ -2395,13 +2395,13 @@ body.layout-single-column { .layout-single-column .about__section:nth-child(3) .about__section__body { padding-bottom: 4em; } -.layout-single-column .about__meta, +.layout-single-column .about__meta, .layout-single-column .about__section__title { color: var(--color-accent); background-color: var(--color-content-secondary-bg); border: 0; border-radius: 7px; -} +} .layout-single-column .about__section.active .about__section__title { border-radius: 7px 7px 0 0; } @@ -2413,13 +2413,13 @@ body.layout-single-column { .layout-single-column .prose, .layout-single-column .prose p, -.layout-single-column .prose b, -.layout-single-column .prose h1, -.layout-single-column .prose h2, -.layout-single-column .prose h3, -.layout-single-column .prose h4, -.layout-single-column .prose h5, -.layout-single-column .prose h6, +.layout-single-column .prose b, +.layout-single-column .prose h1, +.layout-single-column .prose h2, +.layout-single-column .prose h3, +.layout-single-column .prose h4, +.layout-single-column .prose h5, +.layout-single-column .prose h6, .layout-single-column .prose strong, .layout-single-column .rules-list, .layout-single-column .about__domain-blocks__domain h6, @@ -2484,4 +2484,4 @@ body.layout-single-column { .layout-single-column .getting-started__trends h4, /* Hide Trending header in sidebar */ .layout-single-column .account__header__bio .account__header__fields > dl:first-child /* Hide "Joined" field on profiles */ { display: none; -} \ No newline at end of file +}