drupal/core/themes/olivero/css/components/node-teaser.css

209 lines
4.1 KiB
CSS
Raw Normal View History

/*
* DO NOT EDIT THIS FILE.
* See the following change record for more information,
* https://www.drupal.org/node/3084859
* @preserve
*/
/**
* @file
* Node Teaser specific styles.
*/
.node--view-mode-teaser {
position: relative; /* Anchor after pseudo-element. */
margin-bottom: 1.6875rem
}
.node--view-mode-teaser:after {
position: absolute;
bottom: 0;
width: 3.375rem;
height: 0;
content: "";
/* Intentionally not using CSS logical properties. */
border-top: solid 2px #e7edf1;
}
.node--view-mode-teaser .node__meta {
margin-bottom: 1.125rem
}
.node--view-mode-teaser .node__meta a {
color: #0d77b5;
font-weight: bold;
}
.node--view-mode-teaser .node__top-wrapper {
display: flex;
align-items: center;
margin: 0;
margin-bottom: 1.125rem
}
@media (min-width: 62.5rem) {
.node--view-mode-teaser .node__top-wrapper {
position: relative; /* Anchor the image */
margin: 0
}
}
[dir="ltr"] .node--view-mode-teaser .field--name-field-image {
margin-right: 1.125rem
}
[dir="rtl"] .node--view-mode-teaser .field--name-field-image {
margin-left: 1.125rem
}
.node--view-mode-teaser .field--name-field-image {
flex-shrink: 0;
margin: 0
}
.node--view-mode-teaser .field--name-field-image img {
width: 3.9375rem;
height: 3.9375rem;
-o-object-fit: cover;
object-fit: cover;
border-radius: 50%
}
@media (min-width: 62.5rem) {
.node--view-mode-teaser .field--name-field-image img {
width: calc(7.14286vw - 2.31696rem);
height: calc(7.14286vw - 2.31696rem)
}
}
@media (min-width: 75rem) {
.node--view-mode-teaser .field--name-field-image img {
width: calc(7.14286vw - 2.87946rem);
height: calc(7.14286vw - 2.87946rem)
}
}
@media (min-width: 90rem) {
.node--view-mode-teaser .field--name-field-image img {
width: 3.61607rem;
height: 3.61607rem
}
}
@media (min-width: 62.5rem) {
[dir="ltr"] .node--view-mode-teaser .field--name-field-image {
left: calc(-7.14286vw - -1.07143px)
}
[dir="rtl"] .node--view-mode-teaser .field--name-field-image {
right: calc(-7.14286vw - -1.07143px)
}
.node--view-mode-teaser .field--name-field-image {
position: absolute;
top: 0;
margin: 0
}
}
@media (min-width: 75rem) {
[dir="ltr"] .node--view-mode-teaser .field--name-field-image {
left: calc(-7.14286vw - -0.62946rem)
}
[dir="rtl"] .node--view-mode-teaser .field--name-field-image {
right: calc(-7.14286vw - -0.62946rem)
}
}
@media (min-width: 90rem) {
[dir="ltr"] .node--view-mode-teaser .field--name-field-image {
left: -5.86607rem
}
[dir="rtl"] .node--view-mode-teaser .field--name-field-image {
right: -5.86607rem
}
}
.node--view-mode-teaser .node__title {
margin: 0;
color: #0d1214;
font-size: 1.5rem;
line-height: 1.6875rem
}
@media (min-width: 62.5rem) {
.node--view-mode-teaser .node__title {
margin-bottom: 1.125rem;
font-size: 2.25rem;
line-height: 3.375rem
}
}
[dir="ltr"] .node--view-mode-teaser .field--tag-ref {
margin-left: 0
}
[dir="rtl"] .node--view-mode-teaser .field--tag-ref {
margin-right: 0
}
[dir="ltr"] .node--view-mode-teaser .field--tag-ref {
margin-right: 0
}
[dir="rtl"] .node--view-mode-teaser .field--tag-ref {
margin-left: 0
}
[dir="ltr"] .node--view-mode-teaser .field--tag-ref {
padding-left: 0
}
[dir="rtl"] .node--view-mode-teaser .field--tag-ref {
padding-right: 0
}
[dir="ltr"] .node--view-mode-teaser .field--tag-ref {
padding-right: 0
}
[dir="rtl"] .node--view-mode-teaser .field--tag-ref {
padding-left: 0
}
.node--view-mode-teaser .field--tag-ref {
margin-top: 1.125rem;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
background-color: transparent
}
@media (min-width: 62.5rem) {
.node--view-mode-teaser .field--tag-ref {
margin-top: 2.25rem
}
}
@media (min-width: 62.5rem) {
.node--view-mode-teaser {
margin-bottom: 3.375rem
}
}
.views-row:last-child .node--view-mode-teaser {
margin-bottom: 0;
}