Leatherface/mastodon
1
0
Fork 0
mirror of https://github.com/glitch-soc/mastodon.git synced 2025-12-16 01:09:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

[Glitch] Refactor carousel components

Browse Source 
Port e7cd5a430e to glitch-soc

Co-authored-by: diondiondion <mail@diondiondion.com>
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Echo
2025-10-29 15:44:46 +01:00
committed by Claire
parent 6ff4dad89d
commit 9f8e812c56
8 changed files with 581 additions and 297 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
app/javascript/flavours/glitch/styles/components.scss
View File

@@ -1421,7 +1421,7 @@
}
}
.announcements__item__content {
.announcements__content {
overflow-wrap: break-word;
overflow-y: auto;
@@ -9234,10 +9234,21 @@ noscript {
}
.announcements {
background: lighten($ui-base-color, 8%);
font-size: 13px;
display: flex;
align-items: flex-end;
width: calc(100% - 124px);
flex: 0 0 auto;
position: relative;
overflow: hidden;
@media screen and (max-width: (124px + 300px)) {
width: 100%;
}
&__root {
background: lighten($ui-base-color, 8%);
font-size: 13px;
display: flex;
align-items: flex-end;
}
&__mastodon {
width: 124px;
@@ -9248,19 +9259,16 @@ noscript {
}
}
&__container {
width: calc(100% - 124px);
flex: 0 0 auto;
position: relative;
@media screen and (max-width: (124px + 300px)) {
width: 100%;
}
&__slides {
display: flex;
flex-wrap: nowrap;
align-items: start;
}
&__item {
&__slide {
box-sizing: border-box;
width: 100%;
flex: 0 0 100%;
padding: 15px;
position: relative;
font-size: 15px;
@@ -9269,26 +9277,25 @@ noscript {
font-weight: 400;
max-height: 50vh;
overflow: hidden;
display: flex;
flex-direction: column;
}
&__range {
display: block;
font-weight: 500;
margin-bottom: 10px;
padding-inline-end: 18px;
}
&__range {
display: block;
font-weight: 500;
margin-bottom: 10px;
padding-inline-end: 18px;
}
&__unread {
position: absolute;
top: 19px;
inset-inline-end: 19px;
display: block;
background: $highlight-text-color;
border-radius: 50%;
width: 0.625rem;
height: 0.625rem;
}
&__unread {
position: absolute;
top: 19px;
inset-inline-end: 19px;
display: block;
background: $highlight-text-color;
border-radius: 50%;
width: 0.625rem;
height: 0.625rem;
}
&__pagination {
@@ -9299,6 +9306,7 @@ noscript {
inset-inline-end: 0;
display: flex;
align-items: center;
z-index: 1;
}
}
@@ -11910,4 +11918,10 @@ noscript {
height: 16px;
}
}
&__pagination {
display: flex;
align-items: center;
gap: 4px;
}
}