mirror/Tangerine-UI
1
0
Fork 0
mirror of https://github.com/nileane/TangerineUI-for-Mastodon synced 2024-11-27 14:28:14 +09:00
Code

Link cards are more compact on mobile and in the MultiColumn layout

Browse Source
This commit is contained in:
Niléane 2023-11-24 14:10:13 +01:00
parent 746d23edbb
commit b74f34b3df
No known key found for this signature in database
3 changed files with 114 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
TangerineUI-cherry.css
View File

@ -1716,6 +1716,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;
}

38
TangerineUI-purple.css
View File

@ -1716,6 +1716,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;
}

38
TangerineUI.css
View File

@ -1716,6 +1716,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;
}