Visual update for the column header
This commit is contained in:
parent
0c38c5673d
commit
78608346f6
4 changed files with 120 additions and 400 deletions
|
|
@ -295,8 +295,6 @@ body.layout-single-column {
|
||||||
.layout-single-column .scrollable,
|
.layout-single-column .scrollable,
|
||||||
.layout-single-column .column > .scrollable {
|
.layout-single-column .column > .scrollable {
|
||||||
max-height: max-content;
|
max-height: max-content;
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -925,17 +923,17 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Emoji picker */
|
/* Emoji picker */
|
||||||
.layout-single-column .emoji-button {
|
.layout-single-column .compose-form .emoji-button {
|
||||||
margin: 15px 10px 0 0;
|
margin: 15px 10px 0 0;
|
||||||
background-image: var(--icon-emoji);
|
background-image: var(--icon-emoji);
|
||||||
background-size: 26px;
|
background-size: 26px;
|
||||||
background-position: bottom left;
|
background-position: bottom left;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button .emojione {
|
.layout-single-column .compose-form .emoji-button .emojione {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button:hover {
|
.layout-single-column .compose-form .emoji-button:hover {
|
||||||
background-image: var(--icon-emoji-accent);
|
background-image: var(--icon-emoji-accent);
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-picker-dropdown__menu {
|
.layout-single-column .emoji-picker-dropdown__menu {
|
||||||
|
|
@ -1097,7 +1095,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1112,8 +1109,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top-left-radius: 8px;
|
border-top-left-radius: 8px;
|
||||||
border-top-right-radius: 8px;
|
border-top-right-radius: 8px;
|
||||||
|
|
@ -1320,9 +1315,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 4px var(--color-accent-lines);
|
inset 0 4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 -4px var(--color-accent-lines);
|
inset 0 -4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1765,12 +1758,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .empty-column-indicator {
|
.layout-single-column .empty-column-indicator {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border-radius: 8px;
|
border: 1px solid var(--color-lines);
|
||||||
|
border-radius: 0 0 8px 8px;
|
||||||
contain: content;
|
contain: content;
|
||||||
}
|
}
|
||||||
.layout-single-column .empty-column-indicator a {
|
.layout-single-column .empty-column-indicator a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
|
.layout-single-column .explore__links > .empty-column-indicator {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Timeline hint */
|
/* Timeline hint */
|
||||||
.layout-single-column .timeline-hint {
|
.layout-single-column .timeline-hint {
|
||||||
|
|
@ -1886,9 +1883,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 10px var(--color-bg),
|
inset 0 10px var(--color-bg),
|
||||||
0 -30px var(--color-bg);
|
0 -30px var(--color-bg);
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper {
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__wrapper.active:before {
|
.layout-single-column .column-header__wrapper.active:before {
|
||||||
background: none;
|
background: none;
|
||||||
opacity: 40%;
|
opacity: 40%;
|
||||||
|
|
@ -1896,25 +1890,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-header__wrapper.active {
|
.layout-single-column .column-header__wrapper.active {
|
||||||
box-shadow: 0 0;
|
box-shadow: 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper::after,
|
|
||||||
.layout-single-column .column-back-button::after {
|
|
||||||
content: " ";
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: -10px;
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
box-shadow:
|
|
||||||
0 -5px var(--color-bg),
|
|
||||||
0 -10px var(--color-bg),
|
|
||||||
0 -15px var(--color-bg),
|
|
||||||
0 -20px var(--color-bg);
|
|
||||||
height: 10px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
background-color: transparent;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header {
|
.layout-single-column .column-header {
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -1922,8 +1897,11 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-back-button {
|
.layout-single-column .column-back-button {
|
||||||
background: var(--color-content-bg);
|
background: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-radius: 8px;
|
border-right: 1px solid var(--color-lines);
|
||||||
|
border-left: 1px solid var(--color-lines);
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
|
|
@ -1934,12 +1912,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-back-button {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__button {
|
.layout-single-column .column-header__button {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
transition: all .2s;
|
transition: all .2s;
|
||||||
|
height: 50px;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__icon {
|
.layout-single-column .column-header__icon {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
|
|
@ -1989,27 +1965,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .load-more:hover {
|
.layout-single-column .load-more:hover {
|
||||||
background-color: var(--color-accent-lines);
|
background-color: var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media screen and (min-width:890px) and (max-width:1174px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
margin-top: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-single-column .column-header__collapsible {
|
.layout-single-column .column-header__collapsible {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 -20px 0 var(--color-bg);
|
box-shadow: 0 -20px 0 var(--color-bg);
|
||||||
background-color: var(--color-secondary-bg);
|
background-color: var(--color-secondary-bg);
|
||||||
}
|
border-left: 1px solid var(--color-lines);
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
border-right: 1px solid var(--color-lines);
|
||||||
border: 1px solid var(--color-lines);
|
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
|
@ -2020,9 +1982,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__collapsible-inner {
|
.layout-single-column .column-header__collapsible-inner {
|
||||||
background: var(--color-secondary-bg);
|
background: var(--color-secondary-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
|
|
@ -2035,7 +1994,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header > button {
|
.layout-single-column .column-header > button {
|
||||||
padding: 0 0 0 15px;
|
padding: 0 0 0 15px;
|
||||||
line-height: 45px;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:1174px) {
|
@media screen and (max-width:1174px) {
|
||||||
|
|
@ -2111,7 +2069,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .notification__filter-bar {
|
.layout-single-column .notification__filter-bar {
|
||||||
background: var(--color-accent-bg);
|
background: var(--color-accent-bg);
|
||||||
border: 1px solid var(--color-accent-lines);
|
border: 1px solid var(--color-accent-lines);
|
||||||
border-radius: 8px;
|
}
|
||||||
|
.layout-single-column .account__header + .account__section-headline {
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
.layout-single-column .account__section-headline:has(+ .explore__suggestions) {
|
||||||
|
border-bottom-left-radius: 8px;
|
||||||
|
border-bottom-right-radius: 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline a,
|
.layout-single-column .account__section-headline a,
|
||||||
|
|
@ -2543,7 +2507,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* 👤 Account view
|
/* 👤 Account view
|
||||||
--------------- */
|
--------------- */
|
||||||
.layout-single-column .account__header {
|
.layout-single-column .account__header {
|
||||||
border-radius: 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
@ -2589,9 +2553,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__tabs__name .icon-lock {
|
.layout-single-column .account__header__tabs__name .icon-lock {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__header__content a {
|
.layout-single-column .account__header__content a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -2694,13 +2655,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
|
||||||
.layout-single-column .account-timeline__header + article .account { /* rounded corners on first post below account header + on first account in followings/followers list */
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
}
|
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
.layout-single-column .account-timeline__header + article .status__wrapper,
|
||||||
.layout-single-column .account-timeline__header + article .account {
|
.layout-single-column .account-timeline__header + article .account {
|
||||||
|
|
@ -2730,11 +2684,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* ✨ Explore tab
|
/* ✨ Explore tab
|
||||||
-------------- */
|
-------------- */
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .account__section-headline + .scrollable article:first-child .status__wrapper {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
|
|
@ -2757,13 +2706,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border-radius: 8px !important;
|
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
border-radius: 0 !important;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -2787,7 +2735,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* Hashtag header */
|
/* Hashtag header */
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
padding: 18px 20px 20px;
|
padding: 22px 20px 24px;
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
|
|
@ -2814,8 +2762,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -2987,12 +2933,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section {
|
.layout-single-column .search-results__section {
|
||||||
background-color: var(--color-bg);
|
background-color: var(--color-bg);
|
||||||
padding-bottom: 10px;
|
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
.layout-single-column .search-results__section__header {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
|
|
@ -3002,26 +2946,15 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .explore__search-results {
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
.layout-single-column .explore__search-results article:first-child > .account,
|
.layout-single-column .explore__search-results article:first-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:first-child,
|
.layout-single-column .explore__search-results article:first-child > .trends__item {
|
||||||
.layout-single-column .explore__search-results article:first-child > .trends__item,
|
|
||||||
.layout-single-column .search-results__section > .trends__item:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 8px 8px 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__search-results article:last-child > .account,
|
.layout-single-column .explore__search-results article:last-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:last-child,
|
|
||||||
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
||||||
.layout-single-column .search-results__section > .trends__item:last-child,
|
|
||||||
.layout-single-column .explore__search-results .load-more:last-child {
|
.layout-single-column .explore__search-results .load-more:last-child {
|
||||||
border-radius: 0 0 8px 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.layout-single-column .account .account__details > span {
|
.layout-single-column .account .account__details > span {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
|
@ -3108,18 +3041,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .dismissable-banner {
|
.layout-single-column .dismissable-banner {
|
||||||
background-color: var(--color-accent);
|
background-color: var(--color-accent);
|
||||||
box-shadow: 0 5px var(--color-content-bg);
|
box-shadow: 0 5px var(--color-content-bg);
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 0;
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 7px 7px 0 0;
|
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .dismissable-banner,
|
.layout-single-column .dismissable-banner,
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border-radius: 0;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -4031,8 +3962,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
}
|
}
|
||||||
.layout-single-column .announcements {
|
.layout-single-column .announcements {
|
||||||
margin-top: 10px;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
box-shadow: 0 -20px var(--color-bg);
|
box-shadow: 0 -20px var(--color-bg);
|
||||||
|
|
@ -4091,6 +4020,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
|
||||||
130
TangerineUI.css
130
TangerineUI.css
|
|
@ -293,8 +293,6 @@ body.layout-single-column {
|
||||||
.layout-single-column .scrollable,
|
.layout-single-column .scrollable,
|
||||||
.layout-single-column .column > .scrollable {
|
.layout-single-column .column > .scrollable {
|
||||||
max-height: max-content;
|
max-height: max-content;
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -923,17 +921,17 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Emoji picker */
|
/* Emoji picker */
|
||||||
.layout-single-column .emoji-button {
|
.layout-single-column .compose-form .emoji-button {
|
||||||
margin: 15px 10px 0 0;
|
margin: 15px 10px 0 0;
|
||||||
background-image: var(--icon-emoji);
|
background-image: var(--icon-emoji);
|
||||||
background-size: 26px;
|
background-size: 26px;
|
||||||
background-position: bottom left;
|
background-position: bottom left;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button .emojione {
|
.layout-single-column .compose-form .emoji-button .emojione {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button:hover {
|
.layout-single-column .compose-form .emoji-button:hover {
|
||||||
background-image: var(--icon-emoji-accent);
|
background-image: var(--icon-emoji-accent);
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-picker-dropdown__menu {
|
.layout-single-column .emoji-picker-dropdown__menu {
|
||||||
|
|
@ -1095,7 +1093,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1110,8 +1107,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top-left-radius: 8px;
|
border-top-left-radius: 8px;
|
||||||
border-top-right-radius: 8px;
|
border-top-right-radius: 8px;
|
||||||
|
|
@ -1318,9 +1313,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 4px var(--color-accent-lines);
|
inset 0 4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 -4px var(--color-accent-lines);
|
inset 0 -4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1763,12 +1756,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .empty-column-indicator {
|
.layout-single-column .empty-column-indicator {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border-radius: 8px;
|
border: 1px solid var(--color-lines);
|
||||||
|
border-radius: 0 0 8px 8px;
|
||||||
contain: content;
|
contain: content;
|
||||||
}
|
}
|
||||||
.layout-single-column .empty-column-indicator a {
|
.layout-single-column .empty-column-indicator a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
|
.layout-single-column .explore__links > .empty-column-indicator {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Timeline hint */
|
/* Timeline hint */
|
||||||
.layout-single-column .timeline-hint {
|
.layout-single-column .timeline-hint {
|
||||||
|
|
@ -1884,9 +1881,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 10px var(--color-bg),
|
inset 0 10px var(--color-bg),
|
||||||
0 -30px var(--color-bg);
|
0 -30px var(--color-bg);
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper {
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__wrapper.active:before {
|
.layout-single-column .column-header__wrapper.active:before {
|
||||||
background: none;
|
background: none;
|
||||||
opacity: 40%;
|
opacity: 40%;
|
||||||
|
|
@ -1894,25 +1888,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-header__wrapper.active {
|
.layout-single-column .column-header__wrapper.active {
|
||||||
box-shadow: 0 0;
|
box-shadow: 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper::after,
|
|
||||||
.layout-single-column .column-back-button::after {
|
|
||||||
content: " ";
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: -10px;
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
box-shadow:
|
|
||||||
0 -5px var(--color-bg),
|
|
||||||
0 -10px var(--color-bg),
|
|
||||||
0 -15px var(--color-bg),
|
|
||||||
0 -20px var(--color-bg);
|
|
||||||
height: 10px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
background-color: transparent;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header {
|
.layout-single-column .column-header {
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -1920,8 +1895,11 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-back-button {
|
.layout-single-column .column-back-button {
|
||||||
background: var(--color-content-bg);
|
background: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-radius: 8px;
|
border-right: 1px solid var(--color-lines);
|
||||||
|
border-left: 1px solid var(--color-lines);
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
|
|
@ -1932,12 +1910,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-back-button {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__button {
|
.layout-single-column .column-header__button {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
transition: all .2s;
|
transition: all .2s;
|
||||||
|
height: 50px;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__icon {
|
.layout-single-column .column-header__icon {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
|
|
@ -1987,27 +1963,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .load-more:hover {
|
.layout-single-column .load-more:hover {
|
||||||
background-color: var(--color-accent-lines);
|
background-color: var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media screen and (min-width:890px) and (max-width:1174px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
margin-top: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-single-column .column-header__collapsible {
|
.layout-single-column .column-header__collapsible {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 -20px 0 var(--color-bg);
|
box-shadow: 0 -20px 0 var(--color-bg);
|
||||||
background-color: var(--color-secondary-bg);
|
background-color: var(--color-secondary-bg);
|
||||||
}
|
border-left: 1px solid var(--color-lines);
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
border-right: 1px solid var(--color-lines);
|
||||||
border: 1px solid var(--color-lines);
|
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
|
@ -2018,9 +1980,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__collapsible-inner {
|
.layout-single-column .column-header__collapsible-inner {
|
||||||
background: var(--color-secondary-bg);
|
background: var(--color-secondary-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
|
|
@ -2033,7 +1992,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header > button {
|
.layout-single-column .column-header > button {
|
||||||
padding: 0 0 0 15px;
|
padding: 0 0 0 15px;
|
||||||
line-height: 45px;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:1174px) {
|
@media screen and (max-width:1174px) {
|
||||||
|
|
@ -2109,7 +2067,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .notification__filter-bar {
|
.layout-single-column .notification__filter-bar {
|
||||||
background: var(--color-accent-bg);
|
background: var(--color-accent-bg);
|
||||||
border: 1px solid var(--color-accent-lines);
|
border: 1px solid var(--color-accent-lines);
|
||||||
border-radius: 8px;
|
}
|
||||||
|
.layout-single-column .account__header + .account__section-headline {
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
.layout-single-column .account__section-headline:has(+ .explore__suggestions) {
|
||||||
|
border-bottom-left-radius: 8px;
|
||||||
|
border-bottom-right-radius: 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline a,
|
.layout-single-column .account__section-headline a,
|
||||||
|
|
@ -2541,7 +2505,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* 👤 Account view
|
/* 👤 Account view
|
||||||
--------------- */
|
--------------- */
|
||||||
.layout-single-column .account__header {
|
.layout-single-column .account__header {
|
||||||
border-radius: 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
@ -2587,9 +2551,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__tabs__name .icon-lock {
|
.layout-single-column .account__header__tabs__name .icon-lock {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__header__content a {
|
.layout-single-column .account__header__content a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -2692,13 +2653,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
|
||||||
.layout-single-column .account-timeline__header + article .account { /* rounded corners on first post below account header + on first account in followings/followers list */
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
}
|
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
.layout-single-column .account-timeline__header + article .status__wrapper,
|
||||||
.layout-single-column .account-timeline__header + article .account {
|
.layout-single-column .account-timeline__header + article .account {
|
||||||
|
|
@ -2728,11 +2682,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* ✨ Explore tab
|
/* ✨ Explore tab
|
||||||
-------------- */
|
-------------- */
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .account__section-headline + .scrollable article:first-child .status__wrapper {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
|
|
@ -2755,13 +2704,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border-radius: 8px !important;
|
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
border-radius: 0 !important;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -2785,7 +2733,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* Hashtag header */
|
/* Hashtag header */
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
padding: 18px 20px 20px;
|
padding: 22px 20px 24px;
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
|
|
@ -2812,8 +2760,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -2985,12 +2931,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section {
|
.layout-single-column .search-results__section {
|
||||||
background-color: var(--color-bg);
|
background-color: var(--color-bg);
|
||||||
padding-bottom: 10px;
|
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
.layout-single-column .search-results__section__header {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
|
|
@ -3000,26 +2944,15 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .explore__search-results {
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
.layout-single-column .explore__search-results article:first-child > .account,
|
.layout-single-column .explore__search-results article:first-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:first-child,
|
.layout-single-column .explore__search-results article:first-child > .trends__item {
|
||||||
.layout-single-column .explore__search-results article:first-child > .trends__item,
|
|
||||||
.layout-single-column .search-results__section > .trends__item:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 8px 8px 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__search-results article:last-child > .account,
|
.layout-single-column .explore__search-results article:last-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:last-child,
|
|
||||||
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
||||||
.layout-single-column .search-results__section > .trends__item:last-child,
|
|
||||||
.layout-single-column .explore__search-results .load-more:last-child {
|
.layout-single-column .explore__search-results .load-more:last-child {
|
||||||
border-radius: 0 0 8px 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.layout-single-column .account .account__details > span {
|
.layout-single-column .account .account__details > span {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
|
@ -3106,18 +3039,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .dismissable-banner {
|
.layout-single-column .dismissable-banner {
|
||||||
background-color: var(--color-accent);
|
background-color: var(--color-accent);
|
||||||
box-shadow: 0 5px var(--color-content-bg);
|
box-shadow: 0 5px var(--color-content-bg);
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 0;
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 7px 7px 0 0;
|
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .dismissable-banner,
|
.layout-single-column .dismissable-banner,
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border-radius: 0;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -4029,8 +3960,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
}
|
}
|
||||||
.layout-single-column .announcements {
|
.layout-single-column .announcements {
|
||||||
margin-top: 10px;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
box-shadow: 0 -20px var(--color-bg);
|
box-shadow: 0 -20px var(--color-bg);
|
||||||
|
|
@ -4089,6 +4018,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
|
||||||
|
|
@ -295,8 +295,6 @@ body.layout-single-column {
|
||||||
.layout-single-column .scrollable,
|
.layout-single-column .scrollable,
|
||||||
.layout-single-column .column > .scrollable {
|
.layout-single-column .column > .scrollable {
|
||||||
max-height: max-content;
|
max-height: max-content;
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -925,17 +923,17 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Emoji picker */
|
/* Emoji picker */
|
||||||
.layout-single-column .emoji-button {
|
.layout-single-column .compose-form .emoji-button {
|
||||||
margin: 15px 10px 0 0;
|
margin: 15px 10px 0 0;
|
||||||
background-image: var(--icon-emoji);
|
background-image: var(--icon-emoji);
|
||||||
background-size: 26px;
|
background-size: 26px;
|
||||||
background-position: bottom left;
|
background-position: bottom left;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button .emojione {
|
.layout-single-column .compose-form .emoji-button .emojione {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button:hover {
|
.layout-single-column .compose-form .emoji-button:hover {
|
||||||
background-image: var(--icon-emoji-accent);
|
background-image: var(--icon-emoji-accent);
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-picker-dropdown__menu {
|
.layout-single-column .emoji-picker-dropdown__menu {
|
||||||
|
|
@ -1097,7 +1095,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1112,8 +1109,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top-left-radius: 8px;
|
border-top-left-radius: 8px;
|
||||||
border-top-right-radius: 8px;
|
border-top-right-radius: 8px;
|
||||||
|
|
@ -1320,9 +1315,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 4px var(--color-accent-lines);
|
inset 0 4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 -4px var(--color-accent-lines);
|
inset 0 -4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1765,12 +1758,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .empty-column-indicator {
|
.layout-single-column .empty-column-indicator {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border-radius: 8px;
|
border: 1px solid var(--color-lines);
|
||||||
|
border-radius: 0 0 8px 8px;
|
||||||
contain: content;
|
contain: content;
|
||||||
}
|
}
|
||||||
.layout-single-column .empty-column-indicator a {
|
.layout-single-column .empty-column-indicator a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
|
.layout-single-column .explore__links > .empty-column-indicator {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Timeline hint */
|
/* Timeline hint */
|
||||||
.layout-single-column .timeline-hint {
|
.layout-single-column .timeline-hint {
|
||||||
|
|
@ -1886,9 +1883,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 10px var(--color-bg),
|
inset 0 10px var(--color-bg),
|
||||||
0 -30px var(--color-bg);
|
0 -30px var(--color-bg);
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper {
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__wrapper.active:before {
|
.layout-single-column .column-header__wrapper.active:before {
|
||||||
background: none;
|
background: none;
|
||||||
opacity: 40%;
|
opacity: 40%;
|
||||||
|
|
@ -1896,25 +1890,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-header__wrapper.active {
|
.layout-single-column .column-header__wrapper.active {
|
||||||
box-shadow: 0 0;
|
box-shadow: 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper::after,
|
|
||||||
.layout-single-column .column-back-button::after {
|
|
||||||
content: " ";
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: -10px;
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
box-shadow:
|
|
||||||
0 -5px var(--color-bg),
|
|
||||||
0 -10px var(--color-bg),
|
|
||||||
0 -15px var(--color-bg),
|
|
||||||
0 -20px var(--color-bg);
|
|
||||||
height: 10px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
background-color: transparent;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header {
|
.layout-single-column .column-header {
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -1922,8 +1897,11 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-back-button {
|
.layout-single-column .column-back-button {
|
||||||
background: var(--color-content-bg);
|
background: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-radius: 8px;
|
border-right: 1px solid var(--color-lines);
|
||||||
|
border-left: 1px solid var(--color-lines);
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
|
|
@ -1934,12 +1912,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-back-button {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__button {
|
.layout-single-column .column-header__button {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
transition: all .2s;
|
transition: all .2s;
|
||||||
|
height: 50px;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__icon {
|
.layout-single-column .column-header__icon {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
|
|
@ -1989,27 +1965,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .load-more:hover {
|
.layout-single-column .load-more:hover {
|
||||||
background-color: var(--color-accent-lines);
|
background-color: var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media screen and (min-width:890px) and (max-width:1174px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
margin-top: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-single-column .column-header__collapsible {
|
.layout-single-column .column-header__collapsible {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 -20px 0 var(--color-bg);
|
box-shadow: 0 -20px 0 var(--color-bg);
|
||||||
background-color: var(--color-secondary-bg);
|
background-color: var(--color-secondary-bg);
|
||||||
}
|
border-left: 1px solid var(--color-lines);
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
border-right: 1px solid var(--color-lines);
|
||||||
border: 1px solid var(--color-lines);
|
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
|
@ -2020,9 +1982,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__collapsible-inner {
|
.layout-single-column .column-header__collapsible-inner {
|
||||||
background: var(--color-secondary-bg);
|
background: var(--color-secondary-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
|
|
@ -2035,7 +1994,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header > button {
|
.layout-single-column .column-header > button {
|
||||||
padding: 0 0 0 15px;
|
padding: 0 0 0 15px;
|
||||||
line-height: 45px;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:1174px) {
|
@media screen and (max-width:1174px) {
|
||||||
|
|
@ -2111,7 +2069,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .notification__filter-bar {
|
.layout-single-column .notification__filter-bar {
|
||||||
background: var(--color-accent-bg);
|
background: var(--color-accent-bg);
|
||||||
border: 1px solid var(--color-accent-lines);
|
border: 1px solid var(--color-accent-lines);
|
||||||
border-radius: 8px;
|
}
|
||||||
|
.layout-single-column .account__header + .account__section-headline {
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
.layout-single-column .account__section-headline:has(+ .explore__suggestions) {
|
||||||
|
border-bottom-left-radius: 8px;
|
||||||
|
border-bottom-right-radius: 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline a,
|
.layout-single-column .account__section-headline a,
|
||||||
|
|
@ -2543,7 +2507,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* 👤 Account view
|
/* 👤 Account view
|
||||||
--------------- */
|
--------------- */
|
||||||
.layout-single-column .account__header {
|
.layout-single-column .account__header {
|
||||||
border-radius: 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
@ -2589,9 +2553,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__tabs__name .icon-lock {
|
.layout-single-column .account__header__tabs__name .icon-lock {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__header__content a {
|
.layout-single-column .account__header__content a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -2694,13 +2655,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
|
||||||
.layout-single-column .account-timeline__header + article .account { /* rounded corners on first post below account header + on first account in followings/followers list */
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
}
|
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
.layout-single-column .account-timeline__header + article .status__wrapper,
|
||||||
.layout-single-column .account-timeline__header + article .account {
|
.layout-single-column .account-timeline__header + article .account {
|
||||||
|
|
@ -2730,11 +2684,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* ✨ Explore tab
|
/* ✨ Explore tab
|
||||||
-------------- */
|
-------------- */
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .account__section-headline + .scrollable article:first-child .status__wrapper {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
|
|
@ -2757,13 +2706,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border-radius: 8px !important;
|
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
border-radius: 0 !important;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -2787,7 +2735,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* Hashtag header */
|
/* Hashtag header */
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
padding: 18px 20px 20px;
|
padding: 22px 20px 24px;
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
|
|
@ -2814,8 +2762,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -2987,12 +2933,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section {
|
.layout-single-column .search-results__section {
|
||||||
background-color: var(--color-bg);
|
background-color: var(--color-bg);
|
||||||
padding-bottom: 10px;
|
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
.layout-single-column .search-results__section__header {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
|
|
@ -3002,26 +2946,15 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .explore__search-results {
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
.layout-single-column .explore__search-results article:first-child > .account,
|
.layout-single-column .explore__search-results article:first-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:first-child,
|
.layout-single-column .explore__search-results article:first-child > .trends__item {
|
||||||
.layout-single-column .explore__search-results article:first-child > .trends__item,
|
|
||||||
.layout-single-column .search-results__section > .trends__item:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 8px 8px 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__search-results article:last-child > .account,
|
.layout-single-column .explore__search-results article:last-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:last-child,
|
|
||||||
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
||||||
.layout-single-column .search-results__section > .trends__item:last-child,
|
|
||||||
.layout-single-column .explore__search-results .load-more:last-child {
|
.layout-single-column .explore__search-results .load-more:last-child {
|
||||||
border-radius: 0 0 8px 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.layout-single-column .account .account__details > span {
|
.layout-single-column .account .account__details > span {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
|
@ -3108,18 +3041,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .dismissable-banner {
|
.layout-single-column .dismissable-banner {
|
||||||
background-color: var(--color-accent);
|
background-color: var(--color-accent);
|
||||||
box-shadow: 0 5px var(--color-content-bg);
|
box-shadow: 0 5px var(--color-content-bg);
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 0;
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 7px 7px 0 0;
|
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .dismissable-banner,
|
.layout-single-column .dismissable-banner,
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border-radius: 0;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -4031,8 +3962,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
}
|
}
|
||||||
.layout-single-column .announcements {
|
.layout-single-column .announcements {
|
||||||
margin-top: 10px;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
box-shadow: 0 -20px var(--color-bg);
|
box-shadow: 0 -20px var(--color-bg);
|
||||||
|
|
@ -4091,6 +4020,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
|
||||||
|
|
@ -293,8 +293,6 @@ body.layout-single-column {
|
||||||
.layout-single-column .scrollable,
|
.layout-single-column .scrollable,
|
||||||
.layout-single-column .column > .scrollable {
|
.layout-single-column .column > .scrollable {
|
||||||
max-height: max-content;
|
max-height: max-content;
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -923,17 +921,17 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Emoji picker */
|
/* Emoji picker */
|
||||||
.layout-single-column .emoji-button {
|
.layout-single-column .compose-form .emoji-button {
|
||||||
margin: 15px 10px 0 0;
|
margin: 15px 10px 0 0;
|
||||||
background-image: var(--icon-emoji);
|
background-image: var(--icon-emoji);
|
||||||
background-size: 26px;
|
background-size: 26px;
|
||||||
background-position: bottom left;
|
background-position: bottom left;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button .emojione {
|
.layout-single-column .compose-form .emoji-button .emojione {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-button:hover {
|
.layout-single-column .compose-form .emoji-button:hover {
|
||||||
background-image: var(--icon-emoji-accent);
|
background-image: var(--icon-emoji-accent);
|
||||||
}
|
}
|
||||||
.layout-single-column .emoji-picker-dropdown__menu {
|
.layout-single-column .emoji-picker-dropdown__menu {
|
||||||
|
|
@ -1095,7 +1093,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1110,8 +1107,6 @@ body.layout-single-column {
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
.layout-single-column .scrollable > div:first-child > div:first-child > .status__wrapper,
|
||||||
.layout-single-column .scrollable > div:first-child > .status__wrapper,
|
|
||||||
.layout-single-column .scrollable > div > article:first-child > div > .status__wrapper,
|
|
||||||
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
.layout-single-column .explore__search-results > div:first-child > .status__wrapper {
|
||||||
border-top-left-radius: 8px;
|
border-top-left-radius: 8px;
|
||||||
border-top-right-radius: 8px;
|
border-top-right-radius: 8px;
|
||||||
|
|
@ -1318,9 +1313,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 4px var(--color-accent-lines);
|
inset 0 4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
.layout-single-column .scrollable > div:first-child > .detailed-status__wrapper { /* Detailed post is first in column */
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 -4px var(--color-accent-lines);
|
inset 0 -4px var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -1763,12 +1756,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .empty-column-indicator {
|
.layout-single-column .empty-column-indicator {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border-radius: 8px;
|
border: 1px solid var(--color-lines);
|
||||||
|
border-radius: 0 0 8px 8px;
|
||||||
contain: content;
|
contain: content;
|
||||||
}
|
}
|
||||||
.layout-single-column .empty-column-indicator a {
|
.layout-single-column .empty-column-indicator a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
|
.layout-single-column .explore__links > .empty-column-indicator {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Timeline hint */
|
/* Timeline hint */
|
||||||
.layout-single-column .timeline-hint {
|
.layout-single-column .timeline-hint {
|
||||||
|
|
@ -1884,9 +1881,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
inset 0 10px var(--color-bg),
|
inset 0 10px var(--color-bg),
|
||||||
0 -30px var(--color-bg);
|
0 -30px var(--color-bg);
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper {
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__wrapper.active:before {
|
.layout-single-column .column-header__wrapper.active:before {
|
||||||
background: none;
|
background: none;
|
||||||
opacity: 40%;
|
opacity: 40%;
|
||||||
|
|
@ -1894,25 +1888,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-header__wrapper.active {
|
.layout-single-column .column-header__wrapper.active {
|
||||||
box-shadow: 0 0;
|
box-shadow: 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__wrapper::after,
|
|
||||||
.layout-single-column .column-back-button::after {
|
|
||||||
content: " ";
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: -10px;
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
box-shadow:
|
|
||||||
0 -5px var(--color-bg),
|
|
||||||
0 -10px var(--color-bg),
|
|
||||||
0 -15px var(--color-bg),
|
|
||||||
0 -20px var(--color-bg);
|
|
||||||
height: 10px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
background-color: transparent;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header {
|
.layout-single-column .column-header {
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
@ -1920,8 +1895,11 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .column-back-button {
|
.layout-single-column .column-back-button {
|
||||||
background: var(--color-content-bg);
|
background: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
border: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
border-radius: 8px;
|
border-right: 1px solid var(--color-lines);
|
||||||
|
border-left: 1px solid var(--color-lines);
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
|
|
@ -1932,12 +1910,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-back-button {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__button {
|
.layout-single-column .column-header__button {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
transition: all .2s;
|
transition: all .2s;
|
||||||
|
height: 50px;
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__icon {
|
.layout-single-column .column-header__icon {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
|
|
@ -1987,27 +1963,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .load-more:hover {
|
.layout-single-column .load-more:hover {
|
||||||
background-color: var(--color-accent-lines);
|
background-color: var(--color-accent-lines);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media screen and (min-width:890px) and (max-width:1174px) {
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child,
|
|
||||||
.layout-single-column .item-list > .load-gap:first-child {
|
|
||||||
margin-top: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-single-column .column-header__collapsible {
|
.layout-single-column .column-header__collapsible {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 -20px 0 var(--color-bg);
|
box-shadow: 0 -20px 0 var(--color-bg);
|
||||||
background-color: var(--color-secondary-bg);
|
background-color: var(--color-secondary-bg);
|
||||||
}
|
border-left: 1px solid var(--color-lines);
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
border-right: 1px solid var(--color-lines);
|
||||||
border: 1px solid var(--color-lines);
|
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
.layout-single-column .column-header__collapsible::-webkit-scrollbar-track {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
|
@ -2018,9 +1980,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header__collapsible:not(.collapsed) {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .column-header__collapsible-inner {
|
.layout-single-column .column-header__collapsible-inner {
|
||||||
background: var(--color-secondary-bg);
|
background: var(--color-secondary-bg);
|
||||||
border: 0;
|
border: 0;
|
||||||
|
|
@ -2033,7 +1992,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .column-header > button {
|
.layout-single-column .column-header > button {
|
||||||
padding: 0 0 0 15px;
|
padding: 0 0 0 15px;
|
||||||
line-height: 45px;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:1174px) {
|
@media screen and (max-width:1174px) {
|
||||||
|
|
@ -2109,7 +2067,13 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .notification__filter-bar {
|
.layout-single-column .notification__filter-bar {
|
||||||
background: var(--color-accent-bg);
|
background: var(--color-accent-bg);
|
||||||
border: 1px solid var(--color-accent-lines);
|
border: 1px solid var(--color-accent-lines);
|
||||||
border-radius: 8px;
|
}
|
||||||
|
.layout-single-column .account__header + .account__section-headline {
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
.layout-single-column .account__section-headline:has(+ .explore__suggestions) {
|
||||||
|
border-bottom-left-radius: 8px;
|
||||||
|
border-bottom-right-radius: 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline a,
|
.layout-single-column .account__section-headline a,
|
||||||
|
|
@ -2541,7 +2505,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* 👤 Account view
|
/* 👤 Account view
|
||||||
--------------- */
|
--------------- */
|
||||||
.layout-single-column .account__header {
|
.layout-single-column .account__header {
|
||||||
border-radius: 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
@ -2587,9 +2551,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__tabs__name .icon-lock {
|
.layout-single-column .account__header__tabs__name .icon-lock {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
.layout-single-column .account__section-headline {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__header__content a {
|
.layout-single-column .account__header__content a {
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -2692,13 +2653,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
.layout-single-column .account__header__bio .account__header__fields .verified:last-child {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
|
||||||
.layout-single-column .account-timeline__header + article .account { /* rounded corners on first post below account header + on first account in followings/followers list */
|
|
||||||
border-radius: 8px 8px 0 0;
|
|
||||||
border-right: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
}
|
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .account-timeline__header + article .status__wrapper,
|
.layout-single-column .account-timeline__header + article .status__wrapper,
|
||||||
.layout-single-column .account-timeline__header + article .account {
|
.layout-single-column .account-timeline__header + article .account {
|
||||||
|
|
@ -2728,11 +2682,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* ✨ Explore tab
|
/* ✨ Explore tab
|
||||||
-------------- */
|
-------------- */
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .account__section-headline + .scrollable article:first-child .status__wrapper {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
.layout-single-column .account__section-headline + .scrollable article:last-child .status__wrapper {
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
|
|
@ -2755,13 +2704,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
border-radius: 8px !important;
|
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .explore__links {
|
.layout-single-column .explore__links {
|
||||||
border-radius: 0 !important;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -2785,7 +2733,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
/* Hashtag header */
|
/* Hashtag header */
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
padding: 18px 20px 20px;
|
padding: 22px 20px 24px;
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
border-top: 1px solid var(--color-lines);
|
||||||
|
|
@ -2812,8 +2760,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .hashtag-header {
|
.layout-single-column .hashtag-header {
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
}
|
}
|
||||||
|
|
@ -2985,12 +2931,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section {
|
.layout-single-column .search-results__section {
|
||||||
background-color: var(--color-bg);
|
background-color: var(--color-bg);
|
||||||
padding-bottom: 10px;
|
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
.layout-single-column .search-results__section__header {
|
||||||
background-color: var(--color-content-secondary-bg);
|
background-color: var(--color-content-secondary-bg);
|
||||||
border-top: 1px solid var(--color-lines);
|
|
||||||
border-left: 1px solid var(--color-lines);
|
border-left: 1px solid var(--color-lines);
|
||||||
border-right: 1px solid var(--color-lines);
|
border-right: 1px solid var(--color-lines);
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
|
|
@ -3000,26 +2944,15 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-accent);
|
color: var(--color-accent);
|
||||||
}
|
}
|
||||||
@media screen and (min-width:890px) {
|
@media screen and (min-width:890px) {
|
||||||
.layout-single-column .explore__search-results {
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
.layout-single-column .explore__search-results article:first-child > .account,
|
.layout-single-column .explore__search-results article:first-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:first-child,
|
.layout-single-column .explore__search-results article:first-child > .trends__item {
|
||||||
.layout-single-column .explore__search-results article:first-child > .trends__item,
|
|
||||||
.layout-single-column .search-results__section > .trends__item:first-child {
|
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 8px 8px 0 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__search-results article:last-child > .account,
|
.layout-single-column .explore__search-results article:last-child > .account,
|
||||||
.layout-single-column .search-results__section > .account:last-child,
|
|
||||||
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
.layout-single-column .explore__search-results article:last-child > .trends__item,
|
||||||
.layout-single-column .search-results__section > .trends__item:last-child,
|
|
||||||
.layout-single-column .explore__search-results .load-more:last-child {
|
.layout-single-column .explore__search-results .load-more:last-child {
|
||||||
border-radius: 0 0 8px 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
}
|
}
|
||||||
.layout-single-column .search-results__section__header {
|
|
||||||
border-top-left-radius: 8px;
|
|
||||||
border-top-right-radius: 8px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.layout-single-column .account .account__details > span {
|
.layout-single-column .account .account__details > span {
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
|
@ -3106,18 +3039,16 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .dismissable-banner {
|
.layout-single-column .dismissable-banner {
|
||||||
background-color: var(--color-accent);
|
background-color: var(--color-accent);
|
||||||
box-shadow: 0 5px var(--color-content-bg);
|
box-shadow: 0 5px var(--color-content-bg);
|
||||||
border-radius: 8px 8px 0 0;
|
border-radius: 0;
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 7px 7px 0 0;
|
|
||||||
}
|
}
|
||||||
@media screen and (max-width:889px) {
|
@media screen and (max-width:889px) {
|
||||||
.layout-single-column .dismissable-banner,
|
.layout-single-column .dismissable-banner,
|
||||||
.layout-single-column .explore__links .dismissable-banner {
|
.layout-single-column .explore__links .dismissable-banner {
|
||||||
border-radius: 0;
|
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -4029,8 +3960,6 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
}
|
}
|
||||||
.layout-single-column .announcements {
|
.layout-single-column .announcements {
|
||||||
margin-top: 10px;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
box-shadow: 0 -20px var(--color-bg);
|
box-shadow: 0 -20px var(--color-bg);
|
||||||
|
|
@ -4089,6 +4018,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
background-color: var(--color-content-bg);
|
background-color: var(--color-content-bg);
|
||||||
color: var(--color-content-fg);
|
color: var(--color-content-fg);
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
.layout-single-column .error-column {
|
.layout-single-column .error-column {
|
||||||
border: 1px solid var(--color-lines);
|
border: 1px solid var(--color-lines);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue