@zohodesk/components 1.0.0-temp-120 → 1.0.0-temp-122

package/lib/Tooltip/Tooltip.module.css

@@ -1,109 +1,134 @@
-.tooltiptext {
-  position: fixed;
-  z-index: 9999999; /*Hook for editor alert*/
-  pointer-events: none;
-  box-shadow: 0 4px 12px 0 var(--zdt_tooltip_default_box_shadow);
-  border-radius: var(--zd_size4);
-}[dir=ltr] .tooltiptext {
-  animation: tooltip-grow var(--zd_transition7) cubic-bezier(0.175, 0.885, 0.32, 1.15);
-}[dir=rtl] .tooltiptext {
-  animation: tooltip-grow var(--zd_transition7) cubic-bezier(0.175, 0.885, 0.32, 1.15);
-}
-.tooltipcont {
-  color: var(--zdt_tooltip_default_text);
-  font-size: var(--zd_font_size13);
-  font-family: var(--zd_semibold);
-  word-break: break-word;
-  max-width: 420px;
-  line-height: var(--zd_size20);
-  min-height: var(--zd_size24);
-  overflow: hidden;
-  background-color: var(--zdt_tooltip_default_bg);
-  padding: 0 var(--zd_size10);
-  border-style: solid;
-  border-color: transparent;
-  border-radius: var(--zd_size4);
-}
-.tooltipWrapCont {
-  white-space: pre-wrap;
-}
-.tooltipNormalCont {
-  white-space: normal;
-}
-.tooltiparrow {
-  content: '';
-  position: absolute;
-  top: 0;
-  border-top-left-radius: 3px;
-}
-.arrowUp,
-.arrowDown {
-  width: 11px;
-  height: 11px;
-  border-top: solid 6px var(--zdt_tooltip_default_bg);
-  border-left: solid 6px var(--zdt_tooltip_default_bg);
-  border-right: solid 6px transparent;
-  border-bottom: solid 6px transparent;
-}
-.arrowDown {
-  margin-top: -4px !important; /* put important because of '.wms-mainui *' have margin: 0; */
-}
-.arrowLeft,
-.arrowRight {
-  width: 11px;
-  height: 11px;
-  border-top: solid 6px var(--zdt_tooltip_default_bg);
-  border-left: solid 6px var(--zdt_tooltip_default_bg);
-  border-right: solid 6px transparent;
-  border-bottom: solid 6px transparent;
-}
-.arrowRight {
-  margin-left: -2px;
-}
-.arrowLeft {
-  margin-left: 1px;
-}
-.arrowUp {
-  transform: rotate(45deg);
-}
-.arrowDown {
-  transform: rotate(225deg);
-}
-.arrowLeft {
-  transform: rotate(315deg) translateY(-50%);
-}
-.arrowRight {
-  transform: rotate(135deg) translateY(50%);
-}
-@keyframes tooltip-grow {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-@-webkit-keyframes tooltip-grow {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-@-moz-keyframes tooltip-grow {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-@-ms-keyframes tooltip-grow {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
+.tooltiptext {
+  position: fixed;
+  z-index: 9999999;
+  /*Hook for editor alert*/
+  pointer-events: none;
+  box-shadow: var(--bs_tooltip_shadow);
+  border-radius: var(--zd_size4);
+}[dir=ltr] .tooltiptext {
+  animation: tooltip-grow var(--zd_transition7) cubic-bezier(0.175, 0.885, 0.32, 1.15);
+}[dir=rtl] .tooltiptext {
+  animation: tooltip-grow var(--zd_transition7) cubic-bezier(0.175, 0.885, 0.32, 1.15);
+}
+
+.tooltipcont {
+  color: var(--zdt_tooltip_default_text);
+  font-size: var(--zd_font_size13);
+  font-family: var(--zd_semibold);
+  word-break: break-word;
+  max-width: 420px;
+  line-height: var(--zd_size20);
+  min-height: var(--zd_size24);
+  overflow: hidden;
+  background-color: var(--zdt_tooltip_default_bg);
+  padding: 0 var(--zd_size10);
+  border-style: solid;
+  border-color: transparent;
+  border-radius: var(--zd_size4);
+}
+
+.tooltipWrapCont {
+  white-space: pre-wrap;
+}
+
+.tooltipNormalCont {
+  white-space: normal;
+}
+.tooltiparrow {
+  content: '';
+  position: absolute;
+  top: 0;
+  border-top-left-radius: 3px;
+}
+
+.arrowUp,
+.arrowDown {
+  width: 11px;
+  height: 11px;
+  border-top: solid 6px var(--zdt_tooltip_default_bg);
+  border-left: solid 6px var(--zdt_tooltip_default_bg);
+  border-right: solid 6px transparent;
+  border-bottom: solid 6px transparent;
+  box-shadow: var(--bs_tooltip_shadow);
+  z-index: -1;
+}
+
+.arrowDown {
+  margin-top: -4px !important;
+  /* put important because of '.wms-mainui *' have margin: 0; */
+}
+
+.arrowLeft,
+.arrowRight {
+  width: 11px;
+  height: 11px;
+  border-top: solid 6px var(--zdt_tooltip_default_bg);
+  border-left: solid 6px var(--zdt_tooltip_default_bg);
+  border-right: solid 6px transparent;
+  border-bottom: solid 6px transparent;
+  box-shadow: var(--bs_tooltip_shadow);
+  z-index: -1;
+}
+
+.arrowRight {
+  margin-left: -2px;
+}
+
+.arrowLeft {
+  margin-left: 1px;
+}
+
+.arrowUp {
+  transform: rotate(45deg);
+}
+
+.arrowDown {
+  transform: rotate(225deg);
+}
+
+.arrowLeft {
+  transform: rotate(315deg) translateY(-50%);
+}
+
+.arrowRight {
+  transform: rotate(135deg) translateY(50%);
+}
+@keyframes tooltip-grow {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@-webkit-keyframes tooltip-grow {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@-moz-keyframes tooltip-grow {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@-ms-keyframes tooltip-grow {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}

package/lib/common/a11y.module.css

@@ -1,4 +1,4 @@
-:root {  
-    --lib_a11y_focusScope_focus_border:var(--zdt_a11y_focusScope_focus_border);
-    --lib_a11y_focusScope_focus_bg:var(--zdt_listitem_highlight_bg);
+:root {
+    --lib_a11y_focusScope_focus_border: var(--zdt_a11y_focusScope_focus_border);
+    --lib_a11y_focusScope_focus_bg: var(--zdt_listitem_highlight_bg);
 }