diff options
Diffstat (limited to '_sass/common/components/_item.scss')
-rw-r--r-- | _sass/common/components/_item.scss | 100 |
1 files changed, 100 insertions, 0 deletions
diff --git a/_sass/common/components/_item.scss b/_sass/common/components/_item.scss new file mode 100644 index 0000000..a1a9fd0 --- /dev/null +++ b/_sass/common/components/_item.scss @@ -0,0 +1,100 @@ +.item { + @include flexbox(); + @include media-breakpoint-down(md) { + @include flex-direction(column); + } +} + +.item__image { + margin-right: map-get($spacers, 3); + & + .item__content { + & > :first-child { + margin-top: 0; + & > :first-child { + margin-top: 0; + } + } + } + @include media-breakpoint-down(md) { + margin-right: 0; + } +} + +.item__content { + @include flex(1); + min-width: 0; +} + +a > .item__header, a.item__header, .item__header > a { + @include link-colors($text-color-d, $main-color-1); +} + +.item__meta { + color: $text-color-l; +} + +.item__description { + &, .article__content { + font-size: map-get($base, font-size-sm); + line-height: map-get($base, line-height); + @include block-elements() { + margin-top: map-get($spacers, 2); + margin-bottom: map-get($spacers, 2); + } + @include heading-elements() { + margin-top: map-get($spacers, 3); + } + h1, h2, h3 { + color: $text-color; + } + h1, h2 { + padding: 0; + border: none; + } + h1 { + font-size: map-get($base, font-size-h1-xs); + } + h2 { + font-size: map-get($base, font-size-h2-xs); + } + h3 { + font-size: map-get($base, font-size-h3-xs); + } + h4 { + font-size: map-get($base, font-size-h4-xs); + } + h5 { + font-size: map-get($base, font-size-h5-xs); + } + h6 { + font-size: map-get($base, font-size-h6-xs); + } + img { + max-height: 32rem; + @include media-breakpoint-down(md) { + max-height: 14rem; + } + } + } +} + +.items { + & > .item { + &:not(:last-child) { + margin-bottom: map-get($spacers, 2); + } + } +} + +.items--divided { + & > .item { + &:not(:first-child) { + padding-top: map-get($spacers, 4); + } + &:not(:last-child) { + padding-bottom: map-get($spacers, 4); + @include split-line(bottom); + } + list-style-type: none; + } +} |