|
@@ -6,60 +6,62 @@
|
|
|
// transform-origin: left top;
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
-
|
|
|
- .tools{
|
|
|
- position: absolute;
|
|
|
- right: 30px;
|
|
|
- top: 30px;
|
|
|
- font-size: 26px;
|
|
|
- font-weight: bold;
|
|
|
- cursor: pointer;
|
|
|
-
|
|
|
- .time-text{
|
|
|
- font-size: 20px;
|
|
|
- margin-right: 20px;
|
|
|
- font-weight: 600;
|
|
|
- color: #9f9f9f;
|
|
|
- }
|
|
|
+
|
|
|
+ .tools {
|
|
|
+ position: absolute;
|
|
|
+ right: 30px;
|
|
|
+ top: 30px;
|
|
|
+ font-size: 26px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+
|
|
|
+ .time-text {
|
|
|
+ font-size: 30px;
|
|
|
+ margin-right: 20px;
|
|
|
+ font-weight: 200;
|
|
|
+ color: #9f9f9f;
|
|
|
+ font-family: 'yjsz';
|
|
|
+ }
|
|
|
}
|
|
|
- .school-info{
|
|
|
- position: absolute;
|
|
|
- left: 30px;
|
|
|
- top: 40px;
|
|
|
- font-size: 20px;
|
|
|
- font-weight: bold;
|
|
|
- cursor: pointer;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- &-name{
|
|
|
- margin: 0 10px;
|
|
|
- }
|
|
|
-
|
|
|
- &-period{
|
|
|
- font-size: 12px;
|
|
|
- background-color: #2d2d2d;
|
|
|
- display: inline-block;
|
|
|
- padding: 2px 10px;
|
|
|
- border-radius: 4px;
|
|
|
- margin-right: 5px;
|
|
|
- }
|
|
|
-
|
|
|
- &-semester{
|
|
|
- font-size: 12px;
|
|
|
- background-color: #2d2d2d;
|
|
|
- display: inline-block;
|
|
|
- padding: 2px 10px;
|
|
|
- border-radius: 4px;
|
|
|
- margin-right: 5px;
|
|
|
- }
|
|
|
-
|
|
|
- img{
|
|
|
- border-radius: 50%;
|
|
|
- width: 25px;
|
|
|
- }
|
|
|
+
|
|
|
+ .school-info {
|
|
|
+ position: absolute;
|
|
|
+ left: 30px;
|
|
|
+ top: 40px;
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ &-name {
|
|
|
+ margin: 0 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-period {
|
|
|
+ font-size: 12px;
|
|
|
+ background-color: #2d2d2d;
|
|
|
+ display: inline-block;
|
|
|
+ padding: 2px 10px;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-semester {
|
|
|
+ font-size: 12px;
|
|
|
+ background-color: #2d2d2d;
|
|
|
+ display: inline-block;
|
|
|
+ padding: 2px 10px;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ img {
|
|
|
+ border-radius: 50%;
|
|
|
+ width: 25px;
|
|
|
+ }
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.bg {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
@@ -70,18 +72,22 @@
|
|
|
}
|
|
|
|
|
|
.host-body {
|
|
|
+
|
|
|
.dv-dec-10,
|
|
|
.dv-dec-10-s {
|
|
|
width: 33.3%;
|
|
|
height: 5px;
|
|
|
}
|
|
|
+
|
|
|
.dv-dec-10-s {
|
|
|
transform: rotateY(180deg);
|
|
|
}
|
|
|
+
|
|
|
.dv-dec-8 {
|
|
|
width: 200px;
|
|
|
height: 50px;
|
|
|
}
|
|
|
+
|
|
|
.title {
|
|
|
position: relative;
|
|
|
width: 500px;
|
|
@@ -91,7 +97,7 @@
|
|
|
|
|
|
.title-text {
|
|
|
font-size: 24px;
|
|
|
- font-weight: bold;
|
|
|
+ font-weight: bold;
|
|
|
position: absolute;
|
|
|
bottom: 20px;
|
|
|
left: 50%;
|
|
@@ -112,6 +118,7 @@
|
|
|
.aside-width {
|
|
|
width: 40%;
|
|
|
}
|
|
|
+
|
|
|
.react-r-s,
|
|
|
.react-l-s {
|
|
|
// background-color: #0f1325;
|
|
@@ -123,6 +130,7 @@
|
|
|
text-align: left;
|
|
|
width: 500px;
|
|
|
}
|
|
|
+
|
|
|
font-size: 18px;
|
|
|
width: 300px;
|
|
|
line-height: 50px;
|
|
@@ -150,6 +158,7 @@
|
|
|
width: 500px;
|
|
|
text-align: left;
|
|
|
}
|
|
|
+
|
|
|
font-size: 18px;
|
|
|
width: 300px;
|
|
|
height: 50px;
|
|
@@ -177,51 +186,49 @@
|
|
|
.body-box {
|
|
|
margin-top: 20px;
|
|
|
display: flex;
|
|
|
- justify-content: space-between;
|
|
|
+ justify-content: space-between;
|
|
|
|
|
|
//下方区域的布局
|
|
|
.left-box {
|
|
|
- width: 50%;
|
|
|
- height: calc(100vh - 75px);
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- &-top{
|
|
|
- width: 100%;
|
|
|
- height: 24%;
|
|
|
- }
|
|
|
-
|
|
|
- &-bottom{
|
|
|
- width: 100%;
|
|
|
- height: 71%;
|
|
|
- }
|
|
|
+ width: 50%;
|
|
|
+ height: calc(100vh - 75px);
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ &-top {
|
|
|
+ width: 100%;
|
|
|
+ height: 24%;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-bottom {
|
|
|
+ width: 100%;
|
|
|
+ height: 71%;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
// 底部数据
|
|
|
.right-box {
|
|
|
- width: 50%;
|
|
|
- height: calc(100vh - 75px);
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- &-top{
|
|
|
- width: 100%;
|
|
|
- height: 40%;
|
|
|
- }
|
|
|
-
|
|
|
- &-bottom{
|
|
|
- width: 100%;
|
|
|
- height: 55%;
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .right-bottom-single{
|
|
|
- width: 50%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- }
|
|
|
+ width: 50%;
|
|
|
+ height: calc(100vh - 75px);
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ &-top {
|
|
|
+ width: 100%;
|
|
|
+ height: 40%;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-bottom {
|
|
|
+ width: 100%;
|
|
|
+ height: 55%;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .right-bottom-single {
|
|
|
+ width: 50%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
+}
|