no message
This commit is contained in:
A1300399510
216
css/index.css
216
css/index.css
@@ -56,6 +56,10 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
#answer-app {
|
||||
min-width: 1200px;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#answer-app header {
|
||||
background: #f6f6f6;
|
||||
height: 150px;
|
||||
@@ -181,7 +185,8 @@
|
||||
font-size: 14px;
|
||||
height: 24px;
|
||||
color: #333;
|
||||
margin-right: 30px;
|
||||
margin-right: 23px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#answer-app header .tab-box .tab-list .item.pitch {
|
||||
padding: 0 11px;
|
||||
@@ -190,13 +195,26 @@
|
||||
font-weight: 650;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
#answer-app header .tab-box .tab-list .halving-line {
|
||||
font-size: 14px;
|
||||
color: #d7d7d7;
|
||||
margin-right: 23px;
|
||||
}
|
||||
#answer-app .main {
|
||||
margin: 0 auto;
|
||||
height: calc(100vh - 150px);
|
||||
height: calc(100vh - 167px);
|
||||
justify-content: center;
|
||||
background-color: #fbfbfb;
|
||||
min-width: 1200px;
|
||||
}
|
||||
#answer-app .main .transmit-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#answer-app .main.mode-list {
|
||||
background: #fff;
|
||||
}
|
||||
@@ -206,7 +224,11 @@
|
||||
#answer-app .main.mode-list .list-box .list .item {
|
||||
border-right: none;
|
||||
}
|
||||
#answer-app .main.mode-list .list-box .list .item:nth-child(2) {
|
||||
border-top: 1px solid #ebebeb;
|
||||
}
|
||||
#answer-app .main .main-header {
|
||||
min-width: 512px;
|
||||
margin: 0 auto;
|
||||
padding-left: calc((100vw - 1200px) / 2);
|
||||
display: inline-flex;
|
||||
@@ -221,6 +243,7 @@
|
||||
font-size: 14px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
width: 400px;
|
||||
padding-right: 20px;
|
||||
margin-right: 20px;
|
||||
border-right: 1px solid #ebebeb;
|
||||
@@ -239,6 +262,8 @@
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding-right: 15px;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
#answer-app .main .list-box::-webkit-scrollbar {
|
||||
width: 0 !important;
|
||||
@@ -248,8 +273,10 @@
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
min-width: 512px;
|
||||
}
|
||||
#answer-app .main .list-box .list .item {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
padding: 20px 0 0;
|
||||
transition-property: top, left, background;
|
||||
@@ -302,12 +329,19 @@
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
#answer-app .main .list-box .list .item .content .issue {
|
||||
#answer-app .main .list-box .list .item .content .issue-title {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
#answer-app .main .list-box .list .item .content .issue-title .hot-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
#answer-app .main .list-box .list .item .content .issue-title .issue {
|
||||
font-weight: 650;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
line-height: 22px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
#answer-app .main .list-box .list .item .content .answer {
|
||||
color: #555;
|
||||
@@ -361,6 +395,7 @@
|
||||
}
|
||||
#answer-app .main .details-area-box {
|
||||
width: calc((100vw - 1200px) / 2 + 688px);
|
||||
min-width: 688px;
|
||||
background-color: #fbfbfb;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
@@ -372,6 +407,7 @@
|
||||
padding-left: 60px;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .close-box {
|
||||
height: 69px;
|
||||
@@ -382,6 +418,8 @@
|
||||
#answer-app .main .details-area-box .details-box .close-box .close-circle {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .close-box .close-circle .close-icon {
|
||||
width: 20px;
|
||||
@@ -407,17 +445,19 @@
|
||||
position: relative;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .details-issue .icon {
|
||||
position: absolute;
|
||||
background-color: #72db86;
|
||||
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||
font-weight: 650;
|
||||
font-size: 13px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
line-height: 20px;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
margin-right: 17px;
|
||||
border: 4px solid #fbfbfb;
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .details-issue .title {
|
||||
font-weight: 650;
|
||||
@@ -492,6 +532,22 @@
|
||||
box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.1);
|
||||
padding-top: 24px;
|
||||
margin-bottom: 21px;
|
||||
position: relative;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .answer-box-item .icon-box {
|
||||
background-color: #62b1ff;
|
||||
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||
font-weight: 650;
|
||||
font-size: 13px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
line-height: 20px;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
border: 4px solid #fbfbfb;
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .answer-box-item .answer-text {
|
||||
font-size: 14px;
|
||||
@@ -502,6 +558,7 @@
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .answer-box-item .answer-text img {
|
||||
max-width: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .answer-box-item .operate-box {
|
||||
padding: 0 24px;
|
||||
@@ -752,6 +809,8 @@
|
||||
cursor: pointer;
|
||||
height: 53px;
|
||||
position: relative;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.commentnum {
|
||||
z-index: 1;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.commentnum::after {
|
||||
@@ -784,7 +843,6 @@
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.operate-transmit {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.operate-transmit .transmit-box {
|
||||
width: 628px;
|
||||
@@ -799,6 +857,7 @@
|
||||
background: #fff;
|
||||
justify-content: space-between;
|
||||
padding: 40px 35px 42px;
|
||||
z-index: 1;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.operate-transmit .transmit-box .transmit-title {
|
||||
font-weight: 650;
|
||||
@@ -823,6 +882,7 @@
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.operate-transmit .transmit-box .transmit-web .transmit-content .transmit-url {
|
||||
color: #AAAAAA;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.operate-transmit .transmit-box .transmit-web .transmit-web-btn {
|
||||
width: 120px;
|
||||
@@ -848,14 +908,6 @@
|
||||
height: 12px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .operate-box .operate-list .operate-item.operate-transmit .transmit-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
#answer-app .main .details-area-box .details-box .copyright {
|
||||
font-size: 13px;
|
||||
color: #d7d7d7;
|
||||
@@ -1074,7 +1126,7 @@
|
||||
#answer-app .my-popover .popover-box .content-box .item .operate-box .state-box .state-popup {
|
||||
position: absolute;
|
||||
top: 28px;
|
||||
right: 0;
|
||||
right: 3px;
|
||||
width: 140px;
|
||||
height: 101px;
|
||||
background-color: #ffffff;
|
||||
@@ -1148,7 +1200,7 @@
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 1;
|
||||
z-index: 1000;
|
||||
}
|
||||
#answer-app .issue-box .choosing-theme {
|
||||
width: 530px;
|
||||
@@ -1180,25 +1232,23 @@
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
#answer-app .issue-box .choosing-theme .theme-list {
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
#answer-app .issue-box .choosing-theme .theme-list::after {
|
||||
content: "";
|
||||
width: 140px;
|
||||
height: 0;
|
||||
#answer-app .issue-box .choosing-theme .theme-list .theme-stair-box {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
#answer-app .issue-box .choosing-theme .theme-list .theme-item {
|
||||
width: 140px;
|
||||
width: 106px;
|
||||
height: 36px;
|
||||
background-color: #f6f6f6;
|
||||
border-radius: 5px;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
cursor: pointer;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#answer-app .issue-box .choosing-theme .theme-list .theme-item:not(:nth-last-child(-n+3)) {
|
||||
margin-bottom: 20px;
|
||||
#answer-app .issue-box .choosing-theme .theme-list .theme-item:not(:nth-child(4n)) {
|
||||
margin-right: 11px;
|
||||
}
|
||||
#answer-app .issue-box .choosing-theme .theme-list .theme-item:hover {
|
||||
color: #000000;
|
||||
@@ -1206,16 +1256,16 @@
|
||||
}
|
||||
#answer-app .issue-box .issue-form {
|
||||
padding-top: 30px;
|
||||
width: 721px;
|
||||
width: 720px;
|
||||
height: 520px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
background-position: -4px -3px;
|
||||
}
|
||||
#answer-app .issue-box .issue-form .issue-bj {
|
||||
position: absolute;
|
||||
left: -3px;
|
||||
left: -4px;
|
||||
top: -3px;
|
||||
width: 727px;
|
||||
height: 526px;
|
||||
@@ -1231,8 +1281,8 @@
|
||||
color: #FFFFFF;
|
||||
background-color: #72db86;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
top: -1px;
|
||||
left: -1px;
|
||||
}
|
||||
#answer-app .issue-box .issue-form .cross-icon {
|
||||
position: absolute;
|
||||
@@ -1253,19 +1303,22 @@
|
||||
height: 80px;
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
#answer-app .issue-box .issue-form .issue-input input {
|
||||
#answer-app .issue-box .issue-form .issue-input textarea {
|
||||
font-size: 18px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
resize: none;
|
||||
}
|
||||
#answer-app .issue-box .issue-form .issue-input input::placeholder {
|
||||
#answer-app .issue-box .issue-form .issue-input textarea::placeholder {
|
||||
color: #AAAAAA;
|
||||
}
|
||||
#answer-app .issue-box .issue-form .issue-replenish {
|
||||
width: 100%;
|
||||
width: 720px;
|
||||
height: 330px;
|
||||
font-size: 14px;
|
||||
padding: 20px 30px;
|
||||
resize: none;
|
||||
display: block;
|
||||
}
|
||||
#answer-app .issue-box .issue-form .issue-replenish::placeholder {
|
||||
color: #AAAAAA;
|
||||
@@ -1280,6 +1333,8 @@
|
||||
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.11764706);
|
||||
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.11764706);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
#answer-app .edit-answers .close-icon {
|
||||
width: 12px;
|
||||
@@ -1298,17 +1353,25 @@
|
||||
padding-top: 20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
#answer-app .edit-answers textarea {
|
||||
#answer-app .edit-answers .question-textarea {
|
||||
display: block;
|
||||
border: none;
|
||||
outline: none;
|
||||
width: 100%;
|
||||
height: 255px;
|
||||
font-size: 14px;
|
||||
color: #555555;
|
||||
line-height: 26px;
|
||||
resize: none;
|
||||
padding: 20px;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
#answer-app .edit-answers .question-textarea.placeholder::after {
|
||||
content: "输入图文内容回答提问";
|
||||
color: #999;
|
||||
}
|
||||
#answer-app .edit-answers .question-textarea img {
|
||||
max-width: 100%;
|
||||
}
|
||||
#answer-app .issue-bottom {
|
||||
justify-content: space-between;
|
||||
@@ -1401,7 +1464,6 @@
|
||||
margin-right: 12px;
|
||||
}
|
||||
#answer-app .i-answer-box .question-middle .question-textarea {
|
||||
height: 412px;
|
||||
width: 100%;
|
||||
border: none;
|
||||
outline: none;
|
||||
@@ -1416,6 +1478,80 @@
|
||||
#answer-app .i-answer-box .question-middle .question-textarea img {
|
||||
max-width: 100%;
|
||||
}
|
||||
a::after {
|
||||
content: "";
|
||||
#answer-app .detail-image-mask {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: none;
|
||||
max-height: none;
|
||||
border: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
z-index: 100;
|
||||
}
|
||||
#answer-app .detail-image-mask .detail-image {
|
||||
width: 80vw;
|
||||
height: 80vh;
|
||||
border-radius: 8px;
|
||||
background-color: #111;
|
||||
}
|
||||
#answer-app .detail-image-mask .detail-image .detail-img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
.box-item {
|
||||
min-width: 380px;
|
||||
border: 1px solid #EBEEF5;
|
||||
border-radius: 4px;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: #edf2fc;
|
||||
transition: opacity 0.3s, transform 0.4s, top 0.4s;
|
||||
padding: 15px 15px 15px 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
z-index: 5000;
|
||||
}
|
||||
.box-item-success {
|
||||
background-color: #f0f9eb;
|
||||
border-color: #e1f3d8;
|
||||
color: #67c23a;
|
||||
}
|
||||
.box-item-warning {
|
||||
background-color: #fdf6ec;
|
||||
border-color: #faecd8;
|
||||
color: #e6a23c;
|
||||
}
|
||||
.box-item-error {
|
||||
background-color: #fef0f0;
|
||||
border-color: #fde2e2;
|
||||
color: #f56c6c;
|
||||
}
|
||||
.msg-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 16px;
|
||||
}
|
||||
.msg-container .iconfont {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.msg-enter-active {
|
||||
animation: anim 0.5s;
|
||||
}
|
||||
.msg-leave-active {
|
||||
animation: anim 0.5s reverse;
|
||||
}
|
||||
@keyframes anim {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate(-50%, -200%);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
}
|
||||
|
||||
306
css/index.less
306
css/index.less
@@ -70,6 +70,9 @@
|
||||
}
|
||||
|
||||
#answer-app {
|
||||
min-width: 1200px;
|
||||
overflow-x: hidden;
|
||||
|
||||
header {
|
||||
background: rgba(246, 246, 246, 1);
|
||||
height: 150px;
|
||||
@@ -219,7 +222,8 @@
|
||||
font-size: 14px;
|
||||
height: 24px;
|
||||
color: #333;
|
||||
margin-right: 30px;
|
||||
margin-right: 23px;
|
||||
cursor: pointer;
|
||||
|
||||
&.pitch {
|
||||
padding: 0 11px;
|
||||
@@ -228,6 +232,13 @@
|
||||
font-weight: 650;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.halving-line {
|
||||
font-size: 14px;
|
||||
color: #d7d7d7;
|
||||
margin-right: 23px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -236,11 +247,22 @@
|
||||
.main {
|
||||
// width: 1200px;
|
||||
margin: 0 auto;
|
||||
height: calc(100vh - 150px);
|
||||
// height: calc(100vh - 150px);
|
||||
height: calc(100vh - 167px);
|
||||
justify-content: center;
|
||||
background-color: #fbfbfb;
|
||||
min-width: 1200px;
|
||||
|
||||
.transmit-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
// background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
&.mode-list {
|
||||
background: #fff;
|
||||
|
||||
@@ -251,10 +273,15 @@
|
||||
.list-box .list .item {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.list-box .list .item:nth-child(2) {
|
||||
border-top: 1px solid #ebebeb;
|
||||
}
|
||||
}
|
||||
|
||||
.main-header {
|
||||
// width: 1200px;
|
||||
min-width: 512px;
|
||||
margin: 0 auto;
|
||||
// justify-content: space-between;
|
||||
padding-left: calc((100vw - 1200px) / 2);
|
||||
@@ -268,6 +295,7 @@
|
||||
font-size: 14px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
width: 400px;
|
||||
|
||||
.search-keyword-cross {
|
||||
width: 14px;
|
||||
@@ -304,14 +332,20 @@
|
||||
width: 0 !important;
|
||||
}
|
||||
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
// margin: 0 auto;
|
||||
position: relative;
|
||||
min-width: 512px;
|
||||
|
||||
.item {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
padding: 20px 0 0;
|
||||
// transition: all .5s;
|
||||
@@ -388,14 +422,25 @@
|
||||
// width: 531px;
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
padding-bottom: 20px;
|
||||
|
||||
// transition: all 0.3s;
|
||||
|
||||
.issue {
|
||||
font-weight: 650;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
line-height: 22px;
|
||||
|
||||
.issue-title {
|
||||
.hot-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
margin-bottom: 8px;
|
||||
|
||||
.issue {
|
||||
font-weight: 650;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.answer {
|
||||
@@ -465,6 +510,7 @@
|
||||
|
||||
.details-area-box {
|
||||
width: calc((100vw - 1200px) / 2 + 688px);
|
||||
min-width: 688px;
|
||||
// min-height: 1000vh;
|
||||
// background-color: #72DB86;
|
||||
background-color: rgba(251, 251, 251, 1);
|
||||
@@ -480,6 +526,7 @@
|
||||
padding-left: 60px;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
|
||||
.close-box {
|
||||
height: 69px;
|
||||
@@ -490,6 +537,8 @@
|
||||
.close-circle {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
||||
.close-icon {
|
||||
width: 20px;
|
||||
@@ -519,20 +568,36 @@
|
||||
margin-bottom: 28px;
|
||||
position: relative;
|
||||
|
||||
// .icon-boxb {
|
||||
// border: 4px solid #fbfbfb;
|
||||
// position: absolute;
|
||||
// top: -5px;
|
||||
// left: -5px;
|
||||
// width: 28px;
|
||||
// height: 28px;
|
||||
|
||||
|
||||
.icon {
|
||||
position: absolute;
|
||||
background-color: #72db86;
|
||||
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||
font-weight: 650;
|
||||
font-size: 13px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
// width: 20px;
|
||||
// height: 20px;
|
||||
line-height: 20px;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
margin-right: 17px;
|
||||
border: 4px solid #fbfbfb;
|
||||
position: absolute;
|
||||
// margin-right: 17px;
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
// }
|
||||
|
||||
.title {
|
||||
font-weight: 650;
|
||||
font-size: 18px;
|
||||
@@ -624,6 +689,24 @@
|
||||
box-shadow: 0px 0px 11px rgb(0 0 0 / 10%);
|
||||
padding-top: 24px;
|
||||
margin-bottom: 21px;
|
||||
position: relative;
|
||||
|
||||
.icon-box {
|
||||
background-color: #62b1ff;
|
||||
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||
font-weight: 650;
|
||||
font-size: 13px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
line-height: 20px;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
border: 4px solid #fbfbfb;
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
|
||||
.answer-text {
|
||||
font-size: 14px;
|
||||
@@ -634,6 +717,7 @@
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -947,19 +1031,24 @@
|
||||
// background-color: #333333;
|
||||
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
// z-index: 1;
|
||||
|
||||
&.commentnum::after {
|
||||
content: "";
|
||||
width: 80px;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
z-index: -1;
|
||||
transform: translateX(-50%);
|
||||
&.commentnum {
|
||||
|
||||
z-index: 1;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
width: 80px;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
z-index: -1;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
.operate-icon {
|
||||
@@ -984,7 +1073,7 @@
|
||||
|
||||
&.operate-transmit {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
// z-index: 1;
|
||||
|
||||
.transmit-box {
|
||||
width: 628px;
|
||||
@@ -1001,6 +1090,7 @@
|
||||
background: #fff;
|
||||
justify-content: space-between;
|
||||
padding: 40px 35px 42px;
|
||||
z-index: 1;
|
||||
|
||||
.transmit-title {
|
||||
font-weight: 650;
|
||||
@@ -1029,6 +1119,7 @@
|
||||
|
||||
.transmit-url {
|
||||
color: #AAAAAA;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1069,15 +1160,6 @@
|
||||
|
||||
}
|
||||
|
||||
.transmit-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
// background-color:;
|
||||
z-index: -1;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1354,7 +1436,7 @@
|
||||
.state-popup {
|
||||
position: absolute;
|
||||
top: 28px;
|
||||
right: 0;
|
||||
right: 3px;
|
||||
width: 140px;
|
||||
height: 101px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
@@ -1465,7 +1547,7 @@
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 1;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.issue-box {
|
||||
@@ -1503,17 +1585,19 @@
|
||||
}
|
||||
|
||||
.theme-list {
|
||||
justify-content: space-between;
|
||||
// justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
width: 140px;
|
||||
height: 0;
|
||||
.theme-stair-box {
|
||||
flex-wrap: wrap;
|
||||
// border-bottom: 1px dotted #dedede;
|
||||
// margin-bottom: 20px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.theme-item {
|
||||
width: 140px;
|
||||
width: 106px;
|
||||
height: 36px;
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
border-radius: 5px;
|
||||
@@ -1521,8 +1605,10 @@
|
||||
color: #333333;
|
||||
cursor: pointer;
|
||||
|
||||
&:not(:nth-last-child(-n+3)) {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:not(:nth-child(4n)) {
|
||||
margin-right: 11px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@@ -1532,23 +1618,26 @@
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.issue-form {
|
||||
padding-top: 30px;
|
||||
width: 721px;
|
||||
// width: 721px;
|
||||
// height: 520px;
|
||||
width: 721px;
|
||||
width: 720px;
|
||||
height: 520px;
|
||||
background-color: #fff;
|
||||
// background-color: #fff;
|
||||
border-radius: 10px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
// background-image: url(../img/issue-bj.svg);
|
||||
background-position: -4px -3px;
|
||||
|
||||
.issue-bj {
|
||||
position: absolute;
|
||||
left: -3px;
|
||||
left: -4px;
|
||||
top: -3px;
|
||||
width: 727px;
|
||||
height: 526px;
|
||||
@@ -1565,8 +1654,8 @@
|
||||
color: #FFFFFF;
|
||||
background-color: #72db86;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
top: -1px;
|
||||
left: -1px;
|
||||
}
|
||||
|
||||
.cross-icon {
|
||||
@@ -1590,9 +1679,11 @@
|
||||
height: 80px;
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
|
||||
input {
|
||||
textarea {
|
||||
font-size: 18px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
resize: none;
|
||||
|
||||
&::placeholder {
|
||||
color: #AAAAAA;
|
||||
@@ -1601,11 +1692,12 @@
|
||||
}
|
||||
|
||||
.issue-replenish {
|
||||
width: 100%;
|
||||
width: 720px;
|
||||
height: 330px;
|
||||
font-size: 14px;
|
||||
padding: 20px 30px;
|
||||
resize: none;
|
||||
display: block;
|
||||
|
||||
&::placeholder {
|
||||
color: #AAAAAA;
|
||||
@@ -1626,6 +1718,8 @@
|
||||
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.117647058823529);
|
||||
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.117647058823529);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.close-icon {
|
||||
width: 12px;
|
||||
@@ -1646,17 +1740,29 @@
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
.question-textarea {
|
||||
display: block;
|
||||
border: none;
|
||||
outline: none;
|
||||
width: 100%;
|
||||
height: 255px;
|
||||
// height: 255px;
|
||||
font-size: 14px;
|
||||
color: #555555;
|
||||
line-height: 26px;
|
||||
resize: none;
|
||||
padding: 20px;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
|
||||
|
||||
&.placeholder::after {
|
||||
content: "输入图文内容回答提问";
|
||||
color: #999;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1764,7 +1870,7 @@
|
||||
}
|
||||
|
||||
.question-textarea {
|
||||
height: 412px;
|
||||
// height: 412px;
|
||||
width: 100%;
|
||||
border: none;
|
||||
outline: none;
|
||||
@@ -1784,9 +1890,97 @@
|
||||
}
|
||||
}
|
||||
|
||||
.detail-image-mask {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: none;
|
||||
max-height: none;
|
||||
border: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
z-index: 100;
|
||||
|
||||
.detail-image {
|
||||
width: 80vw;
|
||||
height: 80vh;
|
||||
border-radius: 8px;
|
||||
background-color: #111;
|
||||
|
||||
.detail-img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.box-item {
|
||||
// height: 16px;
|
||||
position: fixed;
|
||||
min-width: 380px;
|
||||
border: 1px solid #EBEEF5;
|
||||
border-radius: 4px;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: #edf2fc;
|
||||
transition: opacity .3s, transform .4s, top .4s;
|
||||
padding: 15px 15px 15px 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
z-index: 5000;
|
||||
|
||||
a::after {
|
||||
content: "";
|
||||
&-success {
|
||||
background-color: #f0f9eb;
|
||||
border-color: #e1f3d8;
|
||||
color: #67c23a;
|
||||
}
|
||||
|
||||
&-warning {
|
||||
background-color: #fdf6ec;
|
||||
border-color: #faecd8;
|
||||
color: #e6a23c;
|
||||
}
|
||||
|
||||
&-error {
|
||||
background-color: #fef0f0;
|
||||
border-color: #fde2e2;
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 16px;
|
||||
|
||||
.iconfont {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-enter-active {
|
||||
animation: anim 0.5s;
|
||||
}
|
||||
|
||||
.msg-leave-active {
|
||||
animation: anim 0.5s reverse;
|
||||
}
|
||||
|
||||
@keyframes anim {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate(-50%, -200%);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user