@zohodesk/dot 1.0.0-temp-228.2 → 1.0.0-temp-229

package/es/form/fields/ValidationMessage/ValidationMessage.module.css

@@ -5,16 +5,17 @@
   display: inline;
 }
 .icon{
+  margin-block:0 ;
+  margin-inline: var(--zd_size5) ;
   /*css:theme-validation:ignore*/
   color:var(--label_text_color);
   display: inline-block;
-  margin: 0 var(--zd_size5) ;
 }
 .primary {
   position: absolute;
   top: 100% ;
+  margin-block-start: var(--zd_size5) ;
   composes:basic;
-  margin-top: var(--zd_size5) ;
 }
 [dir=ltr] .primary {
   left: 0 ;
@@ -23,6 +24,6 @@
   right: 0 ;
 }
 .secondary {
+  margin-block-start: var(--zd_size5) ;
   composes:basic;
-  margin-top: var(--zd_size5) ;
 }

package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css

@@ -12,17 +12,12 @@
   font-size: var(--zd_font_size12) ;
   display: inline-block;
   color: var(--zdt_setupdetail_backicon);
+  margin-inline-start: var(--zd_size19) ;
   line-height: 2.5;
   text-align: center;
   border-radius: 50%;
   cursor: pointer;
 }
-[dir=ltr] .backIcon {
-  margin-left: var(--zd_size19) ;
-}
-[dir=rtl] .backIcon {
-  margin-right: var(--zd_size19) ;
-}
 
 .backIcon:hover {
   background-color: var(--zdt_setupdetail_hover_backicon_bg);
@@ -30,16 +25,11 @@
 .title {
   font-size: var(--zd_font_size16) ;
   line-height: 1;
+  padding-inline-end: var(--zd_size12) ;
   font-weight: var(--zd-fw-semibold);
   color: var(--zdt_setupdetail_backicon);
   composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
 }
-[dir=ltr] .title {
-  padding-right: var(--zd_size12) ;
-}
-[dir=rtl] .title {
-  padding-left: var(--zd_size12) ;
-}
 
 .rightPanel {
   composes: justifyFend from '~@zohodesk/components/es/common/common.module.css';
@@ -47,14 +37,14 @@
 .helpInfoCont {
   position: absolute;
   z-index: 10;
+  padding-block: var(--zd_size12) 0 ;
+  padding-inline: 0 var(--zd_size15) ;
 }
 [dir=ltr] .helpInfoCont {
   right: 0 ;
-  padding: var(--zd_size12) var(--zd_size15) 0 0 ;
 }
 [dir=rtl] .helpInfoCont {
   left: 0 ;
-  padding: var(--zd_size12) 0 0 var(--zd_size15) ;
 }
 .helpInfo {
   line-height: 2.3636;
@@ -68,21 +58,16 @@
   text-align: center;
   cursor: pointer;
 }
-[dir=ltr] .mr15 {
-  margin-right: var(--zd_size15) ;
-}
-[dir=rtl] .mr15 {
-  margin-left: var(--zd_size15) ;
+.mr15 {
+  margin-inline-end: var(--zd_size15) ;
 }
 
 .content {
   z-index: 1;
 }
-[dir=ltr] .padding {
-  padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size60) ;
-}
-[dir=rtl] .padding {
-  padding: var(--zd_size10) var(--zd_size60) var(--zd_size10) var(--zd_size25) ;
+.padding {
+  padding-block: var(--zd_size10) ;
+  padding-inline: var(--zd_size60) var(--zd_size25) ;
 }
 .popup {
   z-index: 3;
@@ -110,8 +95,9 @@
 }
 
 .infoHeader {
+  padding-block: var(--zd_size10) var(--zd_size11) ;
+  padding-inline:var(--zd_size20) ;
   color: var(--zdt_setupdetail_infoheader_text);
-  padding: var(--zd_size10) var(--zd_size20) var(--zd_size11) ;
   border-bottom: 1px solid var(--zdt_setupdetail_popup_border);
   background-color: var(--zdt_setupdetail_infoheader_bg);
 }
@@ -127,20 +113,11 @@
 }
 
 .infoText {
+  margin-inline: var(--zd_size8) ;
   composes: dotted from '~@zohodesk/components/es/common/common.module.css';
   font-size: var(--zd_font_size13) ;
 }
 
-[dir=ltr] .infoText {
-  margin-left: var(--zd_size8) ;
-  margin-right: var(--zd_size8) ;
-}
-
-[dir=rtl] .infoText {
-  margin-right: var(--zd_size8) ;
-  margin-left: var(--zd_size8) ;
-}
-
 .infoClose {
   font-size: var(--zd_font_size28) ;
   color: var(--zdt_setupdetail_infoclose);
@@ -148,5 +125,6 @@
 }
 
 .infoFooter {
-  padding: var(--zd_size10) var(--zd_size20) ;
+  padding-block: var(--zd_size10) ;
+  padding-inline:var(--zd_size20) ;
 }

package/es/layout/SubtabLayout/SubtabLayout.module.css

@@ -12,12 +12,8 @@
   background: var(--zdt_subtablayout_tabhead_bg);
 }
 
-[dir=ltr] .left {
-  margin-right: var(--zd_size15) ;
-}
-
-[dir=rtl] .left {
-  margin-left: var(--zd_size15) ;
+.left {
+  margin-inline-end: var(--zd_size15) ;
 }
 
 .plusIconLine {
@@ -85,49 +81,36 @@
   color: var(--zdt_subtablayout_label_text);
 }
 
-.primary, .primary_peek, .secondary, .secondary_peek, .primary_detailFooter, .primary_peekFooter, .secondary_detailFooter, .secondary_peekFooter {
-  padding-top: var(--zd_size27) ;
-  padding-bottom: var(--zd_size26) ;
-}
-
-[dir=ltr] .primary, [dir=ltr] .primary_peek, [dir=ltr] .secondary, [dir=ltr] .secondary_peek, [dir=ltr] .primary_detailFooter, [dir=ltr] .primary_peekFooter, [dir=ltr] .secondary_detailFooter, [dir=ltr] .secondary_peekFooter {
-  padding-left: var(--zd_size25) ;
-}
-
-[dir=rtl] .primary, [dir=rtl] .primary_peek, [dir=rtl] .secondary, [dir=rtl] .secondary_peek, [dir=rtl] .primary_detailFooter, [dir=rtl] .primary_peekFooter, [dir=rtl] .secondary_detailFooter, [dir=rtl] .secondary_peekFooter {
-  padding-right: var(--zd_size25) ;
-}
-
-[dir=ltr] .primary, [dir=ltr] .primary_peek {
-  padding-right: var(--zd_size25) ;
+.primary,
+.primary_peek,
+.secondary,
+.secondary_peek,
+.primary_detailFooter,
+.primary_peekFooter,
+.secondary_detailFooter,
+.secondary_peekFooter {
+  padding-block: var(--zd_size27) var(--zd_size26) ;
+  padding-inline-start: var(--zd_size25) ;
 }
 
-[dir=rtl] .primary, [dir=rtl] .primary_peek {
-  padding-left: var(--zd_size25) ;
+.primary,
+.primary_peek {
+  padding-inline-end: var(--zd_size25) ;
 }
 
-[dir=ltr] .secondary, [dir=ltr] .secondary_peek {
-  padding-right: var(--zd_size115) ;
+.secondary,
+.secondary_peek {
+  padding-inline-end: var(--zd_size115) ;
 }
 
-[dir=rtl] .secondary, [dir=rtl] .secondary_peek {
-  padding-left: var(--zd_size115) ;
+.primary_detailFooter,
+.primary_peekFooter {
+  padding-inline-end: var(--zd_size25) ;
 }
 
-[dir=ltr] .primary_detailFooter, [dir=ltr] .primary_peekFooter {
-  padding-right: var(--zd_size25) ;
-}
-
-[dir=rtl] .primary_detailFooter, [dir=rtl] .primary_peekFooter {
-  padding-left: var(--zd_size25) ;
-}
-
-[dir=ltr] .secondary_detailFooter, [dir=ltr] .secondary_peekFooter {
-  padding-right: var(--zd_size115) ;
-}
-
-[dir=rtl] .secondary_detailFooter, [dir=rtl] .secondary_peekFooter {
-  padding-left: var(--zd_size115) ;
+.secondary_detailFooter,
+.secondary_peekFooter {
+  padding-inline-end: var(--zd_size115) ;
 }
 
 .tertiary,
@@ -135,12 +118,16 @@
   height: var(--zd_size50) ;
 }
 
-.tertiary, .tertiary_detailFooter {
-  padding: 0 var(--zd_size65) ;
+.tertiary,
+.tertiary_detailFooter {
+  padding-block:0 ;
+  padding-inline: var(--zd_size65) ;
 }
 
-.tertiary_peek, .tertiary_peekFooter {
-  padding: 0 var(--zd_size42) ;
+.tertiary_peek,
+.tertiary_peekFooter {
+  padding-block:0 ;
+  padding-inline: var(--zd_size42) ;
 }
 
 .cursor {
@@ -162,4 +149,4 @@
 
 .xlarge {
   height: var(--zd_size50) ;
-}
+}

package/es/list/BluePrintStatus/BluePrintStatus.module.css

@@ -1,9 +1,6 @@
 .container {
+  padding-inline-end: var(--zd_size5) ;
   display: inherit;
-}[dir=ltr] .container {
-  padding-right: var(--zd_size5) ;
-}[dir=rtl] .container {
-  padding-left: var(--zd_size5) ;
 }
 /* .danger {
   color: var(--dot_brightRed);

package/es/list/Comment/Comment.module.css

@@ -6,7 +6,8 @@
   composes: inlineBlockMiddle from '../listCommon.module.css';
   position: relative;
   color: var(--icon_color);
-  padding: 0 var(--zd_size2) ;
+  padding-inline: var(--zd_size2) ;
+  padding-block:0 ;
   cursor: pointer;
 }
 .container:hover {

package/es/list/Dot/Dot.module.css

@@ -8,8 +8,10 @@
   transform: perspective(1px);
 }
 .list {
-  margin: 0 var(--zd_size6) ;
+  margin-inline: var(--zd_size6) ;
+  margin-block:0 ;
 }
 .minimalList {
-  margin: 0 var(--zd_size6) ;
+  margin-inline: var(--zd_size6) ;
+  margin-block:0 ;
 }

package/es/list/GridStencils/GridStencils.module.css

@@ -1,18 +1,16 @@
 .stenLoading {
+  padding-block: var(--zd_size13) var(--zd_size11) ;
+  padding-inline:var(--zd_size15) ;
   position: relative;
+  margin-block-end: var(--zd_size10) ;
   background-color: var(--zdt_gridstencils_default_bg);
   border-bottom: 1px solid var(--zdt_gridstencils_default_border);
-  padding: var(--zd_size13) var(--zd_size15) var(--zd_size11) var(--zd_size15) ;
-  margin-bottom: var(--zd_size10) ;
   border-radius: 5px;
 }
 
-[dir=ltr] .stenLoadbody {
-  margin: var(--zd_size8) var(--zd_size20) var(--zd_size8) 0 ;
-}
-
-[dir=rtl] .stenLoadbody {
-  margin: var(--zd_size8) 0 var(--zd_size8) var(--zd_size20) ;
+.stenLoadbody {
+  margin-block: var(--zd_size8) ;
+  margin-inline:0 var(--zd_size20) ;
 }
 
 .stenLoadbody::after {
@@ -163,4 +161,4 @@
 }
 .leftCont .lineBar3 {
   width: 40% ;
-}
+}

package/es/list/ListLayout/ListLayout.module.css

@@ -21,18 +21,21 @@
 
 /* View */
 .classic .innerContainer {
+  padding-block: var(--zd_size13) ;
+  padding-inline:0 ;
   min-height: var(--zd_size70) ;
-  padding: var(--zd_size13) 0 ;
 }
 
 .compact .innerContainer {
+  padding-block: var(--zd_size5) ;
+  padding-inline:0 ;
   min-height: var(--zd_size41) ;
-  padding: var(--zd_size5) 0 ;
 }
 
 .superCompact .innerContainer {
+  padding-block: var(--zd_size2) ;
+  padding-inline:0 ;
   min-height: var(--zd_size35) ;
-  padding: var(--zd_size2) 0 ;
 }
 
 .compact .innerContainer,
@@ -77,4 +80,4 @@
 
 [dir=rtl] .active {
   border-right-color: var(--zdt_listLayout_active_border);
-}
+}

package/es/list/ListStencils/ListStencils.module.css

@@ -1,7 +1,8 @@
 .container {
   position: relative;
   width: 100% ;
-  padding: 0 var(--zd_size30) ;
+  padding-inline: var(--zd_size30) ;
+  padding-block:0 ;
 }
 .innerContainer {
   composes: dflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
@@ -10,11 +11,8 @@
 .detailsInnerColumn {
   composes: dflex from '~@zohodesk/components/es/common/common.module.css';
 }
-[dir=ltr] .avatar {
-  margin-right: var(--zd_size25) ;
-}
-[dir=rtl] .avatar {
-  margin-left: var(--zd_size25) ;
+.avatar {
+  margin-inline-end: var(--zd_size25) ;
 }
 .detailsColumn {
   min-height: 0 ;
@@ -31,25 +29,26 @@
   flex-basis: 50% ;
 }
 .classic .secondaryRow {
-  margin-top: var(--zd_size10) ;
-}
-[dir=ltr] .compact .secondaryRow, [dir=ltr] .superCompact .secondaryRow {
-  margin-left: var(--zd_size30) ;
+  margin-block-start: var(--zd_size10) ;
 }
-[dir=rtl] .compact .secondaryRow, [dir=rtl] .superCompact .secondaryRow {
-  margin-right: var(--zd_size30) ;
+.compact .secondaryRow,
+.superCompact .secondaryRow {
+  margin-inline-start: var(--zd_size30) ;
 }
 .classic .innerContainer {
+  padding-block: var(--zd_size13) ;
+  padding-inline:0 ;
   height: var(--zd_size70) ;
-  padding: var(--zd_size13) 0 ;
 }
 .compact .innerContainer {
+  padding-block: var(--zd_size5) ;
+  padding-inline:0 ;
   height: var(--zd_size41) ;
-  padding: var(--zd_size5) 0 ;
 }
 .superCompact .innerContainer {
+  padding-block: var(--zd_size2) ;
+  padding-inline:0 ;
   height: var(--zd_size35) ;
-  padding: var(--zd_size2) 0 ;
 }
 .classic .detailsInnerColumn {
   -webkit-box-orient: vertical;

package/es/list/SecondaryText/SecondaryText.module.css

@@ -1,12 +1,9 @@
 .paidUserIcon {
+  margin-inline-end: var(--zd_size5) ;
   vertical-align: middle;
   bottom: var(--zd_size1) ;
   position: relative;
   font-size: var(--zd_font_size8) ;
-}[dir=ltr] .paidUserIcon {
-  margin-right: var(--zd_size5) ;
-}[dir=rtl] .paidUserIcon {
-  margin-left: var(--zd_size5) ;
 }
 
 .icon {
@@ -115,17 +112,11 @@
 
 .happinessImg {
   width: var(--zd_size13) ;
+  margin-block:0 ;
+  margin-inline:0 var(--zd_size4) ;
   vertical-align: middle;
 }
 
-[dir=ltr] .happinessImg {
-  margin: 0 var(--zd_size4) 0 0 ;
-}
-
-[dir=rtl] .happinessImg {
-  margin: 0 0 0 var(--zd_size4) ;
-}
-
 /* colors */
 .gray {
   color: var(--zdt_secondaryText_gray_text);
@@ -153,4 +144,4 @@
 
 .phonetxt {
   composes: ltr-dir from '~@zohodesk/components/es/common/common.module.css';
-}
+}

package/es/list/SentimentStatus/SentimentStatus.module.css

@@ -1,10 +1,8 @@
 .container {
+  margin-inline: var(--zd_size5) 0 ;
+  margin-block:0 ;
   vertical-align: middle;
   font-size: var(--zd_font_size10) ;
-}[dir=ltr] .container {
-  margin: 0 0 0 var(--zd_size5) ;
-}[dir=rtl] .container {
-  margin: 0 var(--zd_size5) 0 0 ;
 }
 
 .sentimentIcon {

package/es/list/TagNew/TagNew.module.css

@@ -3,6 +3,8 @@
   height: var(--zd_size28) ;
   font-size: var(--zd_font_size13) ;
   color: var(--zdt_tagnew_default_text);
+  padding-inline: var(--zd_size15) ;
+  padding-block:0 ;
   composes: inlineFlex from '../listCommon.module.css';
   composes: alignHorizontal from '~@zohodesk/components/es/common/common.module.css';
   transition: all var(--zd_transition2) ease 0s;
@@ -11,7 +13,6 @@
   border-radius: 14px;
   background-color: var(--zdt_tagnew_default_bg);
   box-shadow: var(--zd_bs_tagnew_shadow);
-  padding: 0 var(--zd_size15) ;
   transform: scale(0);
   cursor: pointer;
 }
@@ -114,4 +115,4 @@
     -webkit-transform: scale3d(1, 1, 1);
     transform: scale3d(1, 1, 1);
   }
-}
+}

package/es/list/listCommon.module.css

@@ -7,12 +7,8 @@
   composes: dInflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
 }
 
-[dir=ltr] .avatarMargin {
-  margin-right: var(--zd_size25) ;
-}
-
-[dir=rtl] .avatarMargin {
-  margin-left: var(--zd_size25) ;
+.avatarMargin {
+  margin-inline-end: var(--zd_size25) ;
 }
 
 .subject {
@@ -76,4 +72,4 @@
 .hoveredStyle .superCompact .floatingIconContainer {
   opacity: 1;
   visibility: visible;
-}
+}