82 lines
No EOL
1.7 KiB
SCSS
82 lines
No EOL
1.7 KiB
SCSS
.card--impact{
|
|
@include grid-content();
|
|
padding: calc(var(--spacing)*0.5) 0;
|
|
border-bottom: var(--border-light);
|
|
|
|
container-type: inline-size;
|
|
container-name: impact;
|
|
|
|
&:first-of-type{
|
|
border-top: var(--border-light);
|
|
}
|
|
|
|
.content{
|
|
grid-column: 2;
|
|
}
|
|
&:not([data-impact-type="media"]) .content{
|
|
@media #{$x-small}{ grid-column: span 2; }
|
|
}
|
|
|
|
.tag{
|
|
|
|
width: auto;
|
|
justify-self: start;
|
|
position: relative;
|
|
top: -5px;
|
|
|
|
}
|
|
|
|
.content{
|
|
.see-more{
|
|
color: var(--color-txt-light);
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
&::after{
|
|
content: ' +'
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.open-graph__details{
|
|
grid-column: span 2;
|
|
@include details-summary();
|
|
summary{
|
|
color: var(--color-txt-light);
|
|
.arrow-details svg{ fill: var(--color-txt-light);}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.open-graph__details{
|
|
summary{
|
|
@include grid-content();
|
|
.summary-inner{
|
|
grid-column: 2;
|
|
|
|
}
|
|
}
|
|
|
|
}
|
|
.open-graph__inner{
|
|
margin-top: calc(var(--spacing)*0.5);
|
|
margin-bottom: calc(var(--spacing)*1);
|
|
@media #{$small-up}{
|
|
margin-bottom: calc(var(--spacing)*2);
|
|
}
|
|
.card--open-graph{
|
|
margin-bottom: calc(var(--spacing)*0.5);
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@container impact (width < 420px) {
|
|
.date, .content, details{
|
|
font-size: 14px!important;
|
|
}
|
|
} |