Product Sponsor
Installation
yarn add @chewy/kib-product-styles
Import
@use '~@chewy/kib-product-styles/src/kib-product-sponsor/styles' as kib-product-sponsor;
Mixins
sponsor
@mixin sponsor() { ... }
@mixin sponsor() { @include typography.style-as('caption'); margin-bottom: spacing.get('s1'); display: inline-block; padding: settings.$padding; border-radius: settings.$border-radius; border: settings.$border-size solid settings.$border-color; background-color: settings.$background-color; color: settings.$text-color; }
Description
default sponsor styles
Parameters
None.
Requires
- [function]
get
- [variable]
padding
- [variable]
border-radius
- [variable]
border-size
- [variable]
border-color
- [variable]
background-color
- [variable]
text-color
Variables
border-radius
$border-radius: kib-core.dimensions-get(tiny) !default;
Description
Border radius of product sponsor
Type
Number
border-size
$border-size: unit.rem(1px) !default;
border-color
$border-color: color.get('ui-bg', '07') !default;
Description
Border Color of product sponsor
Type
Color
background-color
$background-color: color.get('ui-bg', 'primary') !default;
Description
Background color of product sponsor
Type
Color
padding
$padding: unit.rem(2px 6px 3px) !default;
text-color
$text-color: color.get('text', 'secondary') !default;
Description
Color of product sponsor text
Type
Color