@zohodesk/components 1.0.0-temp-196 → 1.0.0-temp-197

package/es/Button/css/Button.module.css

@@ -25,6 +25,7 @@
   /* button success status default variable */
   --button_success_border_color: var(--zdt_button_success_default_border);
 }
+
 .native {
   composes: varClass;
   /* transition: all var(--zd_transition2) ease 0s; */
@@ -111,14 +112,14 @@
 .smallBtnprimaryfilled,
 .mediumBtnprimary,
 .mediumBtnprimaryfilled {
-  --button_box_shadow: var(--zd_bs_button_primary);
+  --button_box_shadow: var(--zd_bs_contrast_outline, 0 3px 10px var(--zdt_button_primary_box_shadow));
 }
 
 .smallBtndanger,
 .smallBtndangerfilled,
 .mediumBtndanger,
 .mediumBtndangerfilled {
-  --button_box_shadow: var(--zd_bs_button_danger);
+  --button_box_shadow: var(--zd_bs_contrast_outline, 0 3px 10px var(--zdt_button_danger_box_shadow));
 }
 
 .small,
@@ -136,6 +137,7 @@
   --button_min_width: initial;
   --button_bg_color: var(--zdt_button_default_bg);
 }
+
 .plainprimary:hover {
   --button_text_color: var(--zdt_button_plainprimary_hover_text);
 }
@@ -146,6 +148,7 @@
   --button_min_width: initial;
   --button_bg_color: var(--zdt_button_default_bg);
 }
+
 .plainsecondary:hover {
   --button_text_color: var(--zdt_button_secondary_hover_text);
 }
@@ -160,6 +163,7 @@
 .tertiaryfilled {
   --button_border_width: 1px;
 }
+
 .primary:hover {
   --button_border_color: var(--zdt_button_primary_hover_border);
   --button_text_color: var(--zdt_button_primary_hover_text);
@@ -170,6 +174,7 @@
   --button_bg_color: var(--zdt_button_primaryfill_bg);
   --button_text_color: var(--zdt_button_primaryfill_text);
 }
+
 .primaryfilled:hover {
   --button_bg_color: var(--zdt_button_primaryfill_hover_bg);
 }
@@ -179,6 +184,7 @@
   --button_bg_color: var(--zdt_button_default_bg);
   --button_text_color: var(--zdt_button_danger_text);
 }
+
 .danger:hover {
   --button_border_color: var(--zdt_button_danger_hover_border);
   --button_text_color: var(--zdt_button_danger_hover_text);
@@ -189,6 +195,7 @@
   --button_bg_color: var(--zdt_button_dangerfill_bg);
   --button_text_color: var(--zdt_button_dangerfill_text);
 }
+
 .dangerfilled:hover {
   --button_bg_color: var(--zdt_button_dangerfill_hover_bg);
 }
@@ -198,6 +205,7 @@
   --button_bg_color: var(--zdt_button_default_bg);
   --button_text_color: var(--zdt_button_secondary_text);
 }
+
 .secondary:hover {
   --button_border_color: var(--zdt_button_secondary_hover_border);
   --button_text_color: var(--zdt_button_secondary_hover_text);
@@ -208,6 +216,7 @@
   --button_bg_color: var(--zdt_button_secondaryfill_bg);
   --button_text_color: var(--zdt_button_secondary_text);
 }
+
 .secondaryfilled:hover {
   --button_text_color: var(--zdt_button_secondary_hover_text);
 }
@@ -217,6 +226,7 @@
   --button_bg_color: var(--zdt_button_successfill_bg);
   --button_text_color: var(--zdt_button_dangerfill_text);
 }
+
 .successfilled:hover {
   --button_border_color: var(--zdt_button_successfill_hover_border);
   --button_bg_color: var(--zdt_button_successfill_hover_bg);
@@ -227,6 +237,7 @@
   --button_bg_color: var(--zdt_button_tertiaryfill_bg);
   --button_text_color: var(--zdt_button_dangerfill_text);
 }
+
 .tertiaryfilled:hover {
   --button_bg_color: var(--zdt_button_tertiaryfill_hover_bg);
 }
@@ -326,18 +337,23 @@
 .loadingelement {
   --button_loading_bg_color: var(--zdt_button_primaryfill_bg);
 }
+
 .primaryelement {
   --button_loading_bg_color: var(--zdt_button_loading_default_bg);
 }
+
 .primaryfilledelement {
   --button_loading_bg_color: var(--zdt_button_primaryfill_bg);
 }
+
 .dangerelement {
   --button_loading_bg_color: var(--zdt_button_loading_default_bg);
 }
+
 .dangerfilledelement {
   --button_loading_bg_color: var(--zdt_button_dangerfill_bg);
 }
+
 .loadingelement:after,
 .primaryelement:after,
 .primaryfilledelement:after,
@@ -366,13 +382,13 @@
 
 .primaryelement:before {
   --button_loading_bg_color: var(--zdt_button_primaryfill_bg);
-  --zdt_button_loading_linear_gradient:var(--zdt_button_loading_primary_linear_gradient);
+  --zdt_button_loading_linear_gradient: var(--zdt_button_loading_primary_linear_gradient);
   transform: rotateX(180deg);
 }
 
 .dangerelement:before {
   --button_loading_bg_color: var(--zdt_button_dangerfill_bg);
-  --zdt_button_loading_linear_gradient:var(--zdt_button_loading_danger_linear_gradient);
+  --zdt_button_loading_linear_gradient: var(--zdt_button_loading_danger_linear_gradient);
   transform: rotateX(180deg);
 }
 
