tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Modern theme update

Browse Source
This commit is contained in:
root 2023-08-23 14:15:47 -04:00
parent 211a7143a7
commit 7311c41239
2 changed files with 113 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/javascript/flavours/glitch/styles/modern/diff.css
View File

@ -79,14 +79,17 @@ body.app-body.flavour-modern-glitch
display: none;
}
body.app-body.flavour-modern-glitch > #mastodon .status > .status__content {
body.app-body.flavour-modern-glitch
> #mastodon
.status:not(.status-direct)
> .status__content {
margin-block: -90px -100px !important;
padding-block: 100px !important;
}
body.app-body.flavour-modern-glitch
> #mastodon
.status
.status:not(.status-direct)
> .status__content
.status__content__text {
margin-top: 0;
@ -94,7 +97,7 @@ body.app-body.flavour-modern-glitch
body.app-body.flavour-modern-glitch
> #mastodon
.status
.status:not(.status-direct)
> .status__content
> :last-child:not(.status__content__text) {
margin-bottom: 5px !important;
@ -136,7 +139,7 @@ body.app-body.flavour-modern-glitch > #mastodon .status__action-bar-spacer {
}
body.app-body.flavour-modern-glitch > #mastodon .status__relative-time {
margin-inline: 5px !important;
margin-inline: auto 5px !important;
z-index: 2;
flex-grow: 0 !important;
}

129
app/javascript/flavours/glitch/styles/modern/modern.css
View File

