packages/styles/scss/base/forms/_label.scss

   1 /* label */
   2 // $label-width defined in global vars
   3 .label {
   4         padding-block-start: 0.5em;
   5         inline-size: var(--label-width, $label-width);
   6         padding-inline-end: 0.5em;
   7         max-inline-size: 100%;
   8         flex-shrink: 0;
   9
  10         &.pt-0 {
  11                 padding-block-start: 0;
  12         }
  13
  14         &.auto {
  15                 inline-size: auto;
  16         }
  17
  18         &--small {
  19                 font-size: rem(12);
  20                 line-height: 2;
  21         }
  22 }
  23
  24 // case for forms labelled only with icons (calendar popover, etc.)
  25 .form--icon-labels .label {
  26         --label-width: 2.4em;
  27
  28         @include media('<=xsmall') {
  29                 --label-width: 1.75em;
  30         }
  31 }