2020-04-30 15:09:46 +00:00
|
|
|
/**
|
|
|
|
Please note: These are deprecated in favor of the Gitlab UI utility classes.
|
|
|
|
Check https://unpkg.com/browse/@gitlab/ui/src/scss/utilities.scss
|
|
|
|
to see the available utility classes. If you cannot find the class you need,
|
|
|
|
consider adding it to Gitlab UI before adding it here.
|
|
|
|
**/
|
|
|
|
|
2019-04-03 02:24:07 +00:00
|
|
|
@each $variant, $range in $color-ranges {
|
|
|
|
@each $suffix, $color in $range {
|
|
|
|
#{'.bg-#{$variant}-#{$suffix}'} {
|
|
|
|
background-color: $color;
|
|
|
|
}
|
|
|
|
|
|
|
|
#{'.text-#{$variant}-#{$suffix}'} {
|
|
|
|
color: $color;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@each $index, $size in $type-scale {
|
|
|
|
#{'.text-#{$index}'} {
|
|
|
|
font-size: $size;
|
|
|
|
}
|
|
|
|
}
|
2019-09-10 15:29:06 +00:00
|
|
|
|
2019-10-31 12:06:26 +00:00
|
|
|
@each $index, $size in $size-scale {
|
|
|
|
#{'.mw-#{$index}'} {
|
|
|
|
max-width: $size;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-12-19 12:07:35 +00:00
|
|
|
@each $index, $size in $type-scale {
|
|
|
|
#{'.lh-#{$index}'} {
|
|
|
|
line-height: $size;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-02-06 12:10:29 +00:00
|
|
|
@for $i from 1 through 12 {
|
|
|
|
#{'.tab-width-#{$i}'} {
|
2020-07-09 21:09:33 +00:00
|
|
|
/* stylelint-disable-next-line property-no-vendor-prefix */
|
2020-02-06 12:10:29 +00:00
|
|
|
-moz-tab-size: $i;
|
|
|
|
tab-size: $i;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-09-10 15:29:06 +00:00
|
|
|
.border-width-1px { border-width: 1px; }
|
2020-01-15 00:09:05 +00:00
|
|
|
.border-bottom-width-1px { border-bottom-width: 1px; }
|
2019-09-10 15:29:06 +00:00
|
|
|
.border-style-dashed { border-style: dashed; }
|
|
|
|
.border-style-solid { border-style: solid; }
|
2020-01-15 00:09:05 +00:00
|
|
|
.border-bottom-style-solid { border-bottom-style: solid; }
|
2019-09-10 15:29:06 +00:00
|
|
|
.border-color-blue-300 { border-color: $blue-300; }
|
|
|
|
.border-color-default { border-color: $border-color; }
|
2020-01-15 00:09:05 +00:00
|
|
|
.border-bottom-color-default { border-bottom-color: $border-color; }
|
2020-03-24 18:07:55 +00:00
|
|
|
.border-radius-default { border-radius: $border-radius-default; }
|
2020-04-28 15:09:29 +00:00
|
|
|
.border-radius-small { border-radius: $border-radius-small; }
|
2019-11-07 06:06:12 +00:00
|
|
|
.box-shadow-default { box-shadow: 0 2px 4px 0 $black-transparent; }
|
2019-11-08 06:06:24 +00:00
|
|
|
|
2020-02-25 12:08:48 +00:00
|
|
|
.gl-children-ml-sm-3 > * {
|
|
|
|
@include media-breakpoint-up(sm) {
|
|
|
|
@include gl-ml-3;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-12-10 07:53:40 +00:00
|
|
|
.mh-50vh { max-height: 50vh; }
|
|
|
|
|
2020-04-13 15:09:20 +00:00
|
|
|
.min-width-0 {
|
|
|
|
// By default flex items don't shrink below their minimum content size. To change this, set the item's min-width
|
|
|
|
min-width: 0;
|
|
|
|
}
|
|
|
|
|
2020-02-04 03:08:37 +00:00
|
|
|
.font-size-inherit { font-size: inherit; }
|
2020-03-09 09:07:45 +00:00
|
|
|
.gl-w-8 { width: px-to-rem($grid-size); }
|
2020-02-28 18:09:07 +00:00
|
|
|
.gl-w-16 { width: px-to-rem($grid-size * 2); }
|
2019-11-08 06:06:24 +00:00
|
|
|
.gl-w-64 { width: px-to-rem($grid-size * 8); }
|
2020-03-09 09:07:45 +00:00
|
|
|
.gl-h-8 { height: px-to-rem($grid-size); }
|
2020-01-20 09:08:32 +00:00
|
|
|
.gl-h-32 { height: px-to-rem($grid-size * 4); }
|
2019-11-08 06:06:24 +00:00
|
|
|
.gl-h-64 { height: px-to-rem($grid-size * 8); }
|
2019-12-10 09:07:51 +00:00
|
|
|
|
2020-07-30 09:09:36 +00:00
|
|
|
// Migrate this to Gitlab UI when FF is removed
|
|
|
|
// https://gitlab.com/groups/gitlab-org/-/epics/2882
|
|
|
|
.gl-h-200\! { height: px-to-rem($grid-size * 25) !important; }
|
|
|
|
|
2020-05-21 12:08:08 +00:00
|
|
|
.d-sm-table-column {
|
|
|
|
@include media-breakpoint-up(sm) {
|
|
|
|
display: table-column !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-12-10 09:07:51 +00:00
|
|
|
.gl-text-purple { color: $purple; }
|
|
|
|
.gl-bg-purple-light { background-color: $purple-light; }
|
2020-06-12 12:08:56 +00:00
|
|
|
|
|
|
|
// move this to GitLab UI once onboarding experiment is considered a success
|
|
|
|
.gl-py-8 {
|
|
|
|
padding-top: $gl-spacing-scale-8;
|
|
|
|
padding-bottom: $gl-spacing-scale-8;
|
|
|
|
}
|
|
|
|
|
|
|
|
// move this to GitLab UI once onboarding experiment is considered a success
|
|
|
|
.gl-pl-7 {
|
|
|
|
padding-left: $gl-spacing-scale-7;
|
|
|
|
}
|
2020-06-18 21:09:05 +00:00
|
|
|
|
|
|
|
.gl-transition-property-stroke-opacity {
|
|
|
|
transition-property: stroke-opacity;
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-transition-property-stroke {
|
|
|
|
transition-property: stroke;
|
|
|
|
}
|
2020-07-16 15:09:38 +00:00
|
|
|
|
|
|
|
.gl-top-66vh {
|
|
|
|
top: 66vh;
|
|
|
|
}
|
2020-07-17 06:09:11 +00:00
|
|
|
|
2020-09-01 18:10:48 +00:00
|
|
|
.gl-shadow-x0-y0-b3-s1-blue-500 {
|
|
|
|
box-shadow: inset 0 0 3px $gl-border-size-1 $blue-500;
|
|
|
|
}
|
2020-09-02 12:10:35 +00:00
|
|
|
|
|
|
|
|
|
|
|
.gl-sm-align-items-flex-end {
|
|
|
|
@media (min-width: $breakpoint-sm) {
|
|
|
|
align-items: flex-end;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-sm-text-body {
|
|
|
|
@media (min-width: $breakpoint-sm) {
|
|
|
|
color: $body-color;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-sm-font-weight-bold {
|
|
|
|
@media (min-width: $breakpoint-sm) {
|
|
|
|
font-weight: $gl-font-weight-bold;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-min-h-6 {
|
|
|
|
min-height: $gl-spacing-scale-6;
|
|
|
|
}
|
|
|
|
|
2020-09-07 12:08:27 +00:00
|
|
|
.gl-md-justify-content-end {
|
2020-09-03 12:08:47 +00:00
|
|
|
@media (min-width: $breakpoint-md) {
|
|
|
|
width: auto !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-display-md-flex {
|
|
|
|
@media (min-width: $breakpoint-md) {
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-display-md-none {
|
|
|
|
@media (min-width: $breakpoint-md) {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
}
|