@zohodesk/dot/es/version2/notification/DesktopNotification/DesktopNotification.module.css

In this Library, we Provide Some Basic Components to Build Your Application

.parentElement {
  position: relative;
  margin-bottom: var(--zd_size7) ;
}

.container {
  color: var(--zdt_desktopnotification_text);
  transition: all var(--zd_transition4);
  position: relative;
  max-height: 100% ;
  pointer-events: auto;
  background-color: var(--zdt_desktopnotification_bg);
  box-shadow: var(--zd_bs_desktopnotification_container);
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
}

[dir=ltr] .container {
  transform-origin: right center;
}

[dir=rtl] .container {
  transform-origin: left center;
}

.globalNotify {
  max-width: var(--zd_size490) ;
  min-width: var(--zd_size394) ;
}

/* Size */

.medium {
  width: var(--zd_size452) ;
}

.large {
  width: var(--zd_size580) ;
}
.tapWidth{
  max-width: 100% ;
  min-width: 100% ;
}

/* Animation Style */
.closeAnimation {
  max-height: 0 ;
  transition: all var(--zd_transition3) 0.4s;
  margin-bottom: 0 ;
}

.animation {
  composes: modeForward from '~@zohodesk/components/lib/common/animation.module.css';
}

[dir=ltr] .animation {
  animation-duration: var(--zd_transition4);
  -webkit-animation-duration: var(--zd_transition4);
}

[dir=rtl] .animation {
  animation-duration: var(--zd_transition4);
  -webkit-animation-duration: var(--zd_transition4);
}

.leftanimate {
  composes: slideLeft from '~@zohodesk/components/lib/common/animation.module.css';
  composes: animation;
}

.leftnoanimate {
  opacity: 1;
  transform: translateX(0) scale(1);
}

.rightanimate {
  composes: slideRight from '~@zohodesk/components/lib/common/animation.module.css';
  composes: animation;
  composes: closeAnimation;
}

/* Container Style */
.message {
  position: relative;
  color: var(--zdt_desktopnotification_message_text);
  font-size: var(--zd_font_size11) ;
  composes: dotted textCap from '~@zohodesk/components/lib/common/common.module.css';
  height: var(--zd_size33) ;
  transition: padding var(--zd_transition3), height var(--zd_transition3);
  border-top: 1px solid var(--zdt_desktopnotification_message_border);
  cursor: pointer;
}
[dir=ltr] .message {
  padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76) ;
}
[dir=rtl] .message {
  padding: var(--zd_size10) var(--zd_size76) var(--zd_size10) var(--zd_size20) ;
}

.message:hover {
  background: var(--zdt_desktopnotification_message_hover_bg);
}

/* Section */
.section {
  padding: var(--zd_size15) var(--zd_size30) var(--zd_size30) ;
}


.subTitle {
  font-size: var(--zd_font_size15) ;
  line-height: 1.3333;
  font-family: var(--zd_semibold);
  composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
}

.subTitleMargin {
  margin-bottom: var(--zd_size17) ;
}

.infoText {
  font-size: var(--zd_font_size14) ;
  line-height: 1.43;
  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
}

.secondaryInfo {
  margin-top: var(--zd_size20) ;
}

.footer {
  overflow: hidden;
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
}