// vf-article-meta-information @import 'package.variables.scss'; // Debug information from component's `package.json`: // --- /*! * Component: #{map-get($componentInfo, 'name')} * Version: #{map-get($componentInfo, 'version')} * Location: #{map-get($componentInfo, 'location')} */ .vf-article-meta-information { display: grid; & > div { margin: 0 8px; margin-bottom: 12px; padding-top: 12px; } & > div + div { border-top: 1px solid color(grey--lightest); } } .vf-article-meta-info__author { align-content: center; display: inline-flex; .vf-author__name { @include set-type(text-body--3, $custom-margin-bottom: 0); align-self: center; line-height: 1.3; margin: 0 0 0 8px; } .vf-author__title { align-self: center; margin: 0 0 0 8px; } .vf-author--avatar, .vf-link.vf-author--avatar__link { border-radius: 500px; height: 48px; order: -1; width: 48px; } .vf-link.vf-author--avatar__link .vf-author--avatar { border-width: 0; } } .vf-meta__details { .vf-meta__topics { color: color(grey); margin: 0 0 4px 0; .vf-link { color: inherit; position: relative; } .vf-link:nth-last-child(n+2), .vf-link:nth-last-child(n+2) ~ .vf-link { margin-right: 4px; &::before { content: ','; position: absolute; right: -4px; } } .vf-link:last-of-type { &::before { content: '' !important; } } } .vf-meta__date { @include set-type(text-body--3, $custom-margin-bottom: 4px); color: color(grey); } } .vf-article-meta-info__links { padding: 0; .vf-text { @include set-type(text-body--3, $custom-margin-bottom: 8px); color: color(grey); } .vf-link { display: block; margin-bottom: 4px; } } .vf-meta__text { @include set-type(text-body--3, $custom-margin-bottom: 0); color: color(grey); }