cronapp-framework-js/css/themes/custom/theme-general/modal.css

Javascript library for CronApp's projects

.modal .modal-content .list-group-item {
  border: 0;
  padding: 10px 0;
}

.modal .modal-content .list-group-item {
  border: 0;
  padding: 10px 0;
}

.modal .modal-content .k-textbox {
  width: 100%;
}

.modal .modal-content .list-group {
  display: contents;
}

#modalBodyConfirmDialog {
  text-align: center;
}

#modalBodyConfirmDialog .subtitle,
#modalBodyConfirmDialog .title {
  color: var(--textColor40, #393939);
  white-space: pre-wrap
}

#modalBodyConfirmDialog .title {
  font-size: var(--textExtraBigSize, 18px);
  font-weight: bold;
  line-height: 1;
}

#modalBodyConfirmDialog .subtitle {
  margin: 10px 0px;
  font-size: var(--textNormalSize, 14px);
  font-weight: 300;
  line-height: 1.3;
}

.k-dialog .k-content {
  border-radius: 0px;
}

.k-dialog.k-dialog-titleless .k-content {
  padding-bottom: 8px;
}

.k-window {
  background: var(--backgroundColor40, #f1f1f1);
  border: var(--backgroundColor50, #dfdfdf);
}

.k-dialog .k-dialog-buttongroup.k-dialog-button-layout-normal {
  border-radius: 0;
  justify-content: center;
  border: 0;
}

.k-dialog-buttongroup .k-button {
  background: transparent;
  color: var(--textColor40, #393939);
  box-shadow: none;
}

.k-dialog-buttongroup .k-button:focus,
.k-dialog-buttongroup .k-button:hover {
  background: var(--backgroundColor50, #d3d3d3);
  color: var(--textColor40, #393939);
}

.k-dialog-buttongroup .k-button:focus span,
.k-dialog-buttongroup .k-button:hover span,
.k-dialog-buttongroup .k-button:focus i,
.k-dialog-buttongroup .k-button:hover i {
  color: var(--textColor40, #393939);
}

.k-dialog .k-dialog-titlebar .k-dialog-title {
  font-size: large;
}

/* modal mobile */
.k-dialog-button-layout-stretched .k-primary:not(:hover):not(.k-state-hover):not(:active):not(.k-state-active) {
  color: var(--colorPrimary40, #5665be);
}

.k-dialog-button-layout-stretched .k-button.k-primary.k-state-focused,
.k-dialog-button-layout-stretched .k-button.k-primary:focus {
  box-shadow: inset 0 0 0 2px var(--colorPrimary10, #d8daeb);
}

.k-dialog .k-dialog-titlebar:before {
  content: "\e403";
  font-family: "WebComponentsIcons";
  margin-right: 5px;
  font-size: large;
}

.k-dialog[data-dialog-type="error"] .k-dialog-titlebar,
.k-dialog[data-dialog-type="error"] .k-dialog-title,
.k-dialog[data-dialog-type="error"] .k-dialog-titlebar:before {
  background-color: var(--colorDanger40, #ce3a36);
  color: var(--textColorDanger40, #ffffff);
}

.k-dialog[data-dialog-type="success"] .k-dialog-titlebar,
.k-dialog[data-dialog-type="success"] .k-dialog-title,
.k-dialog[data-dialog-type="success"] .k-dialog-titlebar:before {
  background-color: var(--colorSuccess40, #257d25);
  color: var(--textColorSuccess40, #ffffff);
}

.k-dialog[data-dialog-type="warning"] .k-dialog-titlebar,
.k-dialog[data-dialog-type="warning"] .k-dialog-title,
.k-dialog[data-dialog-type="warning"] .k-dialog-titlebar:before {
  background-color: var(--colorWarning40, #f0ad4e);
  color: var(--textColorWarning40, #ffffff);
}

.k-dialog[data-dialog-type="info"] .k-dialog-titlebar,
.k-dialog[data-dialog-type="info"] .k-dialog-title,
.k-dialog[data-dialog-type="info"] .k-dialog-titlebar:before {
  background-color: var(--colorCalm40, #11c1f3);
  color: var(--textColorCalm40, #ffffff);
}

.k-window-titlebar {
  background-clip: padding-box;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding: 12px 16px;
  border-width: 0 0 1px;
  border-style: solid;
  white-space: nowrap;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -ms-flex-align: center;
  align-items: center;
}