Profile Detail
Installation
yarn add @chewy/kib-profile-styles
Import
@use '~@chewy/kib-profile-styles/src/kib-profile-detail/styles' as kib-profile-detail;
Mixins
item
@mixin item() { ... }
@mixin item() { display: flex; flex-direction: column; margin-bottom: 0; }
Description
Profile avatar image styles
Parameters
None.
label
@mixin label() { ... }
@mixin label() { @include typography.style-as('caption'); color: color.get('text', 'tertiary'); #{$parent}--airy & { @include label-airy; } }
content
@mixin content() { ... }
@mixin content() { @include typography.style-as('paragraph-2'); color: color.get('text', 'primary'); #{$parent}--airy & { @include content-airy; } }
label-airy
@mixin label-airy() { ... }
@mixin label-airy() { @include typography.style-as('paragraph-2'); @container kib-profile-card (max-width: #{settings.$card-condensed-max-width}) { @include typography.style-as('caption'); } }
Description
Profile label airy styles
Parameters
None.
Requires
- [variable]
card-condensed-max-width
Used by
- [mixin]
label
content-airy
@mixin content-airy() { ... }
@mixin content-airy() { @include typography.style-as('paragraph-1'); @container kib-profile-card (max-width: #{settings.$card-condensed-max-width}) { @include typography.style-as('paragraph-2'); } }
Description
Profile content airy styles
Parameters
None.
Requires
- [variable]
card-condensed-max-width
Used by
- [mixin]
content