@trove-ui/react/lib/index.css

A React component library for T Design UI

:root {
  --color-white: #fff;
  --color-black: #000;
  --box-shadow-s: 0 0 0;
  --color-primary-50: #e9ebf9;
  --color-primary-100: #d7daf4;
  --color-primary-200: #b9bfe9;
  --color-primary-300: #9299d8;
  --color-primary-400: #737dc0;
  --color-primary-500: #6a73c4;
  --color-primary-600: #656dc8;
  --color-primary-700: #51569f;
  --color-primary-800: #424782;
  --color-primary-900: #373b6d;
  --color-primary-950: #222442;
  --color-success-50: #e5f6f2;
  --color-success-100: #d1ede7;
  --color-success-200: #aee0d3;
  --color-success-300: #7acbb5;
  --color-success-400: #47b697;
  --color-success-500: #26a680;
  --color-success-600: #0e7e62;
  --color-success-700: #0b654f;
  --color-success-800: #095341;
  --color-success-900: #074536;
  --color-success-950: #042a20;
  --color-warning-50: #f6f2eb;
  --color-warning-100: #ede5d8;
  --color-warning-200: #dbc7a8;
  --color-warning-300: #bd9d69;
  --color-warning-400: #a77e3e;
  --color-warning-500: #99702b;
  --color-warning-600: #936623;
  --color-warning-700: #76521d;
  --color-warning-800: #614317;
  --color-warning-900: #513813;
  --color-warning-950: #31220c;
  --color-danger-50: #fbebef;
  --color-danger-100: #f6d3db;
  --color-danger-200: #ed9ca9;
  --color-danger-300: #e2576b;
  --color-danger-400: #d93347;
  --color-danger-500: #d12539;
  --color-danger-600: #c4404f;
  --color-danger-700: #9c323f;
  --color-danger-800: #802933;
  --color-danger-900: #6a222a;
  --color-danger-950: #401419;
  --color-info-50: #f6f6f7;
  --color-info-100: #ededee;
  --color-info-200: #d8d9db;
  --color-info-300: #bcbcc0;
  --color-info-400: #9e9fa5;
  --color-info-500: #878990;
  --color-info-600: #6d6f74;
  --color-info-700: #57595e;
  --color-info-800: #47484c;
  --color-info-900: #3b3c40;
  --color-info-950: #242426;
}

body {
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  line-height: calc(1em + 8px);
}

h1 {
  font-size: 48px;
  font-weight: 800;
}

h2 {
  font-size: 36px;
  font-weight: 700;
}

h3 {
  font-size: 24px;
  font-weight: 600;
}

h4 {
  font-size: 18px;
  font-weight: 600;
}

h5 {
  font-size: 16px;
  font-weight: normal;
}

h6 {
  font-size: 14px;
  font-weight: normal;
}

.w-full {
  width: 100%;
}

.h-full {
  height: 100%;
}

.flex {
  display: flex;
}

.justify-center, .flex-center {
  justify-content: center;
}

.items-center, .flex-center {
  align-items: center;
}

.flex-row {
  flex-direction: row;
}

.flex-column {
  flex-direction: column;
}

.cursor-pointer:hover {
  cursor: pointer;
}