diff --git a/mastodon/app/javascript/styles/tangerineui-cherry/tangerineui-cherry.scss b/mastodon/app/javascript/styles/tangerineui-cherry/tangerineui-cherry.scss index 9f2ae14..21efe67 100644 --- a/mastodon/app/javascript/styles/tangerineui-cherry/tangerineui-cherry.scss +++ b/mastodon/app/javascript/styles/tangerineui-cherry/tangerineui-cherry.scss @@ -146,6 +146,7 @@ --icon-emoji-accent: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2QzNDg3ZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTI4YTk2LDk2LDAsMSwxLTk2LTk2QTk2LDk2LDAsMCwxLDIyNCwxMjhaIiBvcGFjaXR5PSIwLjIiPjwvcGF0aD48cGF0aCBkPSJNMTI4LDI0QTEwNCwxMDQsMCwxLDAsMjMyLDEyOCwxMDQuMTEsMTA0LjExLDAsMCwwLDEyOCwyNFptMCwxOTJhODgsODgsMCwxLDEsODgtODhBODguMSw4OC4xLDAsMCwxLDEyOCwyMTZaTTgwLDEwOGExMiwxMiwwLDEsMSwxMiwxMkExMiwxMiwwLDAsMSw4MCwxMDhabTk2LDBhMTIsMTIsMCwxLDEtMTItMTJBMTIsMTIsMCwwLDEsMTc2LDEwOFptLTEuMDgsNDhjLTEwLjI5LDE3Ljc5LTI3LjM5LDI4LTQ2LjkyLDI4cy0zNi42My0xMC4yLTQ2LjkyLTI4YTgsOCwwLDEsMSwxMy44NC04YzcuNDcsMTIuOTEsMTkuMjEsMjAsMzMuMDgsMjBzMjUuNjEtNy4xLDMzLjA4LTIwYTgsOCwwLDEsMSwxMy44NCw4WiI+PC9wYXRoPjwvc3ZnPg=="); --icon-link: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2QzNDg3ZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMDkuOTQsMTEzLjk0bC0yOCwyOGE0Ny43Niw0Ny43NiwwLDAsMS0yNi41MiwxMy40OCw0Ny43Niw0Ny43NiwwLDAsMS0xMy40OCwyNi41MmwtMjgsMjhhNDgsNDgsMCwwLDEtNjcuODgtNjcuODhsMjgtMjhhNDcuNzYsNDcuNzYsMCwwLDEsMjYuNTItMTMuNDgsNDcuNzYsNDcuNzYsMCwwLDEsMTMuNDgtMjYuNTJsMjgtMjhhNDgsNDgsMCwwLDEsNjcuODgsNjcuODhaIiBvcGFjaXR5PSIwLjIiPjwvcGF0aD48cGF0aCBkPSJNMTM3LjU0LDE4Ni4zNmE4LDgsMCwwLDEsMCwxMS4zMWwtMTcuOTQsMThBNTYsNTYsMCwwLDEsNDAuMzgsMTM2LjRMNjguNSwxMDguMjlBNTYsNTYsMCwwLDEsMTQ1LjMxLDEwNmE4LDgsMCwxLDEtMTAuNjQsMTIsNDAsNDAsMCwwLDAtNTQuODUsMS42M0w1MS43LDE0Ny43MmE0MCw0MCwwLDEsMCw1Ni41OCw1Ni41OGwxNy45NC0xNy45NEE4LDgsMCwwLDEsMTM3LjU0LDE4Ni4zNlptNzguMDgtMTQ2YTU2LjA4LDU2LjA4LDAsMCwwLTc5LjIyLDBMMTE4LjQ2LDU4LjMzYTgsOCwwLDAsMCwxMS4zMiwxMS4zMUwxNDcuNzIsNTEuN2E0MCw0MCwwLDAsMSw1Ni41OCw1Ni41OEwxNzYuMTgsMTM2LjRBNDAsNDAsMCwwLDEsMTIxLjMzLDEzOCw4LDgsMCwxLDAsMTEwLjY5LDE1MGE1Niw1NiwwLDAsMCw3Ni44MS0yLjI3bDI4LjEyLTI4LjExQTU2LjA4LDU2LjA4LDAsMCwwLDIxNS42Miw0MC4zOFoiPjwvcGF0aD48L3N2Zz4="); --icon-share: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2QzNDg3ZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTA0bC00OCw0OFY1NloiIG9wYWNpdHk9IjAuMiI+PC9wYXRoPjxwYXRoIGQ9Ik0yMjkuNjYsOTguMzRsLTQ4LTQ4QTgsOCwwLDAsMCwxNjgsNTZWOTZoLTNBMTAzLjk0LDEwMy45NCwwLDAsMCw2NC4yNSwxNzRhOCw4LDAsMCwwLDE1LjUsNEE4OCw4OCwwLDAsMSwxNjUsMTEyaDN2NDBhOCw4LDAsMCwwLDEzLjY2LDUuNjZsNDgtNDhBOCw4LDAsMCwwLDIyOS42Niw5OC4zNFpNMTg0LDEzMi42OVY3NS4zMUwyMTIuNjksMTA0Wk0yMDAsMjE2YTgsOCwwLDAsMS04LDhINDBhMTYsMTYsMCwwLDEtMTYtMTZWODhhOCw4LDAsMCwxLDE2LDBWMjA4SDE5MkE4LDgsMCwwLDEsMjAwLDIxNloiPjwvcGF0aD48L3N2Zz4="); + --icon-compose: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2ZmZmZmZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTIwdjg4YTE2LDE2LDAsMCwxLTE2LDE2SDQ4YTE2LDE2LDAsMCwxLTE2LTE2VjQ4QTE2LDE2LDAsMCwxLDQ4LDMyaDg4YTgsOCwwLDAsMSwwLDE2SDQ4VjIwOEgyMDhWMTIwYTgsOCwwLDAsMSwxNiwwWm01LjY2LTUwLjM0LTk2LDk2QTgsOCwwLDAsMSwxMjgsMTY4SDk2YTgsOCwwLDAsMS04LThWMTI4YTgsOCwwLDAsMSwyLjM0LTUuNjZsOTYtOTZhOCw4LDAsMCwxLDExLjMyLDBsMzIsMzJBOCw4LDAsMCwxLDIyOS42Niw2OS42NlptLTE3LTUuNjZMMTkyLDQzLjMxLDE3OS4zMSw1NiwyMDAsNzYuNjlaIj48L3BhdGg+PC9zdmc+"); } @media (prefers-color-scheme: dark) { :root { @@ -714,10 +715,10 @@ body.app-body { background-image: var(--icon-bell); } .app-body .navigation-panel .column-link .icon-hashtag { - background-image: var(--icon-hashtag-active); + background-image: var(--icon-search-column-link-active); } .app-body .navigation-panel .column-link.active .icon-hashtag { - background-image: var(--icon-hashtag); + background-image: var(--icon-search-column-link); } .app-body .navigation-panel .column-link .icon-search { background-image: var(--icon-search-column-link-active); @@ -1206,7 +1207,7 @@ body.app-body { .app-body .e-content blockquote, .app-body .reply-indicator__content blockquote, .app-body .status__content__text blockquote { - color: var(--color-content-fg-muted); + color: var(--color-content-fg); border-color: var(--color-lines); } @@ -1716,6 +1717,44 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu .app-body .status-card__author strong { font-weight: 800; } +@media screen and (max-width:889px) { + .app-body .status-card:not(.expanded) .status-card__image { + width: 80px; + } + .app-body .status-card:not(.expanded) .status-card__content { + padding-top: 0; + padding-bottom: 0; + } + .app-body .status-card:not(.expanded) .status-card__host { + margin-bottom: 2px; + font-size: 12px; + } + .app-body .status-card:not(.expanded) .status-card__title { + font-size: 16px; + } + .app-body .status-card:not(.expanded) .status-card__description { + margin-top: 2px; + font-size: 12px; + } +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__image { + width: 80px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__content { + padding-top: 0; + padding-bottom: 0; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__host { + margin-bottom: 2px; + font-size: 12px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__title { + font-size: 16px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__description { + margin-top: 2px; + font-size: 12px; +} .app-body .status__content p { margin-bottom: 12px; } @@ -2058,7 +2097,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu border-bottom: 0; } .app-body .ui__header__logo { - margin-left: 3px; + margin: 0; + position: absolute; + left: 50%; + transform: translateX(-50%); } .app-body .tabs-bar__wrapper { box-shadow: none; @@ -2324,14 +2366,38 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu .app-body .ui__header__links .button.button-secondary { padding: 8px 15px; } +.app-body .ui__header__links .button.button-secondary[href="/search"] { + display: none; +} .app-body .ui__header__links .button.button-secondary[href="/publish"] { background-color: var(--color-accent); color: var(--color-accent-fg); + width: 45px; + height: 35px; + box-sizing: border-box; + background-image: var(--icon-compose); + background-position: center; + background-repeat: no-repeat; + background-size: 22px; } .app-body .ui__header__links .button.button-secondary[href="/publish"]:is(:hover, :focus, :active) { background-color: var(--color-accent-focus); color: var(--color-accent-fg); } +.app-body .ui__header__links .button.button-secondary[href="/publish"] span { + color: transparent; +} + +@media screen and (max-width:1174px) { + .layout-single-column .ui__header__links .button.button-secondary[href="/publish"] { + position: absolute; + right: 12px; + } + .layout-single-column .ui__header__links { + padding-left: 12px; + } +} + .app-body .column-link--logo { margin-left: 4px; } diff --git a/mastodon/app/javascript/styles/tangerineui-purple/tangerineui-purple.scss b/mastodon/app/javascript/styles/tangerineui-purple/tangerineui-purple.scss index b766349..ce2694b 100644 --- a/mastodon/app/javascript/styles/tangerineui-purple/tangerineui-purple.scss +++ b/mastodon/app/javascript/styles/tangerineui-purple/tangerineui-purple.scss @@ -12,7 +12,7 @@ /* 🎨 Colors */ :root { - --color-bg: #ffffff /* #f2eff5 */; + --color-bg: #ffffff; --color-fg: #2a2d37; --color-fg-muted: #888494; --color-secondary-bg: #e8e4f2; @@ -146,6 +146,7 @@ --icon-emoji-accent: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iIzYzNjRmZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTI4YTk2LDk2LDAsMSwxLTk2LTk2QTk2LDk2LDAsMCwxLDIyNCwxMjhaIiBvcGFjaXR5PSIwLjIiPjwvcGF0aD48cGF0aCBkPSJNMTI4LDI0QTEwNCwxMDQsMCwxLDAsMjMyLDEyOCwxMDQuMTEsMTA0LjExLDAsMCwwLDEyOCwyNFptMCwxOTJhODgsODgsMCwxLDEsODgtODhBODguMSw4OC4xLDAsMCwxLDEyOCwyMTZaTTgwLDEwOGExMiwxMiwwLDEsMSwxMiwxMkExMiwxMiwwLDAsMSw4MCwxMDhabTk2LDBhMTIsMTIsMCwxLDEtMTItMTJBMTIsMTIsMCwwLDEsMTc2LDEwOFptLTEuMDgsNDhjLTEwLjI5LDE3Ljc5LTI3LjM5LDI4LTQ2LjkyLDI4cy0zNi42My0xMC4yLTQ2LjkyLTI4YTgsOCwwLDEsMSwxMy44NC04YzcuNDcsMTIuOTEsMTkuMjEsMjAsMzMuMDgsMjBzMjUuNjEtNy4xLDMzLjA4LTIwYTgsOCwwLDEsMSwxMy44NCw4WiI+PC9wYXRoPjwvc3ZnPg=="); --icon-link: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iIzYzNjRmZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiIHN0eWxlPSItLW5vaXItaW5saW5lLWZpbGw6ICM1ZjlhZmY7IiBkYXRhLW5vaXItaW5saW5lLWZpbGw9IiI+PHBhdGggZD0iTTIwOS45NCwxMTMuOTRsLTI4LDI4YTQ3Ljc2LDQ3Ljc2LDAsMCwxLTI2LjUyLDEzLjQ4LDQ3Ljc2LDQ3Ljc2LDAsMCwxLTEzLjQ4LDI2LjUybC0yOCwyOGE0OCw0OCwwLDAsMS02Ny44OC02Ny44OGwyOC0yOGE0Ny43Niw0Ny43NiwwLDAsMSwyNi41Mi0xMy40OCw0Ny43Niw0Ny43NiwwLDAsMSwxMy40OC0yNi41MmwyOC0yOGE0OCw0OCwwLDAsMSw2Ny44OCw2Ny44OFoiIG9wYWNpdHk9IjAuMiI+PC9wYXRoPjxwYXRoIGQ9Ik0xMzcuNTQsMTg2LjM2YTgsOCwwLDAsMSwwLDExLjMxbC0xNy45NCwxOEE1Niw1NiwwLDAsMSw0MC4zOCwxMzYuNEw2OC41LDEwOC4yOUE1Niw1NiwwLDAsMSwxNDUuMzEsMTA2YTgsOCwwLDEsMS0xMC42NCwxMiw0MCw0MCwwLDAsMC01NC44NSwxLjYzTDUxLjcsMTQ3LjcyYTQwLDQwLDAsMSwwLDU2LjU4LDU2LjU4bDE3Ljk0LTE3Ljk0QTgsOCwwLDAsMSwxMzcuNTQsMTg2LjM2Wm03OC4wOC0xNDZhNTYuMDgsNTYuMDgsMCwwLDAtNzkuMjIsMEwxMTguNDYsNTguMzNhOCw4LDAsMCwwLDExLjMyLDExLjMxTDE0Ny43Miw1MS43YTQwLDQwLDAsMCwxLDU2LjU4LDU2LjU4TDE3Ni4xOCwxMzYuNEE0MCw0MCwwLDAsMSwxMjEuMzMsMTM4LDgsOCwwLDEsMCwxMTAuNjksMTUwYTU2LDU2LDAsMCwwLDc2LjgxLTIuMjdsMjguMTItMjguMTFBNTYuMDgsNTYuMDgsMCwwLDAsMjE1LjYyLDQwLjM4WiI+PC9wYXRoPjwvc3ZnPg=="); --icon-share: ur:("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iIzYzNjRmZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTA0bC00OCw0OFY1NloiIG9wYWNpdHk9IjAuMiI+PC9wYXRoPjxwYXRoIGQ9Ik0yMjkuNjYsOTguMzRsLTQ4LTQ4QTgsOCwwLDAsMCwxNjgsNTZWOTZoLTNBMTAzLjk0LDEwMy45NCwwLDAsMCw2NC4yNSwxNzRhOCw4LDAsMCwwLDE1LjUsNEE4OCw4OCwwLDAsMSwxNjUsMTEyaDN2NDBhOCw4LDAsMCwwLDEzLjY2LDUuNjZsNDgtNDhBOCw4LDAsMCwwLDIyOS42Niw5OC4zNFpNMTg0LDEzMi42OVY3NS4zMUwyMTIuNjksMTA0Wk0yMDAsMjE2YTgsOCwwLDAsMS04LDhINDBhMTYsMTYsMCwwLDEtMTYtMTZWODhhOCw4LDAsMCwxLDE2LDBWMjA4SDE5MkE4LDgsMCwwLDEsMjAwLDIxNloiPjwvcGF0aD48L3N2Zz4="); + --icon-compose: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2ZmZmZmZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTIwdjg4YTE2LDE2LDAsMCwxLTE2LDE2SDQ4YTE2LDE2LDAsMCwxLTE2LTE2VjQ4QTE2LDE2LDAsMCwxLDQ4LDMyaDg4YTgsOCwwLDAsMSwwLDE2SDQ4VjIwOEgyMDhWMTIwYTgsOCwwLDAsMSwxNiwwWm01LjY2LTUwLjM0LTk2LDk2QTgsOCwwLDAsMSwxMjgsMTY4SDk2YTgsOCwwLDAsMS04LThWMTI4YTgsOCwwLDAsMSwyLjM0LTUuNjZsOTYtOTZhOCw4LDAsMCwxLDExLjMyLDBsMzIsMzJBOCw4LDAsMCwxLDIyOS42Niw2OS42NlptLTE3LTUuNjZMMTkyLDQzLjMxLDE3OS4zMSw1NiwyMDAsNzYuNjlaIj48L3BhdGg+PC9zdmc+"); } @media (prefers-color-scheme: dark) { :root { @@ -714,10 +715,10 @@ body.app-body { background-image: var(--icon-bell); } .app-body .navigation-panel .column-link .icon-hashtag { - background-image: var(--icon-hashtag-active); + background-image: var(--icon-search-column-link-active); } .app-body .navigation-panel .column-link.active .icon-hashtag { - background-image: var(--icon-hashtag); + background-image: var(--icon-search-column-link); } .app-body .navigation-panel .column-link .icon-search { background-image: var(--icon-search-column-link-active); @@ -1206,7 +1207,7 @@ body.app-body { .app-body .e-content blockquote, .app-body .reply-indicator__content blockquote, .app-body .status__content__text blockquote { - color: var(--color-content-fg-muted); + color: var(--color-content-fg); border-color: var(--color-lines); } @@ -1716,6 +1717,44 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu .app-body .status-card__author strong { font-weight: 800; } +@media screen and (max-width:889px) { + .app-body .status-card:not(.expanded) .status-card__image { + width: 80px; + } + .app-body .status-card:not(.expanded) .status-card__content { + padding-top: 0; + padding-bottom: 0; + } + .app-body .status-card:not(.expanded) .status-card__host { + margin-bottom: 2px; + font-size: 12px; + } + .app-body .status-card:not(.expanded) .status-card__title { + font-size: 16px; + } + .app-body .status-card:not(.expanded) .status-card__description { + margin-top: 2px; + font-size: 12px; + } +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__image { + width: 80px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__content { + padding-top: 0; + padding-bottom: 0; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__host { + margin-bottom: 2px; + font-size: 12px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__title { + font-size: 16px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__description { + margin-top: 2px; + font-size: 12px; +} .app-body .status__content p { margin-bottom: 12px; } @@ -2058,7 +2097,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu border-bottom: 0; } .app-body .ui__header__logo { - margin-left: 3px; + margin: 0; + position: absolute; + left: 50%; + transform: translateX(-50%); } .app-body .tabs-bar__wrapper { box-shadow: none; @@ -2324,14 +2366,38 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu .app-body .ui__header__links .button.button-secondary { padding: 8px 15px; } +.app-body .ui__header__links .button.button-secondary[href="/search"] { + display: none; +} .app-body .ui__header__links .button.button-secondary[href="/publish"] { background-color: var(--color-accent); color: var(--color-accent-fg); + width: 45px; + height: 35px; + box-sizing: border-box; + background-image: var(--icon-compose); + background-position: center; + background-repeat: no-repeat; + background-size: 22px; } .app-body .ui__header__links .button.button-secondary[href="/publish"]:is(:hover, :focus, :active) { background-color: var(--color-accent-focus); color: var(--color-accent-fg); } +.app-body .ui__header__links .button.button-secondary[href="/publish"] span { + color: transparent; +} + +@media screen and (max-width:1174px) { + .layout-single-column .ui__header__links .button.button-secondary[href="/publish"] { + position: absolute; + right: 12px; + } + .layout-single-column .ui__header__links { + padding-left: 12px; + } +} + .app-body .column-link--logo { margin-left: 4px; } diff --git a/mastodon/app/javascript/styles/tangerineui/tangerineui.scss b/mastodon/app/javascript/styles/tangerineui/tangerineui.scss index 9adba4f..fc55b8d 100644 --- a/mastodon/app/javascript/styles/tangerineui/tangerineui.scss +++ b/mastodon/app/javascript/styles/tangerineui/tangerineui.scss @@ -12,7 +12,7 @@ /* 🎨 Colors */ :root { - --color-bg: #ffffff /* #f5f2ef */; + --color-bg: #ffffff; --color-fg: #2a2d37; --color-fg-muted: #948c84; --color-secondary-bg: #f2eae4; @@ -146,6 +146,7 @@ --icon-emoji-accent: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2Y3NjkwMiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTI4YTk2LDk2LDAsMSwxLTk2LTk2QTk2LDk2LDAsMCwxLDIyNCwxMjhaIiBvcGFjaXR5PSIwLjIiPjwvcGF0aD48cGF0aCBkPSJNMTI4LDI0QTEwNCwxMDQsMCwxLDAsMjMyLDEyOCwxMDQuMTEsMTA0LjExLDAsMCwwLDEyOCwyNFptMCwxOTJhODgsODgsMCwxLDEsODgtODhBODguMSw4OC4xLDAsMCwxLDEyOCwyMTZaTTgwLDEwOGExMiwxMiwwLDEsMSwxMiwxMkExMiwxMiwwLDAsMSw4MCwxMDhabTk2LDBhMTIsMTIsMCwxLDEtMTItMTJBMTIsMTIsMCwwLDEsMTc2LDEwOFptLTEuMDgsNDhjLTEwLjI5LDE3Ljc5LTI3LjM5LDI4LTQ2LjkyLDI4cy0zNi42My0xMC4yLTQ2LjkyLTI4YTgsOCwwLDEsMSwxMy44NC04YzcuNDcsMTIuOTEsMTkuMjEsMjAsMzMuMDgsMjBzMjUuNjEtNy4xLDMzLjA4LTIwYTgsOCwwLDEsMSwxMy44NCw4WiI+PC9wYXRoPjwvc3ZnPg=="); --icon-link: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2Y3NjkwMiIgdmlld0JveD0iMCAwIDI1NiAyNTYiIHN0eWxlPSItLW5vaXItaW5saW5lLWZpbGw6ICNmZDdkMjA7IiBkYXRhLW5vaXItaW5saW5lLWZpbGw9IiI+PHBhdGggZD0iTTIwOS45NCwxMTMuOTRsLTI4LDI4YTQ3Ljc2LDQ3Ljc2LDAsMCwxLTI2LjUyLDEzLjQ4LDQ3Ljc2LDQ3Ljc2LDAsMCwxLTEzLjQ4LDI2LjUybC0yOCwyOGE0OCw0OCwwLDAsMS02Ny44OC02Ny44OGwyOC0yOGE0Ny43Niw0Ny43NiwwLDAsMSwyNi41Mi0xMy40OCw0Ny43Niw0Ny43NiwwLDAsMSwxMy40OC0yNi41MmwyOC0yOGE0OCw0OCwwLDAsMSw2Ny44OCw2Ny44OFoiIG9wYWNpdHk9IjAuMiI+PC9wYXRoPjxwYXRoIGQ9Ik0xMzcuNTQsMTg2LjM2YTgsOCwwLDAsMSwwLDExLjMxbC0xNy45NCwxOEE1Niw1NiwwLDAsMSw0MC4zOCwxMzYuNEw2OC41LDEwOC4yOUE1Niw1NiwwLDAsMSwxNDUuMzEsMTA2YTgsOCwwLDEsMS0xMC42NCwxMiw0MCw0MCwwLDAsMC01NC44NSwxLjYzTDUxLjcsMTQ3LjcyYTQwLDQwLDAsMSwwLDU2LjU4LDU2LjU4bDE3Ljk0LTE3Ljk0QTgsOCwwLDAsMSwxMzcuNTQsMTg2LjM2Wm03OC4wOC0xNDZhNTYuMDgsNTYuMDgsMCwwLDAtNzkuMjIsMEwxMTguNDYsNTguMzNhOCw4LDAsMCwwLDExLjMyLDExLjMxTDE0Ny43Miw1MS43YTQwLDQwLDAsMCwxLDU2LjU4LDU2LjU4TDE3Ni4xOCwxMzYuNEE0MCw0MCwwLDAsMSwxMjEuMzMsMTM4LDgsOCwwLDEsMCwxMTAuNjksMTUwYTU2LDU2LDAsMCwwLDc2LjgxLTIuMjdsMjguMTItMjguMTFBNTYuMDgsNTYuMDgsMCwwLDAsMjE1LjYyLDQwLjM4WiI+PC9wYXRoPjwvc3ZnPg=="); --icon-share: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2Y3NjkwMiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTA0bC00OCw0OFY1NloiIG9wYWNpdHk9IjAuMiI+PC9wYXRoPjxwYXRoIGQ9Ik0yMjkuNjYsOTguMzRsLTQ4LTQ4QTgsOCwwLDAsMCwxNjgsNTZWOTZoLTNBMTAzLjk0LDEwMy45NCwwLDAsMCw2NC4yNSwxNzRhOCw4LDAsMCwwLDE1LjUsNEE4OCw4OCwwLDAsMSwxNjUsMTEyaDN2NDBhOCw4LDAsMCwwLDEzLjY2LDUuNjZsNDgtNDhBOCw4LDAsMCwwLDIyOS42Niw5OC4zNFpNMTg0LDEzMi42OVY3NS4zMUwyMTIuNjksMTA0Wk0yMDAsMjE2YTgsOCwwLDAsMS04LDhINDBhMTYsMTYsMCwwLDEtMTYtMTZWODhhOCw4LDAsMCwxLDE2LDBWMjA4SDE5MkE4LDgsMCwwLDEsMjAwLDIxNloiPjwvcGF0aD48L3N2Zz4="); + --icon-compose: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0iI2ZmZmZmZiIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0yMjQsMTIwdjg4YTE2LDE2LDAsMCwxLTE2LDE2SDQ4YTE2LDE2LDAsMCwxLTE2LTE2VjQ4QTE2LDE2LDAsMCwxLDQ4LDMyaDg4YTgsOCwwLDAsMSwwLDE2SDQ4VjIwOEgyMDhWMTIwYTgsOCwwLDAsMSwxNiwwWm01LjY2LTUwLjM0LTk2LDk2QTgsOCwwLDAsMSwxMjgsMTY4SDk2YTgsOCwwLDAsMS04LThWMTI4YTgsOCwwLDAsMSwyLjM0LTUuNjZsOTYtOTZhOCw4LDAsMCwxLDExLjMyLDBsMzIsMzJBOCw4LDAsMCwxLDIyOS42Niw2OS42NlptLTE3LTUuNjZMMTkyLDQzLjMxLDE3OS4zMSw1NiwyMDAsNzYuNjlaIj48L3BhdGg+PC9zdmc+"); } @media (prefers-color-scheme: dark) { :root { @@ -714,10 +715,10 @@ body.app-body { background-image: var(--icon-bell); } .app-body .navigation-panel .column-link .icon-hashtag { - background-image: var(--icon-hashtag-active); + background-image: var(--icon-search-column-link-active); } .app-body .navigation-panel .column-link.active .icon-hashtag { - background-image: var(--icon-hashtag); + background-image: var(--icon-search-column-link); } .app-body .navigation-panel .column-link .icon-search { background-image: var(--icon-search-column-link-active); @@ -1206,7 +1207,7 @@ body.app-body { .app-body .e-content blockquote, .app-body .reply-indicator__content blockquote, .app-body .status__content__text blockquote { - color: var(--color-content-fg-muted); + color: var(--color-content-fg); border-color: var(--color-lines); } @@ -1716,6 +1717,44 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu .app-body .status-card__author strong { font-weight: 800; } +@media screen and (max-width:889px) { + .app-body .status-card:not(.expanded) .status-card__image { + width: 80px; + } + .app-body .status-card:not(.expanded) .status-card__content { + padding-top: 0; + padding-bottom: 0; + } + .app-body .status-card:not(.expanded) .status-card__host { + margin-bottom: 2px; + font-size: 12px; + } + .app-body .status-card:not(.expanded) .status-card__title { + font-size: 16px; + } + .app-body .status-card:not(.expanded) .status-card__description { + margin-top: 2px; + font-size: 12px; + } +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__image { + width: 80px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__content { + padding-top: 0; + padding-bottom: 0; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__host { + margin-bottom: 2px; + font-size: 12px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__title { + font-size: 16px; +} +.layout-multiple-columns .status-card:not(.expanded) .status-card__description { + margin-top: 2px; + font-size: 12px; +} .app-body .status__content p { margin-bottom: 12px; } @@ -2058,7 +2097,10 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu border-bottom: 0; } .app-body .ui__header__logo { - margin-left: 3px; + margin: 0; + position: absolute; + left: 50%; + transform: translateX(-50%); } .app-body .tabs-bar__wrapper { box-shadow: none; @@ -2324,14 +2366,38 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu .app-body .ui__header__links .button.button-secondary { padding: 8px 15px; } +.app-body .ui__header__links .button.button-secondary[href="/search"] { + display: none; +} .app-body .ui__header__links .button.button-secondary[href="/publish"] { background-color: var(--color-accent); color: var(--color-accent-fg); + width: 45px; + height: 35px; + box-sizing: border-box; + background-image: var(--icon-compose); + background-position: center; + background-repeat: no-repeat; + background-size: 22px; } .app-body .ui__header__links .button.button-secondary[href="/publish"]:is(:hover, :focus, :active) { background-color: var(--color-accent-focus); color: var(--color-accent-fg); } +.app-body .ui__header__links .button.button-secondary[href="/publish"] span { + color: transparent; +} + +@media screen and (max-width:1174px) { + .layout-single-column .ui__header__links .button.button-secondary[href="/publish"] { + position: absolute; + right: 12px; + } + .layout-single-column .ui__header__links { + padding-left: 12px; + } +} + .app-body .column-link--logo { margin-left: 4px; }