[Suggestion] Add responsive helpers to text-align helpers (#985)

* add responsive helpers to text-align helpers

* better generation of classes

* better naming

diff --git a/sass/base/helpers.sass b/sass/base/helpers.sass
index 64fdcff537d0473f8b9f2088915180c7f99e21fc..a7bc9404bad3c03327bb0052d7e0a637e9856de8 100755 (executable)
--- a/sass/base/helpers.sass
+++ b/sass/base/helpers.sass
@@ -44,14 +44,38 @@
     .is-size-#{$i}-fullhd
       font-size: $size !important
 
-.has-text-centered
-  text-align: center !important
+$alignments: ('centered': 'center', 'left': 'left', 'right': 'right')
 
-.has-text-left
-  text-align: left !important
-
-.has-text-right
-  text-align: right !important
+@each $alignment, $text-align in $alignments
+  .has-text-#{$alignment}
+    text-align: #{$text-align} !important
+  +mobile
+    .has-text-#{$alignment}-mobile
+      text-align: #{$text-align} !important
+  +tablet
+    .has-text-#{$alignment}-tablet
+      text-align: #{$text-align} !important
+  +tablet-only
+    .has-text-#{$alignment}-tablet-only
+      text-align: #{$text-align} !important
+  +touch
+    .has-text-#{$alignment}-touch
+      text-align: #{$text-align} !important
+  +desktop
+    .has-text-#{$alignment}-desktop
+      text-align: #{$text-align} !important
+  +desktop-only
+    .has-text-#{$alignment}-desktop-only
+      text-align: #{$text-align} !important
+  +widescreen
+    .has-text-#{$alignment}-widescreen
+      text-align: #{$text-align} !important
+  +widescreen-only
+    .has-text-#{$alignment}-widescreen-only
+      text-align: #{$text-align} !important
+  +fullhd
+    .has-text-#{$alignment}-fullhd
+      text-align: #{$text-align} !important
 
 .is-capitalized
   text-transform: capitalize !important