diff --git a/src/assets/fonts/AlimamaDongFangDaKai-Regular.ttf b/src/assets/fonts/AlimamaDongFangDaKai-Regular.ttf
new file mode 100644
index 0000000..3374d9b
Binary files /dev/null and b/src/assets/fonts/AlimamaDongFangDaKai-Regular.ttf differ
diff --git a/src/assets/fonts/pangmenzhengdao.ttf b/src/assets/fonts/pangmenzhengdao.ttf
new file mode 100644
index 0000000..61d491d
Binary files /dev/null and b/src/assets/fonts/pangmenzhengdao.ttf differ
diff --git a/src/assets/fonts/站酷庆科黄油体.ttf b/src/assets/fonts/站酷庆科黄油体.ttf
new file mode 100644
index 0000000..f8f46ee
Binary files /dev/null and b/src/assets/fonts/站酷庆科黄油体.ttf differ
diff --git a/src/assets/layout/20.png b/src/assets/layout/20.png
new file mode 100644
index 0000000..7be3632
Binary files /dev/null and b/src/assets/layout/20.png differ
diff --git a/src/assets/layout/full-header.png b/src/assets/layout/full-header.png
new file mode 100644
index 0000000..15abb42
Binary files /dev/null and b/src/assets/layout/full-header.png differ
diff --git a/src/assets/layout/header-logo-b.png b/src/assets/layout/header-logo-b.png
new file mode 100644
index 0000000..886346f
Binary files /dev/null and b/src/assets/layout/header-logo-b.png differ
diff --git a/src/assets/layout/header-logo-bb.png b/src/assets/layout/header-logo-bb.png
new file mode 100644
index 0000000..417967e
Binary files /dev/null and b/src/assets/layout/header-logo-bb.png differ
diff --git a/src/assets/layout/header-logo.psd b/src/assets/layout/header-logo.psd
new file mode 100644
index 0000000..e09db1d
Binary files /dev/null and b/src/assets/layout/header-logo.psd differ
diff --git a/src/assets/layout/ks.png b/src/assets/layout/ks.png
new file mode 100644
index 0000000..9d25c2a
Binary files /dev/null and b/src/assets/layout/ks.png differ
diff --git a/src/assets/layout/mofang.png b/src/assets/layout/mofang.png
new file mode 100644
index 0000000..fab6e12
Binary files /dev/null and b/src/assets/layout/mofang.png differ
diff --git a/src/assets/layout/score-box.png b/src/assets/layout/score-box.png
new file mode 100644
index 0000000..a919752
Binary files /dev/null and b/src/assets/layout/score-box.png differ
diff --git a/src/assets/layout/score.png b/src/assets/layout/score.png
new file mode 100644
index 0000000..3caf769
Binary files /dev/null and b/src/assets/layout/score.png differ
diff --git a/src/assets/layout/title.png b/src/assets/layout/title.png
new file mode 100644
index 0000000..bfd7c94
Binary files /dev/null and b/src/assets/layout/title.png differ
diff --git a/src/assets/layout/wk.png b/src/assets/layout/wk.png
new file mode 100644
index 0000000..f5eee84
Binary files /dev/null and b/src/assets/layout/wk.png differ
diff --git a/src/assets/layout/xk.png b/src/assets/layout/xk.png
new file mode 100644
index 0000000..e11b7ff
Binary files /dev/null and b/src/assets/layout/xk.png differ
diff --git a/src/layout/FullScreen.js b/src/layout/FullScreen.js
new file mode 100644
index 0000000..e48e392
--- /dev/null
+++ b/src/layout/FullScreen.js
@@ -0,0 +1,1483 @@
+import React, { useState, useEffect, useMemo, useRef } from "react";
+import { connect } from "dva";
+import { withRouter, matchPath } from "dva/router";
+import { Scrollbars } from "react-custom-scrollbars";
+import { Icon, Row, Col, Progress } from "antd";
+import EnergyIcon from "../utils/energyIcon";
+import { $consts } from "../plugins";
+import styles from "./full.less";
+import echarts from "echarts";
+import realGif from "../assets/layout/mofang.png";
+import logo from "../assets/layout/header-logo.png";
+import {
+ FullScreenContainer,
+ BorderBox8,
+ BorderBox10,
+ ScrollBoard,
+ CapsuleChart,
+ WaterLevelPond,
+} from "@jiaminghi/data-view-react";
+import { text } from "@jiaminghi/data-view-react/lib/index-cd27b7f6";
+
+const stud = (eve) => {
+ return (
+
+
+ ${v.seriesName}
+
${v.value}
+ %`;
+ });
+
+ return html;
+ },
+ extraCssText:
+ "background: #fff; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;",
+ axisPointer: {
+ type: "shadow",
+ shadowStyle: {
+ // color: "#ffffff",
+ shadowColor: "rgba(225,225,225,1)",
+ shadowBlur: 5,
+ },
+ },
+ },
+ grid: {
+ // top: 100,
+ top: "25%",
+ bottom: "10%",
+ containLabel: true,
+ },
+ xAxis: [
+ {
+ type: "category",
+ boundaryGap: false,
+ axisLabel: {
+ formatter: "{value}月",
+ textStyle: {
+ color: "#fff",
+ },
+ },
+ axisLine: {
+ lineStyle: {
+ color: "#fff",
+ },
+ },
+ data: xAxisData,
+ },
+ ],
+ yAxis: [
+ {
+ type: "value",
+ axisLabel: {
+ textStyle: {
+ color: "#fff",
+ },
+ },
+ nameTextStyle: {
+ color: "#fff",
+ fontSize: 12,
+ lineHeight: 40,
+ },
+ splitLine: {
+ lineStyle: {
+ type: "dashed",
+ color: "#fff",
+ },
+ },
+ axisLine: {
+ show: false,
+ },
+ axisTick: {
+ show: false,
+ },
+ },
+ ],
+ series: [
+ {
+ name: "选矿",
+ type: "line",
+ smooth: true,
+ // showSymbol: false,/
+ symbolSize: 8,
+ zlevel: 3,
+ lineStyle: {
+ normal: {
+ color: color[0],
+ shadowBlur: 3,
+ // shadowColor: hexToRgba(color[0], 0.5),
+ shadowOffsetY: 8,
+ },
+ },
+ // areaStyle: {
+ // normal: {
+ // color: new echarts.graphic.LinearGradient(
+ // 0,
+ // 0,
+ // 0,
+ // 1,
+ // [
+ // {
+ // offset: 0,
+ // color: hexToRgba(color[0], 0.3),
+ // },
+ // {
+ // offset: 1,
+ // color: hexToRgba(color[0], 0.1),
+ // },
+ // ],
+ // false
+ // ),
+ // shadowColor: hexToRgba(color[0], 0.1),
+ // shadowBlur: 10,
+ // },
+ // },
+ data: yAxisData1,
+ },
+ {
+ name: "矿山",
+ type: "line",
+ smooth: true,
+ // showSymbol: false,
+ symbolSize: 8,
+ zlevel: 3,
+ lineStyle: {
+ normal: {
+ color: color[1],
+ shadowBlur: 3,
+ // shadowColor: hexToRgba(color[1], 0.5),
+ shadowOffsetY: 8,
+ },
+ },
+ // areaStyle: {
+ // normal: {
+ // color: new echarts.graphic.LinearGradient(
+ // 0,
+ // 0,
+ // 0,
+ // 1,
+ // [
+ // {
+ // offset: 0,
+ // color: hexToRgba(color[1], 0.3),
+ // },
+ // {
+ // offset: 1,
+ // color: hexToRgba(color[1], 0.1),
+ // },
+ // ],
+ // false
+ // ),
+ // shadowColor: hexToRgba(color[1], 0.1),
+ // shadowBlur: 10,
+ // },
+ // },
+ data: yAxisData2,
+ },
+ {
+ name: "尾矿",
+ type: "line",
+ smooth: true,
+ // showSymbol: false,
+ symbolSize: 8,
+ zlevel: 3,
+ lineStyle: {
+ normal: {
+ color: color[2],
+ shadowBlur: 3,
+ // shadowColor: hexToRgba(color[1], 0.5),
+ shadowOffsetY: 8,
+ },
+ },
+ // areaStyle: {
+ // normal: {
+ // color: new echarts.graphic.LinearGradient(
+ // 0,
+ // 0,
+ // 0,
+ // 1,
+ // [
+ // {
+ // offset: 0,
+ // color: hexToRgba(color[1], 0.3),
+ // },
+ // {
+ // offset: 1,
+ // color: hexToRgba(color[1], 0.1),
+ // },
+ // ],
+ // false
+ // ),
+ // shadowColor: hexToRgba(color[1], 0.1),
+ // shadowBlur: 10,
+ // },
+ // },
+ data: yAxisData3,
+ },
+ ],
+ });
+ }
+ };
+ riskLevel = () => {
+ let riskLevel = [];
+ let showData = [
+ { value: 2, name: "一级" },
+ { value: 5, name: "二级" },
+ { value: 15, name: "三级" },
+ { value: 30, name: "四级" },
+ ];
+
+ let riskLevels = document.getElementById("riskLevelFull");
+ if (riskLevels) {
+ let myChart = echarts.init(riskLevels);
+ myChart.setOption({
+ color: ["#c92a2a", "#FF6710", "#FFDD1E", "#0091FF", "#fa8a89"],
+ title: [
+ {
+ text: "52",
+ x: "center",
+ y: "40%",
+ textStyle: {
+ fontSize: 26,
+ fontWeight: "normal",
+ color: ["#fff"],
+ },
+ },
+ {
+ text: "风险总数",
+ x: "center",
+ y: "55%",
+ textStyle: {
+ color: "#fff",
+ fontSize: 12,
+ },
+ },
+ ],
+ tooltip: {
+ trigger: "item",
+ formatter: "{b}:({d}%)",
+ },
+ series: [
+ {
+ name: "访问来源",
+ type: "pie",
+ minAngle: 20,
+ radius: ["45%", "70%"],
+ center: ["50%", "50%"],
+ clockwise: true,
+ avoidLabelOverlap: true,
+ hoverOffset: 15,
+ label: {
+ show: true,
+ position: "outside",
+ // formatter: '{a|{b}:{d}%}\n{hr|}',
+ formatter: "{a|{b}:}{e|{d}%}\n",
+ rich: {
+ hr: {
+ backgroundColor: "t",
+ borderRadius: 3,
+ width: 3,
+ height: 3,
+ padding: [3, 3, 0, -12],
+ },
+ a: {
+ padding: [-15, 0, 0, 0],
+ fontSize: 15,
+ // fontWeight: "bold",
+ color: "#fff",
+ // fontFamily:'站酷庆科黄油体',
+ // letterSpacing: 3,
+ },
+ e: {
+ fontSize: 14,
+ color: "#fff",
+ padding: [-15, 0, 0, 5],
+ },
+ },
+ },
+ labelLine: {
+ normal: {
+ length: 20,
+ length2: 30,
+ lineStyle: {
+ width: 1,
+ type: "dashed",
+ },
+ },
+ },
+ // itemStyle: {
+ // //图形样式
+ // normal: {
+ // borderColor: "#fff",
+ // borderWidth: 2,
+ // padding: "0 20px",
+ // borderRadius: 50,
+ // },
+ // },
+ // color: color,
+ data: showData,
+ },
+ ],
+ });
+ }
+ };
+
+ render() {
+ return (
+
+
+
+
+
+
+
+
+

+
+
+ 安全方针:安全第一、综合治理、控制风险、科学发展
+
+ 安全理念:一切风险皆可控,一切事故皆可防!
+
+
+
+
+
+
+ 宁化行洛坑安全生产标准化运营平台
+
+
+
+
+ {this.state.nowDate}
+
+
+
+
+
+
+
+
+ {/*
*/}
+
+
+
+ {/* */}
+
+
+
+
+ {/*
*/}
+
+
+
+ {this.state.checkData.map((item, index) => {
+ return (
+
+
+
+
+
+ {item.name}
+
+
+
+ /次
+
+
+
+ {item.value}
+
+
+
+
+ );
+ })}
+
+
+
+
+
+ {/* */}
+
+
+
+
+ {this.state.screenWidh ? (
+
+ ) : (
+
+ )}
+
+
+
+

+
+
+ {this.state.roaData.map((item, index) => {
+ return (
+
+
+
+ {item.name}:{item.value}
+
+
+
+ );
+ })}
+
+
+
+
+
+
+
+ {/*
*/}
+
+
+
+
+ {/*
+
*/}
+ {/*
+
+
*/}
+
+
+
+ {this.state.meetingData.map((item, index) => (
+
+
+
+
+
+ {item.value}
+
+
+ {item.name}
+
+
+
+
+
+ ))}
+
+
+
+
+
+
+
+ {/*
*/}
+
+
+ {/* */}
+
+
+
+
+
+
+
+
+ {/*
*/}
+
+
+ {/* */}
+
+
+
+ {/* */}
+
+ {/* */}
+
+
+
+
+
+
+
+
+
+
+ );
+ }
+}
+
+export default withRouter(connect(({ login }) => ({ login }))(FullScreen));
diff --git a/src/layout/Header.js b/src/layout/Header.js
index c810016..c44cbf2 100644
--- a/src/layout/Header.js
+++ b/src/layout/Header.js
@@ -13,6 +13,7 @@ import config from "../config";
import "./header.less";
import Option from "./Option";
import RiskFourPage from "./RiskFour";
+import FullScreenPage from "./FullScreen";
// 投屏
const DataV = (props) => {
@@ -370,6 +371,7 @@ const RiskFourColorOpton = (props) => {
setshowModal(true);
requestFullScreenMethod(document.body); // 进入全屏
}}
+ style={{ margin: "0px 36px", display: "flex", alignItems: "center" }}
>
{/*
{
const RiskFourColor = withRouter(
connect(({ login }) => ({ login }))(RiskFourColorOpton)
);
+
+const FullScreenOpton = (props) => {
+ const [showModal, setshowModal] = useState(false);
+ const getChildCount = (val) => {
+ setshowModal(val);
+ };
+ const [fullScreen, setFullScreen] = useState(false);
+ const [originResizeFunc, setOriginResizeFunc] = useState();
+ const escFunction = () => {
+ let isFull = !!(
+ document.fullscreen ||
+ document.mozFullScreen ||
+ document.webkitIsFullScreen ||
+ document.webkitFullScreen ||
+ document.msFullScreen
+ );
+ if (isFull) {
+ // /
+ }else{
+ // requestFullScreenMethod(document.body);
+ setshowModal(false);
+ }
+ };
+ useEffect(() => {
+ // 监听退出全屏事件 --- chrome 用 esc 退出全屏并不会触发 keyup 事件
+ document.addEventListener(
+ "webkitfullscreenchange",
+ escFunction
+ ); /* Chrome, Safari and Opera */
+ document.addEventListener("mozfullscreenchange", escFunction); /* Firefox */
+ document.addEventListener(
+ "fullscreenchange",
+ escFunction
+ ); /* Standard syntax */
+ document.addEventListener(
+ "msfullscreenchange",
+ escFunction
+ ); /* IE / Edge */
+ return () => {
+ //销毁时清除监听
+ document.removeEventListener("webkitfullscreenchange", escFunction);
+ document.removeEventListener("mozfullscreenchange", escFunction);
+ document.removeEventListener("fullscreenchange", escFunction);
+ document.removeEventListener("MSFullscreenChange", escFunction);
+ };
+ }, []);
+
+ if (window.navigator.userAgent.indexOf("Windows") < 1) {
+ return ;
+ } else {
+ return (
+
+
{
+ setshowModal(true);
+ requestFullScreenMethod(document.body); // 进入全屏
+ }}
+ >
+
+ {/* */}
+
+
{
+ setshowModal(false);
+ }}
+ onCancel={() => {
+ setshowModal(false);
+ }}
+ className="fullScreen"
+ >
+
+
+
+ );
+ }
+};
+
+const FullScreen = withRouter(
+ connect(({ login }) => ({ login }))(FullScreenOpton)
+);
const NavOpton = (props) => {
const [showModal, setshowModal] = useState(false);
const getChildCount = (val) => {
@@ -483,6 +573,7 @@ function Header(props) {
{!props.matchLogin ? (
+
diff --git a/src/layout/full.less b/src/layout/full.less
new file mode 100644
index 0000000..7ea687c
--- /dev/null
+++ b/src/layout/full.less
@@ -0,0 +1,452 @@
+@font-face {
+ font-family: pangmenzhengdao;
+ src: url("../assets/fonts/pangmenzhengdao.ttf");
+}
+
+@font-face {
+ font-family: "阿里妈妈东方大楷 Regular";
+ font-weight: normal;
+ src: url("../assets/fonts/AlimamaDongFangDaKai-Regular.ttf")
+ format("truetype");
+ font-display: swap;
+}
+@font-face {
+ font-family: "站酷庆科黄油体";
+ font-weight: normal;
+ src: url("../assets/fonts/站酷庆科黄油体.ttf") format("truetype");
+ font-display: swap;
+}
+
+.blackBack {
+ background-image: url("../assets/login/bg.png");
+ width: 100%;
+ // height: calc(100% - 10px); // 进入全屏
+ height: 100%;
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+}
+.backImage {
+ background-color: #021428; //021428
+ width: 100%;
+ height: 100%;
+ opacity: 0.9;
+ display: flex;
+ flex-direction: column;
+}
+.header {
+ background-image: url("../assets/layout/full-header.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ height: 100px;
+ width: 100%;
+ display: flex;
+ // align-items: center;
+ justify-content: space-between;
+ flex-direction: row;
+}
+.headerText {
+ color: #fff;
+ font-size: 32px;
+ // font-weight: bold;
+ margin-top: 10px;
+ font-family: "pangmenzhengdao";
+}
+.row {
+ // height: calc(65% - 200px);
+ flex: 1;
+ width: 100%;
+}
+.rowTwo {
+ height: 30%;
+ width: 100%;
+}
+.boxleft {
+ height: 100%;
+ // width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.risklevel {
+ height: 60%;
+ width: 90%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.risklevelOne {
+ height: 40%;
+ width: 90%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.risklevelTwo {
+ height: 100%;
+ width: 90%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+.riskChange {
+ width: 40%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: space-around;
+ padding: 20px 5px;
+}
+.riskChangeTwo {
+ width: 60%;
+ height: 100%;
+ padding: 20px 5px;
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+}
+.gradient {
+ background-image: linear-gradient(
+ 250deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ width: 60%;
+ height: 30%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 2px;
+ // margin: 10px;
+}
+.gradientTwo {
+ background-image: linear-gradient(
+ 250deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ width: 80%;
+ height: 90%;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 2px;
+}
+.gradientThree {
+ background-image: linear-gradient(
+ 275deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 2px;
+}
+.gradientNext {
+ width: 100%;
+ height: 100%;
+ background-color: #021428;
+ // z-index: 999;
+}
+.gradientNextTwo {
+ width: 100%;
+ height: 100%;
+ background-color: rgba(47, 109, 255, 0.1);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 5px;
+ color: #fff;
+}
+.gradientText {
+ font-size: 26px;
+ font-weight: bold;
+}
+.gradientName {
+ font-size: 12px;
+}
+.gradientTextTwo {
+ font-size: 86px;
+ font-weight: bold;
+ color: #ef595a;
+}
+.gradientNameTwo {
+ font-size: 18px;
+}
+.title {
+ background-image: url("../assets/layout/title.png");
+ background-size: cover;
+ background-position: bottom;
+ background-repeat: no-repeat;
+ width: 90%;
+ height: 25px;
+ padding-bottom: 10px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ // justify-content: center;
+}
+.circle {
+ width: 12px;
+ height: 12px;
+ background: #021428;
+ border-radius: 50%;
+ border: 3px solid #fff;
+ margin-right: 5px;
+}
+.titlename {
+ color: #fff;
+ font-size: 16px;
+ font-family: "站酷庆科黄油体";
+ letter-spacing: 3px;
+}
+.risklevelOne {
+ height: 60%;
+ width: 90%;
+}
+.boxTwo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ // width: 100%;
+}
+.capsuleChart {
+ width: 80%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 20px 0px;
+}
+.scrollboard {
+ width: 90%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 0px 20px 20px 20px;
+ flex: 1;
+}
+.scrollboard :global(.header) {
+ height: auto;
+ padding: 0;
+}
+.scrollboard :global(.dv-scroll-board .rows .ceil) {
+ text-align: center;
+}
+.scrollboard :global(.dv-scroll-board .header .header-item) {
+ text-align: center;
+}
+
+.scoreBox {
+ // background-image: url("../assets/layout/score-box.png");
+ // background-size: cover;
+ // background-position: center;
+ // background-repeat: no-repeat;
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+}
+.scoreBox1 {
+ background-image: url("../assets/layout/score-box.png");
+ background-size: contain;
+ background-position: center;
+ background-repeat: no-repeat;
+ width: 100%;
+ // height: 140px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-around;
+ margin-bottom: 20px;
+ padding: 5px;
+}
+.score {
+ display: flex;
+ flex-direction: row;
+ // align-items: center;
+ // justify-content: space-between;
+ background-image: url("../assets/layout/ks.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ object-fit: cover;
+ // width: 230px;
+ width: 33%;
+ height: auto;
+ margin: 10px;
+}
+.score2 {
+ display: flex;
+ flex-direction: row;
+ // align-items: center;
+ // justify-content: space-between;
+ background-image: url("../assets/layout/xk.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ object-fit: cover;
+ width: 33%;
+ height: auto;
+ margin: 10px;
+}
+.score3 {
+ display: flex;
+ flex-direction: row;
+ // align-items: center;
+ // justify-content: space-between;
+ background-image: url("../assets/layout/wk.png");
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ object-fit: cover;
+ width: 33%;
+ height: auto;
+ margin: 10px;
+}
+.score4 {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: space-between;
+ background-image: url("../assets/layout/score.png");
+ background-size: contain;
+ background-position: center;
+ background-repeat: no-repeat;
+ width: 30%;
+ padding: 0px 15px;
+ // height: 100%;
+ // margin: 10px;
+}
+.scoreRight {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 40%;
+ margin-left: 50%;
+}
+.scoreLeft {
+ font-size: 12px;
+ font-weight: bold;
+ color: #6cc8d9;
+ margin-top: 5px;
+}
+.scoreText {
+ font-size: 13px;
+ font-weight: bold;
+ color: #6cc8d9;
+}
+.scoreText2 {
+ font-size: 33px;
+ color: #7fffff;
+ font-weight: bold;
+ // font-style: oblique;
+}
+.scoreText3 {
+ font-size: 12px;
+ color: #6cc8d9;
+ font-weight: bold;
+}
+.ulData {
+ li {
+ // transform: rotate(45deg);
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ // margin-left: -20px;
+ // margin-right: -20px;
+ transform: translate(-50%, -50%);
+ }
+ li:nth-of-type(1) {
+ // transform: rotate(45deg);
+ transform: translate(-50%, -50%) rotate(12deg) translate(-280px)
+ rotate(-12deg);
+ // transform-origin: 20px 220px;
+ }
+ li:nth-of-type(2) {
+ transform: translate(-50%, -50%) rotate(38deg) translate(-280px)
+ rotate(-38deg);
+ }
+ li:nth-of-type(3) {
+ transform: translate(-50%, -50%) rotate(64deg) translate(-280px)
+ rotate(-64deg);
+ }
+ li:nth-of-type(4) {
+ transform: translate(-50%, -50%) rotate(90deg) translate(-280px)
+ rotate(-90deg);
+ }
+ li:nth-of-type(5) {
+ transform: translate(-50%, -50%) rotate(116deg) translate(-280px)
+ rotate(-116deg);
+ }
+ li:nth-of-type(6) {
+ transform: translate(-50%, -50%) rotate(142deg) translate(-280px)
+ rotate(-142deg);
+ }
+ li:nth-of-type(7) {
+ transform: translate(-50%, -50%) rotate(168deg) translate(-280px)
+ rotate(-168deg);
+ }
+ li:nth-of-type(8) {
+ transform: translate(-50%, -50%) rotate(-12deg) translate(-280px)
+ rotate(12deg);
+ }
+ li:nth-of-type(9) {
+ transform: translate(-50%, -50%) rotate(-38deg) translate(-280px)
+ rotate(38deg);
+ }
+ li:nth-of-type(10) {
+ transform: translate(-50%, -50%) rotate(-64deg) translate(-280px)
+ rotate(64deg);
+ }
+ li:nth-of-type(11) {
+ transform: translate(-50%, -50%) rotate(-116deg) translate(-280px)
+ rotate(116deg);
+ }
+
+ li:nth-of-type(12) {
+ transform: translate(-50%, -50%) rotate(-142deg) translate(-280px)
+ rotate(142deg);
+ }
+ li:nth-of-type(13) {
+ transform: translate(-50%, -50%) rotate(-168deg) translate(-280px)
+ rotate(168deg);
+ }
+}
+
+.roateData {
+ background-image: linear-gradient(
+ 275deg,
+ rgba(47, 109, 255, 1) 0%,
+ rgba(255, 255, 255, 54) 50%,
+ rgba(47, 109, 255, 1) 100%
+ );
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 2px;
+ // background-color: rgba(47, 109, 255, 0.1);
+}
+.roatBack {
+ background-color: #021428;
+ width: 100%;
+ height: 100%;
+ padding: 5px;
+}
diff --git a/src/routes/dashboard.css b/src/routes/dashboard.css
index dff70f9..bb840f6 100644
--- a/src/routes/dashboard.css
+++ b/src/routes/dashboard.css
@@ -411,5 +411,31 @@
background-color: #3c9cff;
color: #fff;
}
-:global() {
+:global(.slide-style){
+ /* margin-bottom: 10px; */
+ font-size: 24px;
+ font-weight: bold;
+ color:#de4e58;
+ /* -webkit-text-stroke: #E38C7A 1px; */
+ /* padding-left:30px; */
+ flex: 1;
+ overflow: hidden;
+ display: flex;
+ align-items: center;
+
}
+:global(.slide-text-style){
+ position:relative;
+ display:inline-block;
+ white-space:nowrap;
+ animation: slide-text-style 20s linear 1s infinite ;
+ width:'auto';
+ align-items: center;
+ margin-top: 1em;
+}
+
+@keyframes slide-text-style{
+ 0%{margin-left:100%;}
+100%{margin-left:-1200px;}
+}
+