|
@@ -1,26 +1,26 @@
|
|
|
-.dp-container{
|
|
|
+.dp-container {
|
|
|
// font-family: '微软雅黑';
|
|
|
position: relative;
|
|
|
display: flex;
|
|
|
-
|
|
|
+
|
|
|
.back-to-top {
|
|
|
- position:fixed;
|
|
|
- right:30px;
|
|
|
- bottom:20px;
|
|
|
- height:58px;
|
|
|
- width:60px;
|
|
|
- background:#2d8cf0;
|
|
|
+ position: fixed;
|
|
|
+ right: 30px;
|
|
|
+ bottom: 20px;
|
|
|
+ height: 58px;
|
|
|
+ width: 60px;
|
|
|
+ background: #2d8cf0;
|
|
|
color: #fff;
|
|
|
- z-index:99999;
|
|
|
+ z-index: 99999;
|
|
|
border-radius: 50%;
|
|
|
- cursor:pointer;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
-
|
|
|
- .dp-left{
|
|
|
+
|
|
|
+ .dp-left {
|
|
|
width: calc(100% - 300px);
|
|
|
}
|
|
|
-
|
|
|
- .dp-right{
|
|
|
+
|
|
|
+ .dp-right {
|
|
|
height: 100%;
|
|
|
width: 300px;
|
|
|
background-color: #fff;
|
|
@@ -32,18 +32,18 @@
|
|
|
padding: 70px 20px 20px 20px;
|
|
|
box-shadow: 0 0 5px #c4c4c4;
|
|
|
z-index: 2;
|
|
|
-
|
|
|
- .ivu-btn{
|
|
|
+
|
|
|
+ .ivu-btn {
|
|
|
width: 100%;
|
|
|
margin-top: 10px;
|
|
|
height: 36px;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-title {
|
|
|
font-size: 14px;
|
|
|
font-weight: bold;
|
|
|
margin: 15px 5px;
|
|
|
-
|
|
|
+
|
|
|
&::before {
|
|
|
content: "";
|
|
|
width: 5px;
|
|
@@ -53,197 +53,194 @@
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.ivu-checkbox-wrapper {
|
|
|
margin: 10px;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
- .download-paper-wrap {
|
|
|
- position: relative;
|
|
|
- width: 826px;
|
|
|
- margin: 20px auto;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- color: #000;
|
|
|
-
|
|
|
- .base-bg{
|
|
|
- position: absolute;
|
|
|
- background: #fff;
|
|
|
- z-index: 0;
|
|
|
-
|
|
|
- &-page{
|
|
|
- position: relative;
|
|
|
- width: 826px;
|
|
|
- height: 1170px;
|
|
|
- // border: 1px solid red;
|
|
|
-
|
|
|
- .dp-line {
|
|
|
- position: absolute;
|
|
|
- top: 40%;
|
|
|
- left: -40%;
|
|
|
- margin: 20px 0 0 20px;
|
|
|
- transform:rotate(-90deg);
|
|
|
- border-bottom: 1px dashed #a6a6a6;
|
|
|
-
|
|
|
- .line{
|
|
|
- display: inline-block;
|
|
|
- width: 125px;
|
|
|
- margin: 0 5px;
|
|
|
- border-bottom: 1px solid;
|
|
|
- }
|
|
|
-
|
|
|
- .line-bottom{
|
|
|
- font-size: 12px;
|
|
|
- margin: 10px auto;
|
|
|
- display: inline-block;
|
|
|
- text-align: center;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
+}
|
|
|
+
|
|
|
+.download-paper-wrap {
|
|
|
+ position: relative;
|
|
|
+ width: 826px;
|
|
|
+ margin: 20px auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ color: #000;
|
|
|
+
|
|
|
+ .base-bg {
|
|
|
+ position: absolute;
|
|
|
+ background: #fff;
|
|
|
+ z-index: 0;
|
|
|
+
|
|
|
+ &-page {
|
|
|
+ position: relative;
|
|
|
+ width: 826px;
|
|
|
+ height: 1170px;
|
|
|
+ // border: 1px solid red;
|
|
|
+
|
|
|
+ .dp-line {
|
|
|
+ position: absolute;
|
|
|
+ top: 40%;
|
|
|
+ left: -40%;
|
|
|
+ margin: 20px 0 0 20px;
|
|
|
+ transform: rotate(-90deg);
|
|
|
+ border-bottom: 1px dashed #a6a6a6;
|
|
|
+
|
|
|
+ .line {
|
|
|
+ display: inline-block;
|
|
|
+ width: 125px;
|
|
|
+ margin: 0 5px;
|
|
|
+ border-bottom: 1px solid;
|
|
|
}
|
|
|
-
|
|
|
- .page-num{
|
|
|
- position: absolute;
|
|
|
- bottom: 20px;
|
|
|
- width: 100%;
|
|
|
+
|
|
|
+ .line-bottom {
|
|
|
font-size: 12px;
|
|
|
+ margin: 10px auto;
|
|
|
+ display: inline-block;
|
|
|
text-align: center;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
-
|
|
|
- .split-dom{
|
|
|
- // border: 1px solid red;
|
|
|
- }
|
|
|
-
|
|
|
- .dp-top {
|
|
|
- margin-top: 20px;
|
|
|
- z-index: 1;
|
|
|
-
|
|
|
- &-title {
|
|
|
+
|
|
|
+ .page-num {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 20px;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 12px;
|
|
|
text-align: center;
|
|
|
- font-size: 24px;
|
|
|
- font-weight: bold;
|
|
|
}
|
|
|
-
|
|
|
- &-desc{
|
|
|
- text-align: center;
|
|
|
- padding: 10px 0;
|
|
|
- color: #787878;
|
|
|
-
|
|
|
- &:hover{
|
|
|
- background: rgba(66, 159, 255, 0.6);
|
|
|
- color: #fff;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .dp-top {
|
|
|
+ margin-top: 20px;
|
|
|
+ z-index: 1;
|
|
|
+
|
|
|
+ &-title {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-desc {
|
|
|
+ text-align: center;
|
|
|
+ padding: 10px 0;
|
|
|
+ color: #787878;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background: rgba(66, 159, 255, 0.6);
|
|
|
+ color: #fff;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
-
|
|
|
- &-tip{
|
|
|
- margin: 20px 0 10px 120px;
|
|
|
- padding: 10px;
|
|
|
- color: #949494;
|
|
|
-
|
|
|
- &:hover{
|
|
|
- background: rgba(66, 159, 255, 0.6);
|
|
|
- color: #fff;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-tip {
|
|
|
+ margin: 20px 0 10px 120px;
|
|
|
+ padding: 10px;
|
|
|
+ color: #949494;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background: rgba(66, 159, 255, 0.6);
|
|
|
+ color: #fff;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- .secret-logo{
|
|
|
- position: absolute;
|
|
|
- left: 20px;
|
|
|
- top: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .secret-logo {
|
|
|
+ position: absolute;
|
|
|
+ left: 20px;
|
|
|
+ top: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ z-index: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ .dp-page-content {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dp-content {
|
|
|
+ margin: 0 50px 0 110px;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ .dp-group-title {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ font-size: 16px;
|
|
|
font-weight: bold;
|
|
|
+ padding: 20px 0;
|
|
|
z-index: 1;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background: rgba(66, 159, 255, 0.6) !important;
|
|
|
+ color: #fff;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
-
|
|
|
-
|
|
|
- .dp-page-content{
|
|
|
+ .dp-item {
|
|
|
+ position: relative;
|
|
|
display: flex;
|
|
|
- }
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 10px;
|
|
|
+ margin-left: 10px;
|
|
|
+ // border: 1px solid #FF0000;
|
|
|
+
|
|
|
|
|
|
- .dp-content {
|
|
|
- margin: 0 50px 0 110px;
|
|
|
-
|
|
|
-
|
|
|
|
|
|
- .dp-group-title {
|
|
|
- position: relative;
|
|
|
- z-index: 1;
|
|
|
- font-size: 16px;
|
|
|
+ .props {
|
|
|
+ display: none;
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ bottom: 20px;
|
|
|
+ color: #FF0000;
|
|
|
font-weight: bold;
|
|
|
- padding: 20px 0;
|
|
|
- z-index: 1;
|
|
|
-
|
|
|
- &:hover{
|
|
|
- background: rgba(66, 159, 255, 0.6) !important;
|
|
|
- color: #fff;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
}
|
|
|
|
|
|
- .dp-item {
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- font-size: 14px;
|
|
|
- margin-top: 10px;
|
|
|
- margin-left: 10px;
|
|
|
- // border: 1px solid #FF0000;
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- .props{
|
|
|
- display: none;
|
|
|
- position: absolute;
|
|
|
- right:20px;
|
|
|
- bottom: 20px;
|
|
|
- color: #FF0000;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
+ &-question {
|
|
|
+ flex: 1;
|
|
|
+ padding-left: 10px;
|
|
|
|
|
|
- &-order {
|
|
|
- // min-width: 50px;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
}
|
|
|
+ }
|
|
|
+
|
|
|
+ &-children {
|
|
|
+ margin-left: 20px;
|
|
|
|
|
|
- &-question {
|
|
|
- flex: 1;
|
|
|
- padding-left: 10px;
|
|
|
+ .child-item {
|
|
|
+ margin: 20px 0;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- &-children {
|
|
|
- margin-left: 20px;
|
|
|
+ &-explain {
|
|
|
+ display: flex;
|
|
|
+ padding: 5px 0;
|
|
|
+ color: #149ede;
|
|
|
|
|
|
- .child-item {
|
|
|
- margin: 20px 0;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- &-explain{
|
|
|
- display: flex;
|
|
|
- padding: 5px 0;
|
|
|
- color: #149ede;
|
|
|
-
|
|
|
- .title{
|
|
|
- min-width: 60px;
|
|
|
- }
|
|
|
+ .title {
|
|
|
+ min-width: 60px;
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .dp-item-options {
|
|
|
-
|
|
|
- .item-option-order{
|
|
|
- min-width: 25px;
|
|
|
- }
|
|
|
- .item-option-content {
|
|
|
- display: flex;
|
|
|
- margin: 10px 0;
|
|
|
- }
|
|
|
+ .dp-item-options {
|
|
|
+
|
|
|
+ .item-option-order {
|
|
|
+ min-width: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-option-content {
|
|
|
+ display: flex;
|
|
|
+ margin: 10px 0;
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
+ }
|
|
|
+}
|