Add custom properties for the border of disabled cards

Author: atmelmicro

src/components/Card/Card.module.scss

@@ -35,6 +35,7 @@
     }
 
     .isRootDisabled {
+        border: theme.$disabled-border-width solid var(--rui-local-border-color, theme.$disabled-border-color);
         background-color: theme.$disabled-background-color;
         opacity: theme.$disabled-opacity;
     }

src/components/Card/README.md

@@ -300,6 +300,8 @@ Separate your card actions with CardFooter. See
 | `--rui-Card--raised__box-shadow`         | Box shadow of raised card                      |
 | `--rui-Card--disabled__background-color` | Card background color in disabled state        |
 | `--rui-Card--disabled__opacity`          | Card opacity in disabled state                 |
+| `--rui-Card--disabled__border-width`     | Card border width in disabled state            |
+| `--rui-Card--disabled__border-color`     | Card border color in disabled state            |
 
 ### Theming Variants
 

src/components/Card/_theme.scss

@@ -9,3 +9,5 @@ $raised-box-shadow: var(--rui-Card--raised__box-shadow);
 
 $disabled-background-color: var(--rui-Card--disabled__background-color);
 $disabled-opacity: var(--rui-Card--disabled__opacity);
+$disabled-border-width: var(--rui-Card--disabled__border-width);
+$disabled-border-color: var(--rui-Card--disabled__border-color);

src/theme.scss

@@ -832,6 +832,8 @@
         --rui-Card--raised__box-shadow: var(--rui-shadow-layer-1);
         --rui-Card--disabled__background-color: var(--rui-color-background-disabled);
         --rui-Card--disabled__opacity: var(--rui-ratio-disabled-opacity);
+        --rui-Card--disabled__border-width: var(--rui-dimension-border-width-1);
+        --rui-Card--disabled__border-color: var(--rui-color-border-primary);
 
         // Card: variant: success
         --rui-Card--success__color: var(--rui-color-text-primary);