@use '@storyblok/design-tokens/tokens/scss/variables' as *;

// Icon Sizes
$icon-small-size: 1.6rem;
$icon-default-size: 2.4rem;
$icon-large-size: 3.2rem;
$icon-extra-large-size: 4.8rem;

// Avatar variables
$sb-avatar-small: 26px;
$sb-avatar-normal: 32px;
$sb-avatar-large: 46px;
$s-0: $sb-size-spacing-none; // 0px
$s-1: $sb-size-spacing-xs; // 4px
$s-2: $sb-size-spacing-base; // 8px
$s-3: $sb-size-spacing-lg; // 12px
$s-4: $sb-size-spacing-xl; // 16px
$s-5: $sb-size-spacing-2xl; // 24px
$s-6: 32px;
$s-7: 40px;
$s-8: $sb-size-spacing-3xl; // 48px
$sizes: (
  '0': $s-0,
  '1': $s-1,
  '2': $s-2,
  '3': $s-3,
  '4': $s-4,
  '5': $s-5,
  '6': $s-6,
  '7': $s-7,
  '8': $s-8,
);

// will be removed
$small-size: 8px; // use $s-2
$medium-size: 16px; // use $s-4
$large-size: 32px; // use $s-6
$x-large-size: 48px; // use $s-8