@ -419,7 +419,7 @@ a:focus-visible,
.dropdown-menu,
.dropdown-animation {
border-radius: var(--radius);
animation: scaleIn 0.2s;
animation: scaleIn 0.2s cubic-bezier(0, 0, 0, 1.1);
}
.dropdown-menu__container__list {
overflow: hidden auto;
@ -474,12 +474,6 @@ a:focus-visible,
transition: padding 0.4s;
--top: 20px;
}
.columns-area__panels__pane {
height: unset !important;
}
.columns-area__panels__pane .columns-area__panels__pane__inner {
height: calc(100% + 20px) !important;
}
}
@media (min-width: 1320px) {
.columns-area__panels {
@ -734,7 +728,8 @@ a:focus-visible,
#mastodon .explore__search-results {
padding: 10px;
}
#mastodon .dismissable-banner {
#mastodon .dismissable-banner,
#mastodon .follow_requests-unlocked_explanation {
border-inline: 0;
border-top: 0;
margin: -10px;
@ -1463,7 +1458,7 @@ body:not(.flavour-modern-glitch)
.account-card,
.scrollable :not(.focusable) > .account,
.timeline-hint {
overflow: clip;
overflow: hidden;
transition:
background 0.2s,
box-shadow 0.4s,
@ -2648,12 +2643,6 @@ body:not(.flavour-modern-glitch)
position: absolute;
inset: 0;
}
#mastodon .status__wrapper-direct .status__prepend {
display: none;
}
#mastodon .status__wrapper-direct .status__relative-time {
color: #8c8dff !important;
}
#mastodon .status,
#mastodon .scrollable .account {
padding-block: 15px;
@ -2663,6 +2652,12 @@ body:not(.flavour-modern-glitch)
inset: -10px;
border-radius: var(--radius);
}
#mastodon .status.light {
overflow: hidden !important;
}
#mastodon .status.light .boost-modal__status-header {
display: flow-root !important;
}
#mastodon .account__relationship:empty {
display: none;
}
@ -2910,16 +2905,18 @@ body:not(.flavour-modern-glitch)
height: 2em;
min-width: 2em;
width: auto;
transition: transform 0.2s cubic-bezier(0, 0, 0, 1);
}
#mastodon .status__content .custom-emoji:hover {
transform: scale(1.2);
.custom-emoji {
transition: transform 0.4s cubic-bezier(0, 0.7, 0, 1);
}
.custom-emoji:hover {
transform: scale(1.3);
}
#mastodon .status__content ~ [style*='aspect-ratio'] {
max-height: 80vh;
}
#mastodon .status > .status__content .status__content__text:empty {
margin-top: -10px !important;
margin-top: -5px !important;
}
#mastodon .status__content__spoiler-link {
display: block;
@ -2949,6 +2946,91 @@ body:not(.flavour-modern-glitch)
#mastodon .status__content__spoiler-link:focus::after {
opacity: 1;
}
#mastodon .status-direct .status__prepend,
#mastodon .status__wrapper-direct .status__prepend,
#mastodon .conversation .status__prepend {
position: absolute;
font-size: 0;
}
#mastodon .status-direct .status__content,
#mastodon .status__wrapper-direct .status__content,
#mastodon .conversation .status__content {
position: relative !important;
background: var(--elevated-color);
padding: 8px 12px;
padding: 0.7em 0.9em !important;
border-radius: var(--radius-round);
border-top-left-radius: 6px;
box-sizing: border-box;
margin-top: 5px !important;
margin-bottom: 0;
overflow: hidden !important;
max-width: max-content;
}
#mastodon .status-direct .status__content .media-gallery,
#mastodon .status__wrapper-direct .status__content .media-gallery,
#mastodon .conversation .status__content .media-gallery {
width: 999px;
max-width: 100% !important;
}
.detailed-status__wrapper-direct .status__content {
font-size: 17px;
}
#mastodon .detailed-status__wrapper-direct .fa-at,
#mastodon .detailed-status__wrapper-direct .status__visibility-icon {
font-family: inherit;
font-weight: 600;
color: var(--accent, #8c8dff);
width: auto !important;
}
#mastodon .detailed-status__wrapper-direct .fa-at::before,
#mastodon .detailed-status__wrapper-direct .status__visibility-icon::before {
font-family: FontAwesome !important;
}
#mastodon .detailed-status__wrapper-direct .fa-at::after,
#mastodon .detailed-status__wrapper-direct .status__visibility-icon::after {
content: attr(title);
margin-left: 0.4em;
}
#mastodon .status-direct .fa-at,
#mastodon .status-direct .status__visibility-icon {
color: var(--accent, #8c8dff);
}
#mastodon .status-direct .status__info .status__relative-time {
height: auto;
color: var(--accent, #8c8dff);
}
#mastodon .status-direct.status--in-thread .status__info {
align-items: center;
gap: 10px;
}
#mastodon .status-direct.status--in-thread .status__info > span {
width: 0;
flex-grow: 1;
}
#mastodon .status-direct.status--in-thread .status__info > span,
#mastodon .status-direct.status--in-thread .status__display-name {
overflow: visible !important;
}
#mastodon .status-direct.status--in-thread .status__display-name {
overflow: hidden;
width: 0;
flex-grow: 1;
}
#mastodon .status-direct.status--in-thread .status__avatar {
height: auto;
margin-bottom: -100px;
}
#mastodon .status-direct.status--in-thread .status__avatar .account__avatar {
position: absolute;
top: 0 !important;
height: 46px !important;
width: 46px !important;
}
#mastodon .status-direct.status--in-thread .display-name * {
display: inline;
margin-right: 0.2em;
}
#mastodon .media-gallery,
#mastodon .video-player,
#mastodon .status-card.horizontal.interactive,
@ -3408,6 +3490,7 @@ body:not(.flavour-modern-glitch)
.column-header__collapsible:not(.collapsed) {
flex-direction: column-reverse;
align-items: flex-start;
border: 0;
animation: slideDowFade 0.3s backwards cubic-bezier(0, 1, 0, 1.2);
}
.layout-single-column .tabs-bar__wrapper .column-header__collapsible,
@ -3560,6 +3643,7 @@ body:not(.flavour-modern-glitch)
max-height: 3.3em;
min-height: 2.7em !important;
padding-block: 0;
border-radius: 100px;
position: relative;
box-sizing: border-box;
opacity: 0.9;
@ -3997,6 +4081,9 @@ body:not(.flavour-modern-glitch)
height: 100% !important;
background-size: cover !important;
}
#mastodon .status::before {
content: unset;
}
#mastodon .status__action-bar {
margin-bottom: -5px;
}
@ -4018,10 +4105,6 @@ body:not(.flavour-modern-glitch)
#mastodon .notification__filter-bar + .scrollable {
border-radius: var(--radius) var(--radius) 0 0 !important;
}
#mastodon .modal-root__modal .status.light {
overflow: hidden !important;
padding-inline-start: 70px !important;
}
#mastodon .columns-area {
padding-bottom: 0 !important;
overflow: hidden !important;