@@ -523,6 +539,6 @@
   }
 }
 
-.loader{
-  color:var(--dot_mirror)
+.loader {
+  color: var(--dot_mirror)
 }

package/es/Buttongroup/Buttongroup.module.css

@@ -20,7 +20,7 @@
 }
 
 .footer {
-  --buttongroup_box_shadow: var(--zd_bs_buttongroup_footer);
+  --buttongroup_box_shadow: var(--zd_bs_contrast_outline, 0 -4px 5px -3px var(--zdt_buttongroup_footer_box_shadow));
 }
 
 [dir=ltr] .footer {

package/es/DateTime/DateTime.module.css

@@ -122,7 +122,8 @@
   color: var(--zdt_datetime_invalid_text);
 }
 
-.invalidDate.sunday,.inActiveDate.sunday:hover {
+.invalidDate.sunday,
+.inActiveDate.sunday:hover {
   color: var(--zdt_datetime_invaliddate_text);
 }
 
@@ -147,15 +148,17 @@
   background-color: var(--zdt_datetime_selected_bg);
   border-radius: 50%;
 }
-.inActiveDate{
-color: var(--zdt_datetime_invalid_text);
-cursor: no-drop;
+
+.inActiveDate {
+  color: var(--zdt_datetime_invalid_text);
+  cursor: no-drop;
 }
-.inActiveDate:hover
-{
+
+.inActiveDate:hover {
   color: var(--zdt_datetime_invalid_text);
 }
-.inActiveDate:hover, .inActiveDate.sunday:hover{
+
+.inActiveDate:hover, .inActiveDate.sunday:hover {
   background-color: var(--zdt_datetime_inactivedate_hover_bg);
 
 }
@@ -244,6 +247,6 @@ cursor: no-drop;
 .dropBox {
   width: 100% ;
   border-radius: 3px;
-  box-shadow: var(--zd_bs_dropbox_bottom);
+  box-shadow: var(--zd_bs_contrast_outline, 0 3px 30px var(--zdt_dropbox_default_box_shadow));
   background-color: var(--zdt_dropbox_default_bg);
 }

package/es/DropBox/DropBoxElement/css/DropBoxElement.module.css

@@ -74,23 +74,23 @@
 
 /* shadow */
 .top_shadow {
-    --dropbox_box_shadow: var(--zd_bs_dropbox_top);
+    --dropbox_box_shadow: var(--zd_bs_contrast_outline, 0 -3px 30px var(--zdt_dropbox_default_box_shadow));
 }
 
 .left_shadow {
-    --dropbox_box_shadow: var(--zd_bs_dropbox_left);
+    --dropbox_box_shadow: var(--zd_bs_contrast_outline, -4px 0 30px var(--zdt_dropbox_default_box_shadow));
 }
 
 .right_shadow {
-    --dropbox_box_shadow: var(--zd_bs_dropbox_right);
+    --dropbox_box_shadow: var(--zd_bs_contrast_outline, 4px 0 30px var(--zdt_dropbox_default_box_shadow));
 }
 
 .bottom_shadow {
-    --dropbox_box_shadow: var(--zd_bs_dropbox_bottom);
+    --dropbox_box_shadow: var(--zd_bs_contrast_outline, 0 3px 30px var(--zdt_dropbox_default_box_shadow));
 }
 
 .defaultShadow {
-    box-shadow: var(--zd_bs_dropbox_default);
+    box-shadow: var(--zd_bs_contrast_outline, 4px 3px 30px var(--zdt_dropbox_default_box_shadow));
 }
 
 /* box direction styles */
@@ -206,7 +206,7 @@
 .arrowShape {
     height: var(--zd_size10) ;
     width: var(--zd_size10) ;
-    box-shadow: 1px -1px 2px 0 var(--dropbox_arrow_box_shadow_color);
+    box-shadow: var(--zd_bs_contrast_outline, 1px -1px 2px 0 var(--dropbox_arrow_box_shadow_color));
     background-color: var(--dropbox_bg_color);
     -webkit-transform: rotateZ(-45deg);
     transform: rotateZ(-45deg);
@@ -342,17 +342,21 @@
     composes: animationBasic;
     composes: fadeIn modeForward from '../../../common/animation.module.css';
 }
+
 .scaleIn {
     composes: animationBasic;
     composes: scaleIn from '../../../common/animation.module.css';
 }
+
 .bounce {
     composes: animationBasic;
 }
+
 [dir=ltr] .bounce {
     animation-name: animation;
     animation-timing-function: cubic-bezier(0.4, 1, 0.65, 1.1);
 }
+
 [dir=rtl] .bounce {
     animation-name: animation;
     animation-timing-function: cubic-bezier(0.4, 1, 0.65, 1.1);
@@ -414,7 +418,7 @@
 }
 
 .closeBar {
-  /*  Variable:Ignore  */
+    /*  Variable:Ignore  */
     height: 6px;
     width: 20% ;
     border-radius: 5px;

package/es/DropBox/css/DropBox.module.css

@@ -3,7 +3,7 @@
   --dropbox_bg_color: var(--zdt_dropbox_default_bg);
   --dropbox_border_radius: 0;
   --dropbox_padding: 0;
-  --dropbox_box_shadow: var(--zd_bs_dropbox_bottom);
+  --dropbox_box_shadow: var(--zd_bs_contrast_outline, 0 3px 30px var(--zdt_dropbox_default_box_shadow));
 
   /* dropbox arrow default variables */
   --dropbox_arrow_box_shadow_color: var(--zdt_dropbox_arrow_shadow);