@gitlab/ui 32.56.0 → 32.60.0

package/src/scss/utilities.scss

@@ -4203,6 +4203,18 @@
   }
 }
 
+.gl-sm-w-half {
+  @include gl-media-breakpoint-up(sm) {
+    width: 50%;
+  }
+}
+
+.gl-sm-w-half\! {
+  @include gl-media-breakpoint-up(sm) {
+    width: 50% !important;
+  }
+}
+
 .gl-md-w-auto {
   @include gl-media-breakpoint-up(md) {
     width: auto;
@@ -4215,26 +4227,62 @@
   }
 }
 
+.gl-md-w-50p {
+  @include gl-media-breakpoint-up(md) {
+    width: 50%;
+  }
+}
+
+.gl-md-w-50p\! {
+  @include gl-media-breakpoint-up(md) {
+    width: 50% !important;
+  }
+}
+
 .gl-lg-w-1px {
-  @media (min-width: $breakpoint-lg) {
+  @include gl-media-breakpoint-up(lg) {
     width: 1px;
   }
 }
 
 .gl-lg-w-1px\! {
-  @media (min-width: $breakpoint-lg) {
+  @include gl-media-breakpoint-up(lg) {
     width: 1px !important;
   }
 }
 
-.gl-md-w-50p {
-  @include gl-media-breakpoint-up(md) {
+.gl-lg-w-auto {
+  @include gl-media-breakpoint-up(lg) {
+    width: auto;
+  }
+}
+
+.gl-lg-w-auto\! {
+  @include gl-media-breakpoint-up(lg) {
+    width: auto !important;
+  }
+}
+
+.gl-lg-w-25p {
+  @include gl-media-breakpoint-up(lg) {
+    width: 25%;
+  }
+}
+
+.gl-lg-w-25p\! {
+  @include gl-media-breakpoint-up(lg) {
+    width: 25% !important;
+  }
+}
+
+.gl-lg-w-50p {
+  @include gl-media-breakpoint-up(lg) {
     width: 50%;
   }
 }
 
-.gl-md-w-50p\! {
-  @include gl-media-breakpoint-up(md) {
+.gl-lg-w-50p\! {
+  @include gl-media-breakpoint-up(lg) {
     width: 50% !important;
   }
 }
@@ -5538,6 +5586,16 @@
   margin-bottom: $gl-spacing-scale-3 !important;
   }
 }
+.gl-xs-mb-4 {
+  @include gl-media-breakpoint-down(sm) {
+  margin-bottom: $gl-spacing-scale-4;
+  }
+}
+.gl-xs-mb-4\! {
+  @include gl-media-breakpoint-down(sm) {
+  margin-bottom: $gl-spacing-scale-4 !important;
+  }
+}
 .gl-sm-ml-3 {
   @include gl-media-breakpoint-up(sm) {
   margin-left: $gl-spacing-scale-3;
@@ -5642,6 +5700,16 @@
   margin-bottom: $gl-spacing-scale-5 !important;
   }
 }
+.gl-md-ml-3 {
+  @include gl-media-breakpoint-up(md) {
+  margin-left: $gl-spacing-scale-3;
+  }
+}
+.gl-md-ml-3\! {
+  @include gl-media-breakpoint-up(md) {
+  margin-left: $gl-spacing-scale-3 !important;
+  }
+}
 .gl-md-mr-3 {
   @include gl-media-breakpoint-up(md) {
   margin-right: $gl-spacing-scale-3;
@@ -5758,154 +5826,794 @@
   margin-top: $gl-spacing-scale-5 !important;
   }
 }
-.gl-sm-pr-5 {
+.gl-sm-pt-0 {
   @include gl-media-breakpoint-down(sm) {
-  padding-right: $gl-spacing-scale-5;
+  padding-top: 0;
   }
 }
-.gl-sm-pr-5\! {
+.gl-sm-pt-0\! {
   @include gl-media-breakpoint-down(sm) {
-  padding-right: $gl-spacing-scale-5 !important;
+  padding-top: 0 !important;
   }
 }
-.gl-sm-pl-5 {
+.gl-sm-pt-1 {
   @include gl-media-breakpoint-down(sm) {
-  padding-left: $gl-spacing-scale-5;
+  padding-top: $gl-spacing-scale-1;
   }
 }
-.gl-sm-pl-5\! {
+.gl-sm-pt-1\! {
   @include gl-media-breakpoint-down(sm) {
-  padding-left: $gl-spacing-scale-5 !important;
+  padding-top: $gl-spacing-scale-1 !important;
   }
 }
-.gl-md-pr-0 {
-  @include gl-media-breakpoint-up(md) {
+.gl-sm-pt-2 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-2;
+  }
+}
+.gl-sm-pt-2\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-sm-pt-3 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-3;
+  }
+}
+.gl-sm-pt-3\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-sm-pt-4 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-4;
+  }
+}
+.gl-sm-pt-4\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-sm-pt-5 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-5;
+  }
+}
+.gl-sm-pt-5\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-top: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-sm-pr-0 {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: 0;
   }
 }
-.gl-md-pr-0\! {
-  @include gl-media-breakpoint-up(md) {
+.gl-sm-pr-0\! {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: 0 !important;
   }
 }
-.gl-md-pr-1 {
-  @include gl-media-breakpoint-up(md) {
+.gl-sm-pr-1 {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: $gl-spacing-scale-1;
   }
 }
-.gl-md-pr-1\! {
-  @include gl-media-breakpoint-up(md) {
+.gl-sm-pr-1\! {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: $gl-spacing-scale-1 !important;
   }
 }
-.gl-md-pr-2 {
-  @include gl-media-breakpoint-up(md) {
+.gl-sm-pr-2 {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: $gl-spacing-scale-2;
   }
 }
-.gl-md-pr-2\! {
-  @include gl-media-breakpoint-up(md) {
+.gl-sm-pr-2\! {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: $gl-spacing-scale-2 !important;
   }
 }
-.gl-md-pr-5 {
-  @include gl-media-breakpoint-up(md) {
-  padding-right: $gl-spacing-scale-5;
+.gl-sm-pr-3 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-right: $gl-spacing-scale-3;
   }
 }
-.gl-md-pr-5\! {
-  @include gl-media-breakpoint-up(md) {
-  padding-right: $gl-spacing-scale-5 !important;
+.gl-sm-pr-3\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-right: $gl-spacing-scale-3 !important;
   }
 }
-.gl-lg-pr-5 {
-  @include gl-media-breakpoint-up(lg) {
+.gl-sm-pr-4 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-right: $gl-spacing-scale-4;
+  }
+}
+.gl-sm-pr-4\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-right: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-sm-pr-5 {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: $gl-spacing-scale-5;
   }
 }
-.gl-lg-pr-5\! {
-  @include gl-media-breakpoint-up(lg) {
+.gl-sm-pr-5\! {
+  @include gl-media-breakpoint-down(sm) {
   padding-right: $gl-spacing-scale-5 !important;
   }
 }
-.gl-md-pl-3 {
-  @include gl-media-breakpoint-up(md) {
-  padding-left: $gl-spacing-scale-3;
+.gl-sm-pb-0 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: 0;
   }
 }
-.gl-md-pl-3\! {
-  @include gl-media-breakpoint-up(md) {
-  padding-left: $gl-spacing-scale-3 !important;
+.gl-sm-pb-0\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: 0 !important;
   }
 }
-.gl-collapse-empty {
-  &:empty {
-    padding: 0;
-    margin: 0;
+.gl-sm-pb-1 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-1;
   }
 }
-.gl-collapse-empty\! {
-  &:empty {
-    padding: 0 !important;
-    margin: 0 !important;
+.gl-sm-pb-1\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-1 !important;
   }
 }
-.gl-fill-current-color {
-  fill: currentColor
-}
-
-.gl-fill-current-color\! {
-  fill: currentColor !important
+.gl-sm-pb-2 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-2;
+  }
 }
-
-.gl-fill-blue-500 {
-  fill: $blue-500
+.gl-sm-pb-2\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-2 !important;
+  }
 }
-
-.gl-fill-blue-500\! {
-  fill: $blue-500 !important
+.gl-sm-pb-3 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-3;
+  }
 }
-
-.gl-stop-color-gray-50 {
-  stop-color: $gray-50
+.gl-sm-pb-3\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-3 !important;
+  }
 }
-
-.gl-stop-color-gray-50\! {
-  stop-color: $gray-50 !important
+.gl-sm-pb-4 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-4;
+  }
 }
-
-.gl-stop-color-gray-100 {
-  stop-color: $gray-100
+.gl-sm-pb-4\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-4 !important;
+  }
 }
-
-.gl-stop-color-gray-100\! {
-  stop-color: $gray-100 !important
+.gl-sm-pb-5 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-5;
+  }
 }
