lightning-base-components 1.21.3-alpha → 1.21.4-alpha

package/src/lightning/sldsUtilsMargin/sldsUtilsMargin.css

@@ -10,261 +10,262 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 /* Top */
 
 /* Constant */
-.slds-m-top_none,
-:host(.slds-m-top_none) {
+
+:host([data-render-mode='shadow']) .slds-m-top_none,
+:host([data-render-mode='shadow'].slds-m-top_none) {
     margin-top: 0 !important;
 }
 
-.slds-m-top_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-top_xxx-small {
     /* 0.125rem */
     margin-block-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-top_xx-small {
+:host([data-render-mode='shadow']) .slds-m-top_xx-small {
     margin-block-start: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-top_x-small {
+:host([data-render-mode='shadow']) .slds-m-top_x-small {
     margin-block-start: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-top_small {
+:host([data-render-mode='shadow']) .slds-m-top_small {
     margin-block-start: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-top_medium {
+:host([data-render-mode='shadow']) .slds-m-top_medium {
     margin-block-start: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-top_large {
+:host([data-render-mode='shadow']) .slds-m-top_large {
     margin-block-start: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-top_x-large {
+:host([data-render-mode='shadow']) .slds-m-top_x-large {
     margin-block-start: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-top_xx-large {
+:host([data-render-mode='shadow']) .slds-m-top_xx-large {
     margin-block-start: var(--slds-g-spacing-8, 3rem);
 }
 
 /* Right */
 
-.slds-m-right_none {
+:host([data-render-mode='shadow']) .slds-m-right_none {
     margin-inline-end: 0 !important;
 }
 
-.slds-m-right_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-right_xxx-small {
     /* 0.125rem */
     margin-inline-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-right_xx-small,
-:host(.slds-m-right_xx-small) {
+:host([data-render-mode='shadow']) .slds-m-right_xx-small,
+:host([data-render-mode='shadow'].slds-m-right_xx-small) {
     margin-inline-end: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-right_x-small,
-:host(.slds-m-right_x-small) {
+:host([data-render-mode='shadow']) .slds-m-right_x-small,
+:host([data-render-mode='shadow'].slds-m-right_x-small) {
     margin-inline-end: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-right_small,
-:host(.slds-m-right_small) {
+:host([data-render-mode='shadow']) .slds-m-right_small,
+:host([data-render-mode='shadow'].slds-m-right_small) {
     margin-inline-end: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-right_medium {
+:host([data-render-mode='shadow']) .slds-m-right_medium {
     margin-inline-end: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-right_large {
+:host([data-render-mode='shadow']) .slds-m-right_large {
     margin-inline-end: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-right_x-large {
+:host([data-render-mode='shadow']) .slds-m-right_x-large {
     margin-inline-end: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-right_xx-large {
+:host([data-render-mode='shadow']) .slds-m-right_xx-large {
     margin-inline-end: var(--slds-g-spacing-8, 3rem);
 }
 
 /* Bottom */
 
-.slds-m-bottom_none,
-:host(.slds-m-bottom_none) {
+:host([data-render-mode='shadow']) .slds-m-bottom_none,
+:host([data-render-mode='shadow'].slds-m-bottom_none) {
     margin-block-end: 0 !important;
 }
 
-.slds-m-bottom_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-bottom_xxx-small {
     /* 0.125rem */
     margin-block-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-bottom_xx-small {
+:host([data-render-mode='shadow']) .slds-m-bottom_xx-small {
     margin-block-end: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-bottom_x-small {
+:host([data-render-mode='shadow']) .slds-m-bottom_x-small {
     margin-block-end: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-bottom_small {
+:host([data-render-mode='shadow']) .slds-m-bottom_small {
     margin-block-end: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-bottom_medium {
+:host([data-render-mode='shadow']) .slds-m-bottom_medium {
     margin-block-end: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-bottom_large {
+:host([data-render-mode='shadow']) .slds-m-bottom_large {
     margin-block-end: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-bottom_x-large {
+:host([data-render-mode='shadow']) .slds-m-bottom_x-large {
     margin-block-end: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-bottom_xx-large {
+:host([data-render-mode='shadow']) .slds-m-bottom_xx-large {
     margin-block-end: var(--slds-g-spacing-8, 3rem);
 }
 
 /* Left */
 
-.slds-m-left_none {
+:host([data-render-mode='shadow']) .slds-m-left_none {
     margin-inline-start: 0 !important;
 }
 
-.slds-m-left_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-left_xxx-small {
     /* 0.125rem */
     margin-inline-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-left_xx-small,
-:host(.slds-m-left_xx-small) {
+:host([data-render-mode='shadow']) .slds-m-left_xx-small,
+:host([data-render-mode='shadow'].slds-m-left_xx-small) {
     margin-inline-start: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-left_x-small,
-:host(.slds-m-left_x-small) {
+:host([data-render-mode='shadow']) .slds-m-left_x-small,
+:host([data-render-mode='shadow'].slds-m-left_x-small) {
     margin-inline-start: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-left_small {
+:host([data-render-mode='shadow']) .slds-m-left_small {
     margin-inline-start: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-left_medium {
+:host([data-render-mode='shadow']) .slds-m-left_medium {
     margin-inline-start: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-left_large {
+:host([data-render-mode='shadow']) .slds-m-left_large {
     margin-inline-start: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-left_x-large {
+:host([data-render-mode='shadow']) .slds-m-left_x-large {
     margin-inline-start: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-left_xx-large,
-:host(.slds-m-left_xx-large) {
+:host([data-render-mode='shadow']) .slds-m-left_xx-large,
+:host([data-render-mode='shadow'].slds-m-left_xx-large) {
     margin-inline-start: var(--slds-g-spacing-8, 3rem);
 }
 
 /* Horizontal */
 
-.slds-m-horizontal_none,
-:host(.slds-m-horizontal_none) {
+:host([data-render-mode='shadow']) .slds-m-horizontal_none,
+:host([data-render-mode='shadow'].slds-m-horizontal_none) {
     margin-inline-start: 0 !important;
     margin-inline-end: 0 !important;
 }
 
-.slds-m-horizontal_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-horizontal_xxx-small {
     /* 0.125rem */
     margin-inline-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
     margin-inline-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-horizontal_xx-small {
+:host([data-render-mode='shadow']) .slds-m-horizontal_xx-small {
     margin-inline-start: var(--slds-g-spacing-1, 0.25rem);
     margin-inline-end: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-horizontal_x-small {
+:host([data-render-mode='shadow']) .slds-m-horizontal_x-small {
     margin-inline-start: var(--slds-g-spacing-2, 0.5rem);
     margin-inline-end: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-horizontal_small {
+:host([data-render-mode='shadow']) .slds-m-horizontal_small {
     margin-inline-start: var(--slds-g-spacing-3, 0.75rem);
     margin-inline-end: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-horizontal_medium {
+:host([data-render-mode='shadow']) .slds-m-horizontal_medium {
     margin-inline-start: var(--slds-g-spacing-4, 1rem);
     margin-inline-end: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-horizontal_large {
+:host([data-render-mode='shadow']) .slds-m-horizontal_large {
     margin-inline-start: var(--slds-g-spacing-5, 1.5rem);
     margin-inline-end: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-horizontal_x-large {
+:host([data-render-mode='shadow']) .slds-m-horizontal_x-large {
     margin-inline-start: var(--slds-g-spacing-6, 2rem);
     margin-inline-end: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-horizontal_xx-large {
+:host([data-render-mode='shadow']) .slds-m-horizontal_xx-large {
     margin-inline-start: var(--slds-g-spacing-8, 3rem);
     margin-inline-end: var(--slds-g-spacing-8, 3rem);
 }
 
 /* Vertical */
 
-.slds-m-vertical_none {
+:host([data-render-mode='shadow']) .slds-m-vertical_none {
     margin-block-start: 0 !important;
     margin-block-end: 0 !important;
 }
 
-.slds-m-vertical_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-vertical_xxx-small {
     /* 0.125rem */
     margin-block-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
     margin-block-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-vertical_xx-small {
+:host([data-render-mode='shadow']) .slds-m-vertical_xx-small {
     margin-block-start: var(--slds-g-spacing-1, 0.25rem);
     margin-block-end: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-vertical_x-small {
+:host([data-render-mode='shadow']) .slds-m-vertical_x-small {
     margin-block-start: var(--slds-g-spacing-2, 0.5rem);
     margin-block-end: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-vertical_small {
+:host([data-render-mode='shadow']) .slds-m-vertical_small {
     margin-block-start: var(--slds-g-spacing-3, 0.75rem);
     margin-block-end: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-vertical_medium {
+:host([data-render-mode='shadow']) .slds-m-vertical_medium {
     margin-block-start: var(--slds-g-spacing-4, 1rem);
     margin-block-end: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-vertical_large {
+:host([data-render-mode='shadow']) .slds-m-vertical_large {
     margin-block-start: var(--slds-g-spacing-5, 1.5rem);
     margin-block-end: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-vertical_x-large {
+:host([data-render-mode='shadow']) .slds-m-vertical_x-large {
     margin-block-start: var(--slds-g-spacing-6, 2rem);
     margin-block-end: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-vertical_xx-large {
+:host([data-render-mode='shadow']) .slds-m-vertical_xx-large {
     margin-block-start: var(--slds-g-spacing-8, 3rem);
     margin-block-end: var(--slds-g-spacing-8, 3rem);
 }
@@ -272,42 +273,43 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 /* Around */
 
 /* Constant */
-.slds-m-around_none {
+
+:host([data-render-mode='shadow']) .slds-m-around_none {
     margin: 0 !important;
 }
 
-.slds-m-around_xxx-small {
+:host([data-render-mode='shadow']) .slds-m-around_xxx-small {
     /* 0.125rem */
     margin: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
 }
 
-.slds-m-around_xx-small,
-:host(.slds-m-around_xx-small) {
+:host([data-render-mode='shadow']) .slds-m-around_xx-small,
+:host([data-render-mode='shadow'].slds-m-around_xx-small) {
     margin: var(--slds-g-spacing-1, 0.25rem);
 }
 
-.slds-m-around_x-small {
+:host([data-render-mode='shadow']) .slds-m-around_x-small {
     margin: var(--slds-g-spacing-2, 0.5rem);
 }
 
-.slds-m-around_small {
+:host([data-render-mode='shadow']) .slds-m-around_small {
     margin: var(--slds-g-spacing-3, 0.75rem);
 }
 
-.slds-m-around_medium,
-:host(.slds-m-around_medium) {
+:host([data-render-mode='shadow']) .slds-m-around_medium,
+:host([data-render-mode='shadow'].slds-m-around_medium) {
     margin: var(--slds-g-spacing-4, 1rem);
 }
 
-.slds-m-around_large,
-:host(.slds-m-around_large) {
+:host([data-render-mode='shadow']) .slds-m-around_large,
+:host([data-render-mode='shadow'].slds-m-around_large) {
     margin: var(--slds-g-spacing-5, 1.5rem);
 }
 
-.slds-m-around_x-large {
+:host([data-render-mode='shadow']) .slds-m-around_x-large {
     margin: var(--slds-g-spacing-6, 2rem);
 }
 
-.slds-m-around_xx-large {
+:host([data-render-mode='shadow']) .slds-m-around_xx-large {
     margin: var(--slds-g-spacing-8, 3rem);
 }