feat(item,comment): disabled variants

Added a disabled variant to comment and item because such elements could contain interactive elements and it's quite a common use case to have all/single comment(s)/item(s) being disabled
fomantic · Apr 17, 2023 · d5f0e18 · d5f0e18
1 parent 446d89e
commit d5f0e18
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 0 deletions.
diff --git a/src/definitions/views/comment.less b/src/definitions/views/comment.less
@@ -290,6 +290,13 @@
         }
     }
 }
+& when (@variationCommentDisabled) {
+    .ui.disabled.comments,
+    .ui.comments .disabled.comment {
+        opacity: @disabledOpacity;
+        pointer-events: @disabledPointerEvents;
+    }
+}
 
 // stylelint-disable no-invalid-position-at-import-rule
 @import (multiple, optional) "../../overrides.less";
diff --git a/src/definitions/views/item.less b/src/definitions/views/item.less
@@ -597,6 +597,13 @@
         }
     }
 }
+& when (@variationItemDisabled) {
+    .ui.disabled.items,
+    .ui.items > .disabled.item {
+        opacity: @disabledOpacity;
+        pointer-events: @disabledPointerEvents;
+    }
+}
 
 // stylelint-disable no-invalid-position-at-import-rule
 @import (multiple, optional) "../../overrides.less";
diff --git a/src/themes/default/globals/variation.variables b/src/themes/default/globals/variation.variables
@@ -439,6 +439,7 @@
 
 /* Comment */
 @variationCommentInverted: true;
+@variationCommentDisabled: true;
 @variationCommentThreaded: true;
 @variationCommentMinimal: true;
 @variationCommentAvatar: true;
@@ -461,6 +462,7 @@
 
 /* Item */
 @variationItemInverted: true;
+@variationItemDisabled: true;
 @variationItemImage: true;
 @variationItemHeader: true;
 @variationItemDescription: true;