@open-condo/ui 1.5.0 → 1.7.0

package/dist/styles.css

@@ -2167,6 +2167,16 @@ a.condo-btn-sm {
 .condo-btn-primary:active::before {
   opacity: 0.9;
 }
+.condo-btn-primary.condo-btn-stateless:focus,
+.condo-btn-primary.condo-btn-stateless:hover,
+.condo-btn-primary.condo-btn-stateless:active {
+  background: #222;
+}
+.condo-btn-primary.condo-btn-stateless:focus::before,
+.condo-btn-primary.condo-btn-stateless:hover::before,
+.condo-btn-primary.condo-btn-stateless:active::before {
+  opacity: 0;
+}
 .condo-btn-primary.condo-btn-dangerous {
   background: #ff3b30;
   transition: background 0.15s ease-in-out;
@@ -2180,6 +2190,11 @@ a.condo-btn-sm {
 .condo-btn-primary.condo-btn-dangerous:active {
   background: #ff3b30;
 }
+.condo-btn-primary.condo-btn-dangerous.condo-btn-stateless:focus,
+.condo-btn-primary.condo-btn-dangerous.condo-btn-stateless:hover,
+.condo-btn-primary.condo-btn-dangerous.condo-btn-stateless:active {
+  background: #ff3b30;
+}
 .condo-btn-primary.condo-btn-dangerous::before {
   opacity: 0;
 }
@@ -2321,6 +2336,29 @@ a.condo-btn-sm {
 .condo-btn-secondary.condo-btn-dangerous:active::before {
   background: #ff3b30 border-box;
 }
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:hover > .condo-btn-icon,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:active > .condo-btn-icon,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:focus > .condo-btn-icon {
+  color: #ff3b30;
+  transition: color 0.15s ease-out;
+}
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:hover > .condo-btn-icon svg,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:active > .condo-btn-icon svg,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:focus > .condo-btn-icon svg {
+  fill: currentcolor;
+}
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:hover > .condo-btn-text,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:active > .condo-btn-text,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:focus > .condo-btn-text {
+  color: #ff3b30;
+  transition: color 0.15s ease-out;
+}
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless::before,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:focus::before,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:hover::before,
+.condo-btn-secondary.condo-btn-dangerous.condo-btn-stateless:active::before {
+  background: #ff3b30 border-box;
+}
 .condo-btn-secondary::before {
   position: absolute;
   top: -1px;
@@ -2354,7 +2392,46 @@ a.condo-btn-sm {
   background: linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
   opacity: 0.9;
 }
-.condo-btn-secondary:disabled,
+.condo-btn-secondary:disabled {
+  background: transparent;
+  border: 1px solid #707695;
+  opacity: 0.5;
+}
+.condo-btn-secondary:disabled > .condo-btn-icon {
+  color: #222;
+  transition: color 0.15s ease-out;
+}
+.condo-btn-secondary:disabled > .condo-btn-icon svg {
+  fill: currentcolor;
+}
+.condo-btn-secondary:disabled > .condo-btn-text {
+  color: #222;
+  transition: color 0.15s ease-out;
+}
+.condo-btn-secondary:disabled > .condo-btn-text::before {
+  opacity: 0;
+}
+.condo-btn-secondary:disabled::before {
+  opacity: 0;
+}
+.condo-btn-secondary.condo-btn-stateless:not(.condo-btn-dangerous) > .condo-btn-icon {
+  color: #222;
+  transition: color 0.15s ease-out;
+}
+.condo-btn-secondary.condo-btn-stateless:not(.condo-btn-dangerous) > .condo-btn-icon svg {
+  fill: currentcolor;
+}
+.condo-btn-secondary.condo-btn-stateless:not(.condo-btn-dangerous):hover {
+  border: 1px solid #707695;
+}
+.condo-btn-secondary.condo-btn-stateless:hover::before,
+.condo-btn-secondary.condo-btn-stateless:active::before {
+  opacity: 0;
+}
+.condo-btn-secondary.condo-btn-stateless:hover > .condo-btn-text::before,
+.condo-btn-secondary.condo-btn-stateless:active > .condo-btn-text::before {
+  opacity: 0;
+}
 .condo-btn-secondary:disabled:hover,
 .condo-btn-secondary:disabled:active,
 .condo-btn-secondary:disabled:focus,
@@ -2366,7 +2443,6 @@ a.condo-btn-sm {
   border: 1px solid #707695;
   opacity: 0.5;
 }
-.condo-btn-secondary:disabled > .condo-btn-icon,
 .condo-btn-secondary:disabled:hover > .condo-btn-icon,
 .condo-btn-secondary:disabled:active > .condo-btn-icon,
 .condo-btn-secondary:disabled:focus > .condo-btn-icon,
@@ -2377,46 +2453,684 @@ a.condo-btn-sm {
   color: #222;
   transition: color 0.15s ease-out;
 }
-.condo-btn-secondary:disabled > .condo-btn-icon svg,
-.condo-btn-secondary:disabled:hover > .condo-btn-icon svg,
-.condo-btn-secondary:disabled:active > .condo-btn-icon svg,
-.condo-btn-secondary:disabled:focus > .condo-btn-icon svg,
-.condo-btn-secondary.condo-btn-dangerous:disabled > .condo-btn-icon svg,
-.condo-btn-secondary.condo-btn-dangerous:disabled:hover > .condo-btn-icon svg,
-.condo-btn-secondary.condo-btn-dangerous:disabled:active > .condo-btn-icon svg,
-.condo-btn-secondary.condo-btn-dangerous:disabled:focus > .condo-btn-icon svg {
-  fill: currentcolor;
+.condo-btn-secondary:disabled:hover > .condo-btn-icon svg,
+.condo-btn-secondary:disabled:active > .condo-btn-icon svg,
+.condo-btn-secondary:disabled:focus > .condo-btn-icon svg,
+.condo-btn-secondary.condo-btn-dangerous:disabled > .condo-btn-icon svg,
+.condo-btn-secondary.condo-btn-dangerous:disabled:hover > .condo-btn-icon svg,
+.condo-btn-secondary.condo-btn-dangerous:disabled:active > .condo-btn-icon svg,
+.condo-btn-secondary.condo-btn-dangerous:disabled:focus > .condo-btn-icon svg {
+  fill: currentcolor;
+}
+.condo-btn-secondary:disabled:hover > .condo-btn-text,
+.condo-btn-secondary:disabled:active > .condo-btn-text,
+.condo-btn-secondary:disabled:focus > .condo-btn-text,
+.condo-btn-secondary.condo-btn-dangerous:disabled > .condo-btn-text,
+.condo-btn-secondary.condo-btn-dangerous:disabled:hover > .condo-btn-text,
+.condo-btn-secondary.condo-btn-dangerous:disabled:active > .condo-btn-text,
+.condo-btn-secondary.condo-btn-dangerous:disabled:focus > .condo-btn-text {
+  color: #222;
+  transition: color 0.15s ease-out;
+}
+.condo-btn-secondary:disabled:hover > .condo-btn-text::before,
+.condo-btn-secondary:disabled:active > .condo-btn-text::before,
+.condo-btn-secondary:disabled:focus > .condo-btn-text::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled > .condo-btn-text::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled:hover > .condo-btn-text::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled:active > .condo-btn-text::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled:focus > .condo-btn-text::before {
+  opacity: 0;
+}
+.condo-btn-secondary:disabled:hover::before,
+.condo-btn-secondary:disabled:active::before,
+.condo-btn-secondary:disabled:focus::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled:hover::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled:active::before,
+.condo-btn-secondary.condo-btn-dangerous:disabled:focus::before {
+  opacity: 0;
+}
+
+.condo-typography {
+  color: #222;
+  word-break: break-word;
+}
+.condo-typography,
+.condo-typography-large {
+  margin: 0;
+  font-weight: 400;
+  font-size: 16px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 24px;
+  letter-spacing: -0.01em;
+}
+.condo-typography-medium {
+  margin: 0;
+  font-weight: 400;
+  font-size: 14px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 22px;
+  letter-spacing: -0.01em;
+}
+.condo-typography-small {
+  margin: 0;
+  font-weight: 400;
+  font-size: 12px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 20px;
+  letter-spacing: -0.01em;
+}
+.condo-typography-secondary {
+  color: #707695;
+}
+.condo-typography-inverted {
+  color: #fff;
+}
+.condo-typography-info {
+  color: #2696f3;
+}
+.condo-typography-success {
+  color: #39ce66;
+}
+.condo-typography-warning {
+  color: #ff9500;
+}
+.condo-typography-danger {
+  color: #ff3b30;
+}
+.condo-typography-disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+.condo-typography u,
+.condo-typography ins {
+  text-decoration: underline;
+  -webkit-text-decoration-skip: ink;
+          text-decoration-skip-ink: auto;
+  text-decoration-thickness: 1px;
+}
+.condo-typography s,
+.condo-typography del {
+  text-decoration: line-through;
+  text-decoration-thickness: 1px;
+}
+.condo-typography strong {
+  font-weight: 600;
+}
+.condo-typography code {
+  box-sizing: border-box;
+  margin: 0 0.2em;
+  padding: 0.25em 0.4em;
+  font-size: 95%;
+  font-family: "Noto Sans Mono", monospace;
+  background: #f2f4f6;
+  border: 1px solid #e1e5ed;
+  border-radius: 4px;
+}
+div.condo-typography:not(:last-of-type),
+.condo-typography p:not(:last-of-type) {
+  margin-bottom: 16px;
+}
+div.condo-typography:not(:last-of-type).condo-typography-medium,
+.condo-typography p:not(:last-of-type).condo-typography-medium {
+  margin-bottom: 14px;
+}
+div.condo-typography:not(:last-of-type).condo-typography-small,
+.condo-typography p:not(:last-of-type).condo-typography-small {
+  margin-bottom: 12px;
+}
+h1.condo-typography,
+div.condo-typography-h1,
+div.condo-typography-h1 > textarea,
+.condo-typography h1 {
+  font-weight: 700;
+  font-size: 38px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 46px;
+  letter-spacing: -0.01em;
+  margin: 0;
+}
+h2.condo-typography,
+div.condo-typography-h2,
+div.condo-typography-h2 > textarea,
+.condo-typography h2 {
+  font-weight: 700;
+  font-size: 24px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 32px;
+  letter-spacing: -0.01em;
+  margin: 0;
+}
+h3.condo-typography,
+div.condo-typography-h3,
+div.condo-typography-h3 > textarea,
+.condo-typography h3 {
+  font-weight: 700;
+  font-size: 20px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 28px;
+  letter-spacing: -0.01em;
+  margin: 0;
+}
+h4.condo-typography,
+div.condo-typography-h4,
+div.condo-typography-h4 > textarea,
+.condo-typography h4 {
+  font-weight: 600;
+  font-size: 16px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 24px;
+  letter-spacing: -0.01em;
+  margin: 0;
+}
+h5.condo-typography,
+div.condo-typography-h5,
+div.condo-typography-h5 > textarea,
+.condo-typography h5 {
+  font-weight: 600;
+  font-size: 14px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 22px;
+  letter-spacing: -0.01em;
+  margin: 0;
+}
+h6.condo-typography,
+div.condo-typography-h6,
+div.condo-typography-h6 > textarea,
+.condo-typography h6 {
+  font-weight: 600;
+  font-size: 12px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 20px;
+  letter-spacing: -0.01em;
+  margin: 0;
+}
+a.condo-typography-ellipsis,
+span.condo-typography-ellipsis {
+  display: inline-block;
+  max-width: 100%;
+}
+a.condo-typography,
+.condo-typography a {
+  color: #222;
+  text-decoration: underline;
+  text-underline-offset: 0.2em;
+  text-decoration-thickness: 1px;
+  -webkit-text-decoration-color: #707695;
+          text-decoration-color: #707695;
+  outline: none;
+  cursor: pointer;
+  transition-duration: 0.15s;
+  transition-property: color, -webkit-text-decoration-color;
+  transition-property: color, text-decoration-color;
+  transition-property: color, text-decoration-color, -webkit-text-decoration-color;
+}
+a.condo-typography.focus-visible,
+.condo-typography a.focus-visible,
+a.condo-typography:hover,
+.condo-typography a:hover {
+  color: #39ce66;
+  -webkit-text-decoration-color: #39ce66;
+          text-decoration-color: #39ce66;
+}
+a.condo-typography:focus-visible,
+.condo-typography a:focus-visible,
+a.condo-typography:hover,
+.condo-typography a:hover {
+  color: #39ce66;
+  -webkit-text-decoration-color: #39ce66;
+          text-decoration-color: #39ce66;
+}
+a.condo-typography:active,
+.condo-typography a:active {
+  color: #39ce66;
+  opacity: 0.8;
+  -webkit-text-decoration-color: #39ce66;
+          text-decoration-color: #39ce66;
+}
+a.condo-typography:not(.condo-typography-large):not(.condo-typography-medium):not(.condo-typography-small),
+.condo-typography a:not(.condo-typography-large):not(.condo-typography-medium):not(.condo-typography-small) {
+  font-size: inherit;
+}
+a.condo-typography[disabled],
+.condo-typography a[disabled],
+a.condo-typography.condo-typography-disabled,
+.condo-typography a.condo-typography-disabled,
+a.condo-typography[disabled].focus-visible,
+.condo-typography a[disabled].focus-visible,
+a.condo-typography.condo-typography-disabled.focus-visible,
+.condo-typography a.condo-typography-disabled.focus-visible,
+a.condo-typography[disabled]:hover,
+.condo-typography a[disabled]:hover,
+a.condo-typography.condo-typography-disabled:hover,
+.condo-typography a.condo-typography-disabled:hover,
+a.condo-typography[disabled]:active,
+.condo-typography a[disabled]:active,
+a.condo-typography.condo-typography-disabled:active,
+.condo-typography a.condo-typography-disabled:active {
+  color: #222;
+  cursor: not-allowed;
+  opacity: 0.5;
+  pointer-events: none;
+}
+a.condo-typography[disabled],
+.condo-typography a[disabled],
+a.condo-typography.condo-typography-disabled,
+.condo-typography a.condo-typography-disabled,
+a.condo-typography[disabled].focus-visible,
+.condo-typography a[disabled].focus-visible,
+a.condo-typography.condo-typography-disabled.focus-visible,
+.condo-typography a.condo-typography-disabled.focus-visible,
+a.condo-typography[disabled]:hover,
+.condo-typography a[disabled]:hover,
+a.condo-typography.condo-typography-disabled:hover,
+.condo-typography a.condo-typography-disabled:hover,
+a.condo-typography[disabled]:active,
+.condo-typography a[disabled]:active,
+a.condo-typography.condo-typography-disabled:active,
+.condo-typography a.condo-typography-disabled:active {
+  color: #222;
+  cursor: not-allowed;
+  opacity: 0.5;
+  pointer-events: none;
+}
+a.condo-typography[disabled],
+.condo-typography a[disabled],
+a.condo-typography.condo-typography-disabled,
+.condo-typography a.condo-typography-disabled,
+a.condo-typography[disabled]:focus-visible,
+.condo-typography a[disabled]:focus-visible,
+a.condo-typography.condo-typography-disabled:focus-visible,
+.condo-typography a.condo-typography-disabled:focus-visible,
+a.condo-typography[disabled]:hover,
+.condo-typography a[disabled]:hover,
+a.condo-typography.condo-typography-disabled:hover,
+.condo-typography a.condo-typography-disabled:hover,
+a.condo-typography[disabled]:active,
+.condo-typography a[disabled]:active,
+a.condo-typography.condo-typography-disabled:active,
+.condo-typography a.condo-typography-disabled:active {
+  color: #222;
+  cursor: not-allowed;
+  opacity: 0.5;
+  pointer-events: none;
+}
+.condo-typography-single-line {
+  white-space: nowrap;
+}
+.condo-typography-ellipsis-single-line {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+a.condo-typography-ellipsis-single-line,
+span.condo-typography-ellipsis-single-line {
+  vertical-align: bottom;
+}
+.condo-typography-ellipsis-multiple-line {
+  /* stylelint-disable-next-line value-no-vendor-prefix */
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-line-clamp: 3;
+  /*! autoprefixer: ignore next */
+  -webkit-box-orient: vertical;
+}
+
+.condo-promo-block {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-start;
+  width: 100%;
+  height: 320px;
+  overflow: hidden;
+  border-radius: 12px;
+  cursor: pointer;
+}
+.condo-promo-block-image-container,
+.condo-promo-block-content-container {
+  box-sizing: border-box;
+  width: 50%;
+  height: 100%;
+}
+.condo-promo-block-content-container {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: space-between;
+  padding: 60px 12px 60px 60px;
+}
+.condo-promo-block-content-container-md,
+.condo-promo-block-content-container-sm {
+  padding: 52px 12px 52px 40px;
+}
+.condo-promo-block-content-container-xs {
+  padding: 40px;
+}
+.condo-promo-block-content-container-xxs {
+  padding: 40px 32px;
+}
+.condo-promo-block-no-image > .condo-promo-block-content-container {
+  width: 100%;
+  padding-right: 60px;
+}
+.condo-promo-block-no-image > .condo-promo-block-content-container-md,
+.condo-promo-block-no-image > .condo-promo-block-content-container-sm {
+  padding-right: 52px;
+}
+.condo-promo-block-text-container > *:not(:last-child) {
+  margin-bottom: 16px;
+}
+.condo-promo-block-image-container > img {
+  width: 100%;
+  height: 100%;
+  -o-object-fit: cover;
+     object-fit: cover;
+  -o-object-position: right center;
+     object-position: right center;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -webkit-user-drag: none;
+}
+
+/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
+/* stylelint-disable no-duplicate-selectors */
+/* stylelint-disable */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+.condo-card {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: rgba(0, 0, 0, 0.85);
+  font-size: 14px;
+  font-variant: tabular-nums;
+  line-height: 1.5715;
+  list-style: none;
+  font-feature-settings: 'tnum', "tnum";
+  position: relative;
+  background: #fff;
+  border-radius: 2px;
+}
+.condo-card-rtl {
+  direction: rtl;
+}
+.condo-card-hoverable {
+  cursor: pointer;
+  transition: box-shadow 0.3s, border-color 0.3s;
+}
+.condo-card-hoverable:hover {
+  border-color: transparent;
+  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
+}
+.condo-card-bordered {
+  border: 1px solid #f0f0f0;
+}
+.condo-card-head {
+  min-height: 48px;
+  margin-bottom: -1px;
+  padding: 0 24px;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: 500;
+  font-size: 16px;
+  background: transparent;
+  border-bottom: 1px solid #f0f0f0;
+  border-radius: 2px 2px 0 0;
+}
+.condo-card-head::before {
+  display: table;
+  content: '';
+}
+.condo-card-head::after {
+  display: table;
+  clear: both;
+  content: '';
+}
+.condo-card-head-wrapper {
+  display: flex;
+  align-items: center;
+}
+.condo-card-head-title {
+  display: inline-block;
+  flex: 1;
+  padding: 16px 0;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.condo-card-head-title > .condo-typography,
+.condo-card-head-title > .condo-typography-edit-content {
+  left: 0;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.condo-card-head .condo-tabs-top {
+  clear: both;
+  margin-bottom: -17px;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: normal;
+  font-size: 14px;
+}
+.condo-card-head .condo-tabs-top-bar {
+  border-bottom: 1px solid #f0f0f0;
+}
+.condo-card-extra {
+  margin-left: auto;
+  padding: 16px 0;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: normal;
+  font-size: 14px;
+}
+.condo-card-rtl .condo-card-extra {
+  margin-right: auto;
+  margin-left: 0;
+}
+.condo-card-body {
+  padding: 24px;
+}
+.condo-card-body::before {
+  display: table;
+  content: '';
+}
+.condo-card-body::after {
+  display: table;
+  clear: both;
+  content: '';
+}
+.condo-card-contain-grid .condo-card-body {
+  display: flex;
+  flex-wrap: wrap;
+}
+.condo-card-contain-grid:not(.condo-card-loading) .condo-card-body {
+  margin: -1px 0 0 -1px;
+  padding: 0;
+}
+.condo-card-grid {
+  width: 33.33%;
+  padding: 24px;
+  border: 0;
+  border-radius: 0;
+  box-shadow: 1px 0 0 0 #f0f0f0, 0 1px 0 0 #f0f0f0, 1px 1px 0 0 #f0f0f0, 1px 0 0 0 #f0f0f0 inset, 0 1px 0 0 #f0f0f0 inset;
+  transition: all 0.3s;
+}
+.condo-card-grid-hoverable:hover {
+  position: relative;
+  z-index: 1;
+  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
+}
+.condo-card-contain-tabs > .condo-card-head .condo-card-head-title {
+  min-height: 32px;
+  padding-bottom: 0;
+}
+.condo-card-contain-tabs > .condo-card-head .condo-card-extra {
+  padding-bottom: 0;
+}
+.condo-card-bordered .condo-card-cover {
+  margin-top: -1px;
+  margin-right: -1px;
+  margin-left: -1px;
+}
+.condo-card-cover > * {
+  display: block;
+  width: 100%;
+}
+.condo-card-cover img {
+  border-radius: 2px 2px 0 0;
+}
+.condo-card-actions {
+  display: flex;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  background: #fff;
+  border-top: 1px solid #f0f0f0;
+}
+.condo-card-actions::before {
+  display: table;
+  content: '';
+}
+.condo-card-actions::after {
+  display: table;
+  clear: both;
+  content: '';
+}
+.condo-card-actions > li {
+  margin: 12px 0;
+  color: rgba(0, 0, 0, 0.45);
+  text-align: center;
+}
+.condo-card-actions > li > span {
+  position: relative;
+  display: block;
+  min-width: 32px;
+  font-size: 14px;
+  line-height: 1.5715;
+  cursor: pointer;
+}
+.condo-card-actions > li > span:hover {
+  color: #1890ff;
+  transition: color 0.3s;
+}
+.condo-card-actions > li > span a:not(.condo-btn),
+.condo-card-actions > li > span > .anticon {
+  display: inline-block;
+  width: 100%;
+  color: rgba(0, 0, 0, 0.45);
+  line-height: 22px;
+  transition: color 0.3s;
+}
+.condo-card-actions > li > span a:not(.condo-btn):hover,
+.condo-card-actions > li > span > .anticon:hover {
+  color: #1890ff;
+}
+.condo-card-actions > li > span > .anticon {
+  font-size: 16px;
+  line-height: 22px;
+}
+.condo-card-actions > li:not(:last-child) {
+  border-right: 1px solid #f0f0f0;
+}
+.condo-card-rtl .condo-card-actions > li:not(:last-child) {
+  border-right: none;
+  border-left: 1px solid #f0f0f0;
+}
+.condo-card-type-inner .condo-card-head {
+  padding: 0 24px;
+  background: #fafafa;
+}
+.condo-card-type-inner .condo-card-head-title {
+  padding: 12px 0;
+  font-size: 14px;
+}
+.condo-card-type-inner .condo-card-body {
+  padding: 16px 24px;
+}
+.condo-card-type-inner .condo-card-extra {
+  padding: 13.5px 0;
+}
+.condo-card-meta {
+  display: flex;
+  margin: -4px 0;
+}
+.condo-card-meta::before {
+  display: table;
+  content: '';
+}
+.condo-card-meta::after {
+  display: table;
+  clear: both;
+  content: '';
+}
+.condo-card-meta-avatar {
+  padding-right: 16px;
+}
+.condo-card-rtl .condo-card-meta-avatar {
+  padding-right: 0;
+  padding-left: 16px;
+}
+.condo-card-meta-detail {
+  overflow: hidden;
+}
+.condo-card-meta-detail > div:not(:last-child) {
+  margin-bottom: 8px;
+}
+.condo-card-meta-title {
+  overflow: hidden;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: 500;
+  font-size: 16px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.condo-card-meta-description {
+  color: rgba(0, 0, 0, 0.45);
+}
+.condo-card-loading {
+  overflow: hidden;
+}
+.condo-card-loading .condo-card-body {
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+.condo-card-small > .condo-card-head {
+  min-height: 36px;
+  padding: 0 12px;
+  font-size: 14px;
+}
+.condo-card-small > .condo-card-head > .condo-card-head-wrapper > .condo-card-head-title {
+  padding: 8px 0;
+}
+.condo-card-small > .condo-card-head > .condo-card-head-wrapper > .condo-card-extra {
+  padding: 8px 0;
+  font-size: 14px;
 }
-.condo-btn-secondary:disabled > .condo-btn-text,
-.condo-btn-secondary:disabled:hover > .condo-btn-text,
-.condo-btn-secondary:disabled:active > .condo-btn-text,
-.condo-btn-secondary:disabled:focus > .condo-btn-text,
-.condo-btn-secondary.condo-btn-dangerous:disabled > .condo-btn-text,
-.condo-btn-secondary.condo-btn-dangerous:disabled:hover > .condo-btn-text,
-.condo-btn-secondary.condo-btn-dangerous:disabled:active > .condo-btn-text,
-.condo-btn-secondary.condo-btn-dangerous:disabled:focus > .condo-btn-text {
-  color: #222;
-  transition: color 0.15s ease-out;
+.condo-card-small > .condo-card-body {
+  padding: 12px;
 }
-.condo-btn-secondary:disabled > .condo-btn-text::before,
-.condo-btn-secondary:disabled:hover > .condo-btn-text::before,
-.condo-btn-secondary:disabled:active > .condo-btn-text::before,
-.condo-btn-secondary:disabled:focus > .condo-btn-text::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled > .condo-btn-text::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled:hover > .condo-btn-text::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled:active > .condo-btn-text::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled:focus > .condo-btn-text::before {
-  opacity: 0;
+.condo-card {
+  border: 1px solid #e1e5ed;
+  border-radius: 12px;
 }
-.condo-btn-secondary:disabled::before,
-.condo-btn-secondary:disabled:hover::before,
-.condo-btn-secondary:disabled:active::before,
-.condo-btn-secondary:disabled:focus::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled:hover::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled:active::before,
-.condo-btn-secondary.condo-btn-dangerous:disabled:focus::before {
-  opacity: 0;
+.condo-card-head {
+  min-height: 0;
+  padding: 24px;
+  border-color: #e1e5ed;
+}
+.condo-card-head-title {
+  padding: 0;
+}
+.condo-card-hoverable {
+  transition-duration: 0.15s, 0.15s;
+  transition-property: box-shadow, border-color;
+}
+.condo-card-hoverable:hover {
+  box-shadow: 0 4px 14px 0 rgba(178,185,217,0.4);
 }
 
 /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
@@ -2775,273 +3489,75 @@ a.condo-btn-sm {
   overflow: hidden;
 }
 
-.condo-typography {
-  color: #222;
-  word-break: break-word;
-}
-.condo-typography,
-.condo-typography-large {
-  margin: 0;
-  font-weight: 400;
-  font-size: 16px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 24px;
-  letter-spacing: -0.01em;
+.condo-markdown h1:not(:first-child),
+.condo-markdown h2:not(:first-child),
+.condo-markdown h3:not(:first-child),
+.condo-markdown h4:not(:first-child),
+.condo-markdown h5:not(:first-child),
+.condo-markdown h6:not(:first-child) {
+  margin: 1.8em 0 0.6em;
 }
-.condo-typography-medium {
-  margin: 0;
-  font-weight: 400;
-  font-size: 14px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 22px;
-  letter-spacing: -0.01em;
+.condo-markdown img {
+  max-width: 100%;
 }
-.condo-typography-small {
-  margin: 0;
-  font-weight: 400;
-  font-size: 12px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 20px;
-  letter-spacing: -0.01em;
+.condo-markdown pre code {
+  display: block;
+  margin: 0 0 16px;
 }
-.condo-typography-secondary {
+.condo-markdown ul,
+.condo-markdown ol {
+  margin-bottom: 1.8em;
+  padding-left: 0.75em;
   color: #707695;
+  list-style-position: inside;
 }
-.condo-typography-inverted {
-  color: #fff;
-}
-.condo-typography-info {
-  color: #2696f3;
-}
-.condo-typography-success {
-  color: #39ce66;
-}
-.condo-typography-warning {
-  color: #ff9500;
-}
-.condo-typography-danger {
-  color: #ff3b30;
-}
-.condo-typography-disabled {
-  cursor: not-allowed;
-  opacity: 0.5;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
-}
-.condo-typography u,
-.condo-typography ins {
-  text-decoration: underline;
-  -webkit-text-decoration-skip: ink;
-          text-decoration-skip-ink: auto;
-  text-decoration-thickness: 1px;
-}
-.condo-typography s,
-.condo-typography del {
-  text-decoration: line-through;
-  text-decoration-thickness: 1px;
-}
-.condo-typography strong {
-  font-weight: 600;
-}
-.condo-typography code {
-  box-sizing: border-box;
-  margin: 0 0.2em;
-  padding: 0.25em 0.4em;
-  font-size: 95%;
-  font-family: "Noto Sans Mono", monospace;
-  background: #f2f4f6;
-  border: 1px solid #e1e5ed;
-  border-radius: 4px;
-}
-div.condo-typography:not(:last-of-type),
-.condo-typography p:not(:last-of-type) {
-  margin-bottom: 16px;
-}
-div.condo-typography:not(:last-of-type).condo-typography-medium,
-.condo-typography p:not(:last-of-type).condo-typography-medium {
-  margin-bottom: 14px;
-}
-div.condo-typography:not(:last-of-type).condo-typography-small,
-.condo-typography p:not(:last-of-type).condo-typography-small {
-  margin-bottom: 12px;
-}
-h1.condo-typography,
-div.condo-typography-h1,
-div.condo-typography-h1 > textarea,
-.condo-typography h1 {
-  font-weight: 700;
-  font-size: 38px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 46px;
-  letter-spacing: -0.01em;
-  margin: 0;
-}
-h2.condo-typography,
-div.condo-typography-h2,
-div.condo-typography-h2 > textarea,
-.condo-typography h2 {
-  font-weight: 700;
-  font-size: 24px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 32px;
-  letter-spacing: -0.01em;
-  margin: 0;
-}
-h3.condo-typography,
-div.condo-typography-h3,
-div.condo-typography-h3 > textarea,
-.condo-typography h3 {
-  font-weight: 700;
-  font-size: 20px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 28px;
-  letter-spacing: -0.01em;
-  margin: 0;
-}
-h4.condo-typography,
-div.condo-typography-h4,
-div.condo-typography-h4 > textarea,
-.condo-typography h4 {
-  font-weight: 600;
-  font-size: 16px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 24px;
-  letter-spacing: -0.01em;
-  margin: 0;
-}
-h5.condo-typography,
-div.condo-typography-h5,
-div.condo-typography-h5 > textarea,
-.condo-typography h5 {
-  font-weight: 600;
-  font-size: 14px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 22px;
-  letter-spacing: -0.01em;
-  margin: 0;
-}
-h6.condo-typography,
-div.condo-typography-h6,
-div.condo-typography-h6 > textarea,
-.condo-typography h6 {
-  font-weight: 600;
-  font-size: 12px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 20px;
-  letter-spacing: -0.01em;
-  margin: 0;
-}
-a.condo-typography-ellipsis,
-span.condo-typography-ellipsis {
-  display: inline-block;
-  max-width: 100%;
-}
-a.condo-typography,
-.condo-typography a {
-  color: #222;
-  text-decoration: underline;
-  text-underline-offset: 0.2em;
-  text-decoration-thickness: 1px;
-  -webkit-text-decoration-color: #707695;
-          text-decoration-color: #707695;
-  outline: none;
-  cursor: pointer;
-  transition-duration: 0.15s;
-  transition-property: color, -webkit-text-decoration-color;
-  transition-property: color, text-decoration-color;
-  transition-property: color, text-decoration-color, -webkit-text-decoration-color;
+.condo-markdown ul.contains-task-list,
+.condo-markdown ol.contains-task-list {
+  padding-left: 0;
 }
-a.condo-typography.focus-visible,
-.condo-typography a.focus-visible,
-a.condo-typography:hover,
-.condo-typography a:hover {
-  color: #39ce66;
-  -webkit-text-decoration-color: #39ce66;
-          text-decoration-color: #39ce66;
+.condo-markdown ul.contains-task-list > li,
+.condo-markdown ol.contains-task-list > li {
+  list-style-type: none;
 }
-a.condo-typography:focus-visible,
-.condo-typography a:focus-visible,
-a.condo-typography:hover,
-.condo-typography a:hover {
-  color: #39ce66;
-  -webkit-text-decoration-color: #39ce66;
-          text-decoration-color: #39ce66;
+.condo-markdown ul ul,
+.condo-markdown ol ul,
+.condo-markdown ul ol,
+.condo-markdown ol ol {
+  padding-left: 20px;
 }
-a.condo-typography:active,
-.condo-typography a:active {
-  color: #39ce66;
-  opacity: 0.8;
-  -webkit-text-decoration-color: #39ce66;
-          text-decoration-color: #39ce66;
+.condo-markdown ul > li:not(:last-child),
+.condo-markdown ol > li:not(:last-child),
+.condo-markdown ul > li ul:not(:last-child),
+.condo-markdown ol > li ul:not(:last-child),
+.condo-markdown ul > li ol:not(:last-child),
+.condo-markdown ol > li ol:not(:last-child) {
+  margin-bottom: 0.5em;
 }
-a.condo-typography:not(.condo-typography-large):not(.condo-typography-medium):not(.condo-typography-small),
-.condo-typography a:not(.condo-typography-large):not(.condo-typography-medium):not(.condo-typography-small) {
-  font-size: inherit;
+.condo-markdown ul > li ul:first-child,
+.condo-markdown ol > li ul:first-child,
+.condo-markdown ul > li ol:first-child,
+.condo-markdown ol > li ol:first-child {
+  margin-top: 0.5em;
 }
-a.condo-typography[disabled],
-.condo-typography a[disabled],
-a.condo-typography.condo-typography-disabled,
-.condo-typography a.condo-typography-disabled,
-a.condo-typography[disabled].focus-visible,
-.condo-typography a[disabled].focus-visible,
-a.condo-typography.condo-typography-disabled.focus-visible,
-.condo-typography a.condo-typography-disabled.focus-visible,
-a.condo-typography[disabled]:hover,
-.condo-typography a[disabled]:hover,
-a.condo-typography.condo-typography-disabled:hover,
-.condo-typography a.condo-typography-disabled:hover,
-a.condo-typography[disabled]:active,
-.condo-typography a[disabled]:active,
-a.condo-typography.condo-typography-disabled:active,
-.condo-typography a.condo-typography-disabled:active {
-  color: #222;
-  cursor: not-allowed;
-  opacity: 0.5;
-  pointer-events: none;
+.condo-markdown ul li::marker,
+.condo-markdown ol li::marker {
+  margin: 0;
+  font-weight: 400;
+  font-size: 16px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 24px;
+  letter-spacing: -0.01em;
 }
-a.condo-typography[disabled],
-.condo-typography a[disabled],
-a.condo-typography.condo-typography-disabled,
-.condo-typography a.condo-typography-disabled,
-a.condo-typography[disabled].focus-visible,
-.condo-typography a[disabled].focus-visible,
-a.condo-typography.condo-typography-disabled.focus-visible,
-.condo-typography a.condo-typography-disabled.focus-visible,
-a.condo-typography[disabled]:hover,
-.condo-typography a[disabled]:hover,
-a.condo-typography.condo-typography-disabled:hover,
-.condo-typography a.condo-typography-disabled:hover,
-a.condo-typography[disabled]:active,
-.condo-typography a[disabled]:active,
-a.condo-typography.condo-typography-disabled:active,
-.condo-typography a.condo-typography-disabled:active {
-  color: #222;
-  cursor: not-allowed;
-  opacity: 0.5;
-  pointer-events: none;
+.condo-markdown blockquote {
+  margin: 1em 0;
+  padding-left: 1em;
+  border-left: 0.25em solid #d0d3e5;
 }
-a.condo-typography[disabled],
-.condo-typography a[disabled],
-a.condo-typography.condo-typography-disabled,
-.condo-typography a.condo-typography-disabled,
-a.condo-typography[disabled]:focus-visible,
-.condo-typography a[disabled]:focus-visible,
-a.condo-typography.condo-typography-disabled:focus-visible,
-.condo-typography a.condo-typography-disabled:focus-visible,
-a.condo-typography[disabled]:hover,
-.condo-typography a[disabled]:hover,
-a.condo-typography.condo-typography-disabled:hover,
-.condo-typography a.condo-typography-disabled:hover,
-a.condo-typography[disabled]:active,
-.condo-typography a[disabled]:active,
-a.condo-typography.condo-typography-disabled:active,
-.condo-typography a.condo-typography-disabled:active {
-  color: #222;
-  cursor: not-allowed;
-  opacity: 0.5;
-  pointer-events: none;
+.condo-markdown blockquote > .condo-typography {
+  padding: 0.5em 0;
+}
+.condo-markdown blockquote > blockquote:not(:first-child) {
+  margin-top: 0.5em;
 }
 
 /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
@@ -3360,74 +3876,262 @@ a.condo-typography.condo-typography-disabled:active,
   margin-left: 0;
 }
 
-.condo-markdown h1:not(:first-child),
-.condo-markdown h2:not(:first-child),
-.condo-markdown h3:not(:first-child),
-.condo-markdown h4:not(:first-child),
-.condo-markdown h5:not(:first-child),
-.condo-markdown h6:not(:first-child) {
-  margin: 1.8em 0 0.6em;
+/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
+/* stylelint-disable no-duplicate-selectors */
+/* stylelint-disable */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+.condo-tag {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: rgba(0, 0, 0, 0.85);
+  font-size: 14px;
+  font-variant: tabular-nums;
+  line-height: 1.5715;
+  list-style: none;
+  font-feature-settings: 'tnum', "tnum";
+  display: inline-block;
+  height: auto;
+  margin-right: 8px;
+  padding: 0 7px;
+  font-size: 12px;
+  line-height: 20px;
+  white-space: nowrap;
+  background: #fafafa;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  opacity: 1;
+  transition: all 0.3s;
 }
-.condo-markdown img {
-  max-width: 100%;
+.condo-tag,
+.condo-tag a,
+.condo-tag a:hover {
+  color: rgba(0, 0, 0, 0.85);
 }
-.condo-markdown pre code {
-  display: block;
-  margin: 0 0 16px;
+.condo-tag > a:first-child:last-child {
+  display: inline-block;
+  margin: 0 -8px;
+  padding: 0 8px;
 }
-.condo-markdown ul,
-.condo-markdown ol {
-  margin-bottom: 1.8em;
-  padding-left: 0.75em;
-  color: #707695;
-  list-style-position: inside;
+.condo-tag-close-icon {
+  margin-left: 3px;
+  color: rgba(0, 0, 0, 0.45);
+  font-size: 10px;
+  cursor: pointer;
+  transition: all 0.3s;
 }
-.condo-markdown ul.contains-task-list,
-.condo-markdown ol.contains-task-list {
-  padding-left: 0;
+.condo-tag-close-icon:hover {
+  color: rgba(0, 0, 0, 0.85);
 }
-.condo-markdown ul.contains-task-list > li,
-.condo-markdown ol.contains-task-list > li {
-  list-style-type: none;
+.condo-tag-has-color {
+  border-color: transparent;
 }
-.condo-markdown ul ul,
-.condo-markdown ol ul,
-.condo-markdown ul ol,
-.condo-markdown ol ol {
-  padding-left: 20px;
+.condo-tag-has-color,
+.condo-tag-has-color a,
+.condo-tag-has-color a:hover,
+.condo-tag-has-color .anticon-close,
+.condo-tag-has-color .anticon-close:hover {
+  color: #fff;
 }
-.condo-markdown ul > li:not(:last-child),
-.condo-markdown ol > li:not(:last-child),
-.condo-markdown ul > li ul:not(:last-child),
-.condo-markdown ol > li ul:not(:last-child),
-.condo-markdown ul > li ol:not(:last-child),
-.condo-markdown ol > li ol:not(:last-child) {
-  margin-bottom: 0.5em;
+.condo-tag-checkable {
+  background-color: transparent;
+  border-color: transparent;
+  cursor: pointer;
 }
-.condo-markdown ul > li ul:first-child,
-.condo-markdown ol > li ul:first-child,
-.condo-markdown ul > li ol:first-child,
-.condo-markdown ol > li ol:first-child {
-  margin-top: 0.5em;
+.condo-tag-checkable:not(.condo-tag-checkable-checked):hover {
+  color: #1890ff;
 }
-.condo-markdown ul li::marker,
-.condo-markdown ol li::marker {
-  margin: 0;
-  font-weight: 400;
-  font-size: 16px;
-  font-family: "Open Sans", sans-serif;
-  line-height: 24px;
-  letter-spacing: -0.01em;
+.condo-tag-checkable:active,
+.condo-tag-checkable-checked {
+  color: #fff;
 }
-.condo-markdown blockquote {
-  margin: 1em 0;
-  padding-left: 1em;
-  border-left: 0.25em solid #d0d3e5;
+.condo-tag-checkable-checked {
+  background-color: #1890ff;
 }
-.condo-markdown blockquote > .condo-typography {
-  padding: 0.5em 0;
+.condo-tag-checkable:active {
+  background-color: #096dd9;
 }
-.condo-markdown blockquote > blockquote:not(:first-child) {
-  margin-top: 0.5em;
+.condo-tag-hidden {
+  display: none;
+}
+.condo-tag-pink {
+  color: #c41d7f;
+  background: #fff0f6;
+  border-color: #ffadd2;
+}
+.condo-tag-pink-inverse {
+  color: #fff;
+  background: #eb2f96;
+  border-color: #eb2f96;
+}
+.condo-tag-magenta {
+  color: #c41d7f;
+  background: #fff0f6;
+  border-color: #ffadd2;
+}
+.condo-tag-magenta-inverse {
+  color: #fff;
+  background: #eb2f96;
+  border-color: #eb2f96;
+}
+.condo-tag-red {
+  color: #cf1322;
+  background: #fff1f0;
+  border-color: #ffa39e;
+}
+.condo-tag-red-inverse {
+  color: #fff;
+  background: #f5222d;
+  border-color: #f5222d;
+}
+.condo-tag-volcano {
+  color: #d4380d;
+  background: #fff2e8;
+  border-color: #ffbb96;
+}
+.condo-tag-volcano-inverse {
+  color: #fff;
+  background: #fa541c;
+  border-color: #fa541c;
+}
+.condo-tag-orange {
+  color: #d46b08;
+  background: #fff7e6;
+  border-color: #ffd591;
+}
+.condo-tag-orange-inverse {
+  color: #fff;
+  background: #fa8c16;
+  border-color: #fa8c16;
+}
+.condo-tag-yellow {
+  color: #d4b106;
+  background: #feffe6;
+  border-color: #fffb8f;
+}
+.condo-tag-yellow-inverse {
+  color: #fff;
+  background: #fadb14;
+  border-color: #fadb14;
+}
+.condo-tag-gold {
+  color: #d48806;
+  background: #fffbe6;
+  border-color: #ffe58f;
+}
+.condo-tag-gold-inverse {
+  color: #fff;
+  background: #faad14;
+  border-color: #faad14;
+}
+.condo-tag-cyan {
+  color: #08979c;
+  background: #e6fffb;
+  border-color: #87e8de;
+}
+.condo-tag-cyan-inverse {
+  color: #fff;
+  background: #13c2c2;
+  border-color: #13c2c2;
+}
+.condo-tag-lime {
+  color: #7cb305;
+  background: #fcffe6;
+  border-color: #eaff8f;
+}
+.condo-tag-lime-inverse {
+  color: #fff;
+  background: #a0d911;
+  border-color: #a0d911;
+}
+.condo-tag-green {
+  color: #389e0d;
+  background: #f6ffed;
+  border-color: #b7eb8f;
+}
+.condo-tag-green-inverse {
+  color: #fff;
+  background: #52c41a;
+  border-color: #52c41a;
+}
+.condo-tag-blue {
+  color: #096dd9;
+  background: #e6f7ff;
+  border-color: #91d5ff;
+}
+.condo-tag-blue-inverse {
+  color: #fff;
+  background: #1890ff;
+  border-color: #1890ff;
+}
+.condo-tag-geekblue {
+  color: #1d39c4;
+  background: #f0f5ff;
+  border-color: #adc6ff;
+}
+.condo-tag-geekblue-inverse {
+  color: #fff;
+  background: #2f54eb;
+  border-color: #2f54eb;
+}
+.condo-tag-purple {
+  color: #531dab;
+  background: #f9f0ff;
+  border-color: #d3adf7;
+}
+.condo-tag-purple-inverse {
+  color: #fff;
+  background: #722ed1;
+  border-color: #722ed1;
+}
+.condo-tag-success {
+  color: #52c41a;
+  background: #f6ffed;
+  border-color: #b7eb8f;
+}
+.condo-tag-processing {
+  color: #1890ff;
+  background: #e6f7ff;
+  border-color: #91d5ff;
+}
+.condo-tag-error {
+  color: #ff4d4f;
+  background: #fff2f0;
+  border-color: #ffccc7;
+}
+.condo-tag-warning {
+  color: #faad14;
+  background: #fffbe6;
+  border-color: #ffe58f;
+}
+.condo-tag > .anticon + span,
+.condo-tag > span + .anticon {
+  margin-left: 7px;
+}
+.condo-tag.condo-tag-rtl {
+  margin-right: 0;
+  margin-left: 8px;
+  direction: rtl;
+  text-align: right;
+}
+.condo-tag-rtl .condo-tag-close-icon {
+  margin-right: 3px;
+  margin-left: 0;
+}
+.condo-tag-rtl.condo-tag > .anticon + span,
+.condo-tag-rtl.condo-tag > span + .anticon {
+  margin-right: 7px;
+  margin-left: 0;
+}
+.condo-tag {
+  font-weight: 600;
+  font-size: 12px;
+  font-family: "Open Sans", sans-serif;
+  line-height: 20px;
+  letter-spacing: -0.01em;
+  margin: 0;
+  padding: 0.17em 0.83em;
+  border: none;
+  border-radius: 12px;
 }