@zohodesk/dot 1.0.0-temp-151 → 1.0.0-temp-153

package/lib/Message/Message.module.css

@@ -1,103 +1,103 @@
-.message {
-  position: absolute;
-  top: 0;
-  z-index: 1000;
-  /*Hook for editor alert*/
-  pointer-events: none;
-  text-align: center;
-}[dir=ltr] .message {
-  right: 0;
-  left: 0;
-}[dir=rtl] .message {
-  left: 0;
-  right: 0;
-}
-
-.container {
-  position: relative;
-  display: inline-block;
-  pointer-events: initial;
-  box-shadow: var(--zd_bs_message_container);
-  border-radius: 0 0 5px 5px;
-  background: var(--zdt_message_default_bg);
-}
-
-[dir=ltr] .container {
-  padding: var(--zd_size13) var(--zd_size10) var(--zd_size13) var(--zd_size50);
-}
-
-[dir=rtl] .container {
-  padding: var(--zd_size13) var(--zd_size50) var(--zd_size13) var(--zd_size10);
-}
-
-.text {
-  max-width: var(--zd_size480);
-  display: inline-block;
-  word-break: break-word;
-  font-size: var(--zd_font_size14);
-  vertical-align: middle;
-}
-
-[dir=ltr] .text {
-  text-align: left;
-}
-
-[dir=rtl] .text {
-  text-align: right;
-}
-
-.icon {
-  position: absolute;
-  top: 0;
-  width: var(--zd_size40);
-  display: inline-block;
-  height: 100%;
-}
-
-[dir=ltr] .icon {
-  left: 0;
-  border-bottom-left-radius: 5px;
-}
-
-[dir=rtl] .icon {
-  right: 0;
-  border-bottom-right-radius: 5px;
-}
-
-.success {
-  composes: icon;
-  background: var(--zdt_message_success_bg);
-}
-
-.alert {
-  composes: icon;
-  background: var(--zdt_message_alert_bg);
-}
-
-.info {
-  composes: icon;
-  background: var(--zdt_message_info_bg);
-}
-
-.tickIcn {
-  color: var(--zdt_message_tickicon);
-  font-size: var(--zd_font_size16);
-  position: absolute;
-  composes: middleBoth from '~@zohodesk/components/lib/common/common.module.css';
-}
-
-.close {
-  color: var(--zdt_message_close_text);
-  font-size: var(--zd_font_size16);
-  display: inline-block;
-  vertical-align: middle;
-  cursor: pointer;
-}
-
-[dir=ltr] .close {
-  margin-left: var(--zd_size10);
-}
-
-[dir=rtl] .close {
-  margin-right: var(--zd_size10);
+.message {
+  position: absolute;
+  top: 0;
+  z-index: 1000;
+  /*Hook for editor alert*/
+  pointer-events: none;
+  text-align: center;
+}[dir=ltr] .message {
+  right: 0;
+  left: 0;
+}[dir=rtl] .message {
+  left: 0;
+  right: 0;
+}
+
+.container {
+  position: relative;
+  display: inline-block;
+  pointer-events: initial;
+  box-shadow: var(--zd_bs_message_container);
+  border-radius: 0 0 5px 5px;
+  background: var(--zdt_message_default_bg);
+}
+
+[dir=ltr] .container {
+  padding: 13px 10px 13px 50px;
+}
+
+[dir=rtl] .container {
+  padding: 13px 50px 13px 10px;
+}
+
+.text {
+  max-width: 480px;
+  display: inline-block;
+  word-break: break-word;
+  font-size: 14px;
+  vertical-align: middle;
+}
+
+[dir=ltr] .text {
+  text-align: left;
+}
+
+[dir=rtl] .text {
+  text-align: right;
+}
+
+.icon {
+  position: absolute;
+  top: 0;
+  width: 40px;
+  display: inline-block;
+  height: 100%;
+}
+
+[dir=ltr] .icon {
+  left: 0;
+  border-bottom-left-radius: 5px;
+}
+
+[dir=rtl] .icon {
+  right: 0;
+  border-bottom-right-radius: 5px;
+}
+
+.success {
+  composes: icon;
+  background: var(--zdt_message_success_bg);
+}
+
+.alert {
+  composes: icon;
+  background: var(--zdt_message_alert_bg);
+}
+
+.info {
+  composes: icon;
+  background: var(--zdt_message_info_bg);
+}
+
+.tickIcn {
+  color: var(--zdt_message_tickicon);
+  font-size: 16px;
+  position: absolute;
+  composes: middleBoth from '~@zohodesk/components/lib/common/common.module.css';
+}
+
+.close {
+  color: var(--zdt_message_close_text);
+  font-size: 16px;
+  display: inline-block;
+  vertical-align: middle;
+  cursor: pointer;
+}
+
+[dir=ltr] .close {
+  margin-left: 10px;
+}
+
+[dir=rtl] .close {
+  margin-right: 10px;
 }

package/lib/MessageBanner/MessageBanner.module.css

@@ -1,46 +1,46 @@
-.type_secondary {
-  max-width: var(--zd_size468);
-  border-radius: 3px;
-  margin: 0 auto;
-}
-.message {
-  color: var(--zdt_messagebanner_text);
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
-  padding: var(--zd_size10) 0;
-}
-[dir=ltr] .message {
-  margin-left: var(--zd_size10);
-}
-[dir=rtl] .message {
-  margin-right: var(--zd_size10);
-}
-.link {
-  color: var(--zdt_messagebanner_link_text);
-}
-[dir=ltr] .link {
-  margin-left: var(--zd_size5);
-}
-[dir=rtl] .link {
-  margin-right: var(--zd_size5);
-}
-.message,.link{font-size:  var(--zd_font_size14);}
-.close {
-  color: var(--zdt_messagebanner_close_text);
-  cursor: pointer;
-}
-.type_primary .close:hover {
-  background: var(--zdt_messagebanner_close_hover_bg);
-}
-.close:hover {
-  color: var(--zdt_messagebanner_close_hover_text);
-}
-
-.palette_default {
-  background: var(--zdt_messagebanner_default_bg);
-}
-.palette_blue {
-  background: var(--zdt_messagebanner_blue_bg);
-}
-.palette_white {
-  background: var(--zdt_messagebanner_white_text);
-}
+.type_secondary {
+  max-width: 468px;
+  border-radius: 3px;
+  margin: 0 auto;
+}
+.message {
+  color: var(--zdt_messagebanner_text);
+  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  padding: 10px 0;
+}
+[dir=ltr] .message {
+  margin-left: 10px;
+}
+[dir=rtl] .message {
+  margin-right: 10px;
+}
+.link {
+  color: var(--zdt_messagebanner_link_text);
+}
+[dir=ltr] .link {
+  margin-left: 5px;
+}
+[dir=rtl] .link {
+  margin-right: 5px;
+}
+.message,.link{font-size:  14px;}
+.close {
+  color: var(--zdt_messagebanner_close_text);
+  cursor: pointer;
+}
+.type_primary .close:hover {
+  background: var(--zdt_messagebanner_close_hover_bg);
+}
+.close:hover {
+  color: var(--zdt_messagebanner_close_hover_text);
+}
+
+.palette_default {
+  background: var(--zdt_messagebanner_default_bg);
+}
+.palette_blue {
+  background: var(--zdt_messagebanner_blue_bg);
+}
+.palette_white {
+  background: var(--zdt_messagebanner_white_text);
+}

package/lib/NewStar/NewStar.module.css

@@ -1,175 +1,183 @@
-.star {
-  position: absolute;
-  height: var(--zd_size20);
-  width: var(--zd_size21);
-}
-.topLeft {
-  top: 0;
-}
-[dir=ltr] .topLeft {
-  transform: translate(-45%, -45%);
-  left: 0;
-}
-[dir=rtl] .topLeft {
-  transform: translate(45%, -45%);
-  right: 0;
-}
-.topRight {
-  top: 0;
-}
-[dir=ltr] .topRight {
-  transform: translate(45%, -45%);
-  right: 0;
-}
-[dir=rtl] .topRight {
-  transform: translate(-45%, -45%);
-  left: 0;
-}
-.bottomLeft {
-  bottom: 0;
-}
-[dir=ltr] .bottomLeft {
-  transform: translate(-45%, 45%);
-  left: 0;
-}
-[dir=rtl] .bottomLeft {
-  transform: translate(45%, 45%);
-  right: 0;
-}
-.bottomRight {
-  bottom: 0;
-}
-[dir=ltr] .bottomRight {
-  transform: translate(45%, 45%);
-  right: 0;
-}
-[dir=rtl] .bottomRight {
-  transform: translate(-45%, 45%);
-  left: 0;
-}
-
-.stars {
-  position: absolute;
-}
-
-[dir=ltr] .stars {
-  animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
-}
-
-[dir=rtl] .stars {
-  animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
-}
-.green::before {
-  color: var(--zdt_newstar_green_text);
-}
-.yellow::before {
-  color: var(--zdt_newstar_yellow_text);
-}
-.blue::before {
-  color: var(--zdt_newstar_blue_text);
-}
-.starOne {
-  composes: stars;
-}
-.starTwo {
-  composes: stars;
-}
-[dir=ltr] .starTwo {
-  animation-delay: 0.5s;
-}
-[dir=rtl] .starTwo {
-  animation-delay: 0.5s;
-}
-.starThree {
-  composes: stars;
-}
-[dir=ltr] .starThree {
-  animation-delay: 1s;
-}
-[dir=rtl] .starThree {
-  animation-delay: 1s;
-}
-
-.topLeft .starOne{top:0}
-
-[dir=ltr] .topLeft .starOne{
-  left:0}
-
-[dir=rtl] .topLeft .starOne{right:0}
-.topLeft .starTwo{top:0}
-[dir=ltr] .topLeft .starTwo{
-  left:10px}
-[dir=rtl] .topLeft .starTwo{right:10px}
-.topLeft .starThree{top:10px}
-[dir=ltr] .topLeft .starThree{
-  left:0}
-[dir=rtl] .topLeft .starThree{right:0}
-
-.topRight .starOne{top:0}
-
-[dir=ltr] .topRight .starOne{
-  right:0}
-
-[dir=rtl] .topRight .starOne{left:0}
-.topRight .starTwo{top:0}
-[dir=ltr] .topRight .starTwo{
-  right:10px}
-[dir=rtl] .topRight .starTwo{left:10px}
-.topRight .starThree{top:10px}
-[dir=ltr] .topRight .starThree{
-  right:0}
-[dir=rtl] .topRight .starThree{left:0}
-
-.bottomLeft .starOne{bottom:0}
-
-[dir=ltr] .bottomLeft .starOne{
-  left:0}
-
-[dir=rtl] .bottomLeft .starOne{right:0}
-.bottomLeft .starTwo{bottom:0}
-[dir=ltr] .bottomLeft .starTwo{
-  left:10px}
-[dir=rtl] .bottomLeft .starTwo{right:10px}
-.bottomLeft .starThree{bottom:10px}
-[dir=ltr] .bottomLeft .starThree{
-  left:0}
-[dir=rtl] .bottomLeft .starThree{right:0}
-
-.bottomRight .starOne{bottom:0}
-
-[dir=ltr] .bottomRight .starOne{
-  right:0}
-
-[dir=rtl] .bottomRight .starOne{left:0}
-.bottomRight .starTwo{bottom:0}
-[dir=ltr] .bottomRight .starTwo{
-  right:10px}
-[dir=rtl] .bottomRight .starTwo{left:10px}
-.bottomRight .starThree{bottom:10px}
-[dir=ltr] .bottomRight .starThree{
-  right:0}
-[dir=rtl] .bottomRight .starThree{left:0}
-
-@keyframes twinkle {
-  0% {
-    opacity: 0.5;
-  }
-  50% {
-    opacity: 1;
-  }
-  100% {
-    opacity: 0.6;
-  }
-}
-
-@keyframes star-scale {
-  0% {
-    transform: perspective(1px) scale(0.7);
-  }
-  50% {
-    transform: perspective(1px) scale(1, 1);
-  }
-  100% {
-    transform: perspective(1px) scale(0.7);
-  }
-}
+.star {
+  position: absolute;
+  height: 20px;
+  width: 21px;
+}
+.topLeft {
+  top: 0;
+}
+[dir=ltr] .topLeft {
+  transform: translate(-45%, -45%);
+  left: 0;
+}
+[dir=rtl] .topLeft {
+  transform: translate(45%, -45%);
+  right: 0;
+}
+.topRight {
+  top: 0;
+}
+[dir=ltr] .topRight {
+  transform: translate(45%, -45%);
+  right: 0;
+}
+[dir=rtl] .topRight {
+  transform: translate(-45%, -45%);
+  left: 0;
+}
+.bottomLeft {
+  bottom: 0;
+}
+[dir=ltr] .bottomLeft {
+  transform: translate(-45%, 45%);
+  left: 0;
+}
+[dir=rtl] .bottomLeft {
+  transform: translate(45%, 45%);
+  right: 0;
+}
+.bottomRight {
+  bottom: 0;
+}
+[dir=ltr] .bottomRight {
+  transform: translate(45%, 45%);
+  right: 0;
+}
+[dir=rtl] .bottomRight {
+  transform: translate(-45%, 45%);
+  left: 0;
+}
+
+.stars {
+  position: absolute;
+}
+
+[dir=ltr] .stars {
+  animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
+}
+
+[dir=rtl] .stars {
+  animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
+}
+.green::before {
+  color: var(--zdt_newstar_green_text);
+}
+.yellow::before {
+  color: var(--zdt_newstar_yellow_text);
+}
+.blue::before {
+  color: var(--zdt_newstar_blue_text);
+}
+.starOne {
+  composes: stars;
+}
+.starTwo {
+  composes: stars;
+}
+[dir=ltr] .starTwo {
+  animation-delay: 0.5s;
+}
+[dir=rtl] .starTwo {
+  animation-delay: 0.5s;
+}
+.starThree {
+  composes: stars;
+}
+[dir=ltr] .starThree {
+  animation-delay: 1s;
+}
+[dir=rtl] .starThree {
+  animation-delay: 1s;
+}
+
+.topLeft .starOne{top:0}
+
+[dir=ltr] .topLeft .starOne{
+  left:0}
+
+[dir=rtl] .topLeft .starOne{right:0}
+.topLeft .starTwo{top:0
+  /*  Variable:Ignore  */}
+[dir=ltr] .topLeft .starTwo{
+  left:10px}
+[dir=rtl] .topLeft .starTwo{right:10px}
+.topLeft .starThree{
+  /*  Variable:Ignore  */top:10px}
+[dir=ltr] .topLeft .starThree{
+  left:0}
+[dir=rtl] .topLeft .starThree{right:0}
+
+.topRight .starOne{top:0}
+
+[dir=ltr] .topRight .starOne{
+  right:0}
+
+[dir=rtl] .topRight .starOne{left:0}
+.topRight .starTwo{top:0
+  /*  Variable:Ignore  */}
+[dir=ltr] .topRight .starTwo{
+  right:10px}
+[dir=rtl] .topRight .starTwo{left:10px}
+.topRight .starThree{
+  /*  Variable:Ignore  */top:10px}
+[dir=ltr] .topRight .starThree{
+  right:0}
+[dir=rtl] .topRight .starThree{left:0}
+
+.bottomLeft .starOne{bottom:0}
+
+[dir=ltr] .bottomLeft .starOne{
+  left:0}
+
+[dir=rtl] .bottomLeft .starOne{right:0}
+.bottomLeft .starTwo{bottom:0
+  /*  Variable:Ignore  */}
+[dir=ltr] .bottomLeft .starTwo{
+  left:10px}
+[dir=rtl] .bottomLeft .starTwo{right:10px}
+.bottomLeft .starThree{
+  /*  Variable:Ignore  */bottom:10px}
+[dir=ltr] .bottomLeft .starThree{
+  left:0}
+[dir=rtl] .bottomLeft .starThree{right:0}
+
+.bottomRight .starOne{bottom:0}
+
+[dir=ltr] .bottomRight .starOne{
+  right:0}
+
+[dir=rtl] .bottomRight .starOne{left:0}
+.bottomRight .starTwo{bottom:0
+  /*  Variable:Ignore  */}
+[dir=ltr] .bottomRight .starTwo{
+  right:10px}
+[dir=rtl] .bottomRight .starTwo{left:10px}
+.bottomRight .starThree{
+  /*  Variable:Ignore  */bottom:10px}
+[dir=ltr] .bottomRight .starThree{
+  right:0}
+[dir=rtl] .bottomRight .starThree{left:0}
+
+@keyframes twinkle {
+  0% {
+    opacity: 0.5;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0.6;
+  }
+}
+
+@keyframes star-scale {
+  0% {
+    transform: perspective(1px) scale(0.7);
+  }
+  50% {
+    transform: perspective(1px) scale(1, 1);
+  }
+  100% {
+    transform: perspective(1px) scale(0.7);
+  }
+}