From d97f62772a7f4d4a1ddac38e3cb5c4e66ab054fd Mon Sep 17 00:00:00 2001
From: HerrHase <me@herr-hase.wtf>
Date: Wed, 4 Aug 2021 09:25:31 +0200
Subject: [PATCH] adding #21

---
 src/scss/helpers/_visibility.scss | 55 ++++++++++++++++++++++++++++++-
 1 file changed, 54 insertions(+), 1 deletion(-)

diff --git a/src/scss/helpers/_visibility.scss b/src/scss/helpers/_visibility.scss
index 95742e3..7610c20 100644
--- a/src/scss/helpers/_visibility.scss
+++ b/src/scss/helpers/_visibility.scss
@@ -1,34 +1,87 @@
+/**
+ *  visibility
+ *
+ *
+ *  @author Björn Hase, Tentakelfabrik
+ *  @license http://opensource.org/licenses/MIT The MIT License
+ *  @link https://github.com/tentakelfabrik/plain-ui-css
+ *
+ */
+
+
 /**
  *  display
- *  
+ *
  *
  */
 
+@mixin display($breakpoint, $class, $value)
+{
+    .display-#{ $class }-#{ $breakpoint } {
+        display: #{ $value };
+    }
+}
+
+@mixin display-breakpoints($class, $value)
+{
+    @include media-xs() {
+        @include display('xs', $class, $value);
+    }
+
+    @include media-sm() {
+        @include display('sm', $class, $value);
+    }
+
+    @include media-md() {
+        @include display('md', $class, $value);
+    }
+
+    @include media-lg() {
+         @include display('lg', $class, $value);
+     }
+
+    @include media-xlg() {
+        @include display('xlg', $class, $value);
+    }
+}
+
 
 .display-block {
     display: block;
 }
 
+@include display-breakpoints('block', 'block');
+
 .display-inline {
     display: inline;
 }
 
+@include display-breakpoints('inline', 'inline');
+
 .display-inline-block {
     display: inline-block;
 }
 
+@include display-breakpoints('inline-block', 'inline-block');
+
 .display-flex {
     display: flex;
 }
 
+@include display-breakpoints('flex', 'flex');
+
 .display-inline-flex {
     display: inline-flex;
 }
 
+@include display-breakpoints('inline-flex', 'inline-flex');
+
 .display-table {
     display: table;
 }
 
+@include display-breakpoints('table', 'table');
+
 
 /**
  *  for hidden-xs etc, show https://reflexgrid.com/#visibility-helpers