add static hide selector without media query

documentation/docs/attribute-selectors/show-hide.md

@@ -14,6 +14,7 @@ The attributes have the following naming scheme:
 
 * `data-show-[mediaQueryName]`
 * `data-hide-[mediaQueryName]`
+* `data-hide`
 
 With `mediaQueryName` being the name of one of the [available media queries](../responsive#media-queries).
 

documentation/docs/flex-layout-migration.mdx

@@ -23,8 +23,7 @@ Let's start with what is missing in css-fx-layout in comparison with Angular Fle
 * no alternative for `fxFlexOrder`
 * no alternative for `fxFlexOffset`
 * no custom breakpoints
-* the alternatives to `fxShow`/`fxHide` only support the responsive API
-* the alternative to `fxShow` does not work the same way it does in Flex-Layout
+* the alternative to `fxShow` only supports the responsive API and does not work the same way it does in Flex-Layout
 
 :::warning Migrate away from `fxShow` / `data-show`
 

src/lib/show-hide-attributes.scss

@@ -2,6 +2,9 @@
 
 /// Generates show/hide attribute selectors
 @mixin show-hide-attributes {
+	*[data-hide] {
+		display: none !important;
+	}
 	@each $breakpoint, $_ in $flex-layout-media-queries {
 		*[data-show-#{$breakpoint}] {
 			@include flex-layout-media-not($breakpoint) {

src/lib/show-hide-classes.scss

@@ -2,6 +2,9 @@
 
 /// Generates show/hide class selectors
 @mixin show-hide-classes {
+	*.hide {
+		display: none !important;
+	}
 	@each $breakpoint, $_ in $flex-layout-media-queries {
 		*.show-#{$breakpoint} {
 			@include flex-layout-media-not($breakpoint) {

test/show-hide.spec.scss

@@ -11,6 +11,9 @@
 				@include shc.show-hide-classes;
 			}
 			@include true.expect {
+				*.hide {
+					display: none !important;
+				}
 				@include mix.xs(true) {
 					*.show-xs {
 						display: none !important;
@@ -150,6 +153,9 @@
 				@include sha.show-hide-attributes;
 			}
 			@include true.expect {
+				*[data-hide] {
+					display: none !important;
+				}
 				@include mix.xs(true) {
 					*[data-show-xs] {
 						display: none !important;