waterAnalysisDataVisualization index.css 邵敏 commit at 2020-09-04

waterAnalysisDataVisualization/frontImplementation/index.css

@@ -0,0 +1,137 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+li {
+  list-style: none;
+}
+select,
+input {
+  outline: none;
+}
+.text-left {
+  text-align: left;
+}
+/* 溢出滚动样式 */
+.summary ::-webkit-scrollbar {
+  height: 7px !important;
+  width: 7px !important;
+}
+/*定义了滚动条滑块的样式*/
+.summary ::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  border-style: dashed;
+  background-color: #28BEFC;
+  border-color: #e2242400;
+  border-width: 1.5px;
+  background-clip: padding-box;
+}
+/*定义了轨道的样式*/
+.summary ::-webkit-scrollbar-track {
+  /*滚动条里面轨道*/
+  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
+  border-radius: 5px;
+  background: rgba(0, 0, 0, 0);
+}
+@font-face {
+  font-family: electronicFont;
+  src: url(../font/DS-DIGIT.TTF);
+}
+@font-face {
+  font-family: IMPACT;
+  src: url(../font/IMPACT.TTF);
+}
+body {
+  font-family: Arial, Helvetica, sans-serif;
+  margin: 0;
+  padding: 0;
+  /*  背景图定位 / 背景图尺寸  cover 完全铺满容器  contain 完整显示在容器内 */
+  background: url(../images/bg.jpg) no-repeat #000;
+  background-size: cover;
+  /* 行高是字体1.15倍 */
+  line-height: 1.15;
+  position: relative;
+}
+body .page-container {
+  font-family: Arial, Helvetica, sans-serif;
+  margin: 0;
+  padding: 0;
+  /*  背景图定位 / 背景图尺寸  cover 完全铺满容器  contain 完整显示在容器内 */
+  background: url(../images/bg.jpg) no-repeat #000;
+  background-size: cover;
+  /* 行高是字体1.15倍 */
+  line-height: 1.15;
+  position: relative;
+}
+header {
+  position: relative;
+  height: 1rem;
+  background: url(../images/head_bg.png) no-repeat top center;
+  background-size: 100% 100%;
+  min-width: 1024px;
+  max-width: 1920px;
+}
+header h1 {
+  font-size: 0.35rem;
+  color: #fff;
+  text-align: center;
+  line-height: 1rem;
+  font-weight: normal;
+}
+header .filterSec {
+  position: absolute;
+  top: 0;
+  right: 0.375rem;
+  line-height: 0.9375rem;
+  font-size: 0.25rem;
+  color: rgba(255, 255, 255, 0.7);
+}
+.mainbox {
+  min-width: 1024px;
+  max-width: 1920px;
+  padding: 0.225rem 0.225rem 0 0.2625rem;
+}
+.mainbox .topSection,
+.mainbox .bottomSection {
+  display: flex;
+}
+.mainbox.eleFire .topSection .column {
+  flex: 2;
+}
+.mainbox.eleFire .topSection .column:nth-child(2) {
+  flex: 5;
+  margin: 0 0 0 0.275rem;
+  overflow: hidden;
+}
+.mainbox .bottomSection .column {
+  flex: 1;
+}
+.mainbox .bottomSection .column:nth-child(2) {
+  flex: 1;
+  margin: 0 0 0 0.275rem;
+  overflow: hidden;
+}
+.panel {
+  position: relative;
+  height: 5.9rem;
+  border: 1px solid rgba(25, 140, 186, 0.5);
+  background: rgba(8, 26, 50, 0.6);
+  padding: 0 0.5375rem;
+  margin-bottom: 0.2rem;
+}
+.panel::before {
+  position: absolute;
+  top: 0;
+  left: 0;
+  content: "";
+  width: 10px;
+  height: 10px;
+  border-top: 2px solid #28BEFC;
+  border-left: 2px solid #28BEFC;
+}
+.panel::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  content: "";