Article Media
Mixins
image
@mixin image() { ... }@mixin image() { width: 100%; height: 100%; object-fit: cover; display: block; }
Description
image styles
Parameters
None.
standard
@mixin standard() { ... }@mixin standard() { aspect-ratio: 16 / 9; img { @include top-border-radius; } }
Description
sets the aspect ratio and top border radius for the standard layout
Parameters
None.
Requires
- [mixin]
top-border-radius
landscape
@mixin landscape() { ... }@mixin landscape() { aspect-ratio: 4 / 3; width: unit.rem(120px); height: unit.rem(90px); @include full-border-radius; img { @include full-border-radius; } }
Description
sets the aspect ratio and border radius for the landscape layout
Parameters
None.
Requires
- [mixin]
full-border-radius - [function]
rem
landscape-condensed
@mixin landscape-condensed() { ... }@mixin landscape-condensed() { aspect-ratio: 1 / 1; width: unit.rem(60px); height: unit.rem(60px); border-radius: border.get('br02'); img { @include full-border-radius; } }
Description
sets the aspect ratio and border radius for the landscape condensed layout
Parameters
None.
Requires
- [mixin]
full-border-radius - [function]
rem - [function]
get
full-border-radius
@mixin full-border-radius() { ... }@mixin full-border-radius() { border-radius: border.get('br02'); }
Description
mixin for the full border radius
Parameters
None.
Requires
- [function]
get
Used by
- [mixin]
landscape - [mixin]
landscape-condensed