@gravity-ui/uikit/build/esm/components/layout/Flex/Flex.css

Gravity UI base styling and components

/* stylelint-disable declaration-no-important */
.g-flex {
  display: flex;
}
.g-flex_inline {
  display: inline-flex;
}
.g-flex_center-content {
  justify-content: center;
  align-items: center;
}
.g-flex_s_0 {
  margin-block-start: calc(-1 * var(--g-spacing-0)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-0)) !important;
}
.g-flex_s_0 > * {
  padding-block-start: var(--g-spacing-0) !important;
  padding-inline-start: var(--g-spacing-0) !important;
}
.g-flex_s_half {
  margin-block-start: calc(-1 * var(--g-spacing-half)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-half)) !important;
}
.g-flex_s_half > * {
  padding-block-start: var(--g-spacing-half) !important;
  padding-inline-start: var(--g-spacing-half) !important;
}
.g-flex_s_1 {
  margin-block-start: calc(-1 * var(--g-spacing-1)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-1)) !important;
}
.g-flex_s_1 > * {
  padding-block-start: var(--g-spacing-1) !important;
  padding-inline-start: var(--g-spacing-1) !important;
}
.g-flex_s_2 {
  margin-block-start: calc(-1 * var(--g-spacing-2)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-2)) !important;
}
.g-flex_s_2 > * {
  padding-block-start: var(--g-spacing-2) !important;
  padding-inline-start: var(--g-spacing-2) !important;
}
.g-flex_s_3 {
  margin-block-start: calc(-1 * var(--g-spacing-3)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-3)) !important;
}
.g-flex_s_3 > * {
  padding-block-start: var(--g-spacing-3) !important;
  padding-inline-start: var(--g-spacing-3) !important;
}
.g-flex_s_4 {
  margin-block-start: calc(-1 * var(--g-spacing-4)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-4)) !important;
}
.g-flex_s_4 > * {
  padding-block-start: var(--g-spacing-4) !important;
  padding-inline-start: var(--g-spacing-4) !important;
}
.g-flex_s_5 {
  margin-block-start: calc(-1 * var(--g-spacing-5)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-5)) !important;
}
.g-flex_s_5 > * {
  padding-block-start: var(--g-spacing-5) !important;
  padding-inline-start: var(--g-spacing-5) !important;
}
.g-flex_s_6 {
  margin-block-start: calc(-1 * var(--g-spacing-6)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-6)) !important;
}
.g-flex_s_6 > * {
  padding-block-start: var(--g-spacing-6) !important;
  padding-inline-start: var(--g-spacing-6) !important;
}
.g-flex_s_7 {
  margin-block-start: calc(-1 * var(--g-spacing-7)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-7)) !important;
}
.g-flex_s_7 > * {
  padding-block-start: var(--g-spacing-7) !important;
  padding-inline-start: var(--g-spacing-7) !important;
}
.g-flex_s_8 {
  margin-block-start: calc(-1 * var(--g-spacing-8)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-8)) !important;
}
.g-flex_s_8 > * {
  padding-block-start: var(--g-spacing-8) !important;
  padding-inline-start: var(--g-spacing-8) !important;
}
.g-flex_s_9 {
  margin-block-start: calc(-1 * var(--g-spacing-9)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-9)) !important;
}
.g-flex_s_9 > * {
  padding-block-start: var(--g-spacing-9) !important;
  padding-inline-start: var(--g-spacing-9) !important;
}
.g-flex_s_10 {
  margin-block-start: calc(-1 * var(--g-spacing-10)) !important;
  margin-inline-start: calc(-1 * var(--g-spacing-10)) !important;
}
.g-flex_s_10 > * {
  padding-block-start: var(--g-spacing-10) !important;
  padding-inline-start: var(--g-spacing-10) !important;
}