From 21f8403e9695aeab89cbb7fe9203e72e1208daa6 Mon Sep 17 00:00:00 2001
From: Dhiraj Bodicherla <dhiraj@gitlab.com>
Date: Tue, 2 Jun 2020 19:11:41 +0000
Subject: [PATCH] feat(css): Add more css utils

---
 src/scss/utility-mixins/display.scss        | 12 ++++++++++++
 src/scss/utility-mixins/flex.scss           |  6 ++++++
 src/scss/utility-mixins/vertical-align.scss |  4 ++++
 3 files changed, 22 insertions(+)

diff --git a/src/scss/utility-mixins/display.scss b/src/scss/utility-mixins/display.scss
index fca4e94661..bf6ce7cb4b 100644
--- a/src/scss/utility-mixins/display.scss
+++ b/src/scss/utility-mixins/display.scss
@@ -11,6 +11,12 @@
   display: flex;
 }
 
+@mixin gl-display-sm-flex {
+  @media (min-width: $breakpoint-sm) {
+    @include gl-display-flex;
+  }
+}
+
 @mixin gl-display-inline-flex {
   display: inline-flex;
 }
@@ -38,3 +44,9 @@
 @mixin gl-display-table-cell {
   display: table-cell;
 }
+
+@mixin gl-display-sm-block {
+  @media (min-width: $breakpoint-sm) {
+    @include gl-display-block;
+  }
+}
diff --git a/src/scss/utility-mixins/flex.scss b/src/scss/utility-mixins/flex.scss
index ec7702a206..455d699f46 100644
--- a/src/scss/utility-mixins/flex.scss
+++ b/src/scss/utility-mixins/flex.scss
@@ -13,6 +13,12 @@
   flex-wrap: wrap;
 }
 
+@mixin gl-flex-sm-wrap {
+  @media (min-width: $breakpoint-sm) {
+    @include gl-flex-wrap;
+  }
+}
+
 @mixin gl-flex-direction-column {
   flex-direction: column;
 }
diff --git a/src/scss/utility-mixins/vertical-align.scss b/src/scss/utility-mixins/vertical-align.scss
index aa201eb107..c923756e0e 100644
--- a/src/scss/utility-mixins/vertical-align.scss
+++ b/src/scss/utility-mixins/vertical-align.scss
@@ -16,3 +16,7 @@
 @mixin gl-vertical-align-bottom {
   vertical-align: bottom;
 }
+
+@mixin gl-vertical-align-text-bottom {
+  vertical-align: text-bottom;
+}
-- 
GitLab