discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

Fixed article cards style

Browse Source
This commit is contained in:
kvakazyambra 2023-05-29 22:27:25 +03:00
parent bb45d206e1
commit b4e1ed2835
2 changed files with 29 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/components/Feed/ArticleCard.module.scss
View File

@ -118,10 +118,13 @@
.shoutCardTitle { .shoutCardTitle {
@include font-size(2.2rem); @include font-size(2.2rem);
font-weight: 700; font-weight: 700;
line-height: 1.1; line-height: 1.1;
margin-bottom: 0.8rem; margin-bottom: 0.8rem;
:global(.col-md-12) & {
@include font-size(2.6rem);
}
} }
.shoutCardTitle, .shoutCardTitle,
@ -129,7 +132,6 @@
&, &,
.shoutCardLinkContainer { .shoutCardLinkContainer {
box-decoration-break: clone; box-decoration-break: clone;
/* stylelint-disable-next-line */ /* stylelint-disable-next-line */
-webkit-box-decoration-break: clone; -webkit-box-decoration-break: clone;
} }
@ -267,7 +269,6 @@
.shoutCardTitle, .shoutCardTitle,
.shoutCardSubtitle { .shoutCardSubtitle {
@include font-size(2.6rem); @include font-size(2.6rem);
display: inline; display: inline;
line-height: 1.2; line-height: 1.2;
} }
@ -288,20 +289,24 @@
.shoutAuthor { .shoutAuthor {
margin-top: 0.8rem; margin-top: 0.8rem;
a { a:link,
a:visited {
color: rgb(255 255 255 / 50%); color: rgb(255 255 255 / 50%);
} }
a:hover {
background-color: #fff !important;
}
} }
.shoutCardTitle { a:link,
a { a:visited {
color: #fff; color: #fff;
} }
}
a:hover { a:hover {
background: #fff; background: #fff;
color: #000 !important; color: #000;
} }
.shoutCardTitlesContainer { .shoutCardTitlesContainer {
@ -508,27 +513,22 @@
padding: 0; padding: 0;
} }
.shoutCardTitle { .shoutCardTitle,
font-size: 2.6rem !important; .shoutCardSubtitle {
font-size: 2.2rem !important;
@include media-breakpoint-between(lg, xl) { @include media-breakpoint-between(lg, xl) {
font-size: 2.4rem !important; font-size: 1.8rem !important;
} }
} }
.shoutCardContent { .shoutCardContent {
justify-content: start; justify-content: start;
position: relative; position: relative;
.shoutCardSubtitle {
@include media-breakpoint-up(lg) {
@include font-size(2rem);
} }
@include media-breakpoint-between(lg, xl) { .shoutDate {
@include font-size(1.8rem); color: rgb(255 255 255 / 0.5);
}
}
} }
} }
@ -562,8 +562,7 @@
.shoutCardBigTitle { .shoutCardBigTitle {
.shoutCardTitle { .shoutCardTitle {
@include font-size(3.2rem); @include font-size(2.6rem);
display: block; display: block;
padding-right: 0; padding-right: 0;
} }
@ -577,8 +576,7 @@
.shoutCardCompact { .shoutCardCompact {
.shoutCardTitle, .shoutCardTitle,
.shoutCardSubtitle { .shoutCardSubtitle {
@include font-size(2.6rem); @include font-size(2.2rem);
display: inline; display: inline;
line-height: 1.2; line-height: 1.2;
} }
@ -586,19 +584,15 @@
.shoutCardSubtitle { .shoutCardSubtitle {
padding-left: 0.3em; padding-left: 0.3em;
box-decoration-break: slice; box-decoration-break: slice;
/* stylelint-disable-next-line */ /* stylelint-disable-next-line */
-webkit-box-decoration-break: slice; -webkit-box-decoration-break: slice;
} }
a { a:link {
color: #fff; background: none !important;
&:hover {
.shoutCardSubtitle { .shoutCardSubtitle {
background-color: #fff; color: #696969;
color: #000;
}
} }
} }
} }
@ -610,7 +604,6 @@
.shoutCardTitle, .shoutCardTitle,
.shoutCardSubtitle { .shoutCardSubtitle {
display: inline; display: inline;
@include font-size(1.4rem); @include font-size(1.4rem);
} }
@ -671,14 +664,12 @@
.shoutCardTitle { .shoutCardTitle {
@include font-size(4rem); @include font-size(4rem);
font-weight: 900; font-weight: 900;
line-height: 1.1; line-height: 1.1;
} }
.shoutCardSubtitle { .shoutCardSubtitle {
@include font-size(2.4rem); @include font-size(2.4rem);
color: #696969; color: #696969;
flex: 1; flex: 1;
} }

4
src/components/Feed/CardTopic.module.scss
View File

@ -22,7 +22,7 @@
} }
.shoutTopicFloorImportant { .shoutTopicFloorImportant {
a { a:hover {
color: rgb(255 255 255 / 50%); background: $link-color !important;
} }
} }