app.scss 2.94 KB
Newer Older
hucy's avatar
hucy committed
1 2 3 4 5 6 7 8 9 10
a:link {
  color: $primary;
} /* 未访问的链接 */
a:visited {
  color: $primary;
} /* 已访问的链接 */
a:hover {
  opacity: 0.8;
} /* 鼠标移动到链接上 */

hucy's avatar
hucy committed
11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50
// 布局
.center {
  display: flex;
  justify-content: center;
  align-items: center;
}
.container-height {
  height: calc(100vh - 50px);
}

// 颜色
// 播放
.text-play {
  color: #6cc4a1;
}
.bg-play {
  background: #6cc4a1;
}
// 暂停
.text-pause {
  color: #df7861;
}
.bg-pause {
  background: #df7861;
}
// 导航栏激活颜色
.text-headeractive {
  color: $primary-3;
}
.bg-headeractive {
  background: $primary-3;
}

// tooltip样式
.com-tooltip-sty {
  border: 1px solid rgba(9, 30, 66, 0.13);
  color: $gray-light-text;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
}
hucy's avatar
hucy committed
51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76

.table-view {
  position: relative;
  table {
    position: relative;
    margin: 0 auto;
    text-align: center;
    background-color: #fafafa;
    border: 1px solid #dadada;
    border-collapse: collapse; /*表格的边框合并,如果相邻,则共用一个边框*/
    border-spacing: 0; /*设置行与单元格边框的间距。当表格边框独立(即border-collapse:separate;)此属性才起作用*/
    td {
      padding: 4px;
      border: 1px solid #dadada;
      height: 30px;
      min-height: 30px;
      min-width: 100px;
    }
    th {
      padding: 4px;
      border: 1px solid #dadada;
      height: 30px;
      min-height: 30px;
    }
  }
}
hcyhuchaoyue's avatar
hcyhuchaoyue committed
77

hucy's avatar
hucy committed
78
// Ag Grid
hcyhuchaoyue's avatar
hcyhuchaoyue committed
79
.ag-theme-alpine {
hcyhuchaoyue's avatar
hcyhuchaoyue committed
80 81 82
  // 选中的复选框、范围选择、行悬停、行选择、选定的选项卡下划线、输入焦点轮廓
  // 不要和标题行背景色一样
  --ag-alpine-active-color: var(--my-ag-grid-active) !important;
hucy's avatar
hucy committed
83

hcyhuchaoyue's avatar
hcyhuchaoyue committed
84 85 86 87 88
  // 菜单等主要 UI 元素中文本和图标的颜色
  // 不要和标题行背景色一样
  --ag-foreground-color: var(--my-ag-grid-active) !important;
  // 背景色
  --ag-background-color: Var(--my-ag-grid-text) !important;
hucy's avatar
hucy committed
89

hcyhuchaoyue's avatar
hcyhuchaoyue committed
90 91 92 93
  // 标题行字体色
  --ag-header-foreground-color: var(--my-ag-grid-text) !important;
  // 标题行背景色
  --ag-header-background-color: var(--my-ag-grid-primary) !important;
hucy's avatar
hucy committed
94

hcyhuchaoyue's avatar
hcyhuchaoyue committed
95 96 97 98
  // index为奇数的背景色
  --ag-odd-row-background-color: var(--my-ag-grid-primary-light) !important;
  // 标题列调整大小句柄颜色
  --ag-header-column-resize-handle-color: var(--my-ag-grid-active) !important;
hucy's avatar
hucy committed
99

hcyhuchaoyue's avatar
hcyhuchaoyue committed
100 101 102 103 104 105 106 107 108 109 110 111 112 113
  --ag-selected-row-background-color: var(--my-ag-grid-primary-1) !important;
  --ag-range-selection-background-color: var(--my-ag-grid-primary-2) !important;
  --ag-row-hover-color: var(--my-ag-grid-primary-1) !important;
  --ag-column-hover-color: var(--my-ag-grid-primary-1) !important;
  --ag-input-focus-border-color: var(--my-ag-grid-primary-1) !important;

  --ag-border-color: var(--my-ag-grid-primary) !important;
  --ag-row-border-color: var(--my-ag-grid-primary-1) !important;

  --ag-input-disabled-background-color: #fff !important;
  .ag-input-field-input,
  .ag-text-field-input {
    color: var(--my-ag-grid-primary) !important;
  }
hcyhuchaoyue's avatar
hcyhuchaoyue committed
114
}