commons/admin/src/components/molecules/AssetTeaser.module.scss

96 lines
1.7 KiB
SCSS

@import '../../styles/variables';
.asset {
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
> a {
display: block;
height: 100%;
padding: $spacer;
border: 1px solid $brand-grey-lighter;
border-radius: $border-radius;
background: $brand-white;
color: inherit;
position: relative;
&:hover,
&:focus {
color: inherit;
border-color: $brand-pink;
transform: none;
// category image
> div:first-child {
opacity: 1;
background-size: 105%;
}
}
}
h1 {
font-size: $font-size-large;
margin-top: 0;
}
}
.minimal {
h1 {
margin-bottom: 0;
}
}
.assetList {
> a {
color: $brand-grey-dark;
border-bottom: 1px solid $brand-grey-lighter;
padding-top: $spacer / 2;
padding-bottom: $spacer / 2;
display: flex;
justify-content: space-between;
align-items: center;
&:hover,
&:focus {
color: $brand-pink;
transform: none;
}
}
h1 {
font-size: $font-size-base;
color: inherit;
margin: 0;
}
}
.description {
&,
p,
strong,
a,
h1,
h2,
h3,
h4,
h5 {
font-weight: $font-weight-base;
font-family: $font-family-base;
margin-bottom: 0;
font-size: $font-size-small;
color: $brand-grey;
}
}
.date {
font-size: $font-size-small;
color: $brand-grey-light;
}
.assetFooter {
margin-top: $spacer / 2;
font-size: $font-size-small;
color: $brand-grey-light;
}