-
-.gl-stop-color-gray-200 {
-  stop-color: $gray-200
+.gl-sm-pb-5\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-bottom: $gl-spacing-scale-5 !important;
+  }
 }
-
-.gl-stop-color-gray-200\! {
-  stop-color: $gray-200 !important
+.gl-sm-pl-0 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: 0;
+  }
 }
-
-.gl-stroke-white {
-  stroke: $white
+.gl-sm-pl-0\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: 0 !important;
+  }
 }
-
-.gl-stroke-white\! {
-  stroke: $white !important
+.gl-sm-pl-1 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-1;
+  }
 }
-
-.gl-stroke-gray-200 {
-  stroke: $gray-200
+.gl-sm-pl-1\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-1 !important;
+  }
 }
-
-.gl-stroke-gray-200\! {
-  stroke: $gray-200 !important
+.gl-sm-pl-2 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-2;
+  }
 }
-
+.gl-sm-pl-2\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-sm-pl-3 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-3;
+  }
+}
+.gl-sm-pl-3\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-sm-pl-4 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-4;
+  }
+}
+.gl-sm-pl-4\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-sm-pl-5 {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-5;
+  }
+}
+.gl-sm-pl-5\! {
+  @include gl-media-breakpoint-down(sm) {
+  padding-left: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-md-pt-0 {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: 0;
+  }
+}
+.gl-md-pt-0\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: 0 !important;
+  }
+}
+.gl-md-pt-1 {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-1;
+  }
+}
+.gl-md-pt-1\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-md-pt-2 {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-2;
+  }
+}
+.gl-md-pt-2\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-md-pt-3 {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-3;
+  }
+}
+.gl-md-pt-3\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-md-pt-4 {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-4;
+  }
+}
+.gl-md-pt-4\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-md-pt-5 {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-5;
+  }
+}
+.gl-md-pt-5\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-top: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-md-pr-0 {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: 0;
+  }
+}
+.gl-md-pr-0\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: 0 !important;
+  }
+}
+.gl-md-pr-1 {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-1;
+  }
+}
+.gl-md-pr-1\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-md-pr-2 {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-2;
+  }
+}
+.gl-md-pr-2\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-md-pr-3 {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-3;
+  }
+}
+.gl-md-pr-3\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-md-pr-4 {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-4;
+  }
+}
+.gl-md-pr-4\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-md-pr-5 {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-5;
+  }
+}
+.gl-md-pr-5\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-right: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-md-pb-0 {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: 0;
+  }
+}
+.gl-md-pb-0\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: 0 !important;
+  }
+}
+.gl-md-pb-1 {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-1;
+  }
+}
+.gl-md-pb-1\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-md-pb-2 {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-2;
+  }
+}
+.gl-md-pb-2\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-md-pb-3 {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-3;
+  }
+}
+.gl-md-pb-3\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-md-pb-4 {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-4;
+  }
+}
+.gl-md-pb-4\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-md-pb-5 {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-5;
+  }
+}
+.gl-md-pb-5\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-bottom: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-md-pl-0 {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: 0;
+  }
+}
+.gl-md-pl-0\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: 0 !important;
+  }
+}
+.gl-md-pl-1 {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-1;
+  }
+}
+.gl-md-pl-1\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-md-pl-2 {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-2;
+  }
+}
+.gl-md-pl-2\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-md-pl-3 {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-3;
+  }
+}
+.gl-md-pl-3\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-md-pl-4 {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-4;
+  }
+}
+.gl-md-pl-4\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-md-pl-5 {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-5;
+  }
+}
+.gl-md-pl-5\! {
+  @include gl-media-breakpoint-up(md) {
+  padding-left: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-lg-pt-0 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: 0;
+  }
+}
+.gl-lg-pt-0\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: 0 !important;
+  }
+}
+.gl-lg-pt-1 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-1;
+  }
+}
+.gl-lg-pt-1\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-lg-pt-2 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-2;
+  }
+}
+.gl-lg-pt-2\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-lg-pt-3 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-3;
+  }
+}
+.gl-lg-pt-3\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-lg-pt-4 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-4;
+  }
+}
+.gl-lg-pt-4\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-lg-pt-5 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-5;
+  }
+}
+.gl-lg-pt-5\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-top: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-lg-pr-0 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: 0;
+  }
+}
+.gl-lg-pr-0\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: 0 !important;
+  }
+}
+.gl-lg-pr-1 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-1;
+  }
+}
+.gl-lg-pr-1\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-lg-pr-2 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-2;
+  }
+}
+.gl-lg-pr-2\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-lg-pr-3 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-3;
+  }
+}
+.gl-lg-pr-3\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-lg-pr-4 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-4;
+  }
+}
+.gl-lg-pr-4\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-lg-pr-5 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-5;
+  }
+}
+.gl-lg-pr-5\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-right: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-lg-pb-0 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: 0;
+  }
+}
+.gl-lg-pb-0\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: 0 !important;
+  }
+}
+.gl-lg-pb-1 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-1;
+  }
+}
+.gl-lg-pb-1\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-lg-pb-2 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-2;
+  }
+}
+.gl-lg-pb-2\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-lg-pb-3 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-3;
+  }
+}
+.gl-lg-pb-3\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-lg-pb-4 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-4;
+  }
+}
+.gl-lg-pb-4\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-lg-pb-5 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-5;
+  }
+}
+.gl-lg-pb-5\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-bottom: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-lg-pl-0 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: 0;
+  }
+}
+.gl-lg-pl-0\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: 0 !important;
+  }
+}
+.gl-lg-pl-1 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-1;
+  }
+}
+.gl-lg-pl-1\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-1 !important;
+  }
+}
+.gl-lg-pl-2 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-2;
+  }
+}
+.gl-lg-pl-2\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-2 !important;
+  }
+}
+.gl-lg-pl-3 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-3;
+  }
+}
+.gl-lg-pl-3\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-3 !important;
+  }
+}
+.gl-lg-pl-4 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-4;
+  }
+}
+.gl-lg-pl-4\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-4 !important;
+  }
+}
+.gl-lg-pl-5 {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-5;
+  }
+}
+.gl-lg-pl-5\! {
+  @include gl-media-breakpoint-up(lg) {
+  padding-left: $gl-spacing-scale-5 !important;
+  }
+}
+.gl-collapse-empty {
+  &:empty {
+    padding: 0;
+    margin: 0;
+  }
+}
+.gl-collapse-empty\! {
+  &:empty {
+    padding: 0 !important;
+    margin: 0 !important;
+  }
+}
+.gl-fill-current-color {
+  fill: currentColor
+}
+
+.gl-fill-current-color\! {
+  fill: currentColor !important
+}
+
+.gl-fill-blue-500 {
+  fill: $blue-500
+}
+
+.gl-fill-blue-500\! {
+  fill: $blue-500 !important
+}
+
+.gl-stop-color-gray-50 {
+  stop-color: $gray-50
+}
+
+.gl-stop-color-gray-50\! {
+  stop-color: $gray-50 !important
+}
+
+.gl-stop-color-gray-100 {
+  stop-color: $gray-100
+}
+
+.gl-stop-color-gray-100\! {
+  stop-color: $gray-100 !important
+}
+
+.gl-stop-color-gray-200 {
+  stop-color: $gray-200
+}
+
+.gl-stop-color-gray-200\! {
+  stop-color: $gray-200 !important
+}
+
+.gl-stroke-white {
+  stroke: $white
+}
+
+.gl-stroke-white\! {
+  stroke: $white !important
+}
+
+.gl-stroke-gray-200 {
+  stroke: $gray-200
+}
+
+.gl-stroke-gray-200\! {
+  stroke: $gray-200 !important
+}
+
 .gl-stroke-blue-400 {
   stroke: $blue-400
 }
@@ -6481,6 +7189,14 @@
   font-size: $gl-font-size-compact-markdown-h1 !important;
 }
 
+.gl-reset-font-size {
+  font-size: inherit;
+}
+
+.gl-reset-font-size\! {
+  font-size: inherit !important;
+}
+
 .gl-font-weight-100 {
   font-weight: 100;
 }