Section Heading

Installation

  yarn add @chewy/kib-content-groups-styles

Import

  @use '~@chewy/kib-content-groups-styles/src/kib-section-heading/styles' as kib-section-heading;

Mixins

header-wrapper

@mixin header-wrapper() { ... }@mixin header-wrapper() { 
  margin-bottom: spacing.get('s4');
 }
Description

Chirp Section Heading Header Wrapper Styles

Parameters

None.

Requires

header-small

@mixin header-small() { ... }@mixin header-small() { 
  margin-bottom: spacing.get('s2');
 }
Description

Small heading header wrapper styles

Parameters

None.

Requires

heading

@mixin heading() { ... }@mixin heading() { 
  @include typography.style-as('section-1');

  margin: 0;
  padding: 0;
  color: settings.$heading-text-color;
 }
Description

Chirp Section Heading Heading Styles

Parameters

None.

Requires

heading-small

@mixin heading-small() { ... }@mixin heading-small() { 
  @include typography.style-as('section-2');
 }
Description

small heading heading styles

Parameters

None.

subheading

@mixin subheading() { ... }@mixin subheading() { 
  @include typography.style-as('paragraph-2');

  margin-top: spacing.get('s1');
  margin-bottom: 0;
  color: settings.$subheading-text-color;
 }
Description

Chirp Section Heading Subheading Styles

Parameters

None.

Requires

Variables

heading-text-color

$heading-text-color: color.get('text', 'primary') !default;
Description

Default heading text color of section-heading

Type

Color

Used by

subheading-text-color

$subheading-text-color: color.get('text', 'secondary') !default;
Description

Default subheading text color of section-heading

Type

Color

Used by