feat: 会员中心 hgcloud 主题初始化 + drone 部署步骤
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
- 解压官方默认主题 default_yfMBA.tar.gz 到 clientarea/hgcloud/ - .gitignore 排除压缩包和临时解压目录 - drone 新增步骤: 同步 hgcloud 到 /clientarea/template/pc/
This commit is contained in:
yiqiu
28
clientarea/hgcloud/css/NotFound.css
Normal file
28
clientarea/hgcloud/css/NotFound.css
Normal file
@@ -0,0 +1,28 @@
|
||||
.content-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.content-box .img-box {
|
||||
width: 2.91rem;
|
||||
height: 2.08rem;
|
||||
}
|
||||
.content-box .img-box img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.content-box .tips-box {
|
||||
text-align: center;
|
||||
color: #666B80;
|
||||
font-size: 0.16rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
.content-box .tran-again {
|
||||
margin-top: 0.06rem;
|
||||
cursor: pointer;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
32
clientarea/hgcloud/css/NotFound.less
Normal file
32
clientarea/hgcloud/css/NotFound.less
Normal file
@@ -0,0 +1,32 @@
|
||||
.content-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.img-box {
|
||||
width: 2.91rem;
|
||||
height: 2.08rem;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.tips-box {
|
||||
text-align: center;
|
||||
color: #666B80;
|
||||
font-size: 0.16rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.tran-again {
|
||||
margin-top: 0.06rem;
|
||||
cursor: pointer;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
}
|
||||
478
clientarea/hgcloud/css/account.css
Normal file
478
clientarea/hgcloud/css/account.css
Normal file
@@ -0,0 +1,478 @@
|
||||
.main-card-title {
|
||||
font-size: 0.28rem;
|
||||
line-height: 0.28rem;
|
||||
}
|
||||
.content-box {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.box-top {
|
||||
height: 1rem;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e6e7eb;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.right-name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
.name-text {
|
||||
font-size: 0.32rem;
|
||||
font-family: Helvetica;
|
||||
font-weight: bold;
|
||||
line-height: 0.32rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.name-country {
|
||||
margin-top: 0.1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.country-img {
|
||||
height: 0.25rem;
|
||||
width: 0.4rem;
|
||||
}
|
||||
.attestation-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
margin-left: 0.04rem;
|
||||
}
|
||||
.attestation-status > img {
|
||||
width: 0.26rem;
|
||||
height: 0.26rem;
|
||||
}
|
||||
.attestation-text {
|
||||
cursor: pointer;
|
||||
margin-left: 0.1rem;
|
||||
font-size: 0.14rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.bule-text {
|
||||
color: var(--color-primary) !important;
|
||||
}
|
||||
.bule-text .el-icon-arrow-right {
|
||||
margin-left: 0.08rem;
|
||||
}
|
||||
.box-main {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.el-popconfirm .el-popconfirm__main {
|
||||
margin: 14px 0;
|
||||
}
|
||||
.el-popconfirm .el-popconfirm__action .el-button {
|
||||
display: initial !important;
|
||||
}
|
||||
.account-title,
|
||||
.basic-title {
|
||||
border-left: 3px solid var(--color-primary);
|
||||
padding-left: 0.1rem;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.16rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.account {
|
||||
margin-top: 0.62rem !important;
|
||||
}
|
||||
.basic > .el-row,
|
||||
.account > .el-row {
|
||||
margin-top: 0.43rem;
|
||||
}
|
||||
.oauth {
|
||||
margin-top: 0.62rem;
|
||||
}
|
||||
.wx-switch {
|
||||
margin-top: 0.43rem;
|
||||
}
|
||||
.oauth-box {
|
||||
margin-top: 0.43rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
row-gap: 0.43rem;
|
||||
}
|
||||
.box-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
.box-item-t {
|
||||
font-size: 0.13rem;
|
||||
font-weight: 500;
|
||||
height: 0.2rem;
|
||||
color: #8692b0;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
.box-item-b > .el-input,
|
||||
.box-item-b .el-select,
|
||||
.box-item-b .el-textarea {
|
||||
width: 3.2rem;
|
||||
border: none;
|
||||
border-bottom: 1px solid #e6e7eb;
|
||||
}
|
||||
.el-textarea .el-textarea__inner {
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
.box-item-b .el-input__inner {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
.btn-save {
|
||||
width: 0.88rem;
|
||||
height: 0.32rem;
|
||||
margin-top: 0.43rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 3px;
|
||||
color: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-input.is-disabled .el-input__inner {
|
||||
background: #ffffff;
|
||||
}
|
||||
.el-input__inner {
|
||||
height: 0.46rem;
|
||||
}
|
||||
.el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.input-with-select .el-input-group__prepend {
|
||||
width: 60px;
|
||||
border: none;
|
||||
background: #ffffff;
|
||||
}
|
||||
.edit-icon {
|
||||
cursor: pointer;
|
||||
padding: 0.15rem;
|
||||
}
|
||||
.el-dialog__body {
|
||||
padding: 0.3rem 0.8rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.mian-form {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.input-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.code-btn {
|
||||
margin-left: 0.12rem;
|
||||
width: 1.3rem;
|
||||
background: #eef4ff;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.select-input {
|
||||
width: auto !important;
|
||||
min-width: 1.14rem;
|
||||
}
|
||||
.com-search {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
.msg-search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
.msgsearch-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.msgsearch-left .el-button {
|
||||
border-radius: 0.03rem;
|
||||
border: 0.01rem solid var(--color-primary);
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.msgsearch-right {
|
||||
display: flex;
|
||||
}
|
||||
.msgsearch-right .el-select {
|
||||
width: 2.4rem;
|
||||
margin-right: 0.1rem;
|
||||
border: none;
|
||||
}
|
||||
.msgsearch-right .search-btn {
|
||||
margin-left: 0.1rem;
|
||||
background: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.a-text {
|
||||
color: #171725;
|
||||
}
|
||||
.a-text:hover {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.msg-status {
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
.is-read {
|
||||
color: #8692b0;
|
||||
}
|
||||
.no-read {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
tr > td {
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
th {
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
.forget-pass {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
line-height: 0.14rem;
|
||||
font-size: 0.14rem;
|
||||
margin-top: 0.04rem;
|
||||
}
|
||||
.forget-pass > a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
color: #666b80;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-phone {
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
padding-bottom: 0.14rem;
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
.form-main {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.form-item {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.rember-item {
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rember-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
}
|
||||
.read-item {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.read-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.line-item {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.line-item text {
|
||||
font-size: 16px;
|
||||
color: #1e2736;
|
||||
}
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.code-pass-select {
|
||||
width: auto;
|
||||
height: 44px;
|
||||
border: 1px solid #e6e7eb;
|
||||
border-right: none;
|
||||
}
|
||||
.el-message-box__btns {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
.el-message-box__btns > .el-button {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.mobel {
|
||||
display: none;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.main-card-title {
|
||||
font-size: 0.48rem;
|
||||
}
|
||||
.name-text {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
.basic-title,
|
||||
.account-title {
|
||||
font-size: 0.36rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 800;
|
||||
line-height: 0.36rem;
|
||||
color: var(--color-primary);
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
.box-item-t {
|
||||
font-size: 0.28rem;
|
||||
height: 0.28rem;
|
||||
}
|
||||
.el-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.el-col {
|
||||
width: 100%;
|
||||
}
|
||||
.box-item-b > .el-input,
|
||||
.box-item-b .el-select,
|
||||
.box-item-b .el-textarea {
|
||||
width: 100%;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.el-input__inner {
|
||||
font-size: 0.32rem;
|
||||
height: auto;
|
||||
}
|
||||
.btn-save {
|
||||
width: calc(100% - 0.6rem);
|
||||
margin: 0 auto;
|
||||
margin-top: 0.43rem;
|
||||
height: 0.8rem;
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
.code-btn {
|
||||
width: auto;
|
||||
height: 0.8rem;
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
.dialog-footer {
|
||||
flex-direction: column;
|
||||
}
|
||||
.dialog-footer .btn-ok,
|
||||
.dialog-footer .btn-no {
|
||||
width: 100%;
|
||||
height: 0.8rem;
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
.dialog-footer .btn-no {
|
||||
margin-left: 0;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.el-form-item__label {
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
.edit-icon {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
.dialog-title {
|
||||
font-size: 0.36rem;
|
||||
}
|
||||
.forget-pass {
|
||||
font-size: 0.28rem;
|
||||
line-height: 0.29rem;
|
||||
}
|
||||
.content_searchbar .left_tips .tips_item {
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.searchbar {
|
||||
width: 100%;
|
||||
}
|
||||
.searchbar .el-input {
|
||||
margin-left: 0;
|
||||
width: 100% !important;
|
||||
}
|
||||
.mob-searchbar {
|
||||
margin-top: 0.53rem;
|
||||
}
|
||||
.mob-search-input {
|
||||
height: 0.8rem;
|
||||
background: rgba(134, 146, 176, 0.1);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
.mob-search-input > input {
|
||||
height: 0.8rem;
|
||||
background: rgba(134, 146, 176, 0.1);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
.mob-tabledata {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #d7d8db;
|
||||
border-radius: 0px 0px 3px 3px;
|
||||
}
|
||||
.mob-tabledata-item {
|
||||
height: auto;
|
||||
border-bottom: 1px solid #d7d8db;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 0.3rem;
|
||||
}
|
||||
.mob-item-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.mob-item-row1,
|
||||
.mob-item-row3,
|
||||
.mob-item-row-notes {
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.27rem;
|
||||
color: #8692b0;
|
||||
}
|
||||
.mob-item-row2-name {
|
||||
font-size: 0.32rem;
|
||||
line-height: 0.33rem;
|
||||
}
|
||||
.mob-item-row3 {
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.back-top-img {
|
||||
width: 0.88rem;
|
||||
position: fixed;
|
||||
right: 0.3rem;
|
||||
bottom: 1.17rem;
|
||||
}
|
||||
.bottom-text {
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.27rem;
|
||||
color: #8692b0;
|
||||
margin: 0.4rem 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.basic > .el-row:nth-child(3) {
|
||||
margin-top: 0;
|
||||
}
|
||||
.select-input > .el-input--suffix {
|
||||
width: 1.86rem;
|
||||
}
|
||||
}
|
||||
616
clientarea/hgcloud/css/account.less
Normal file
616
clientarea/hgcloud/css/account.less
Normal file
@@ -0,0 +1,616 @@
|
||||
// Variables
|
||||
@text-color: #1e2736;
|
||||
@border-color: #e6e7eb;
|
||||
@text-secondary: #8692b0;
|
||||
@white: #ffffff;
|
||||
|
||||
// Mixins
|
||||
.flex-center() {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.flex-between() {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
// Main styles
|
||||
.main-card-title {
|
||||
font-size: 0.28rem;
|
||||
line-height: 0.28rem;
|
||||
}
|
||||
|
||||
.content-box {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.box-top {
|
||||
height: 1rem;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid @border-color;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.right-name {
|
||||
.flex-between();
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.name-text {
|
||||
font-size: 0.32rem;
|
||||
font-family: Helvetica;
|
||||
font-weight: bold;
|
||||
line-height: 0.32rem;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
.name-country {
|
||||
margin-top: 0.1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.country-img {
|
||||
height: 0.25rem;
|
||||
width: 0.4rem;
|
||||
}
|
||||
|
||||
.attestation-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
margin-left: 0.04rem;
|
||||
|
||||
>img {
|
||||
width: 0.26rem;
|
||||
height: 0.26rem;
|
||||
}
|
||||
}
|
||||
|
||||
.attestation-text {
|
||||
cursor: pointer;
|
||||
margin-left: 0.1rem;
|
||||
font-size: 0.14rem;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
.bule-text {
|
||||
color: var(--color-primary) !important;
|
||||
|
||||
.el-icon-arrow-right {
|
||||
margin-left: 0.08rem;
|
||||
}
|
||||
}
|
||||
|
||||
.box-main {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
// Element UI overrides
|
||||
.el-popconfirm {
|
||||
.el-popconfirm__main {
|
||||
margin: 14px 0;
|
||||
}
|
||||
|
||||
.el-popconfirm__action .el-button {
|
||||
display: initial !important;
|
||||
}
|
||||
}
|
||||
|
||||
.account-title,
|
||||
.basic-title {
|
||||
border-left: 3px solid var(--color-primary);
|
||||
padding-left: 0.1rem;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.16rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.account {
|
||||
margin-top: 0.62rem !important;
|
||||
}
|
||||
|
||||
.basic>.el-row,
|
||||
.account>.el-row {
|
||||
margin-top: 0.43rem;
|
||||
}
|
||||
|
||||
.oauth {
|
||||
margin-top: 0.62rem;
|
||||
}
|
||||
|
||||
.wx-switch {
|
||||
margin-top: 0.43rem;
|
||||
}
|
||||
|
||||
.oauth-box {
|
||||
margin-top: 0.43rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
row-gap: 0.43rem;
|
||||
}
|
||||
|
||||
.box-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
|
||||
.box-item-t {
|
||||
font-size: 0.13rem;
|
||||
font-weight: 500;
|
||||
height: 0.2rem;
|
||||
color: @text-secondary;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.box-item-b {
|
||||
|
||||
>.el-input,
|
||||
.el-select,
|
||||
.el-textarea {
|
||||
width: 3.2rem;
|
||||
border: none;
|
||||
border-bottom: 1px solid @border-color;
|
||||
}
|
||||
}
|
||||
|
||||
.el-textarea .el-textarea__inner {
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.box-item-b .el-input__inner {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.btn-save {
|
||||
width: 0.88rem;
|
||||
height: 0.32rem;
|
||||
margin-top: 0.43rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 3px;
|
||||
color: @white;
|
||||
.flex-center();
|
||||
}
|
||||
|
||||
.el-input {
|
||||
&.is-disabled .el-input__inner {
|
||||
background: @white;
|
||||
}
|
||||
|
||||
&__inner {
|
||||
height: 0.46rem;
|
||||
}
|
||||
|
||||
&__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.input-with-select .el-input-group__prepend {
|
||||
width: 60px;
|
||||
border: none;
|
||||
background: @white;
|
||||
}
|
||||
|
||||
.edit-icon {
|
||||
cursor: pointer;
|
||||
padding: 0.15rem;
|
||||
}
|
||||
|
||||
// Dialog styles
|
||||
.el-dialog__body {
|
||||
padding: 0.3rem 0.8rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.mian-form {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.input-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
margin-left: 0.12rem;
|
||||
width: 1.3rem;
|
||||
background: #eef4ff;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
.flex-center();
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.select-input {
|
||||
width: auto !important;
|
||||
min-width: 1.14rem;
|
||||
}
|
||||
|
||||
// Table styles
|
||||
|
||||
|
||||
// Search styles
|
||||
.com-search {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
|
||||
.msg-search {
|
||||
.flex-between();
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
|
||||
.msgsearch-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.el-button {
|
||||
border-radius: 0.03rem;
|
||||
border: 0.01rem solid var(--color-primary);
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.msgsearch-right {
|
||||
display: flex;
|
||||
|
||||
.el-select {
|
||||
width: 2.4rem;
|
||||
margin-right: 0.1rem;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.search-btn {
|
||||
margin-left: 0.1rem;
|
||||
background: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
}
|
||||
|
||||
// Link styles
|
||||
.a-text {
|
||||
color: #171725;
|
||||
|
||||
&:hover {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-status {
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
|
||||
.is-read {
|
||||
color: @text-secondary;
|
||||
}
|
||||
|
||||
.no-read {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
// Table cell styles
|
||||
tr>td {
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
|
||||
th {
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
|
||||
// Forget password styles
|
||||
.forget-pass {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
line-height: 0.14rem;
|
||||
font-size: 0.14rem;
|
||||
margin-top: 0.04rem;
|
||||
|
||||
>a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// Login styles
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
|
||||
.login-email,
|
||||
.login-phone {
|
||||
color: #666b80;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-phone {
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
padding-bottom: 0.14rem;
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.rember-item {
|
||||
margin-top: 0.2rem;
|
||||
.flex-between();
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
}
|
||||
|
||||
.read-item {
|
||||
margin-top: 0.2rem;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.line-item {
|
||||
margin-top: 0.4rem;
|
||||
|
||||
text {
|
||||
font-size: 16px;
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.code-pass-select {
|
||||
width: auto;
|
||||
height: 44px;
|
||||
border: 1px solid @border-color;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
// Message box styles
|
||||
.el-message-box__btns {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
|
||||
>.el-button {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
// Mobile styles
|
||||
.mobel {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.main-card-title {
|
||||
font-size: 0.48rem;
|
||||
}
|
||||
|
||||
.name-text {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.basic-title,
|
||||
.account-title {
|
||||
font-size: 0.36rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 800;
|
||||
line-height: 0.36rem;
|
||||
color: var(--color-primary);
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.box-item-t {
|
||||
font-size: 0.28rem;
|
||||
height: 0.28rem;
|
||||
}
|
||||
|
||||
.el-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.el-col {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.box-item-b {
|
||||
|
||||
>.el-input,
|
||||
.el-select,
|
||||
.el-textarea {
|
||||
width: 100%;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-input__inner {
|
||||
font-size: 0.32rem;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.btn-save {
|
||||
width: calc(100% - 0.6rem);
|
||||
margin: 0 auto;
|
||||
margin-top: 0.43rem;
|
||||
height: 0.8rem;
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
width: auto;
|
||||
height: 0.8rem;
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
flex-direction: column;
|
||||
|
||||
.btn-ok,
|
||||
.btn-no {
|
||||
width: 100%;
|
||||
height: 0.8rem;
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
margin-left: 0;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
|
||||
.edit-icon {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.dialog-title {
|
||||
font-size: 0.36rem;
|
||||
}
|
||||
|
||||
.forget-pass {
|
||||
font-size: 0.28rem;
|
||||
line-height: 0.29rem;
|
||||
}
|
||||
|
||||
.content_searchbar {
|
||||
.left_tips .tips_item {
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.searchbar {
|
||||
width: 100%;
|
||||
|
||||
.el-input {
|
||||
margin-left: 0;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mob-searchbar {
|
||||
margin-top: 0.53rem;
|
||||
}
|
||||
|
||||
.mob-search-input {
|
||||
height: 0.8rem;
|
||||
background: rgba(134, 146, 176, 0.1);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
|
||||
>input {
|
||||
height: 0.8rem;
|
||||
background: rgba(134, 146, 176, 0.1);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.mob-tabledata {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #d7d8db;
|
||||
border-radius: 0px 0px 3px 3px;
|
||||
}
|
||||
|
||||
.mob-tabledata-item {
|
||||
height: auto;
|
||||
border-bottom: 1px solid #d7d8db;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 0.3rem;
|
||||
}
|
||||
|
||||
.mob-item-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.mob-item-row1,
|
||||
.mob-item-row3,
|
||||
.mob-item-row-notes {
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.27rem;
|
||||
color: @text-secondary;
|
||||
}
|
||||
|
||||
.mob-item-row2-name {
|
||||
font-size: 0.32rem;
|
||||
line-height: 0.33rem;
|
||||
}
|
||||
|
||||
.mob-item-row3 {
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
|
||||
.back-top-img {
|
||||
width: 0.88rem;
|
||||
position: fixed;
|
||||
right: 0.3rem;
|
||||
bottom: 1.17rem;
|
||||
}
|
||||
|
||||
.bottom-text {
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.27rem;
|
||||
color: @text-secondary;
|
||||
margin: 0.4rem 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.basic>.el-row:nth-child(3) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.select-input>.el-input--suffix {
|
||||
width: 1.86rem;
|
||||
}
|
||||
}
|
||||
68
clientarea/hgcloud/css/agreement.css
Normal file
68
clientarea/hgcloud/css/agreement.css
Normal file
@@ -0,0 +1,68 @@
|
||||
.contnet-right-out {
|
||||
margin: auto;
|
||||
font-size: 0.14rem;
|
||||
padding: 0.2rem 3rem;
|
||||
}
|
||||
.contnet-right-out .content-right {
|
||||
border: 1px solid #e6e7eb;
|
||||
border-radius: 3px;
|
||||
padding: 0.36rem 0.5rem;
|
||||
overflow-x: auto;
|
||||
}
|
||||
.contnet-right-out .content-right .right-title {
|
||||
font-size: 0.28rem;
|
||||
font-weight: bold;
|
||||
line-height: 0.28rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.contnet-right-out .content-right .right-keywords-time {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.contnet-right-out .content-right .right-keywords-time .right-time,
|
||||
.contnet-right-out .content-right .right-keywords-time .right-keywords {
|
||||
font-size: 0.14rem;
|
||||
color: #8692b0;
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
.contnet-right-out .content-right .right-keywords-time .right-keywords {
|
||||
margin-left: 0.2rem;
|
||||
}
|
||||
.contnet-right-out .content-right .right-content {
|
||||
word-wrap: break-word;
|
||||
word-break: normal;
|
||||
margin-top: 0.42rem;
|
||||
}
|
||||
.contnet-right-out .content-right .right-content img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.contnet-right-out .content-right .right-attachment {
|
||||
margin-top: 0.42rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.contnet-right-out .content-right .right-attachment .right-attachment-item {
|
||||
margin-right: 0.2rem;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.contnet-right-out .page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.2rem;
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
.contnet-right-out .page .blue {
|
||||
color: var(--color-primary) !important;
|
||||
}
|
||||
.contnet-right-out .page .pre,
|
||||
.contnet-right-out .page .next {
|
||||
cursor: pointer;
|
||||
color: #4e5259;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.contnet-right-out {
|
||||
padding: 0.2rem 0.3rem;
|
||||
}
|
||||
}
|
||||
82
clientarea/hgcloud/css/agreement.less
Normal file
82
clientarea/hgcloud/css/agreement.less
Normal file
@@ -0,0 +1,82 @@
|
||||
.contnet-right-out {
|
||||
margin: auto;
|
||||
font-size: 0.14rem;
|
||||
padding: 0.2rem 3rem;
|
||||
|
||||
.content-right {
|
||||
border: 1px solid #e6e7eb;
|
||||
border-radius: 3px;
|
||||
padding: 0.36rem 0.5rem;
|
||||
// margin-left: .4rem;
|
||||
overflow-x: auto;
|
||||
|
||||
.right-title {
|
||||
font-size: 0.28rem;
|
||||
font-weight: bold;
|
||||
line-height: 0.28rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
|
||||
.right-keywords-time {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.right-time,
|
||||
.right-keywords {
|
||||
font-size: 0.14rem;
|
||||
color: #8692b0;
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
|
||||
.right-keywords {
|
||||
margin-left: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.right-content {
|
||||
word-wrap: break-word;
|
||||
word-break: normal;
|
||||
margin-top: 0.42rem;
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.right-attachment {
|
||||
margin-top: 0.42rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.right-attachment-item {
|
||||
margin-right: 0.2rem;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.2rem;
|
||||
margin-left: 0.4rem;
|
||||
|
||||
.blue {
|
||||
color: var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.pre,
|
||||
.next {
|
||||
cursor: pointer;
|
||||
color: #4e5259;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.contnet-right-out {
|
||||
padding: 0.2rem 0.3rem;
|
||||
}
|
||||
}
|
||||
438
clientarea/hgcloud/css/authentication.css
Normal file
438
clientarea/hgcloud/css/authentication.css
Normal file
@@ -0,0 +1,438 @@
|
||||
.main-card-title {
|
||||
font-size: .28rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #171725;
|
||||
}
|
||||
|
||||
.top-back-img {
|
||||
cursor: pointer;
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
margin-right: 0.25rem;
|
||||
|
||||
}
|
||||
|
||||
.top-line {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: #E6E7EB;
|
||||
opacity: 1;
|
||||
margin-top: .2rem;
|
||||
margin-bottom: 0.65rem;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.content-title {
|
||||
font-size: 0.18rem;
|
||||
color: #1E2736;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.check-type {
|
||||
display: flex;
|
||||
margin-top: .2rem;
|
||||
}
|
||||
|
||||
.check-type>div {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
height: 3.13rem;
|
||||
border: 0.01rem solid #E6E7EB;
|
||||
}
|
||||
|
||||
.select-type {
|
||||
border-radius: 0.03rem;
|
||||
background: #FEFFFF;
|
||||
box-shadow: 0rem 0rem 0.06rem rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.font-18 {
|
||||
color: #1E2736;
|
||||
font-weight: bold;
|
||||
font-size: 0.18rem;
|
||||
}
|
||||
|
||||
/* .person-box {} */
|
||||
.presonl-status {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
text-align: center;
|
||||
height: 0.52rem;
|
||||
line-height: 0.52rem;
|
||||
z-index: 8;
|
||||
}
|
||||
|
||||
.person-success {
|
||||
color: #FFFFFF;
|
||||
font-size: 0.16rem;
|
||||
background: rgb(61, 213, 152);
|
||||
}
|
||||
|
||||
.person-loading {
|
||||
color: #F0142F;
|
||||
font-weight: bold;
|
||||
font-size: 0.16rem;
|
||||
background: rgba(240, 20, 46, 0.08);
|
||||
}
|
||||
|
||||
.check-type>div:nth-of-type(1) {
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.checked-icon {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
line-height: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-bottom: .25rem solid #0058FF;
|
||||
border-left: .25rem solid transparent;
|
||||
}
|
||||
|
||||
.checked-icon::after {
|
||||
content: '√';
|
||||
font-size: .16rem;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: .15rem;
|
||||
}
|
||||
|
||||
.check-mode {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.check-select .el-select {
|
||||
margin-top: .2rem;
|
||||
width: 4.2rem;
|
||||
height: 0.52rem;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
|
||||
.next-box {
|
||||
margin-top: 1.5rem;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
.next-box .el-button {
|
||||
width: 1.8rem;
|
||||
height: 0.46rem;
|
||||
background: #0058FF;
|
||||
color: #FFFFFF;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.next-box .back-btn {
|
||||
color: #0058FF;
|
||||
background: #fff;
|
||||
border: 1px solid #0058FF;
|
||||
}
|
||||
|
||||
.go-Back-Btn {
|
||||
margin-top: 1.1rem;
|
||||
}
|
||||
|
||||
.go-Back-Btn .back-btn {
|
||||
border-radius: 0;
|
||||
width: 1.8rem;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
color: #0058FF;
|
||||
background: #fff;
|
||||
border: 1px solid #0058FF;
|
||||
}
|
||||
|
||||
.main-content .el-form .el-form-item .el-input {
|
||||
width: 5.2rem;
|
||||
}
|
||||
|
||||
|
||||
.type-img img {
|
||||
width: 0.64rem;
|
||||
height: 0.64rem;
|
||||
}
|
||||
|
||||
.type-title {
|
||||
margin: 0.24rem 0 0.21rem 0;
|
||||
}
|
||||
|
||||
.type-tips {
|
||||
margin-bottom: 0.1rem;
|
||||
width: 4.36rem;
|
||||
color: #4E5259;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.upload-btn {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.el-upload--picture-card {
|
||||
width: 3.6rem;
|
||||
height: 2.66rem;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.upload-progress {
|
||||
width: 3.6rem;
|
||||
height: 2.66rem;
|
||||
}
|
||||
|
||||
.upload-btn-img {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 3.6rem;
|
||||
height: 2.66rem;
|
||||
background: #FEFFFF;
|
||||
box-shadow: 0rem 0.08rem 0.12rem rgba(0, 0, 0, 0.08);
|
||||
border-radius: 0.03rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.upload-btn-img img {
|
||||
width: 3.08rem;
|
||||
border: 1px dashed #DCDCDC;
|
||||
height: 1.83rem;
|
||||
}
|
||||
|
||||
.certification-person {
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.visibleImg {
|
||||
height: 65vh;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.visibleImg img {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hide .el-upload--picture-card {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.el-upload-list--picture-card .el-upload-list__item {
|
||||
width: 3.6rem;
|
||||
height: 2.66rem;
|
||||
}
|
||||
|
||||
.el-upload-list--picture-card .el-upload-list__item-thumbnail {
|
||||
width: 3.6rem;
|
||||
height: 2.66rem;
|
||||
}
|
||||
|
||||
.status-box {
|
||||
width: 100%;
|
||||
height: 6.97rem;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
padding-top: 1.08rem;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
|
||||
.third-box {
|
||||
width: 9.7rem;
|
||||
height: 5.49rem;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
padding-top: 1.08rem;
|
||||
border-radius: 0.03rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
}
|
||||
|
||||
.status-title {
|
||||
color: #3DD598;
|
||||
font-weight: 500;
|
||||
font-size: 0.28rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.status-tips {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 400;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.status-info {
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.status-info>div:nth-of-type(1) {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.status-info>div:nth-of-type(2) {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.status-info>p {
|
||||
margin-bottom: .05rem;
|
||||
font-size: 0.13rem;
|
||||
}
|
||||
|
||||
.info-key {
|
||||
color: #8692B0;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
margin-left: .2rem;
|
||||
color: #4E5259;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
margin-top: 0.82rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.btn-box .el-button {
|
||||
width: 1.8rem;
|
||||
background: #0058FF;
|
||||
color: #FFFFFF;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.origin-color {
|
||||
color: #F99600;
|
||||
}
|
||||
|
||||
.black-color {
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.personl-ing {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.title-blue {
|
||||
color: #0058FF;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
|
||||
.updata-btn {
|
||||
margin-top: 0.24rem;
|
||||
}
|
||||
|
||||
.updata-btn .el-button {
|
||||
color: #FFFFFF;
|
||||
font-size: 0.16rem;
|
||||
border-radius: 0;
|
||||
background: #0058FF;
|
||||
width: 1.8rem;
|
||||
height: 0.46rem;
|
||||
}
|
||||
|
||||
.status-img-box img {
|
||||
width: 0.68rem;
|
||||
height: 0.68rem;
|
||||
}
|
||||
|
||||
.title-green {
|
||||
margin-top: 0.21rem;
|
||||
color: #3DD598;
|
||||
font-weight: 800;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
|
||||
.table-box {
|
||||
margin-top: 0.8rem;
|
||||
border-spacing: 0;
|
||||
text-align: left;
|
||||
width: 8.23rem;
|
||||
height: 1.05rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
}
|
||||
|
||||
.mar-top-42 {
|
||||
margin-top: 0.42rem;
|
||||
}
|
||||
|
||||
.table-box tr td {
|
||||
color: #1E2736;
|
||||
font-size: 0.14rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
padding-left: 0.4rem !important;
|
||||
}
|
||||
|
||||
.again-btn {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.again-btn .el-button {
|
||||
border-radius: 0;
|
||||
width: 1.8rem;
|
||||
height: 0.46rem;
|
||||
color: #0058FF;
|
||||
font-size: 0.16rem;
|
||||
border: 1px solid #0058FF;
|
||||
}
|
||||
|
||||
.el-link.el-link--default {
|
||||
align-items: flex-end;
|
||||
margin-left: 0.1rem;
|
||||
color: #0058FF;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
.green-text {
|
||||
color: #3DD598;
|
||||
}
|
||||
|
||||
.font-14 {
|
||||
color: #8692B0;
|
||||
font-size: 0.16rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.bule-text {
|
||||
color: #3699FF;
|
||||
}
|
||||
|
||||
.red-text {
|
||||
text-align: center;
|
||||
font-size: 0.16rem;
|
||||
color: red;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/*去除upload组件过渡效果*/
|
||||
.el-upload-list__item {
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
.mar-top-114 {
|
||||
margin-top: 1.14rem;
|
||||
}
|
||||
|
||||
.tips-text {
|
||||
text-align: center;
|
||||
font-size: 0.14rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
|
||||
.upload-1 {
|
||||
margin-right: 0.6rem;
|
||||
}
|
||||
34
clientarea/hgcloud/css/certification.css
Normal file
34
clientarea/hgcloud/css/certification.css
Normal file
@@ -0,0 +1,34 @@
|
||||
.dialag-content {
|
||||
padding: 1.79rem 1.94rem 2rem 1.94rem;
|
||||
text-align: center;
|
||||
}
|
||||
.tips-title {
|
||||
font-size: 0.28rem;
|
||||
font-weight: 400;
|
||||
color: #1E2736;
|
||||
}
|
||||
.tips-text {
|
||||
margin-top: 0.3rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 400;
|
||||
color: #1E2736;
|
||||
}
|
||||
.button-box {
|
||||
margin-top: 0.8rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.button-box .el-button {
|
||||
width: 1.8rem;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
color: #FFFFFF;
|
||||
font-size: 0.16rem;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.button-box .el-link {
|
||||
color: var(--color-primary);
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
57
clientarea/hgcloud/css/certification.less
Normal file
57
clientarea/hgcloud/css/certification.less
Normal file
@@ -0,0 +1,57 @@
|
||||
// Variables
|
||||
@text-color: #1E2736;
|
||||
@font-size-small: 0.14rem;
|
||||
@font-size-medium: 0.16rem;
|
||||
@font-size-large: 0.28rem;
|
||||
|
||||
// Mixins
|
||||
.flex-center() {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.flex-between() {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
// Styles
|
||||
.dialag-content {
|
||||
padding: 1.79rem 1.94rem 2rem 1.94rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tips-title {
|
||||
font-size: @font-size-large;
|
||||
font-weight: 400;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
.tips-text {
|
||||
margin-top: 0.3rem;
|
||||
font-size: @font-size-small;
|
||||
font-weight: 400;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
.button-box {
|
||||
margin-top: 0.8rem;
|
||||
.flex-center();
|
||||
align-items: flex-end;
|
||||
|
||||
.el-button {
|
||||
width: 1.8rem;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
color: #FFFFFF;
|
||||
font-size: @font-size-medium;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
|
||||
.el-link {
|
||||
color: var(--color-primary);
|
||||
font-size: @font-size-small;
|
||||
}
|
||||
}
|
||||
3174
clientarea/hgcloud/css/common/common.css
Normal file
3174
clientarea/hgcloud/css/common/common.css
Normal file
File diff suppressed because it is too large
Load Diff
4023
clientarea/hgcloud/css/common/common.less
Normal file
4023
clientarea/hgcloud/css/common/common.less
Normal file
File diff suppressed because it is too large
Load Diff
84
clientarea/hgcloud/css/common/element-comment.css
Normal file
84
clientarea/hgcloud/css/common/element-comment.css
Normal file
@@ -0,0 +1,84 @@
|
||||
.el-pagination .el-select .el-input {
|
||||
margin: 0;
|
||||
}
|
||||
.el-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-table__fixed-right::before,
|
||||
.el-table__fixed::before {
|
||||
height: 0;
|
||||
}
|
||||
.el-slider__button-wrapper {
|
||||
z-index: 2;
|
||||
}
|
||||
.el-tabs__nav-wrap::after {
|
||||
height: 1px;
|
||||
}
|
||||
.el-notification__content {
|
||||
overflow-y: auto;
|
||||
padding-right: 5px;
|
||||
max-height: 80vh;
|
||||
}
|
||||
.el-notification__content::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
.el-notification__content::-webkit-scrollbar-track {
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
.el-notification__content::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
/* 提示弹窗 */
|
||||
.el-message-box {
|
||||
width: 5.2rem;
|
||||
}
|
||||
.el-message {
|
||||
z-index: 99999999999 !important;
|
||||
}
|
||||
.el-tooltip__popper {
|
||||
max-width: 50%;
|
||||
}
|
||||
/* 表格 表头和每一行 的统一高度 */
|
||||
thead tr {
|
||||
height: 0.56rem;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
.el-table th.el-table__cell {
|
||||
background-color: #F9FAFC;
|
||||
}
|
||||
tbody .el-table__row {
|
||||
height: 0.6rem;
|
||||
}
|
||||
.el-table .el-table__cell {
|
||||
padding: 0;
|
||||
}
|
||||
.el-container:nth-child(2) {
|
||||
flex-direction: column;
|
||||
background: #f6f6fa;
|
||||
}
|
||||
.el-container:nth-child(2) > .el-main {
|
||||
background: #fff;
|
||||
margin: 0.24rem;
|
||||
margin-top: calc(40px + 0.24rem);
|
||||
border-radius: 0.08rem;
|
||||
padding: 0.24rem;
|
||||
}
|
||||
/* el弹窗自带底部按钮 */
|
||||
.el-message-box__btns > .el-button {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.el-message-box__btns {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
.list-table-border {
|
||||
border: none;
|
||||
}
|
||||
.list-table-border::after,
|
||||
.list-table-border::before {
|
||||
display: none;
|
||||
}
|
||||
111
clientarea/hgcloud/css/common/element-comment.less
Normal file
111
clientarea/hgcloud/css/common/element-comment.less
Normal file
@@ -0,0 +1,111 @@
|
||||
.el-pagination .el-select .el-input {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.el-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.el-table__fixed-right::before,
|
||||
.el-table__fixed::before {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.el-slider__button-wrapper {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.el-tabs__nav-wrap::after {
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
.el-notification__content {
|
||||
overflow-y: auto;
|
||||
padding-right: 5px;
|
||||
max-height: 80vh;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 提示弹窗 */
|
||||
.el-message-box {
|
||||
width: 5.2rem;
|
||||
}
|
||||
|
||||
.el-message {
|
||||
z-index: 99999999999 !important;
|
||||
}
|
||||
|
||||
.el-tooltip__popper {
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
/* 表格 表头和每一行 的统一高度 */
|
||||
thead tr {
|
||||
height: 0.56rem;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
|
||||
.el-table th.el-table__cell {
|
||||
background-color: #F9FAFC;
|
||||
}
|
||||
|
||||
tbody .el-table__row {
|
||||
height: 0.6rem;
|
||||
}
|
||||
|
||||
.el-table .el-table__cell {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.el-container:nth-child(2) {
|
||||
flex-direction: column;
|
||||
background: #f6f6fa;
|
||||
|
||||
&>.el-main {
|
||||
background: #fff;
|
||||
margin: 0.24rem;
|
||||
margin-top: calc(40px + 0.24rem);
|
||||
border-radius: 0.08rem;
|
||||
padding: 0.24rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* el弹窗自带底部按钮 */
|
||||
.el-message-box__btns>.el-button {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.el-message-box__btns {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
.list-table-border {
|
||||
border: none;
|
||||
|
||||
&::after,
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
1
clientarea/hgcloud/css/common/element.css
Normal file
1
clientarea/hgcloud/css/common/element.css
Normal file
File diff suppressed because one or more lines are too long
BIN
clientarea/hgcloud/css/common/fonts/element-icons.ttf
Normal file
BIN
clientarea/hgcloud/css/common/fonts/element-icons.ttf
Normal file
Binary file not shown.
BIN
clientarea/hgcloud/css/common/fonts/element-icons.woff
Normal file
BIN
clientarea/hgcloud/css/common/fonts/element-icons.woff
Normal file
Binary file not shown.
75
clientarea/hgcloud/css/common/reset.css
Normal file
75
clientarea/hgcloud/css/common/reset.css
Normal file
@@ -0,0 +1,75 @@
|
||||
@charset 'utf-8';
|
||||
/*这些元素都建议重新初始化*/
|
||||
body,
|
||||
div,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ul,
|
||||
ol,
|
||||
li,
|
||||
tr,
|
||||
td,
|
||||
th,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
hr,
|
||||
br,
|
||||
img,
|
||||
table,
|
||||
input,
|
||||
form,
|
||||
a,
|
||||
p,
|
||||
textarea {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
/*去掉列表默认排列*/
|
||||
ul,
|
||||
ol,
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
/*去掉底部横线*/
|
||||
/*把a元素更改设置成块级元素，这个根据实际情况决定要不要*/
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
/*img标签要清除border。*/
|
||||
/*display设为block设置为块级元素，默认为display:inline;
|
||||
存在下边线多出4px状况,所以一般设为block*/
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(144, 147, 153, 0.3);
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
cursor: pointer;
|
||||
background-color: rgba(144, 147, 153, 0.5);
|
||||
}
|
||||
/*清除浮动破坏带来的塌陷问题*/
|
||||
/*清除浮动的兼容IE*/
|
||||
.clearfloat {
|
||||
zoom: 1;
|
||||
}
|
||||
.clearfloat:after {
|
||||
display: block;
|
||||
clear: both;
|
||||
content: "";
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
}
|
||||
89
clientarea/hgcloud/css/common/reset.less
Normal file
89
clientarea/hgcloud/css/common/reset.less
Normal file
@@ -0,0 +1,89 @@
|
||||
@charset 'utf-8';
|
||||
|
||||
|
||||
/*这些元素都建议重新初始化*/
|
||||
body,
|
||||
div,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ul,
|
||||
ol,
|
||||
li,
|
||||
tr,
|
||||
td,
|
||||
th,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
hr,
|
||||
br,
|
||||
img,
|
||||
table,
|
||||
input,
|
||||
form,
|
||||
a,
|
||||
p,
|
||||
textarea {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*去掉列表默认排列*/
|
||||
ul,
|
||||
ol,
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*去掉底部横线*/
|
||||
/*把a元素更改设置成块级元素，这个根据实际情况决定要不要*/
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/*img标签要清除border。*/
|
||||
/*display设为block设置为块级元素，默认为display:inline;
|
||||
存在下边线多出4px状况,所以一般设为block*/
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(144, 147, 153, .3);
|
||||
border-radius: 0.5rem;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
background-color: rgba(144, 147, 153, .5);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*清除浮动破坏带来的塌陷问题*/
|
||||
/*清除浮动的兼容IE*/
|
||||
.clearfloat {
|
||||
zoom: 1;
|
||||
}
|
||||
|
||||
.clearfloat:after {
|
||||
display: block;
|
||||
clear: both;
|
||||
content: "";
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
}
|
||||
386
clientarea/hgcloud/css/common/viewer.min.css
vendored
Normal file
386
clientarea/hgcloud/css/common/viewer.min.css
vendored
Normal file
@@ -0,0 +1,386 @@
|
||||
/*!
|
||||
* Viewer.js v0.3.1
|
||||
* https://github.com/fengyuanchen/viewerjs
|
||||
*
|
||||
* Copyright (c) 2015-2016 Fengyuan Chen
|
||||
* Released under the MIT license
|
||||
*
|
||||
* Date: 2016-02-02T11:35:36.273Z
|
||||
*/
|
||||
.viewer-container,
|
||||
.viewer-navbar {
|
||||
background-color: #000;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.viewer-canvas,
|
||||
.viewer-container,
|
||||
.viewer-footer,
|
||||
.viewer-player {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.viewer-button,
|
||||
.viewer-canvas,
|
||||
.viewer-container,
|
||||
.viewer-footer,
|
||||
.viewer-list,
|
||||
.viewer-navbar,
|
||||
.viewer-open,
|
||||
.viewer-title,
|
||||
.viewer-toolbar,
|
||||
.viewer-toolbar>li {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.viewer-close:before,
|
||||
.viewer-flip-horizontal:before,
|
||||
.viewer-flip-vertical:before,
|
||||
.viewer-fullscreen-exit:before,
|
||||
.viewer-fullscreen:before,
|
||||
.viewer-next:before,
|
||||
.viewer-one-to-one:before,
|
||||
.viewer-play:before,
|
||||
.viewer-prev:before,
|
||||
.viewer-reset:before,
|
||||
.viewer-rotate-left:before,
|
||||
.viewer-rotate-right:before,
|
||||
.viewer-zoom-in:before,
|
||||
.viewer-zoom-out:before {
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
color: transparent;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAAAUCAYAAABWOyJDAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAQPSURBVHic7Zs/iFxVFMa/0U2UaJGksUgnIVhYxVhpjDbZCBmLdAYECxsRFBTUamcXUiSNncgKQbSxsxH8gzAP3FU2jY0kKKJNiiiIghFlccnP4p3nPCdv3p9778vsLOcHB2bfveeb7955c3jvvNkBIMdxnD64a94GHMfZu3iBcRynN7zAOI7TG15gHCeeNUkr8zaxG2lbYDYsdgMbktBsP03jdQwljSXdtBhLOmtjowC9Mg9L+knSlcD8TNKpSA9lBpK2JF2VdDSR5n5J64m0qli399hNFMUlpshQii5jbXTbHGviB0nLNeNDSd9VO4A2UdB2fp+x0eCnaXxWXGA2X0au/3HgN9P4LFCjIANOJdrLr0zzZ+BEpNYDwKbpnQMeAw4m8HjQtM6Z9qa917zPQwFr3M5KgA6J5rTJCdFZJj9/lyvGhsDvwFNVuV2MhhjrK6b9bFiE+j1r87eBl4HDwCF7/U/k+ofAX5b/EXBv5JoLMuILzf3Ap6Z3EzgdqHMCuF7hcQf4HDgeoHnccncqdK/TvSDWffFXI/exICY/xZyqc6XLWF1UFZna4gJ7q8BsRvgd2/xXpo6P+D9dfT7PpECtA3cnWPM0GXGFZh/wgWltA+cDNC7X+AP4GzjZQe+k5dRxuYPeiuXU7e1qwLpDz7dFjXKRaSwuMLvAlG8zZlG+YmiK1HoFqT7wP2z+4Q45TfEGcMt01xLoNZEBTwRqD4BLpnMLeC1A41UmVxsXgXeBayV/Wx20rpTyrpnWRft7p6O/FdqzGrDukPNtkaMoMo3FBdBSQMOnYBCReyf05s126fU9ytfX98+mY54Kxnp7S9K3kj6U9KYdG0h6UdLbkh7poFXMfUnSOyVvL0h6VtIXHbS6nOP+s/Zm9mvyXW1uuC9ohZ72E9uDmXWLJOB1GxsH+DxPftsB8B6wlGDN02TAkxG6+4D3TWsbeC5CS8CDFce+AW500LhhOW2020TRjK3b21HEmgti9m0RonxbdMZeVzV+/4tF3cBpP7E9mKHNL5q8h5g0eYsCMQz0epq8gQrwMXAgcs0FGXGFRcB9wCemF9PkbYqM/Bas7fxLwNeJPdTdpo4itQti8lPMqTpXuozVRVXPpbHI3KkNTB1NfkL81j2mvhDp91HgV9MKuRIqrykj3WPq4rHyL+axj8/qGPmTqi6F9YDlHOvJU6oYcTsh/TYSzWmTE6JT19CtLTJt32D6CmHe0eQn1O8z5AXgT4sx4Vcu0/EQecMydB8z0hUWkTd2t4CrwNEePqMBcAR4mrBbwyXLPWJa8zrXmmLEhNBmfpkuY2102xxrih+pb+ieAb6vGhuA97UcJ5KR8gZ77K+99xxeYBzH6Q3/Z0fHcXrDC4zjOL3hBcZxnN74F+zlvXFWXF9PAAAAAElFTkSuQmCC);
|
||||
background-repeat: no-repeat
|
||||
}
|
||||
|
||||
.viewer-zoom-in:before {
|
||||
content: 'Zoom In';
|
||||
background-position: 0 0
|
||||
}
|
||||
|
||||
.viewer-zoom-out:before {
|
||||
content: 'Zoom Out';
|
||||
background-position: -20px 0
|
||||
}
|
||||
|
||||
.viewer-one-to-one:before {
|
||||
content: 'One to One';
|
||||
background-position: -40px 0
|
||||
}
|
||||
|
||||
.viewer-reset:before {
|
||||
content: 'Reset';
|
||||
background-position: -60px 0
|
||||
}
|
||||
|
||||
.viewer-prev:before {
|
||||
content: 'Previous';
|
||||
background-position: -80px 0
|
||||
}
|
||||
|
||||
.viewer-play:before {
|
||||
content: 'Play';
|
||||
background-position: -100px 0
|
||||
}
|
||||
|
||||
.viewer-next:before {
|
||||
content: 'Next';
|
||||
background-position: -120px 0
|
||||
}
|
||||
|
||||
.viewer-rotate-left:before {
|
||||
content: 'Rotate Left';
|
||||
background-position: -140px 0
|
||||
}
|
||||
|
||||
.viewer-rotate-right:before {
|
||||
content: 'Rotate Right';
|
||||
background-position: -160px 0
|
||||
}
|
||||
|
||||
.viewer-flip-horizontal:before {
|
||||
content: 'Flip Horizontal';
|
||||
background-position: -180px 0
|
||||
}
|
||||
|
||||
.viewer-flip-vertical:before {
|
||||
content: 'Flip Vertical';
|
||||
background-position: -200px 0
|
||||
}
|
||||
|
||||
.viewer-fullscreen:before {
|
||||
content: 'Enter Full Screen';
|
||||
background-position: -220px 0
|
||||
}
|
||||
|
||||
.viewer-fullscreen-exit:before {
|
||||
content: 'Exit Full Screen';
|
||||
background-position: -240px 0
|
||||
}
|
||||
|
||||
.viewer-close:before {
|
||||
content: 'Close';
|
||||
background-position: -260px 0
|
||||
}
|
||||
|
||||
.viewer-container {
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
direction: ltr !important;
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
-webkit-touch-callout: none
|
||||
}
|
||||
|
||||
.viewer-container ::-moz-selection,
|
||||
.viewer-container::-moz-selection {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.viewer-container ::selection,
|
||||
.viewer-container::selection {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.viewer-container img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
min-width: 0 !important;
|
||||
max-width: none !important;
|
||||
height: auto;
|
||||
min-height: 0 !important;
|
||||
max-height: none !important
|
||||
}
|
||||
|
||||
.viewer-player,
|
||||
.viewer-tooltip {
|
||||
display: none;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.viewer-canvas {
|
||||
position: absolute;
|
||||
top: 0
|
||||
}
|
||||
|
||||
.viewer-canvas>img {
|
||||
width: auto;
|
||||
max-width: 90% !important;
|
||||
height: auto;
|
||||
margin: 15px auto
|
||||
}
|
||||
|
||||
.viewer-footer {
|
||||
position: absolute;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.viewer-navbar {
|
||||
background-color: rgba(0, 0, 0, .5)
|
||||
}
|
||||
|
||||
.viewer-list {
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 50px;
|
||||
margin: 0;
|
||||
padding: 1px 0
|
||||
}
|
||||
|
||||
.viewer-list>li {
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
width: 30px;
|
||||
height: 50px;
|
||||
cursor: pointer;
|
||||
opacity: .5;
|
||||
color: transparent;
|
||||
filter: alpha(opacity=50)
|
||||
}
|
||||
|
||||
.viewer-list>li+li {
|
||||
margin-left: 1px
|
||||
}
|
||||
|
||||
.viewer-list>.viewer-active {
|
||||
opacity: 1;
|
||||
filter: alpha(opacity=100)
|
||||
}
|
||||
|
||||
.viewer-player {
|
||||
top: 0;
|
||||
cursor: none;
|
||||
background-color: #000
|
||||
}
|
||||
|
||||
.viewer-player>img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.viewer-toolbar {
|
||||
width: 280px;
|
||||
margin: 0 auto 5px;
|
||||
padding: 3px 0
|
||||
}
|
||||
|
||||
.viewer-toolbar>li {
|
||||
float: left;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
background-color: #000;
|
||||
background-color: rgba(0, 0, 0, .5)
|
||||
}
|
||||
|
||||
.viewer-toolbar>li:hover {
|
||||
background-color: #000;
|
||||
background-color: rgba(0, 0, 0, .8)
|
||||
}
|
||||
|
||||
.viewer-toolbar>li:before {
|
||||
margin: 2px
|
||||
}
|
||||
|
||||
.viewer-toolbar>li+li {
|
||||
margin-left: 1px
|
||||
}
|
||||
|
||||
.viewer-toolbar>.viewer-play {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: -3px;
|
||||
margin-bottom: -3px
|
||||
}
|
||||
|
||||
.viewer-toolbar>.viewer-play:before {
|
||||
margin: 5px
|
||||
}
|
||||
|
||||
.viewer-tooltip {
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50px;
|
||||
height: 20px;
|
||||
margin-top: -10px;
|
||||
margin-left: -25px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
border-radius: 10px;
|
||||
background-color: #000;
|
||||
background-color: rgba(0, 0, 0, .8)
|
||||
}
|
||||
|
||||
.viewer-title {
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
display: inline-block;
|
||||
max-width: 90%;
|
||||
margin: 0 5% 5px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
opacity: .8;
|
||||
color: #ccc;
|
||||
filter: alpha(opacity=80)
|
||||
}
|
||||
|
||||
.viewer-title:hover {
|
||||
opacity: 1;
|
||||
filter: alpha(opacity=100)
|
||||
}
|
||||
|
||||
.viewer-button {
|
||||
position: absolute;
|
||||
top: -40px;
|
||||
right: -40px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
background-color: #000;
|
||||
background-color: rgba(0, 0, 0, .5)
|
||||
}
|
||||
|
||||
.viewer-button:before {
|
||||
position: absolute;
|
||||
bottom: 15px;
|
||||
left: 15px
|
||||
}
|
||||
|
||||
.viewer-fixed {
|
||||
position: fixed
|
||||
}
|
||||
|
||||
.viewer-show {
|
||||
display: block
|
||||
}
|
||||
|
||||
.viewer-hide {
|
||||
display: none
|
||||
}
|
||||
|
||||
.viewer-invisible {
|
||||
visibility: hidden
|
||||
}
|
||||
|
||||
.viewer-move {
|
||||
cursor: move;
|
||||
cursor: -webkit-grab;
|
||||
cursor: -moz-grab;
|
||||
cursor: grab
|
||||
}
|
||||
|
||||
.viewer-fade {
|
||||
opacity: 0;
|
||||
filter: alpha(opacity=0)
|
||||
}
|
||||
|
||||
.viewer-in {
|
||||
opacity: 1;
|
||||
filter: alpha(opacity=100)
|
||||
}
|
||||
|
||||
.viewer-transition {
|
||||
-webkit-transition: all .3s ease-out;
|
||||
-o-transition: all .3s ease-out;
|
||||
transition: all .3s ease-out
|
||||
}
|
||||
|
||||
@media (max-width:767px) {
|
||||
.viewer-hide-xs-down {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:991px) {
|
||||
.viewer-hide-sm-down {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:1199px) {
|
||||
.viewer-hide-md-down {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
951
clientarea/hgcloud/css/finance.css
Normal file
951
clientarea/hgcloud/css/finance.css
Normal file
@@ -0,0 +1,951 @@
|
||||
.el-main {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.finance .finance-top .finance-title {
|
||||
padding: 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
font-weight: 600;
|
||||
color: #2B2B2B;
|
||||
border-bottom: 1px solid #EAEAEA;
|
||||
}
|
||||
.finance .finance-top .finance-money-main {
|
||||
padding: 0.24rem;
|
||||
border-bottom: 1px solid #EAEAEA;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-left .balance-left-title {
|
||||
font-weight: 400;
|
||||
font-size: 0.14rem;
|
||||
color: #646464;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-left .balance-left-title .balance-title-num {
|
||||
font-weight: 600;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-left .balance-left-num {
|
||||
margin-top: 0.16rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.45rem;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-left .balance-left-num .prefix {
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.16rem;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-right .el-button {
|
||||
height: 0.37rem;
|
||||
border-radius: 0.04rem;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-right .balance-tx-btn {
|
||||
color: var(--color-primary);
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-balance .balance-right .tx-list {
|
||||
font-size: 0.14rem;
|
||||
color: #999999;
|
||||
cursor: pointer;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money {
|
||||
margin-top: 0.24rem;
|
||||
padding-top: 0.24rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-top: 1px dashed #EAEAEA;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money .other-money-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 0.4rem;
|
||||
border-left: 1px solid #EAEAEA;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money .other-money-item:nth-of-type(1) {
|
||||
padding-left: 0;
|
||||
border-left: none;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money .other-money-item .other-money-item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.05rem;
|
||||
color: #646464;
|
||||
font-weight: 400;
|
||||
font-size: 0.14rem;
|
||||
margin-right: 0.08rem;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money .other-money-item .other-money-item-value {
|
||||
font-weight: 600;
|
||||
font-size: 0.18rem;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money .other-money-item .other-money-item-value .prefix {
|
||||
font-size: 0.12rem;
|
||||
}
|
||||
.finance .finance-top .finance-money-main .finance-other-money .other-money-item .freeze-list {
|
||||
margin-left: 0.16rem;
|
||||
font-weight: 400;
|
||||
font-size: 0.12rem;
|
||||
color: var(--color-primary);
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
}
|
||||
.finance .content_box {
|
||||
padding: 0.24rem;
|
||||
}
|
||||
.a-text {
|
||||
cursor: pointer;
|
||||
}
|
||||
.a-text:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.content_searchbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.content_searchbar .left_tips {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.2rem;
|
||||
}
|
||||
.content_searchbar .left_tips .all-pay {
|
||||
padding: 0 10px;
|
||||
height: 32px;
|
||||
}
|
||||
.content_searchbar .left_tips .all-del {
|
||||
margin-left: 0;
|
||||
padding: 0 10px;
|
||||
height: 32px;
|
||||
}
|
||||
.content_searchbar .left_tips .tips_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.finance .el-tabs__content {
|
||||
min-height: 5rem;
|
||||
}
|
||||
.dot {
|
||||
width: 0.08rem;
|
||||
height: 0.08rem;
|
||||
line-height: 0.1rem;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.dot.new {
|
||||
background: #0058FF;
|
||||
}
|
||||
.dot.renew,
|
||||
.dot.on_demand {
|
||||
background: #3DD598;
|
||||
}
|
||||
.dot.upgrade,
|
||||
.dot.change_billing_cycle {
|
||||
background: #F0142F;
|
||||
}
|
||||
.dot.artificial {
|
||||
background: #F99600;
|
||||
}
|
||||
.dot.recharge {
|
||||
background: #9C27B0;
|
||||
}
|
||||
.main_table {
|
||||
margin-top: 0.7rem;
|
||||
}
|
||||
.main_table > thead > tr > th:nth-child(1) {
|
||||
padding-left: 0.3rem;
|
||||
}
|
||||
.pay-html {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.pay-html > img {
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
}
|
||||
.status-tag {
|
||||
padding: 0.04rem 0.1rem;
|
||||
border-radius: 3px;
|
||||
font-size: 13px;
|
||||
border: none;
|
||||
}
|
||||
.status-tag.Unpaid {
|
||||
background-color: rgba(240, 20, 47, 0.08);
|
||||
color: var(--color-danger);
|
||||
border: none;
|
||||
}
|
||||
.status-tag.Paid {
|
||||
background-color: rgba(61, 213, 152, 0.12);
|
||||
color: var(--color-success);
|
||||
border: none;
|
||||
}
|
||||
.status-tag.Wait {
|
||||
background-color: rgba(230, 162, 60, 0.12);
|
||||
color: var(--color-warning);
|
||||
border: none;
|
||||
}
|
||||
.status-tag.Refunded {
|
||||
background-color: rgba(64, 158, 255, 0.12);
|
||||
color: var(--color-info);
|
||||
border: none;
|
||||
}
|
||||
.gateway-pay {
|
||||
color: #5c5ee4;
|
||||
cursor: pointer;
|
||||
}
|
||||
.tooltip {
|
||||
text-align: center;
|
||||
}
|
||||
.balance-tag {
|
||||
padding: 0.04rem 0.1rem;
|
||||
border-radius: 3px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.balance-tag.Recharge,
|
||||
.balance-tag.recharge {
|
||||
background: rgba(54, 153, 255, 0.12);
|
||||
color: var(--color-info);
|
||||
}
|
||||
.Applied {
|
||||
background: rgba(249, 150, 0, 0.12);
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.Refund {
|
||||
background: rgba(240, 20, 47, 0.12);
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.Withdraw {
|
||||
background: rgba(61, 213, 152, 0.12);
|
||||
color: var(--color-success);
|
||||
}
|
||||
.Artificial {
|
||||
background: rgba(54, 153, 255, 0.12);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.Freeze {
|
||||
background: rgba(240, 20, 47, 0.12);
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.Unfreeze {
|
||||
background: rgba(54, 153, 255, 0.12);
|
||||
color: var(--color-info);
|
||||
}
|
||||
.el-form,
|
||||
.el-select {
|
||||
width: 100%;
|
||||
}
|
||||
.el-form-item__label {
|
||||
font-size: 0.16rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #1e2736;
|
||||
}
|
||||
.kd-dialog .dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
color: #171725;
|
||||
}
|
||||
.kd-dialog .dialog-dec {
|
||||
margin-top: 0.2rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.kd-dialog .el-dialog__body {
|
||||
padding: 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.kd-dialog .dialog-box {
|
||||
margin-top: 0.3rem;
|
||||
padding: 0.2rem 0.16rem;
|
||||
border: 0.01rem solid #e6e7eb;
|
||||
}
|
||||
.kd-dialog .kd-item {
|
||||
margin-bottom: 0.1rem;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.kd-dialog .kd-item:nth-last-of-type(1) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.kd-dialog .kd-item .kd-label {
|
||||
color: #8692b0;
|
||||
}
|
||||
.kd-dialog .kd-item .kd-value {
|
||||
margin-left: 0.3rem;
|
||||
color: #4E5259;
|
||||
}
|
||||
.kd-dialog .dialog-fotter {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.kd-dialog .dialog-fotter .el-button {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
color: #1e2736;
|
||||
font-size: 0.16rem;
|
||||
background: #E7E7E7;
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
}
|
||||
.info-dialog .dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
color: #171725;
|
||||
}
|
||||
.info-dialog .certification-info {
|
||||
margin-top: 0.1rem;
|
||||
margin-bottom: 0.3rem;
|
||||
padding: 0.2rem 0.16rem;
|
||||
border: 0.01rem solid #e6e7eb;
|
||||
}
|
||||
.info-dialog .certification-info .kd-item {
|
||||
margin-bottom: 0.1rem;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.info-dialog .certification-info .kd-item:nth-last-of-type(1) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.info-dialog .certification-info .kd-item .kd-label {
|
||||
color: #8692b0;
|
||||
}
|
||||
.info-dialog .certification-info .kd-item .kd-value {
|
||||
margin-left: 0.3rem;
|
||||
color: #4E5259;
|
||||
}
|
||||
.info-dialog .dialog-dec {
|
||||
font-size: 0.14rem;
|
||||
padding: 0.12rem 0.16rem;
|
||||
margin-top: 0.4rem;
|
||||
color: var(--color-danger);
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
background: #FDE6E9;
|
||||
}
|
||||
.info-dialog .dialog-dec p {
|
||||
margin: 0;
|
||||
}
|
||||
.info-dialog .el-dialog__body {
|
||||
padding: 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.info-dialog .dialog-fotter {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.info-dialog .info-form .el-form-item__label {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.info-dialog .save-btn,
|
||||
.info-dialog .cancel-btn {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
border-radius: 0.03rem;
|
||||
border: none;
|
||||
}
|
||||
.info-dialog .save-btn {
|
||||
background: var(--color-primary);
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.info-dialog .cancel-btn {
|
||||
margin-left: 0.12rem;
|
||||
background: #E7E7E7;
|
||||
color: #1e2736;
|
||||
}
|
||||
.info-dialog .first-save-tip {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.cancel-dialog .dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
color: #171725;
|
||||
}
|
||||
.cancel-dialog .el-dialog__body {
|
||||
padding: 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.cancel-dialog .dialog-dec {
|
||||
margin-top: 0.3rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.cancel-dialog .dialog-fotter {
|
||||
margin-top: 0.4rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.cancel-dialog .dialog-fotter .save-btn,
|
||||
.cancel-dialog .dialog-fotter .cancel-btn {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
border: none;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.cancel-dialog .dialog-fotter .save-btn {
|
||||
background: var(--color-primary);
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.cancel-dialog .dialog-fotter .cancel-btn {
|
||||
margin-left: 0.12rem;
|
||||
background: #E7E7E7;
|
||||
color: #1e2736;
|
||||
}
|
||||
.mail-dialog .dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
color: #171725;
|
||||
}
|
||||
.mail-dialog .dialog-dec {
|
||||
font-size: 0.14rem;
|
||||
margin-top: 0.3rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.mail-dialog .el-dialog__body {
|
||||
padding: 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.mail-dialog .dialog-fotter {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.mail-dialog .info-form .el-form-item__label {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.mail-dialog .fotter-left {
|
||||
color: #1e2736;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.mail-dialog .fotter-left .price-blue {
|
||||
font-weight: bold;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.mail-dialog .save-btn,
|
||||
.mail-dialog .cancel-btn {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
border-radius: 0.03rem;
|
||||
border: none;
|
||||
}
|
||||
.mail-dialog .save-btn {
|
||||
background: var(--color-primary);
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.mail-dialog .cancel-btn {
|
||||
margin-left: 0.12rem;
|
||||
background: #E7E7E7;
|
||||
color: #1e2736;
|
||||
}
|
||||
.creat-dia .dialog-tips {
|
||||
display: flex;
|
||||
}
|
||||
.creat-dia .tips_item {
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.credit-content {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.credit-content .credit-top {
|
||||
display: flex;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.credit-content .credit-top .credit-item {
|
||||
margin-left: 0.4rem;
|
||||
padding: 0.31rem 0.2rem 0.4rem 0.2rem;
|
||||
flex: 1;
|
||||
flex-shrink: 0;
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
border: 0.01rem solid #e6e7eb;
|
||||
}
|
||||
.credit-content .credit-top .credit-item:nth-of-type(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: #8692b0;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-top .item-l {
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-top .item-r {
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-top .label-box {
|
||||
display: inline-block;
|
||||
padding: 0.03rem 0.16rem;
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-top .is-active {
|
||||
background-color: rgba(54, 153, 255, 0.12);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-top .no-active {
|
||||
background-color: rgba(240, 20, 47, 0.08);
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-bottom {
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .item-bottom .item-bl {
|
||||
font-size: 0.28rem;
|
||||
font-weight: bold;
|
||||
color: #1e2736;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .flex-bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .flex-bottom .credit-btn,
|
||||
.credit-content .credit-top .credit-item .flex-bottom .no-btn {
|
||||
height: 0.32rem;
|
||||
font-size: 0.14rem;
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .flex-bottom .credit-btn {
|
||||
background: var(--color-primary);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.credit-content .credit-top .credit-item .flex-bottom .no-btn {
|
||||
border: 0.01rem solid #e6e7eb;
|
||||
background: #FFFFFF;
|
||||
color: #757575;
|
||||
}
|
||||
.credit-content .credit-operation {
|
||||
cursor: pointer;
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.dialog-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.el-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.form-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.form-footer > .btn-ok {
|
||||
background: var(--color-primary);
|
||||
border-radius: 3px;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.form-footer > .btn-no {
|
||||
background: #e7e7e7;
|
||||
border-radius: 3px;
|
||||
color: #1e2736;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.true-money {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.orderid_a {
|
||||
cursor: pointer;
|
||||
}
|
||||
.orderid_a:hover {
|
||||
border-bottom: 2px solid #808080;
|
||||
}
|
||||
.el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.input-search {
|
||||
padding-right: 0.1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.cz-input {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.cz-input > .btn-ok {
|
||||
margin-left: 0.1rem;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 3px;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-table__expand-icon {
|
||||
position: absolute;
|
||||
left: 0.1rem;
|
||||
}
|
||||
.el-table__indent {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.mobel {
|
||||
display: none;
|
||||
}
|
||||
.el-icon-more {
|
||||
font-size: 0.16rem;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
.operation-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.operation-item {
|
||||
margin-top: 0.05rem;
|
||||
margin-bottom: 0.05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.operation-item:hover {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.has-border {
|
||||
border: 0.01rem solid #e6e7eb;
|
||||
}
|
||||
.contract-status {
|
||||
display: inline-block;
|
||||
padding: 0.04rem 0.1rem;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.help-icon {
|
||||
cursor: pointer;
|
||||
margin-left: 0.04rem;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.delete-order-dialog .el-dialog__header {
|
||||
padding: 0;
|
||||
}
|
||||
.delete-order-dialog .el-dialog__body {
|
||||
padding: 0;
|
||||
}
|
||||
.delete-order-dialog .delete-box {
|
||||
height: 2.56rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #ffffff;
|
||||
}
|
||||
.delete-order-dialog .delete-content {
|
||||
font-size: 0.18rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.delete-order-dialog .delete-btn {
|
||||
margin-top: 0.4rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.delete-order-dialog .delete-btn .save-btn,
|
||||
.delete-order-dialog .delete-btn .cancel-btn {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
border: none;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.delete-order-dialog .delete-btn .save-btn {
|
||||
background: var(--color-danger);
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.delete-order-dialog .delete-btn .cancel-btn {
|
||||
margin-left: 0.12rem;
|
||||
background: #E7E7E7;
|
||||
color: #1e2736;
|
||||
}
|
||||
.pre-dialog .dialog-box {
|
||||
text-align: center;
|
||||
}
|
||||
.pre-dialog .dialog-box .tit {
|
||||
font-size: 0.18rem;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.pre-dialog .dialog-box .con .item {
|
||||
margin: 5px 0;
|
||||
}
|
||||
.pre-dialog .dialog-fotter {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.pre-dialog .dialog-fotter .save-btn {
|
||||
background: var(--color-primary);
|
||||
color: #fff;
|
||||
}
|
||||
.pre-dialog .s-tip {
|
||||
margin: 0.2rem 0 0 0;
|
||||
font-size: 0.14rem;
|
||||
color: #999;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.content_searchbar .left_tips .tips_item {
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.searchbar {
|
||||
width: 100%;
|
||||
}
|
||||
.searchbar .el-input {
|
||||
width: 100% !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
.content_searchbar {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.mob-searchbar {
|
||||
margin-top: 0.53rem;
|
||||
}
|
||||
.mob-search-input {
|
||||
height: 0.8rem;
|
||||
background: rgba(134, 146, 176, 0.1);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
.mob-search-input > input {
|
||||
height: 0.8rem;
|
||||
background: rgba(134, 146, 176, 0.1);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
.mob-tabledata {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #d7d8db;
|
||||
border-radius: 0px 0px 3px 3px;
|
||||
}
|
||||
.mob-tabledata-item {
|
||||
height: auto;
|
||||
border-bottom: 1px solid #d7d8db;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 0.3rem;
|
||||
}
|
||||
.mob-item-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.mob-item-row1,
|
||||
.mob-item-row3,
|
||||
.mob-item-row-notes {
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.26rem;
|
||||
color: #8692b0;
|
||||
margin-left: 0.26rem;
|
||||
}
|
||||
.mob-item-row1 {
|
||||
margin-top: 0.41rem;
|
||||
align-items: center;
|
||||
}
|
||||
.mob-item-row2 {
|
||||
font-size: 0.3rem;
|
||||
line-height: 0.31rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.mob-item-row3 {
|
||||
margin-bottom: 0.33rem;
|
||||
}
|
||||
.mob-item-row2-name {
|
||||
width: 50%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.bottom-text {
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.26rem;
|
||||
color: #8692b0;
|
||||
margin: 0.4rem 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.back-top-img {
|
||||
width: 0.88rem;
|
||||
position: fixed;
|
||||
right: 0.3rem;
|
||||
bottom: 1.17rem;
|
||||
}
|
||||
.el-form-item__label {
|
||||
font-size: 0.32rem;
|
||||
line-height: 0.32rem;
|
||||
}
|
||||
.dialog-form .el-input__inner {
|
||||
height: 0.8rem;
|
||||
}
|
||||
.cz-input > .btn-ok {
|
||||
height: 0.8rem;
|
||||
}
|
||||
.dialog-footer {
|
||||
flex-direction: column;
|
||||
}
|
||||
.dialog-footer .btn-ok,
|
||||
.dialog-footer .btn-no {
|
||||
width: 100%;
|
||||
height: 0.8rem;
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
.dialog-footer .btn-no {
|
||||
margin-left: 0;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.top-line {
|
||||
display: none;
|
||||
}
|
||||
.order-detail-table {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
.main_table {
|
||||
display: none;
|
||||
}
|
||||
.mob-item-row-child {
|
||||
background: #eef4ff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.child-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
font-size: 0.26rem;
|
||||
margin-bottom: 0.16rem;
|
||||
line-height: 0.4rem;
|
||||
color: #8692b0;
|
||||
margin-left: 0.26rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.child-row:nth-child(1) {
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
.child-row-name {
|
||||
color: #1e2736;
|
||||
width: 2.86rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.money {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
.item-balance > .text {
|
||||
font-size: 0.26rem;
|
||||
}
|
||||
.money-num > .text {
|
||||
font-size: 0.26rem;
|
||||
}
|
||||
.item-unbalance > .text {
|
||||
font-size: 0.26rem;
|
||||
}
|
||||
.btn-tx,
|
||||
.btn-cz {
|
||||
height: 0.42rem;
|
||||
width: 0.76rem;
|
||||
font-size: 0.22rem;
|
||||
}
|
||||
.balance-tag {
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
.left_tips {
|
||||
font-size: 0.26rem;
|
||||
}
|
||||
.balance-searchbar {
|
||||
margin-top: 0;
|
||||
}
|
||||
.form-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
/* 签章上传样式 */
|
||||
.seal-upload .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.seal-upload .el-upload:hover {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
.seal-upload-content {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
position: relative;
|
||||
}
|
||||
.seal-upload-content .seal-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
display: block;
|
||||
}
|
||||
.seal-upload-content .seal-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
.seal-upload-content:hover .seal-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
.seal-mask-actions {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
}
|
||||
.seal-mask-actions i {
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
.seal-upload-placeholder {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #8c939d;
|
||||
}
|
||||
.seal-upload-placeholder i {
|
||||
font-size: 32px;
|
||||
color: #8c939d;
|
||||
}
|
||||
.seal-upload-text {
|
||||
margin-top: 8px;
|
||||
font-size: 12px;
|
||||
color: #606266;
|
||||
}
|
||||
.seal-upload-tip {
|
||||
margin-top: 4px;
|
||||
font-size: 11px;
|
||||
color: #909399;
|
||||
text-align: center;
|
||||
line-height: 1.4;
|
||||
}
|
||||
1232
clientarea/hgcloud/css/finance.less
Normal file
1232
clientarea/hgcloud/css/finance.less
Normal file
File diff suppressed because it is too large
Load Diff
243
clientarea/hgcloud/css/forget.css
Normal file
243
clientarea/hgcloud/css/forget.css
Normal file
@@ -0,0 +1,243 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#forget {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.login-container {
|
||||
width: 15.7rem;
|
||||
height: 8.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.container-back {
|
||||
width: 15.7rem;
|
||||
height: 6.8rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: Source Han Sans CN;
|
||||
}
|
||||
.container-back .back-text {
|
||||
font-size: 0.27rem;
|
||||
z-index: 10;
|
||||
color: #FFFFFF;
|
||||
margin-top: 1.39rem;
|
||||
margin-left: 0.65rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.container-back .text-welcome {
|
||||
font-size: 0.74rem;
|
||||
font-family: Bahnschrift;
|
||||
line-height: 0.74rem;
|
||||
}
|
||||
.container-back .text-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.container-back .text-level {
|
||||
font-size: 0.12rem;
|
||||
margin-top: 0.81rem;
|
||||
}
|
||||
.container-back .back-line1,
|
||||
.container-back .back-line2,
|
||||
.container-back .back-line3 {
|
||||
width: 60px;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
.container-back .back-line1 {
|
||||
height: 5rem;
|
||||
opacity: 1;
|
||||
transform: rotate(45deg);
|
||||
top: -1.2rem;
|
||||
left: 4.15rem;
|
||||
}
|
||||
.container-back .back-line2 {
|
||||
height: 7rem;
|
||||
transform: rotate(110deg);
|
||||
top: 0px;
|
||||
left: 5rem;
|
||||
}
|
||||
.container-back .back-line3 {
|
||||
height: 5rem;
|
||||
transform: rotate(45deg);
|
||||
top: 2.3rem;
|
||||
left: 1.5rem;
|
||||
}
|
||||
.container-before {
|
||||
width: 7.5rem;
|
||||
height: 8rem;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1);
|
||||
position: absolute;
|
||||
right: 0.9rem;
|
||||
border: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
.login {
|
||||
padding-top: 0.8rem;
|
||||
padding-left: 1.24rem;
|
||||
padding-right: 1.05rem;
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 14px;
|
||||
}
|
||||
.login-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.login-text-title {
|
||||
font-size: 0.32rem;
|
||||
color: #1E2736;
|
||||
line-height: 0.32rem;
|
||||
}
|
||||
.login-text-regist {
|
||||
font-weight: Regular;
|
||||
margin-top: 0.08rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.login-text-regist a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 0.68rem;
|
||||
}
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: 0.34rem;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-phone {
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
.form-main {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.form-item {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.input-with-select .el-input-group__prepend {
|
||||
background: #FFFFFF;
|
||||
width: 60px;
|
||||
}
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.code-btn {
|
||||
margin-left: 0.1rem;
|
||||
background: var(--color-primary);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.rember-item {
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rember-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
background: var(--color-primary);
|
||||
}
|
||||
.read-item {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.read-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.line-item {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.line-item text {
|
||||
font-size: 16px;
|
||||
color: #1E2736;
|
||||
}
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.login-container {
|
||||
height: calc(100vh - 1.2rem);
|
||||
width: 100vw;
|
||||
background: #F2F2FE;
|
||||
padding: 0.6rem 0;
|
||||
}
|
||||
.container-back {
|
||||
display: none;
|
||||
}
|
||||
.container-before {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0rem 0.3rem;
|
||||
position: unset;
|
||||
z-index: 0;
|
||||
}
|
||||
.login {
|
||||
padding-top: 1.17rem;
|
||||
padding-left: 0.3rem;
|
||||
padding-right: 0.3rem;
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.3rem;
|
||||
}
|
||||
.login-text-title {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
.login-text-regist {
|
||||
margin-top: 0.1rem;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 1.21rem;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: 0.34rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
padding-bottom: 0.13rem;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
font-size: 0.26rem;
|
||||
}
|
||||
.read-item {
|
||||
line-height: 0.3rem;
|
||||
}
|
||||
.login-btn {
|
||||
font-size: 0.34rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
.type-btn {
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
}
|
||||
306
clientarea/hgcloud/css/forget.less
Normal file
306
clientarea/hgcloud/css/forget.less
Normal file
@@ -0,0 +1,306 @@
|
||||
// Variables
|
||||
@text-color: #1E2736;
|
||||
@border-color: #E6E7EB;
|
||||
@background-color: #FFFFFF;
|
||||
@text-secondary: #666B80;
|
||||
|
||||
// Mixins
|
||||
.flex-center() {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#forget {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
.flex-center();
|
||||
}
|
||||
|
||||
.login-container {
|
||||
width: 15.7rem;
|
||||
height: 8.2rem;
|
||||
.flex-center();
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// Background panel
|
||||
.container-back {
|
||||
width: 15.7rem;
|
||||
height: 6.8rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: Source Han Sans CN;
|
||||
|
||||
.back-text {
|
||||
font-size: .27rem;
|
||||
z-index: 10;
|
||||
color: #FFFFFF;
|
||||
margin-top: 1.39rem;
|
||||
margin-left: .65rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.text-welcome {
|
||||
font-size: .74rem;
|
||||
font-family: Bahnschrift;
|
||||
line-height: .74rem;
|
||||
}
|
||||
|
||||
.text-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.text-level {
|
||||
font-size: .12rem;
|
||||
margin-top: .81rem;
|
||||
}
|
||||
|
||||
.back-line1,
|
||||
.back-line2,
|
||||
.back-line3 {
|
||||
width: 60px;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.3000) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.back-line1 {
|
||||
height: 5rem;
|
||||
opacity: 1;
|
||||
transform: rotate(45deg);
|
||||
top: -1.2rem;
|
||||
left: 4.15rem;
|
||||
}
|
||||
|
||||
.back-line2 {
|
||||
height: 7rem;
|
||||
transform: rotate(110deg);
|
||||
top: 0px;
|
||||
left: 5rem;
|
||||
}
|
||||
|
||||
.back-line3 {
|
||||
height: 5rem;
|
||||
transform: rotate(45deg);
|
||||
top: 2.3rem;
|
||||
left: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Login form
|
||||
.container-before {
|
||||
width: 7.5rem;
|
||||
height: 8rem;
|
||||
background: @background-color;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1000);
|
||||
position: absolute;
|
||||
right: .9rem;
|
||||
border: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.login {
|
||||
padding-top: .8rem;
|
||||
padding-left: 1.24rem;
|
||||
padding-right: 1.05rem;
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 14px;
|
||||
|
||||
&-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&-title {
|
||||
font-size: .32rem;
|
||||
color: @text-color;
|
||||
line-height: .32rem;
|
||||
}
|
||||
|
||||
&-regist {
|
||||
font-weight: Regular;
|
||||
margin-top: .08rem;
|
||||
color: @text-color;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-form {
|
||||
margin-top: .68rem;
|
||||
}
|
||||
|
||||
&-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
&-email,
|
||||
&-phone {
|
||||
height: .34rem;
|
||||
color: @text-secondary;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&-phone {
|
||||
margin-left: .4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.input-with-select {
|
||||
.el-input-group__prepend {
|
||||
background: @background-color;
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
margin-left: .1rem;
|
||||
background: var(--color-primary);
|
||||
color: @background-color;
|
||||
}
|
||||
|
||||
.rember-item {
|
||||
margin-top: .2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
background: var(--color-primary);
|
||||
}
|
||||
|
||||
.read-item {
|
||||
margin-top: .2rem;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.line-item {
|
||||
margin-top: .4rem;
|
||||
|
||||
text {
|
||||
font-size: 16px;
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
font-size: .16rem;
|
||||
}
|
||||
|
||||
// Media queries
|
||||
@media screen and (max-width: 750px) {
|
||||
.login-container {
|
||||
height: calc(100vh - 1.2rem);
|
||||
width: 100vw;
|
||||
background: #F2F2FE;
|
||||
padding: .6rem 0;
|
||||
}
|
||||
|
||||
.container-back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.container-before {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0rem .3rem;
|
||||
position: unset;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.login {
|
||||
padding-top: 1.17rem;
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
font-size: .26rem;
|
||||
line-height: .3rem;
|
||||
|
||||
&-text {
|
||||
&-title {
|
||||
font-size: .4rem;
|
||||
}
|
||||
|
||||
&-regist {
|
||||
margin-top: .1rem;
|
||||
font-size: .28rem;
|
||||
}
|
||||
}
|
||||
|
||||
&-form {
|
||||
margin-top: 1.21rem;
|
||||
}
|
||||
|
||||
&-email,
|
||||
&-phone {
|
||||
height: .34rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: @text-secondary;
|
||||
cursor: pointer;
|
||||
padding-bottom: .13rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-checkbox__label {
|
||||
font-size: .26rem;
|
||||
}
|
||||
|
||||
.read-item {
|
||||
line-height: .3rem;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
font-size: .34rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
font-size: .34rem;
|
||||
}
|
||||
}
|
||||
883
clientarea/hgcloud/css/home.css
Normal file
883
clientarea/hgcloud/css/home.css
Normal file
@@ -0,0 +1,883 @@
|
||||
.el-main {
|
||||
padding: 40px 0 0 0;
|
||||
}
|
||||
.main-card {
|
||||
max-width: none;
|
||||
background: #F3F5F9;
|
||||
}
|
||||
.main-content {
|
||||
display: flex;
|
||||
}
|
||||
.left-box {
|
||||
flex: 1;
|
||||
}
|
||||
.info-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
box-sizing: border-box;
|
||||
padding: 0.84rem 0.6rem 0.4rem 1.1rem;
|
||||
border-right: 1px solid #E6E7EB;
|
||||
background-color: #fff;
|
||||
min-height: 1.88rem;
|
||||
}
|
||||
.info-first {
|
||||
height: 0.6rem;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
}
|
||||
.name-first {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 0.36rem;
|
||||
background: #fff;
|
||||
width: 0.6rem;
|
||||
height: 0.6rem;
|
||||
border-radius: 0.03rem;
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
.name-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
margin-left: 0.08rem;
|
||||
}
|
||||
.name {
|
||||
color: #8692B0;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.name .id-text {
|
||||
color: #1E2736;
|
||||
}
|
||||
.hello {
|
||||
font-weight: 400;
|
||||
font-size: 0.16rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.info-second {
|
||||
height: 0.6rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.info-three {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
row-gap: 0.04rem;
|
||||
}
|
||||
.info-three .compny-box,
|
||||
.info-three .person-box {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
column-gap: 0.32rem;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.info-three .compny-box .left-icon,
|
||||
.info-three .person-box .left-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.04rem;
|
||||
font-size: 0.14rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
.info-three .compny-box .left-icon img,
|
||||
.info-three .person-box .left-icon img {
|
||||
vertical-align: middle;
|
||||
width: 0.24rem;
|
||||
height: 0.24rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.info-three .compny-box .right-text .certify-id,
|
||||
.info-three .person-box .right-text .certify-id {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.info-three .compny-box .right-text .right-type,
|
||||
.info-three .person-box .right-text .right-type {
|
||||
color: #949CB0;
|
||||
}
|
||||
.info-three .compny-box .right-text .company-name,
|
||||
.info-three .person-box .right-text .company-name {
|
||||
color: #1E2736;
|
||||
}
|
||||
.info-three .compny-box .right-text .certify-bottom,
|
||||
.info-three .person-box .right-text .certify-bottom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.info-three .compny-box .right-text .certify-bottom .cpoy-btn,
|
||||
.info-three .person-box .right-text .certify-bottom .cpoy-btn {
|
||||
cursor: pointer;
|
||||
margin-left: 0.04rem;
|
||||
width: 0.14rem;
|
||||
height: 0.14rem;
|
||||
}
|
||||
.info-three .compny-box .right-text .bule-text,
|
||||
.info-three .person-box .right-text .bule-text {
|
||||
cursor: pointer;
|
||||
color: #3699FF;
|
||||
}
|
||||
.info-three .compny-box .right-text .certify-text,
|
||||
.info-three .person-box .right-text .certify-text {
|
||||
color: #292E36;
|
||||
display: inline-block;
|
||||
max-width: 1.6rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.email-box,
|
||||
.phone-box {
|
||||
color: #8692B0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.email-box .phone-number,
|
||||
.phone-box .phone-number {
|
||||
margin-left: 0.25rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.info-second > div img {
|
||||
margin-right: 0.05rem;
|
||||
vertical-align: middle;
|
||||
width: 0.16rem;
|
||||
}
|
||||
.statistics-box {
|
||||
margin-top: 0.4rem;
|
||||
padding: 0 0.36rem 0rem 0.8rem;
|
||||
}
|
||||
.title-text {
|
||||
font-weight: Bold;
|
||||
color: #171725;
|
||||
font-size: 0.16rem;
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.statistics-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
min-height: 2.57rem;
|
||||
}
|
||||
.money-box {
|
||||
flex: 1;
|
||||
background-color: #fff;
|
||||
}
|
||||
.order-box {
|
||||
display: flex;
|
||||
}
|
||||
.order-box > div {
|
||||
height: 100%;
|
||||
width: 1.66rem;
|
||||
}
|
||||
.statistics-top {
|
||||
padding: 0.16rem 0.16rem 0 0.16rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
column-gap: 0.16rem;
|
||||
}
|
||||
.statistics-top .statistics-credit {
|
||||
flex: 1;
|
||||
flex-shrink: 0;
|
||||
border-radius: 4px;
|
||||
background: rgba(221, 225, 230, 0.24);
|
||||
padding: 0.12rem 0.08rem;
|
||||
}
|
||||
.statistics-top .statistics-credit .credit-title {
|
||||
color: #949cb0;
|
||||
font-size: 0.12rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.08rem;
|
||||
}
|
||||
.statistics-top .statistics-credit .credit-title .credit-tag {
|
||||
color: #444B59;
|
||||
font-size: 0.12rem;
|
||||
box-sizing: border-box;
|
||||
padding: 0.02rem 0.04rem;
|
||||
/* 线条/描边 */
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 2px;
|
||||
background: #ffffff;
|
||||
}
|
||||
.statistics-top .statistics-credit .credit-money {
|
||||
margin-top: 0.1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.1rem;
|
||||
}
|
||||
.statistics-top .statistics-credit .credit-money .credit-num {
|
||||
color: #292e36;
|
||||
font-size: 0.18rem;
|
||||
font-weight: bold;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.statistics-top .statistics-credit .credit-money .recharge-btn {
|
||||
cursor: pointer;
|
||||
padding: 0 0.1rem;
|
||||
line-height: 0.24rem;
|
||||
color: #ffffff;
|
||||
font-size: 0.12rem;
|
||||
border-radius: 0.04rem;
|
||||
background: #0058FF;
|
||||
}
|
||||
.statistics-top .statistics-credit .credit-money .recharge-text {
|
||||
cursor: pointer;
|
||||
color: #0058FF;
|
||||
font-size: 0.12rem;
|
||||
}
|
||||
.voucher-box {
|
||||
padding: 0 0.16rem;
|
||||
color: #949CB0;
|
||||
font-size: 0.12rem;
|
||||
margin-top: 0.06rem;
|
||||
}
|
||||
.voucher-box .bule-text {
|
||||
color: #0058FF;
|
||||
margin-left: 0.03rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.statistics-bottom {
|
||||
display: flex;
|
||||
padding: 0.16rem 0.24rem;
|
||||
}
|
||||
.statistics-bottom-right {
|
||||
margin-left: 0.24rem;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
.money-month,
|
||||
.money-total {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
color: #949CB0;
|
||||
font-size: 0.12rem;
|
||||
}
|
||||
.money-total {
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
.type-box {
|
||||
margin-right: 0.05rem;
|
||||
display: inline-block;
|
||||
width: 0.08rem;
|
||||
height: 0.08rem;
|
||||
}
|
||||
.green-bg {
|
||||
background-color: #04C8C9;
|
||||
}
|
||||
.grey-bg {
|
||||
background-color: #E4E7EF;
|
||||
}
|
||||
.percent-box-green {
|
||||
display: inline-block;
|
||||
padding: 0 0.03rem;
|
||||
background: rgba(80, 205, 136, 0.08);
|
||||
color: #50CD89;
|
||||
font-size: 0.13rem;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.percent-box-red {
|
||||
display: inline-block;
|
||||
padding: 0 0.03rem;
|
||||
background: rgba(240, 20, 46, 0.08);
|
||||
font-size: 0.13rem;
|
||||
color: #F0142F;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.money-num {
|
||||
color: #1E2736;
|
||||
font-weight: bold;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.order-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 1.16rem;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.order-item:hover {
|
||||
cursor: default;
|
||||
transform: scale(1.1);
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.order-box {
|
||||
margin-left: 0.29rem;
|
||||
}
|
||||
.order-box-1 {
|
||||
margin-right: 0.11rem;
|
||||
background: #7239EA;
|
||||
}
|
||||
.order-box-2 {
|
||||
margin-right: 0.11rem;
|
||||
background: #3699FF;
|
||||
}
|
||||
.order-box-3 {
|
||||
background: #3DD598;
|
||||
}
|
||||
.order-title {
|
||||
color: #FFFFFF;
|
||||
font-size: 0.13rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
.order-nums {
|
||||
margin-bottom: 0.33rem;
|
||||
font-size: 0.32rem;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.order-type-img {
|
||||
margin-top: 0.36rem;
|
||||
}
|
||||
.order-type-img img {
|
||||
width: 0.68rem;
|
||||
height: 0.68rem;
|
||||
}
|
||||
.product-list-box {
|
||||
margin-top: 0.4rem;
|
||||
padding: 0 0.36rem 0rem 0.8rem;
|
||||
}
|
||||
.goods-box {
|
||||
background-color: #fff;
|
||||
}
|
||||
.goods-table {
|
||||
border-spacing: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.product-item {
|
||||
cursor: pointer;
|
||||
}
|
||||
.product-item:hover {
|
||||
background-color: #F5F7FA;
|
||||
transition: background-color 0.25s ease;
|
||||
}
|
||||
.goods-table thead tr td {
|
||||
font-size: 0.14rem;
|
||||
color: #8692B0;
|
||||
width: 25%;
|
||||
}
|
||||
.goods-table tbody tr td {
|
||||
padding: 0.2rem 0;
|
||||
font-size: 0.14rem;
|
||||
color: #171725;
|
||||
}
|
||||
.time-box {
|
||||
width: 1.6rem;
|
||||
}
|
||||
.goods-table tbody tr .red-time {
|
||||
color: #F0142F;
|
||||
}
|
||||
.right-box {
|
||||
box-sizing: border-box;
|
||||
padding: 0.4rem;
|
||||
width: 5.9rem;
|
||||
background-color: #fff;
|
||||
}
|
||||
.recommend-box {
|
||||
width: 3.65rem;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 0.21rem;
|
||||
}
|
||||
.recommend-box h2 {
|
||||
text-align: center;
|
||||
color: #1E2736;
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
.recommend-box p {
|
||||
margin-top: 0.26rem;
|
||||
text-align: center;
|
||||
color: #8692B0;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.recommend-box img {
|
||||
width: 3.65rem;
|
||||
height: 2.56rem;
|
||||
}
|
||||
.recommend-people {
|
||||
margin-top: 0.3rem;
|
||||
border-top: 1px solid #E6E7EB;
|
||||
padding-top: 0.3rem;
|
||||
text-align: left;
|
||||
}
|
||||
.recommend-people-num {
|
||||
display: inline-block;
|
||||
width: 1rem;
|
||||
height: 0.08rem;
|
||||
background: #F99600;
|
||||
border-radius: 0rem 0.2rem 0.2rem 0rem;
|
||||
}
|
||||
.recommend-money-num {
|
||||
display: inline-block;
|
||||
width: 1.2rem;
|
||||
height: 0.08rem;
|
||||
background: #3DD598;
|
||||
border-radius: 0rem 0.2rem 0.2rem 0rem;
|
||||
}
|
||||
.recommend-number {
|
||||
margin-left: 0.16rem;
|
||||
font-weight: bold;
|
||||
font-size: 0.26rem;
|
||||
color: #040E34;
|
||||
}
|
||||
.recommend-people > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.recommend-people > div:nth-of-type(2) {
|
||||
margin-top: 0.47rem;
|
||||
}
|
||||
.WorkOrder-box {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.WorkOrder-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.more {
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
padding: 0 0.03rem;
|
||||
background: #EEF4FF;
|
||||
height: 0.24rem;
|
||||
line-height: 0.24rem;
|
||||
text-align: center;
|
||||
border-radius: 0.03rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
.WorkOrder-content {
|
||||
padding: 0.3rem 0.3rem 0 0.3rem;
|
||||
border-radius: 0.03rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
}
|
||||
.WorkOrder-item {
|
||||
display: flex;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.WorkOrder-item:hover {
|
||||
cursor: pointer;
|
||||
background-color: #f5f7fa;
|
||||
transition: background-color 0.25s ease;
|
||||
}
|
||||
.replay-div {
|
||||
margin-right: 0.1rem;
|
||||
font-weight: 500;
|
||||
font-size: 0.13rem;
|
||||
padding: 0 0.1rem;
|
||||
height: 0.26rem;
|
||||
line-height: 0.26rem;
|
||||
text-align: center;
|
||||
background: rgba(54, 155, 255, 0.205);
|
||||
color: #FFF;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.replay-red {
|
||||
color: #F0142F;
|
||||
background: rgba(240, 20, 46, 0.205);
|
||||
}
|
||||
.replay-green {
|
||||
background: rgba(61, 213, 152, 0.205);
|
||||
color: #3DD598;
|
||||
}
|
||||
.replay-box {
|
||||
width: 80%;
|
||||
}
|
||||
.replay-title {
|
||||
font-size: 0.14rem;
|
||||
color: #1E2736;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.replay-name {
|
||||
font-size: 0.13rem;
|
||||
font-weight: 500;
|
||||
color: #8692B0;
|
||||
}
|
||||
.notice-box {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.notice-item {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-left: 0.16rem;
|
||||
}
|
||||
.notice-item:hover {
|
||||
background-color: #f5f7fa;
|
||||
transition: background-color 0.25s ease;
|
||||
}
|
||||
.progress-box .el-progress-circle {
|
||||
width: 1.1rem !important;
|
||||
}
|
||||
.notice-item:nth-of-type(1) {
|
||||
border-left: 0.02rem solid #3DD598;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.notice-item:nth-of-type(2) {
|
||||
border-left: 0.02rem solid #3699FF;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.notice-item:nth-of-type(3) {
|
||||
border-left: 0.02rem solid #F99600;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.notice-time {
|
||||
font-size: 0.2rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.notice-title {
|
||||
font-weight: 400;
|
||||
font-size: 0.14rem;
|
||||
color: #1E2736;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.notice-type {
|
||||
font-size: 0.13rem;
|
||||
font-weight: 500;
|
||||
color: #8692B0;
|
||||
}
|
||||
.notice-item-right {
|
||||
color: #8692B0;
|
||||
width: 0.24rem;
|
||||
height: 0.24rem;
|
||||
text-align: center;
|
||||
line-height: 0.24rem;
|
||||
background: #EEF4FF;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.no-product {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 1.06rem;
|
||||
padding-bottom: 1.72rem;
|
||||
}
|
||||
.no-product h2 {
|
||||
font-weight: 400;
|
||||
color: #171725;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
.no-product p {
|
||||
margin: 0.1rem 0 0.2rem 0;
|
||||
color: #8692B0;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.no-product .el-button {
|
||||
margin: 0 auto;
|
||||
width: 1.02rem;
|
||||
height: 0.32rem;
|
||||
background: #0058FF;
|
||||
border-radius: 0.03rem;
|
||||
font-size: 0.14rem;
|
||||
border: none;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.no-recommend {
|
||||
margin: 0 auto;
|
||||
margin-top: 0.24rem;
|
||||
color: #FFF;
|
||||
font-size: 0.14rem;
|
||||
background: #3699FF;
|
||||
height: 0.32rem;
|
||||
line-height: 0.32rem;
|
||||
width: 1.52rem;
|
||||
border-radius: 0.03rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.recommend-text {
|
||||
margin: 0 auto;
|
||||
margin-top: 0.24rem;
|
||||
color: #8692B0;
|
||||
font-size: 0.14rem;
|
||||
background: #EEF4FF;
|
||||
height: 0.32rem;
|
||||
line-height: 0.32rem;
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.info-box .divider-box {
|
||||
height: 0.6rem;
|
||||
background-color: #E6E7EB !important;
|
||||
}
|
||||
/* 提现弹窗 */
|
||||
.tx-dialog .el-dialog__body,
|
||||
.cz-dialog .el-dialog__body {
|
||||
padding: 0.3rem 0.8rem;
|
||||
}
|
||||
.dialog-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.cz-input {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.cz-input > .btn-ok {
|
||||
margin-left: 0.1rem;
|
||||
height: 0.46rem;
|
||||
background: #0058FF;
|
||||
border-radius: 3px;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.pay-html {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.pay-html > img {
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
}
|
||||
.ty-select {
|
||||
width: 100%;
|
||||
}
|
||||
.recommend-box-open .recommend-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left {
|
||||
padding-top: 0.26rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left .row1 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left .row1 .title-text {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #171725;
|
||||
margin-right: 0.2rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left .row1 .reword {
|
||||
background: linear-gradient(180deg, #F74C4B 0%, #EF7575 100%);
|
||||
border-radius: 3px;
|
||||
color: #FFF;
|
||||
position: relative;
|
||||
padding: 1px 6px 1px 20px;
|
||||
font-size: 13px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left .row1 .reword img {
|
||||
width: 36px;
|
||||
height: 35px;
|
||||
position: absolute;
|
||||
left: -18px;
|
||||
top: -4px;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left .row2 {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #171725;
|
||||
margin-top: 0.3rem;
|
||||
margin-bottom: 0.13rem;
|
||||
}
|
||||
.recommend-box-open .recommend-top .left .row3,
|
||||
.recommend-box-open .recommend-top .left .row4 {
|
||||
font-size: 14px;
|
||||
color: #8692B0;
|
||||
}
|
||||
.recommend-box-open .recommend-top .right {
|
||||
width: 1.5rem;
|
||||
height: 1.53rem;
|
||||
}
|
||||
.recommend-box-open .url {
|
||||
width: 5.2rem;
|
||||
height: 0.46rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 0.26rem;
|
||||
}
|
||||
.recommend-box-open .url .url-text {
|
||||
width: 100%;
|
||||
font-size: 15px;
|
||||
color: #8692B0;
|
||||
margin-left: 0.16rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.recommend-box-open .url .copy-btn {
|
||||
width: 112px;
|
||||
height: 100%;
|
||||
background: #E1F0FF;
|
||||
border-left: 1px solid #E6E7EB;
|
||||
border-radius: 0px 3px 3px 0px;
|
||||
font-size: 16px;
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.recommend-box-open .top-statistic {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
padding-left: 3px;
|
||||
padding-right: 3px;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
.recommend-box-open .top-statistic .top-item {
|
||||
width: 2.4rem;
|
||||
min-height: 1.76rem;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 1px 4px rgba(21, 34, 50, 0.08);
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.recommend-box-open .top-statistic .top-item .item-top {
|
||||
margin-top: 0.12rem;
|
||||
margin-left: 0.21rem;
|
||||
}
|
||||
.recommend-box-open .top-statistic .top-item .item-top .top-money {
|
||||
font-size: 0.32rem;
|
||||
font-weight: bold;
|
||||
color: #1E2736;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.recommend-box-open .top-statistic .top-item .item-top .top-money .icon-help {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 1px solid #0058FF;
|
||||
border-radius: 50%;
|
||||
margin-left: 5px;
|
||||
cursor: help;
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #0058FF;
|
||||
}
|
||||
.recommend-box-open .top-statistic .top-item .item-top .top-text {
|
||||
font-size: 12px;
|
||||
color: #8692B0;
|
||||
}
|
||||
.recommend-box-open .top-statistic .top-item .top-img {
|
||||
width: 100%;
|
||||
align-self: flex-end;
|
||||
}
|
||||
.open-dialog {
|
||||
font-size: 16px;
|
||||
}
|
||||
.open-dialog .dialog-footer {
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.open-dialog .dialog-footer .btn-ok {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
background: #0058FF;
|
||||
border-radius: 3px;
|
||||
color: #FFF;
|
||||
}
|
||||
.open-dialog .dialog-footer .btn-no {
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
background: #E7E7E7;
|
||||
border-radius: 3px;
|
||||
color: #1E2736;
|
||||
}
|
||||
.wx-code {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 100;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
right: 8px;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.wx-code:hover .wx-img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: url('../img/home/wx_hover.png') no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.wx-code .wx-img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
background: url('../img/home/wx.png') no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.wx-box {
|
||||
text-align: center;
|
||||
}
|
||||
.wx-box .img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.wx-box .img img {
|
||||
width: 100%;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.main-content {
|
||||
display: block;
|
||||
padding-bottom: 1.5rem;
|
||||
}
|
||||
.replay-div {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.recharge-btn {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.progress-box .el-progress-circle {
|
||||
display: flex;
|
||||
}
|
||||
.order-box {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.order-box .order-item {
|
||||
flex: 1;
|
||||
}
|
||||
.info-box .divider-box {
|
||||
display: none;
|
||||
}
|
||||
.info-three {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.right-box {
|
||||
width: auto;
|
||||
margin-left: 0.8rem;
|
||||
margin-right: 0.36rem;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
1067
clientarea/hgcloud/css/home.less
Normal file
1067
clientarea/hgcloud/css/home.less
Normal file
File diff suppressed because it is too large
Load Diff
36
clientarea/hgcloud/css/index.css
Normal file
36
clientarea/hgcloud/css/index.css
Normal file
@@ -0,0 +1,36 @@
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.el-header, .el-footer {
|
||||
background-color: #B3C0D1;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
.el-aside {
|
||||
background-color: #1E41C9;
|
||||
text-align: center;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.el-main {
|
||||
background-color: #E9EEF3;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
line-height: 160px !important;
|
||||
}
|
||||
|
||||
body > .el-container {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.el-container:nth-child(5) .el-aside,
|
||||
.el-container:nth-child(6) .el-aside {
|
||||
line-height: 260px;
|
||||
}
|
||||
|
||||
.el-container:nth-child(7) .el-aside {
|
||||
line-height: 320px;
|
||||
}
|
||||
391
clientarea/hgcloud/css/login.css
Normal file
391
clientarea/hgcloud/css/login.css
Normal file
@@ -0,0 +1,391 @@
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
.lang-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 5px;
|
||||
}
|
||||
.lang-option .lang-img {
|
||||
width: 30px;
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.read-text {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
padding: 0 10px;
|
||||
color: #606266;
|
||||
font-weight: 500;
|
||||
}
|
||||
#login {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.login-container {
|
||||
width: 15.7rem;
|
||||
height: 8.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.container-back {
|
||||
width: 15.7rem;
|
||||
height: 6.8rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: Source Han Sans CN;
|
||||
}
|
||||
.container-back .back-text {
|
||||
font-size: 0.27rem;
|
||||
z-index: 10;
|
||||
color: #ffffff;
|
||||
margin-top: 1.39rem;
|
||||
margin-left: 0.65rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.container-back .text-welcome {
|
||||
font-size: 0.74rem;
|
||||
font-family: Bahnschrift;
|
||||
line-height: 0.74rem;
|
||||
}
|
||||
.container-back .text-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.container-back .text-level {
|
||||
font-size: 0.12rem;
|
||||
margin-top: 0.81rem;
|
||||
}
|
||||
.back-line1,
|
||||
.back-line2,
|
||||
.back-line3 {
|
||||
width: 0.6rem;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
.back-line1 {
|
||||
height: 5rem;
|
||||
opacity: 1;
|
||||
transform: rotate(45deg);
|
||||
top: -1.2rem;
|
||||
left: 4.15rem;
|
||||
}
|
||||
.back-line2 {
|
||||
height: 7rem;
|
||||
transform: rotate(110deg);
|
||||
top: 0;
|
||||
left: 5rem;
|
||||
}
|
||||
.back-line3 {
|
||||
height: 5rem;
|
||||
transform: rotate(45deg);
|
||||
top: 2.3rem;
|
||||
left: 1.5rem;
|
||||
clip-path: polygon(0px 0.3rem, 0.64rem 0px, 100% 100%, 0 100%);
|
||||
}
|
||||
.container-before {
|
||||
width: 7.5rem;
|
||||
height: 8rem;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1);
|
||||
position: absolute;
|
||||
right: 0.9rem;
|
||||
border: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
.login {
|
||||
padding-top: 0.8rem;
|
||||
padding-left: 1.24rem;
|
||||
padding-right: 1.05rem;
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 14px;
|
||||
position: relative;
|
||||
}
|
||||
.login .lang-box {
|
||||
position: absolute;
|
||||
right: 0.1rem;
|
||||
top: 0.1rem;
|
||||
}
|
||||
.login .qr-code {
|
||||
position: absolute;
|
||||
right: 1.05rem;
|
||||
top: 0.8rem;
|
||||
cursor: pointer;
|
||||
width: 0.48rem;
|
||||
height: 0.48rem;
|
||||
}
|
||||
.login .qr-code .login-icon {
|
||||
fill: var(--color-primary);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.login .qr-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.login .qr-box .qr-box-img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
position: relative;
|
||||
}
|
||||
.login .qr-box .qr-box-img img {
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.login .qr-box .qr-box-img .qr-expire-time {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login .qr-box .qr-box-img .qr-expire-time .el-icon-refresh-right {
|
||||
font-size: 30px;
|
||||
}
|
||||
.login .qr-box .qr-box-tips {
|
||||
margin-top: 10px;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
.login .qr-box-select-account {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.2rem;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0.2rem;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #e5e5e5;
|
||||
}
|
||||
.login .qr-box-select-account .qr-box-back {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
gap: 5px;
|
||||
font-size: 16px;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login .qr-box-select-account .qr-box-select-account-title {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
.login-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.login-text-title {
|
||||
font-size: 0.32rem;
|
||||
color: #1e2736;
|
||||
line-height: 0.32rem;
|
||||
}
|
||||
.login-text-regist {
|
||||
font-weight: Regular;
|
||||
margin-top: 0.08rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.login-text-regist a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 0.68rem;
|
||||
}
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: 0.34rem;
|
||||
color: #666b80;
|
||||
cursor: pointer;
|
||||
}
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
.login-email {
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.form-main {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.form-item {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.input-with-select .el-input-group__prepend {
|
||||
background: #ffffff;
|
||||
width: 60px;
|
||||
}
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.code-btn {
|
||||
margin-left: 0.1rem;
|
||||
color: #ffffff;
|
||||
}
|
||||
.rember-item {
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.rember-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
}
|
||||
.pass-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
margin-left: 0 !important;
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
.read-item {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.read-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.line-item {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.line-item text {
|
||||
font-size: 16px;
|
||||
color: #1e2736;
|
||||
}
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.login-type {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.15rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.a-text {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.oauth-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.oauth-item:hover .oauth-img {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
.oauth-img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.login-container {
|
||||
height: calc(100vh - 1.2rem);
|
||||
width: 100vw;
|
||||
background: #f2f2fe;
|
||||
padding: 0.6rem 0;
|
||||
}
|
||||
.container-back {
|
||||
display: none;
|
||||
}
|
||||
.container-before {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0rem 0.3rem;
|
||||
position: unset;
|
||||
z-index: 0;
|
||||
}
|
||||
.login {
|
||||
padding-top: 1.17rem;
|
||||
padding-left: 0.3rem;
|
||||
padding-right: 0.3rem;
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.3rem;
|
||||
}
|
||||
.login .qr-code {
|
||||
right: 0.3rem;
|
||||
top: 1.17rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-text-title {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
.login-text-regist {
|
||||
margin-top: 0.16rem;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 1.21rem;
|
||||
}
|
||||
.form-main {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: 0.34rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #666b80;
|
||||
cursor: pointer;
|
||||
padding-bottom: 0.13rem;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
font-size: 0.22rem;
|
||||
}
|
||||
.read-item {
|
||||
line-height: 0.3rem;
|
||||
}
|
||||
.login-btn {
|
||||
font-size: 0.34rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
.type-btn {
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
}
|
||||
480
clientarea/hgcloud/css/login.less
Normal file
480
clientarea/hgcloud/css/login.less
Normal file
@@ -0,0 +1,480 @@
|
||||
// Variables
|
||||
@text-color: #1e2736;
|
||||
@text-secondary: #666b80;
|
||||
@white: #ffffff;
|
||||
@shadow-color: rgba(0, 0, 0, 0.1);
|
||||
|
||||
|
||||
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.lang-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 5px;
|
||||
|
||||
.lang-img {
|
||||
width: 30px;
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.read-text {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
padding: 0 10px;
|
||||
color: #606266;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#login {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login-container {
|
||||
width: 15.7rem;
|
||||
height: 8.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// Background panel
|
||||
.container-back {
|
||||
width: 15.7rem;
|
||||
height: 6.8rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: Source Han Sans CN;
|
||||
|
||||
.back-text {
|
||||
font-size: .27rem;
|
||||
z-index: 10;
|
||||
color: @white;
|
||||
margin-top: 1.39rem;
|
||||
margin-left: .65rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.text-welcome {
|
||||
font-size: .74rem;
|
||||
font-family: Bahnschrift;
|
||||
line-height: .74rem;
|
||||
}
|
||||
|
||||
.text-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.text-level {
|
||||
font-size: .12rem;
|
||||
margin-top: .81rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Background lines
|
||||
.back-line1,
|
||||
.back-line2,
|
||||
.back-line3 {
|
||||
width: .6rem;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(255, 255, 255, 0.3) 0%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.back-line1 {
|
||||
height: 5rem;
|
||||
opacity: 1;
|
||||
transform: rotate(45deg);
|
||||
top: -1.2rem;
|
||||
left: 4.15rem;
|
||||
}
|
||||
|
||||
.back-line2 {
|
||||
height: 7rem;
|
||||
transform: rotate(110deg);
|
||||
top: 0;
|
||||
left: 5rem;
|
||||
}
|
||||
|
||||
.back-line3 {
|
||||
height: 5rem;
|
||||
transform: rotate(45deg);
|
||||
top: 2.3rem;
|
||||
left: 1.5rem;
|
||||
clip-path: polygon(0px .3rem, .64rem 0px, 100% 100%, 0 100%);
|
||||
}
|
||||
|
||||
// Login form container
|
||||
.container-before {
|
||||
width: 7.5rem;
|
||||
height: 8rem;
|
||||
background: @white;
|
||||
box-shadow: 0px 3px 12px @shadow-color;
|
||||
position: absolute;
|
||||
right: .9rem;
|
||||
border: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.login {
|
||||
padding-top: .8rem;
|
||||
padding-left: 1.24rem;
|
||||
padding-right: 1.05rem;
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 14px;
|
||||
position: relative;
|
||||
|
||||
.lang-box {
|
||||
position: absolute;
|
||||
right: 0.1rem;
|
||||
top: 0.1rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.qr-code {
|
||||
position: absolute;
|
||||
right: 1.05rem;
|
||||
top: 0.8rem;
|
||||
cursor: pointer;
|
||||
width: 0.48rem;
|
||||
height: 0.48rem;
|
||||
|
||||
.login-icon {
|
||||
fill: var(--color-primary);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.qr-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.qr-box-img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.qr-expire-time {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
color: @white;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 14px;
|
||||
cursor: pointer;
|
||||
|
||||
.el-icon-refresh-right {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.qr-box-tips {
|
||||
margin-top: 10px;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.qr-box-select-account {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: .2rem;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: .2rem;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #e5e5e5;
|
||||
|
||||
.qr-box-back {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
gap: 5px;
|
||||
font-size: 16px;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.qr-box-select-account-title {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&-title {
|
||||
font-size: .32rem;
|
||||
color: @text-color;
|
||||
line-height: .32rem;
|
||||
}
|
||||
|
||||
&-regist {
|
||||
font-weight: Regular;
|
||||
margin-top: .08rem;
|
||||
color: @text-color;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-form {
|
||||
margin-top: .68rem;
|
||||
}
|
||||
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: .34rem;
|
||||
color: @text-secondary;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.login-email {
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.input-with-select {
|
||||
.el-input-group__prepend {
|
||||
background: @white;
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
margin-left: .1rem;
|
||||
color: @white;
|
||||
}
|
||||
|
||||
.rember-item {
|
||||
margin-top: .2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
line-height: 1.5;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.pass-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
margin-left: 0 !important;
|
||||
margin-top: .15rem;
|
||||
}
|
||||
|
||||
.read-item {
|
||||
margin-top: .2rem;
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.line-item {
|
||||
margin-top: .4rem;
|
||||
|
||||
text {
|
||||
font-size: 16px;
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
font-size: .16rem;
|
||||
}
|
||||
|
||||
.login-type {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 0.15rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.a-text {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.oauth-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover .oauth-img {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
}
|
||||
|
||||
.oauth-img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
// Media queries
|
||||
@media screen and (max-width: 750px) {
|
||||
.login-container {
|
||||
height: calc(100vh - 1.2rem);
|
||||
width: 100vw;
|
||||
background: #f2f2fe;
|
||||
padding: .6rem 0;
|
||||
}
|
||||
|
||||
.container-back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.container-before {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0rem .3rem;
|
||||
position: unset;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.login {
|
||||
padding-top: 1.17rem;
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
font-size: .26rem;
|
||||
line-height: .3rem;
|
||||
|
||||
.qr-code {
|
||||
right: .3rem;
|
||||
top: 1.17rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.login-text-title {
|
||||
font-size: .4rem;
|
||||
}
|
||||
|
||||
.login-text-regist {
|
||||
margin-top: .16rem;
|
||||
font-size: .28rem;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
margin-top: 1.21rem;
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: .6rem;
|
||||
}
|
||||
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: .34rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: @text-secondary;
|
||||
cursor: pointer;
|
||||
padding-bottom: .13rem;
|
||||
}
|
||||
|
||||
.el-checkbox__label {
|
||||
font-size: .22rem;
|
||||
}
|
||||
|
||||
.read-item {
|
||||
line-height: .3rem;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
font-size: .34rem;
|
||||
height: .8rem;
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
font-size: .34rem;
|
||||
}
|
||||
}
|
||||
114
clientarea/hgcloud/css/loginDialog.css
Normal file
114
clientarea/hgcloud/css/loginDialog.css
Normal file
@@ -0,0 +1,114 @@
|
||||
.login-dialog {
|
||||
border-radius: 0.3rem;
|
||||
margin-top: 10vh !important;
|
||||
}
|
||||
.login-dialog .el-dialog__body {
|
||||
padding: 0.95rem 1.36rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
position: relative;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left {
|
||||
width: 5.21rem;
|
||||
position: relative;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left::after {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 4.6rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
opacity: 0.4;
|
||||
position: absolute;
|
||||
top: 0.91rem;
|
||||
right: -1.65rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-text .login-text-title {
|
||||
font-size: 0.32rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-text .login-text-regist {
|
||||
color: #1E2736;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-text .login-text-regist a {
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form {
|
||||
margin-top: 0.68rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .login-top .active {
|
||||
color: #0058FF;
|
||||
border-bottom: 2px solid #0058FF;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .login-top .login-email {
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .login-top .login-email,
|
||||
.login-dialog .el-dialog__body .login-left .login-form .login-top .login-phone {
|
||||
height: 0.34rem;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .form-item {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .form-item .input-with-select .el-input-group__prepend {
|
||||
background: #FFFFFF;
|
||||
width: 64px;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .form-item .login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
background: #0058FF;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .form-item .type-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .code-item .code-btn {
|
||||
margin-left: 0.1rem;
|
||||
background: #0058FF;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .rember-item {
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .rember-item a {
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .read-item {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .read-item a {
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .line-item {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-left .login-form .form-main .line-item text {
|
||||
font-size: 16px;
|
||||
color: #1E2736;
|
||||
}
|
||||
.login-dialog .el-dialog__body .login-right .login-back-img {
|
||||
width: 5.17rem;
|
||||
height: 3.975rem;
|
||||
position: absolute;
|
||||
top: 2.29rem;
|
||||
right: 1.36rem;
|
||||
}
|
||||
151
clientarea/hgcloud/css/loginDialog.less
Normal file
151
clientarea/hgcloud/css/loginDialog.less
Normal file
@@ -0,0 +1,151 @@
|
||||
.login-dialog {
|
||||
border-radius: .3rem;
|
||||
margin-top: 10vh !important;
|
||||
|
||||
.el-dialog__body {
|
||||
padding: .95rem 1.36rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
position: relative;
|
||||
|
||||
.login-left {
|
||||
width: 5.21rem;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 4.6rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
opacity: 0.4;
|
||||
position: absolute;
|
||||
top: .91rem;
|
||||
right: -1.65rem;
|
||||
}
|
||||
|
||||
.login-text {
|
||||
.login-text-title {
|
||||
font-size: .32rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.login-text-regist {
|
||||
color: #1E2736;
|
||||
|
||||
a {
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.login-form {
|
||||
margin-top: .68rem;
|
||||
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.active {
|
||||
color: #0058FF;
|
||||
border-bottom: 2px solid #0058FF;
|
||||
}
|
||||
|
||||
.login-email {
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: .34rem;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: .3rem;
|
||||
|
||||
.form-item {
|
||||
margin-top: .3rem;
|
||||
|
||||
.input-with-select {
|
||||
.el-input-group__prepend {
|
||||
background: #FFFFFF;
|
||||
width: 64px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
background: #0058FF;
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
font-size: .16rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.code-btn {
|
||||
margin-left: .1rem;
|
||||
background: #0058FF;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.rember-item {
|
||||
margin-top: .2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
a {
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.read-item {
|
||||
margin-top: .2rem;
|
||||
|
||||
a {
|
||||
color: #0058FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.line-item {
|
||||
margin-top: .4rem;
|
||||
|
||||
text {
|
||||
font-size: 16px;
|
||||
color: #1E2736;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-right {
|
||||
|
||||
|
||||
.login-back-img {
|
||||
width: 5.17rem;
|
||||
height: 3.975rem;
|
||||
position: absolute;
|
||||
top: 2.29rem;
|
||||
right: 1.36rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
32
clientarea/hgcloud/css/networkErro.css
Normal file
32
clientarea/hgcloud/css/networkErro.css
Normal file
@@ -0,0 +1,32 @@
|
||||
.content-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.content-box .img-box {
|
||||
position: relative;
|
||||
width: 2.82rem;
|
||||
height: 4.55rem;
|
||||
background: url('../img/common/network_erro.png') center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.content-box .img-box .tips-box {
|
||||
position: absolute;
|
||||
left: 0.96rem;
|
||||
bottom: 0.9rem;
|
||||
text-align: center;
|
||||
}
|
||||
.content-box .img-box .tips-box .tips-text {
|
||||
margin-top: 0.12rem;
|
||||
color: #666B80;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.content-box .img-box .tips-box .tran-again {
|
||||
margin-top: 0.06rem;
|
||||
cursor: pointer;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
36
clientarea/hgcloud/css/networkErro.less
Normal file
36
clientarea/hgcloud/css/networkErro.less
Normal file
@@ -0,0 +1,36 @@
|
||||
.content-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.img-box {
|
||||
position: relative;
|
||||
width: 2.82rem;
|
||||
height: 4.55rem;
|
||||
background: url('../img/common/network_erro.png') center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.tips-box {
|
||||
position: absolute;
|
||||
left: 0.96rem;
|
||||
bottom: 0.9rem;
|
||||
text-align: center;
|
||||
|
||||
.tips-text {
|
||||
margin-top: 0.12rem;
|
||||
color: #666B80;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.tran-again {
|
||||
margin-top: 0.06rem;
|
||||
cursor: pointer;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
344
clientarea/hgcloud/css/news.css
Normal file
344
clientarea/hgcloud/css/news.css
Normal file
@@ -0,0 +1,344 @@
|
||||
.news .top-back {
|
||||
width: calc(100% - 190px);
|
||||
background: #F6FAFF;
|
||||
height: calc(40px + 2.56rem);
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
.news .main-card {
|
||||
position: relative;
|
||||
}
|
||||
.news .main-card .main-card-title {
|
||||
font-size: 0.28rem;
|
||||
color: #171725;
|
||||
margin-bottom: 0.24rem;
|
||||
}
|
||||
.news .main-card .search-input {
|
||||
margin-bottom: 0.6rem;
|
||||
height: 0.46rem;
|
||||
width: 3.2rem;
|
||||
}
|
||||
.news .main-card .search-input .el-input__inner {
|
||||
height: 0.46rem;
|
||||
}
|
||||
.news .main-card .search-input .el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
right: 0.14rem;
|
||||
}
|
||||
.news .main-card .search-input .input-search {
|
||||
cursor: pointer;
|
||||
}
|
||||
.news .main-card .back-img {
|
||||
width: 3.7rem;
|
||||
height: 2.35rem;
|
||||
position: absolute;
|
||||
top: -0.3rem;
|
||||
right: 1.84rem;
|
||||
z-index: -1;
|
||||
}
|
||||
.news .top-search {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
padding: 0 0.4rem 0 0;
|
||||
}
|
||||
.news .top-search .input-search {
|
||||
line-height: 0.4rem;
|
||||
}
|
||||
.news .tit {
|
||||
font-size: 0.2rem;
|
||||
color: #171725;
|
||||
line-height: 1;
|
||||
}
|
||||
.news .com-search {
|
||||
height: 0.4rem;
|
||||
}
|
||||
.news .com-search .el-input__inner {
|
||||
height: 0.4rem;
|
||||
line-height: 0.4rem;
|
||||
}
|
||||
.news .box {
|
||||
margin-top: 0.4rem;
|
||||
position: relative;
|
||||
min-height: 70vh;
|
||||
}
|
||||
.news .com-l-box {
|
||||
margin-right: 3.57rem;
|
||||
}
|
||||
.news .com-r-box {
|
||||
width: 3.58rem !important;
|
||||
padding: 0.3rem;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1);
|
||||
margin-right: 3px;
|
||||
float: right;
|
||||
}
|
||||
.news .com-r-box .tit {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.news .no-data {
|
||||
text-align: center;
|
||||
line-height: 0.6rem;
|
||||
height: 0.6rem;
|
||||
color: #999;
|
||||
}
|
||||
.news .myPage {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.news .el-icon-download {
|
||||
color: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.news .tag {
|
||||
line-height: 0.2rem;
|
||||
height: 0.2rem;
|
||||
padding: 0 0.05rem;
|
||||
border-radius: 0.03rem;
|
||||
font-size: 0.13rem;
|
||||
background: #E6E7EB;
|
||||
color: #4E5259;
|
||||
}
|
||||
.news .tag.suc {
|
||||
background: #C9F7F5;
|
||||
color: var(--color-success);
|
||||
}
|
||||
.news .tag.war {
|
||||
background: #FFF4DE;
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.news .tag.error {
|
||||
background: #FFE2E5;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.news .tag.def {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-info);
|
||||
}
|
||||
.news .total {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
line-height: 0.2rem;
|
||||
font-size: 0.16rem;
|
||||
color: #171725;
|
||||
padding-left: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
}
|
||||
.news .total.active {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.news .file_folder {
|
||||
padding-left: 0.1rem;
|
||||
}
|
||||
.news .file_folder .item {
|
||||
position: relative;
|
||||
line-height: 0.18rem;
|
||||
padding-left: 0.15rem;
|
||||
margin-bottom: 0.2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.news .file_folder .item::before {
|
||||
content: '';
|
||||
width: 0.03rem;
|
||||
height: 0.18rem;
|
||||
background: #E6E7EB;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.news .file_folder .item.active {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.news .file_folder .item.active::before {
|
||||
background: var(--color-primary);
|
||||
}
|
||||
.news .news-list {
|
||||
padding: 0 0.4rem 0 0;
|
||||
}
|
||||
.news .news-list .item {
|
||||
margin-top: 0.32rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.news .news-list .item .item-left {
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.news .news-list .item .item-left .item-img {
|
||||
width: 1.4rem;
|
||||
height: 0.84rem;
|
||||
}
|
||||
.news .news-list .item .item-right {
|
||||
width: 100%;
|
||||
height: 0.84rem;
|
||||
border-bottom: 1px solid #E6E7EB;
|
||||
}
|
||||
.news .news-list .title {
|
||||
margin-bottom: 0.1rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.news .news-list .info {
|
||||
font-size: 0.13rem;
|
||||
color: var(--color-text-tips);
|
||||
}
|
||||
.news .mobile {
|
||||
display: none;
|
||||
}
|
||||
/* news_detail */
|
||||
.news_detail .main-card-title {
|
||||
padding-bottom: 0.2rem;
|
||||
border-bottom: 1px solid #E6E7EB;
|
||||
}
|
||||
.news_detail .back {
|
||||
cursor: pointer;
|
||||
width: 0.24rem;
|
||||
}
|
||||
.news_detail .news_annex {
|
||||
margin-top: 0.3rem;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
.news_detail .news_annex a {
|
||||
text-decoration: none;
|
||||
color: #171725;
|
||||
}
|
||||
.news_detail .news_annex a:hover {
|
||||
text-decoration: underline;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.news_detail .new-box {
|
||||
width: 10.33rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
margin: 0.4rem auto;
|
||||
padding: 0.3rem 0.5rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.news_detail .new-box .tit {
|
||||
line-height: 1.2;
|
||||
font-size: 0.28rem;
|
||||
color: #171725;
|
||||
margin-bottom: 0.14rem;
|
||||
}
|
||||
.news_detail .new-box .time {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-text-tips);
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.news_detail .new-box img {
|
||||
max-width: 100%;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.news_detail .new-box .content {
|
||||
word-break: break-all;
|
||||
overflow-x: auto;
|
||||
}
|
||||
.news_detail .page {
|
||||
overflow: hidden;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.news_detail .page .link {
|
||||
width: 50%;
|
||||
height: 0.24rem;
|
||||
float: left;
|
||||
}
|
||||
.news_detail .page .link .txt,
|
||||
.news_detail .page .link .icon {
|
||||
color: var(--color-text-tips);
|
||||
}
|
||||
.news_detail .page .link a {
|
||||
display: block;
|
||||
font-size: 0.14rem;
|
||||
color: #171725;
|
||||
text-decoration: none;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.news_detail .page .link:last-child {
|
||||
text-align: right;
|
||||
}
|
||||
@media screen and (max-width: 1100px) {
|
||||
.news .com-search {
|
||||
height: 0.5rem;
|
||||
}
|
||||
.news .com-search .el-input__inner {
|
||||
height: 0.5rem;
|
||||
line-height: 0.5rem;
|
||||
}
|
||||
.news .top-search .input-search {
|
||||
line-height: 0.5rem;
|
||||
}
|
||||
.news .com-l-box {
|
||||
margin-right: 3rem;
|
||||
}
|
||||
.news .com-r-box {
|
||||
width: 3rem !important;
|
||||
}
|
||||
.news .box::after {
|
||||
right: 3rem;
|
||||
}
|
||||
.news_detail .new-box {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.news .com-l-box {
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
margin-right: 0;
|
||||
}
|
||||
.news .pc {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.news .tit {
|
||||
font-size: 0.3rem;
|
||||
}
|
||||
.news .main-card-title {
|
||||
font-size: 0.48rem;
|
||||
}
|
||||
.news .com-r-box {
|
||||
font-size: 0.16rem;
|
||||
width: 100% !important;
|
||||
}
|
||||
.news_detail .back {
|
||||
width: 0.42rem;
|
||||
}
|
||||
.news_detail .new-box {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
.news_detail .new-box .tit {
|
||||
font-size: 0.46rem;
|
||||
font-weight: bold;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.news_detail .new-box .time {
|
||||
font-size: 0.24rem;
|
||||
margin-bottom: 0.6rem;
|
||||
}
|
||||
.news_detail .new-box .content {
|
||||
font-size: 0.28rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.news_detail .new-box .news_annex {
|
||||
line-height: 1.5;
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
.news_detail .page .link {
|
||||
height: 0.4rem;
|
||||
line-height: 0.4rem;
|
||||
}
|
||||
.news_detail .page .link a {
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
}
|
||||
466
clientarea/hgcloud/css/news.less
Normal file
466
clientarea/hgcloud/css/news.less
Normal file
@@ -0,0 +1,466 @@
|
||||
@text-color: #171725;
|
||||
|
||||
.news {
|
||||
|
||||
|
||||
|
||||
.top-back {
|
||||
width: calc(100% - 190px);
|
||||
background: #F6FAFF;
|
||||
height: calc(40px + 2.56rem);
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.main-card {
|
||||
position: relative;
|
||||
|
||||
.main-card-title {
|
||||
font-size: .28rem;
|
||||
color: @text-color;
|
||||
margin-bottom: .24rem;
|
||||
}
|
||||
|
||||
.search-input {
|
||||
margin-bottom: .6rem;
|
||||
height: .46rem;
|
||||
width: 3.2rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: .46rem;
|
||||
}
|
||||
|
||||
.el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
right: .14rem;
|
||||
}
|
||||
|
||||
.input-search {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.back-img {
|
||||
width: 3.7rem;
|
||||
height: 2.35rem;
|
||||
position: absolute;
|
||||
top: -.3rem;
|
||||
right: 1.84rem;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.top-search {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
padding: 0 .4rem 0 0;
|
||||
|
||||
.input-search {
|
||||
line-height: .4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
font-size: .2rem;
|
||||
color: @text-color;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.com-search {
|
||||
height: .4rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: .4rem;
|
||||
line-height: .4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
// width: 100%;
|
||||
margin-top: .4rem;
|
||||
// border: 1px solid #E6E7EB;
|
||||
position: relative;
|
||||
min-height: 70vh;
|
||||
|
||||
// &::after {
|
||||
// content: '';
|
||||
// width: 1px;
|
||||
// height: 100%;
|
||||
// background: #E6E7EB;
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// right: 3.57rem;
|
||||
// }
|
||||
}
|
||||
|
||||
.com-l-box {
|
||||
margin-right: 3.57rem;
|
||||
}
|
||||
|
||||
.com-r-box {
|
||||
width: 3.58rem !important;
|
||||
padding: .3rem;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1);
|
||||
margin-right: 3px;
|
||||
float: right;
|
||||
|
||||
.tit {
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.no-data {
|
||||
text-align: center;
|
||||
line-height: .6rem;
|
||||
height: .6rem;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.myPage {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.el-icon-download {
|
||||
color: var(--color-primary);
|
||||
font-size: .16rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tag {
|
||||
line-height: .2rem;
|
||||
height: .2rem;
|
||||
padding: 0 .05rem;
|
||||
border-radius: .03rem;
|
||||
font-size: .13rem;
|
||||
background: #E6E7EB;
|
||||
color: #4E5259;
|
||||
|
||||
&.suc {
|
||||
background: #C9F7F5;
|
||||
color: var(--color-success);
|
||||
}
|
||||
|
||||
&.war {
|
||||
background: #FFF4DE;
|
||||
color: var(--color-warning);
|
||||
}
|
||||
|
||||
&.error {
|
||||
background: #FFE2E5;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
|
||||
&.def {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-info);
|
||||
}
|
||||
}
|
||||
|
||||
.total {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
line-height: .2rem;
|
||||
font-size: .16rem;
|
||||
color: @text-color;
|
||||
padding-left: .2rem;
|
||||
margin-bottom: .2rem;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
|
||||
&.active {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.file_folder {
|
||||
padding-left: .1rem;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
line-height: .18rem;
|
||||
padding-left: .15rem;
|
||||
margin-bottom: .2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
width: .03rem;
|
||||
height: .18rem;
|
||||
background: #E6E7EB;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: var(--color-primary);
|
||||
|
||||
&::before {
|
||||
background: var(--color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.news-list {
|
||||
padding: 0 .4rem 0 0;
|
||||
|
||||
.item {
|
||||
// line-height: 1;
|
||||
// color: #171725;
|
||||
// border-bottom: 1px solid #E6E7EB;
|
||||
// padding: .2rem 0;
|
||||
margin-top: .32rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.item-left {
|
||||
margin-right: .2rem;
|
||||
|
||||
.item-img {
|
||||
width: 1.40rem;
|
||||
height: .84rem;
|
||||
}
|
||||
}
|
||||
|
||||
.item-right {
|
||||
width: 100%;
|
||||
height: .84rem;
|
||||
border-bottom: 1px solid #E6E7EB;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: .1rem;
|
||||
font-size: .16rem;
|
||||
}
|
||||
|
||||
.info {
|
||||
font-size: .13rem;
|
||||
color: var(--color-text-tips);
|
||||
}
|
||||
}
|
||||
|
||||
.mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* news_detail */
|
||||
.news_detail {
|
||||
.main-card-title {
|
||||
padding-bottom: .2rem;
|
||||
border-bottom: 1px solid #E6E7EB;
|
||||
}
|
||||
|
||||
.back {
|
||||
cursor: pointer;
|
||||
width: .24rem;
|
||||
}
|
||||
|
||||
.news_annex {
|
||||
margin-top: .3rem;
|
||||
line-height: .24rem;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: @text-color;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.new-box {
|
||||
width: 10.33rem;
|
||||
border: 1px solid #E6E7EB;
|
||||
margin: .4rem auto;
|
||||
padding: .3rem .5rem;
|
||||
box-sizing: border-box;
|
||||
|
||||
|
||||
.tit {
|
||||
line-height: 1.2;
|
||||
font-size: .28rem;
|
||||
color: @text-color;
|
||||
margin-bottom: .14rem;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-size: .14rem;
|
||||
color: var(--color-text-tips);
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.content {
|
||||
|
||||
word-break: break-all;
|
||||
overflow-x: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.page {
|
||||
overflow: hidden;
|
||||
margin-top: .3rem;
|
||||
|
||||
.link {
|
||||
width: 50%;
|
||||
height: .24rem;
|
||||
float: left;
|
||||
|
||||
.txt,
|
||||
.icon {
|
||||
color: var(--color-text-tips);
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
font-size: .14rem;
|
||||
color: @text-color;
|
||||
text-decoration: none;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1100px) {
|
||||
.news {
|
||||
.com-search {
|
||||
height: .5rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: .5rem;
|
||||
line-height: .5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.top-search .input-search {
|
||||
line-height: .5rem;
|
||||
}
|
||||
|
||||
.com-l-box {
|
||||
margin-right: 3rem;
|
||||
}
|
||||
|
||||
.com-r-box {
|
||||
width: 3rem !important;
|
||||
}
|
||||
|
||||
.box {
|
||||
&::after {
|
||||
right: 3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.news_detail {
|
||||
.new-box {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.news {
|
||||
.com-l-box {
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.pc {
|
||||
// display: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.tit {
|
||||
font-size: 0.3rem;
|
||||
}
|
||||
|
||||
.mobile {
|
||||
// display: block;
|
||||
}
|
||||
|
||||
.main-card-title {
|
||||
font-size: .48rem;
|
||||
}
|
||||
|
||||
.com-r-box {
|
||||
font-size: 0.16rem;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.news_detail {
|
||||
.back {
|
||||
width: .42rem;
|
||||
}
|
||||
|
||||
.new-box {
|
||||
border: none;
|
||||
padding: 0;
|
||||
|
||||
.tit {
|
||||
font-size: .46rem;
|
||||
font-weight: bold;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-size: .24rem;
|
||||
margin-bottom: .6rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: .28rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.news_annex {
|
||||
line-height: 1.5;
|
||||
font-size: .24rem;
|
||||
}
|
||||
}
|
||||
|
||||
.page .link {
|
||||
height: .4rem;
|
||||
line-height: .4rem;
|
||||
|
||||
a {
|
||||
font-size: .24rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
38
clientarea/hgcloud/css/newworkErro.css
Normal file
38
clientarea/hgcloud/css/newworkErro.css
Normal file
@@ -0,0 +1,38 @@
|
||||
.content-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
position: relative;
|
||||
width: 2.82rem;
|
||||
height: 4.55rem;
|
||||
background: url('../img/common/network_erro.png') center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
.tips-box {
|
||||
position: absolute;
|
||||
left: 0.96rem;
|
||||
bottom: 0.9rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.tips-text {
|
||||
margin-top: 0.12rem;
|
||||
color: #666B80;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
||||
.tran-again {
|
||||
margin-top: 0.06rem;
|
||||
cursor: pointer;
|
||||
color: #0058FF;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
24
clientarea/hgcloud/css/noPermissions.css
Normal file
24
clientarea/hgcloud/css/noPermissions.css
Normal file
@@ -0,0 +1,24 @@
|
||||
.el-main {
|
||||
padding-left: 1.02rem;
|
||||
}
|
||||
.box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.box img {
|
||||
margin-bottom: 0.2rem;
|
||||
width: 2.4rem;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
.box p {
|
||||
font-size: 0.18rem;
|
||||
color: #848585;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0.1rem 0;
|
||||
}
|
||||
.box p .el-button {
|
||||
font-size: 0.18rem;
|
||||
}
|
||||
28
clientarea/hgcloud/css/noPermissions.less
Normal file
28
clientarea/hgcloud/css/noPermissions.less
Normal file
@@ -0,0 +1,28 @@
|
||||
.el-main {
|
||||
padding-left: 1.02rem;
|
||||
}
|
||||
|
||||
.box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
margin-bottom: 0.2rem;
|
||||
width: 2.4rem;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.18rem;
|
||||
color: rgb(132, 133, 133);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0.1rem 0;
|
||||
|
||||
.el-button {
|
||||
font-size: 0.18rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
203
clientarea/hgcloud/css/orderDetail.css
Normal file
203
clientarea/hgcloud/css/orderDetail.css
Normal file
@@ -0,0 +1,203 @@
|
||||
.order-detail {
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.page-top {
|
||||
padding-bottom: 0.2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #E6E7EB;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.page-top .back-btn {
|
||||
cursor: pointer;
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
}
|
||||
.page-top .back-btn img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.page-top .top-title {
|
||||
margin-left: 0.25rem;
|
||||
font-size: 0.28rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.order-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-right: 0.85rem;
|
||||
}
|
||||
.order-info .info-left .order-user {
|
||||
font-size: 0.18rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.order-info .info-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.order-info .info-right .order-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 0.18rem;
|
||||
}
|
||||
.order-info .info-right .go-pay {
|
||||
text-align: center;
|
||||
}
|
||||
.order-info .info-right .go-pay .pay-text {
|
||||
margin-top: 0.15rem;
|
||||
cursor: pointer;
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.order-info .info-right .go-pay .pay-text:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.order-info .info-right .go-pay .pay-info {
|
||||
margin-top: 0.1rem;
|
||||
font-weight: bold;
|
||||
font-size: 0.14rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.order-info .pay-status {
|
||||
border-radius: 0.03rem;
|
||||
padding: 0.05rem 0.14rem;
|
||||
font-size: 0.16rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.order-info .Unpaid-text {
|
||||
background: var(--color-danger);
|
||||
}
|
||||
.order-info .Wait {
|
||||
background: var(--color-warning);
|
||||
}
|
||||
.order-info .Unpaid {
|
||||
background: var(--color-danger);
|
||||
}
|
||||
.order-info .Paid-text {
|
||||
background: var(--color-primary);
|
||||
}
|
||||
.order-info .Refunded-text {
|
||||
background: var(--color-danger);
|
||||
}
|
||||
.order-info .order-num {
|
||||
margin-top: 0.13rem;
|
||||
color: #1E2736;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.order-info .order-num .num-text {
|
||||
color: #666B80;
|
||||
}
|
||||
.order-info .order-data {
|
||||
margin-top: 0.04rem;
|
||||
}
|
||||
.self-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 0.04rem;
|
||||
}
|
||||
.self-field .self-num {
|
||||
display: flex;
|
||||
color: #1E2736;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.self-field .self-num .field-name {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.self-field .self-num .self-text {
|
||||
white-space: pre;
|
||||
color: #666B80;
|
||||
}
|
||||
.order-table {
|
||||
margin-top: 0.33rem;
|
||||
border-radius: 0.03rem;
|
||||
border: 0.01rem solid #E6E7EB;
|
||||
}
|
||||
.order-table .table-title {
|
||||
font-size: 0.14rem;
|
||||
background: #FAFBFF;
|
||||
height: 0.46rem;
|
||||
line-height: 0.46rem;
|
||||
padding-left: 0.2rem;
|
||||
border-bottom: 0.01rem solid #E6E7EB;
|
||||
}
|
||||
.order-table .table-item {
|
||||
margin: 0 0.2rem;
|
||||
min-height: 0.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.order-table .table-item .des,
|
||||
.order-table .table-item .money {
|
||||
color: #1E2736;
|
||||
}
|
||||
.order-table .table-item .des-text {
|
||||
margin-right: 0.5rem;
|
||||
color: #666B80;
|
||||
}
|
||||
.order-table .table-item .money-text {
|
||||
color: #666B80;
|
||||
}
|
||||
.order-table .order-item {
|
||||
border-bottom: 0.01rem dashed #E6E7EB;
|
||||
}
|
||||
.order-table .title-item {
|
||||
border-bottom: 0.01rem solid #E6E7EB;
|
||||
}
|
||||
.order-table .total-money {
|
||||
color: #1E2736;
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
.order-transaction {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.order-transaction .table-top,
|
||||
.order-transaction .table-bottom {
|
||||
font-size: 0.14rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 0.01rem solid #E6E7EB;
|
||||
}
|
||||
.order-transaction .table-top {
|
||||
color: #1E2736;
|
||||
padding: 0.13rem 0.2rem 0.14rem;
|
||||
}
|
||||
.order-transaction .table-bottom {
|
||||
padding: 0.13rem 0.2rem;
|
||||
color: #666B80;
|
||||
}
|
||||
.order-transaction .w-200 {
|
||||
width: 2rem;
|
||||
}
|
||||
.order-transaction .flex-1 {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.order-transaction .text-r {
|
||||
text-align: right;
|
||||
}
|
||||
.order-transaction .no-list {
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-bottom: 0.01rem solid #E6E7EB;
|
||||
text-align: center;
|
||||
color: #909399;
|
||||
font-size: 14px;
|
||||
}
|
||||
.down-pag {
|
||||
margin-top: 0.8rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.down-pag .el-button {
|
||||
height: 0.32rem;
|
||||
border-radius: 0.03rem;
|
||||
border: 0.01rem solid var(--color-primary);
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
260
clientarea/hgcloud/css/orderDetail.less
Normal file
260
clientarea/hgcloud/css/orderDetail.less
Normal file
@@ -0,0 +1,260 @@
|
||||
// Variables
|
||||
@border-color: #E6E7EB;
|
||||
@text-primary: #1E2736;
|
||||
@text-secondary: #666B80;
|
||||
@white: #FFFFFF;
|
||||
|
||||
|
||||
.order-detail {
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
.page-top {
|
||||
padding-bottom: 0.2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid @border-color;
|
||||
margin-bottom: 0.4rem;
|
||||
|
||||
.back-btn {
|
||||
cursor: pointer;
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.top-title {
|
||||
margin-left: 0.25rem;
|
||||
font-size: 0.28rem;
|
||||
color: @text-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.page-content {}
|
||||
|
||||
.order-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-right: 0.85rem;
|
||||
|
||||
.info-left {
|
||||
.order-user {
|
||||
font-size: 0.18rem;
|
||||
color: @text-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.info-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.order-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 0.18rem;
|
||||
}
|
||||
|
||||
.go-pay {
|
||||
text-align: center;
|
||||
|
||||
.pay-text {
|
||||
margin-top: 0.15rem;
|
||||
cursor: pointer;
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.pay-info {
|
||||
margin-top: 0.1rem;
|
||||
font-weight: bold;
|
||||
font-size: 0.14rem;
|
||||
color: @text-primary;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.pay-status {
|
||||
border-radius: 0.03rem;
|
||||
padding: 0.05rem 0.14rem;
|
||||
font-size: 0.16rem;
|
||||
color: @white;
|
||||
}
|
||||
|
||||
.Unpaid-text {
|
||||
background: var(--color-danger);
|
||||
}
|
||||
|
||||
.Wait {
|
||||
background: var(--color-warning);
|
||||
}
|
||||
|
||||
.Unpaid {
|
||||
background: var(--color-danger);
|
||||
}
|
||||
|
||||
.Paid-text {
|
||||
background: var(--color-primary);
|
||||
}
|
||||
|
||||
.Refunded-text {
|
||||
background: var(--color-danger);
|
||||
}
|
||||
|
||||
.order-num {
|
||||
margin-top: 0.13rem;
|
||||
color: @text-primary;
|
||||
font-size: 0.14rem;
|
||||
|
||||
.num-text {
|
||||
color: @text-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
.order-data {
|
||||
margin-top: 0.04rem;
|
||||
}
|
||||
}
|
||||
|
||||
.self-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 0.04rem;
|
||||
|
||||
.self-num {
|
||||
display: flex;
|
||||
color: @text-primary;
|
||||
font-size: 0.14rem;
|
||||
|
||||
.field-name {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.self-text {
|
||||
white-space: pre;
|
||||
color: @text-secondary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-table {
|
||||
margin-top: 0.33rem;
|
||||
border-radius: 0.03rem;
|
||||
border: 0.01rem solid @border-color;
|
||||
|
||||
.table-title {
|
||||
font-size: 0.14rem;
|
||||
background: #FAFBFF;
|
||||
height: 0.46rem;
|
||||
line-height: 0.46rem;
|
||||
padding-left: 0.2rem;
|
||||
border-bottom: 0.01rem solid @border-color;
|
||||
}
|
||||
|
||||
.table-item {
|
||||
margin: 0 0.2rem;
|
||||
min-height: 0.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 0.14rem;
|
||||
|
||||
.des,
|
||||
.money {
|
||||
color: @text-primary;
|
||||
}
|
||||
|
||||
.des-text {
|
||||
margin-right: 0.5rem;
|
||||
color: @text-secondary;
|
||||
}
|
||||
|
||||
.money-text {
|
||||
color: @text-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
.order-item {
|
||||
border-bottom: 0.01rem dashed @border-color;
|
||||
}
|
||||
|
||||
.title-item {
|
||||
border-bottom: 0.01rem solid @border-color;
|
||||
}
|
||||
|
||||
.total-money {
|
||||
color: @text-primary;
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.order-transaction {
|
||||
margin-top: 0.4rem;
|
||||
|
||||
.table-top,
|
||||
.table-bottom {
|
||||
font-size: 0.14rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 0.01rem solid @border-color;
|
||||
}
|
||||
|
||||
.table-top {
|
||||
color: @text-primary;
|
||||
padding: 0.13rem 0.2rem 0.14rem;
|
||||
}
|
||||
|
||||
.table-bottom {
|
||||
padding: 0.13rem 0.2rem;
|
||||
color: @text-secondary;
|
||||
}
|
||||
|
||||
.w-200 {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-r {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.no-list {
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-bottom: 0.01rem solid @border-color;
|
||||
text-align: center;
|
||||
color: #909399;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.down-pag {
|
||||
margin-top: 0.8rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.el-button {
|
||||
height: 0.32rem;
|
||||
border-radius: 0.03rem;
|
||||
border: 0.01rem solid var(--color-primary);
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
195
clientarea/hgcloud/css/productList.css
Normal file
195
clientarea/hgcloud/css/productList.css
Normal file
@@ -0,0 +1,195 @@
|
||||
#cloudList {
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: #171725;
|
||||
}
|
||||
.main-card-title {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.title-text {
|
||||
font-size: 28px;
|
||||
}
|
||||
.add-btn {
|
||||
width: 0.6rem;
|
||||
height: 0.24rem;
|
||||
border: 1px solid var(--color-primary);
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
color: var(--color-primary);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
margin-left: 0.08rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: bold;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
.main-card-menu {
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e6e7eb;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.main-card-menu .active {
|
||||
border-bottom: 1px solid var(--color-primary);
|
||||
}
|
||||
.card-menu-item {
|
||||
font-size: 15;
|
||||
color: #1e2736;
|
||||
padding-bottom: 13px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.card-menu-item:not(:first-child) {
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
.main-card-search {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
.main-card-search .right-search {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
align-items: center;
|
||||
column-gap: 0.2rem;
|
||||
}
|
||||
.main-card-search .right-search .el-select,
|
||||
.main-card-search .right-search .el-input {
|
||||
width: 2.2rem;
|
||||
}
|
||||
.center-option-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.center-option-label img {
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.search-btn {
|
||||
min-width: 0.8rem;
|
||||
height: 0.4rem;
|
||||
background: var(--color-primary);
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
font-size: 0.16rem;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
padding: 0 0.15rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.main-card-table {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
tbody tr:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.column-id {
|
||||
cursor: pointer;
|
||||
}
|
||||
.column-id:hover {
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
.area {
|
||||
height: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.area-img {
|
||||
height: 18px;
|
||||
}
|
||||
.area-country {
|
||||
margin-left: 8px;
|
||||
}
|
||||
.area-city {
|
||||
margin-left: 8px;
|
||||
}
|
||||
.cloud-name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.cloud-name .packge-name {
|
||||
color: #171725;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.cloud-name .name {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: #8692b0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.power-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.power-status img {
|
||||
width: 0.24rem;
|
||||
}
|
||||
.power-status .status-text {
|
||||
color: #1e2736;
|
||||
margin-left: 7px;
|
||||
}
|
||||
.os {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.os-img {
|
||||
width: 28px;
|
||||
}
|
||||
.os-text {
|
||||
margin-left: 0.08rem;
|
||||
}
|
||||
.status {
|
||||
width: 56px;
|
||||
height: 26px;
|
||||
border-radius: 4px;
|
||||
background: pink;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
.operation .dot {
|
||||
color: var(--color-primary);
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.input-search {
|
||||
padding-right: 0.1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
.list-show-ip .cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.list-show-ip .com-ip-box {
|
||||
display: flex;
|
||||
max-width: calc(100% - 0.3rem);
|
||||
}
|
||||
.list-show-ip .com-ip-box > span {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-right: 0.05rem;
|
||||
line-height: 1;
|
||||
}
|
||||
233
clientarea/hgcloud/css/productList.less
Normal file
233
clientarea/hgcloud/css/productList.less
Normal file
@@ -0,0 +1,233 @@
|
||||
#cloudList {
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: #171725;
|
||||
}
|
||||
|
||||
.main-card-title {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.title-text {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.add-btn {
|
||||
width: 0.6rem;
|
||||
height: 0.24rem;
|
||||
border: 1px solid var(--color-primary);
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
color: var(--color-primary);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
margin-left: 0.08rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: bold;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
|
||||
.main-card-menu {
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e6e7eb;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.main-card-menu .active {
|
||||
border-bottom: 1px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.card-menu-item {
|
||||
font-size: 15;
|
||||
color: #1e2736;
|
||||
padding-bottom: 13px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.card-menu-item:not(:first-child) {
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
|
||||
.main-card-search {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
|
||||
.main-card-search .right-search {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
align-items: center;
|
||||
column-gap: 0.2rem;
|
||||
}
|
||||
|
||||
.main-card-search .right-search .el-select,
|
||||
.main-card-search .right-search .el-input {
|
||||
width: 2.2rem;
|
||||
}
|
||||
|
||||
.center-option-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.center-option-label img {
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
|
||||
.search-btn {
|
||||
min-width: 0.8rem;
|
||||
height: 0.4rem;
|
||||
background: var(--color-primary);
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
font-size: 0.16rem;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
padding: 0 0.15rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.main-card-table {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
tbody tr:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.column-id {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.column-id:hover {
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
|
||||
.area {
|
||||
height: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.area-img {
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.area-country {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.area-city {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.cloud-name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cloud-name .packge-name {
|
||||
color: #171725;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.cloud-name .name {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: #8692b0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.power-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.power-status img {
|
||||
width: 0.24rem;
|
||||
}
|
||||
|
||||
.power-status .status-text {
|
||||
color: #1e2736;
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
.os {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.os-img {
|
||||
width: 28px;
|
||||
}
|
||||
|
||||
.os-text {
|
||||
margin-left: 0.08rem;
|
||||
}
|
||||
|
||||
.status {
|
||||
width: 56px;
|
||||
height: 26px;
|
||||
border-radius: 4px;
|
||||
background: pink;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.operation .dot {
|
||||
color: var(--color-primary);
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.input-search {
|
||||
padding-right: 0.1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
|
||||
.list-show-ip .cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.list-show-ip .com-ip-box {
|
||||
display: flex;
|
||||
max-width: calc(100% - 0.3rem);
|
||||
}
|
||||
|
||||
.list-show-ip .com-ip-box > span {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-right: 0.05rem;
|
||||
line-height: 1;
|
||||
}
|
||||
40
clientarea/hgcloud/css/productdetail.css
Normal file
40
clientarea/hgcloud/css/productdetail.css
Normal file
@@ -0,0 +1,40 @@
|
||||
.config-box .contract-box {
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
.config-box .contract-box .contract-top .back-img {
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.config-box .contract-box .contract-top .top-product-name {
|
||||
font-size: 0.28rem;
|
||||
color: #171725;
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
.config-box .contract-box .go-contract {
|
||||
margin-top: 1.96rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.config-box .contract-box .go-contract .contract-img {
|
||||
width: 1.72rem;
|
||||
height: 1.72rem;
|
||||
}
|
||||
.config-box .contract-box .go-contract .contract-text {
|
||||
margin: 0.4rem 0 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.config-box .contract-box .go-contract .contract-btn {
|
||||
font-size: 0.16rem;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
}
|
||||
.upgrade-dialog .el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled) {
|
||||
box-shadow: none;
|
||||
}
|
||||
56
clientarea/hgcloud/css/productdetail.less
Normal file
56
clientarea/hgcloud/css/productdetail.less
Normal file
@@ -0,0 +1,56 @@
|
||||
.config-box {
|
||||
.contract-box {
|
||||
font-size: 0.14rem;
|
||||
|
||||
.contract-top {
|
||||
.back-img {
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.top-product-name {
|
||||
font-size: 0.28rem;
|
||||
color: #171725;
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
// 电子合同
|
||||
.go-contract {
|
||||
margin-top: 1.96rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.contract-img {
|
||||
width: 1.72rem;
|
||||
height: 1.72rem;
|
||||
}
|
||||
|
||||
.contract-text {
|
||||
margin: 0.4rem 0 0.24rem;
|
||||
font-size: 0.16rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.contract-btn {
|
||||
font-size: 0.16rem;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
width: 1.12rem;
|
||||
height: 0.46rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.upgrade-dialog {
|
||||
.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled) {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
64
clientarea/hgcloud/css/promotionDetail.css
Normal file
64
clientarea/hgcloud/css/promotionDetail.css
Normal file
@@ -0,0 +1,64 @@
|
||||
.promotionDetail-contetn header {
|
||||
display: flex;
|
||||
margin-bottom: 0.4rem;
|
||||
padding-bottom: 0.2rem;
|
||||
border-bottom: 0.01rem solid #e6e7eb;
|
||||
font-size: 0.28rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.25rem;
|
||||
color: #171725;
|
||||
}
|
||||
.promotionDetail-contetn header img {
|
||||
display: block;
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
margin-right: 0.24rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.promotionDetail-contetn main .title {
|
||||
padding-left: 0.1rem;
|
||||
border-left: 0.03rem solid var(--color-primary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.4rem;
|
||||
font-size: 0.18rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
line-height: 0.25rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form {
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form .el-form-item {
|
||||
width: 5.4rem;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form .el-form-item .el-form-item__label {
|
||||
font-size: 0.16rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #1e2736;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form .el-form-item .el-form-item__content {
|
||||
width: 4rem;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form .el-form-item .el-form-item__content .el-input {
|
||||
width: 3.6rem;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form .el-form-item .el-form-item__content .textarea .el-textarea__inner {
|
||||
width: 3.6rem;
|
||||
height: 1.12rem;
|
||||
}
|
||||
.promotionDetail-contetn main .el-form .el-form-item .el-form-item__content .text {
|
||||
font-size: 0.15rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.24rem;
|
||||
color: #8692b0;
|
||||
}
|
||||
.promotionDetail-contetn main .content-table {
|
||||
border: 1px solid #e6e7eb;
|
||||
border-radius: 3px;
|
||||
}
|
||||
82
clientarea/hgcloud/css/promotionDetail.less
Normal file
82
clientarea/hgcloud/css/promotionDetail.less
Normal file
@@ -0,0 +1,82 @@
|
||||
.promotionDetail-contetn {
|
||||
header {
|
||||
display: flex;
|
||||
margin-bottom: 0.4rem;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
width: 0.24rem;
|
||||
height: 0.26rem;
|
||||
margin-right: 0.24rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
padding-bottom: 0.2rem;
|
||||
border-bottom: 0.01rem solid #e6e7eb;
|
||||
font-size: 0.28rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.25rem;
|
||||
color: #171725;
|
||||
}
|
||||
|
||||
main {
|
||||
.title {
|
||||
padding-left: 0.1rem;
|
||||
border-left: 0.03rem solid var(--color-primary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.4rem;
|
||||
font-size: 0.18rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
line-height: 0.25rem;
|
||||
color: #1e2736;
|
||||
}
|
||||
|
||||
.el-form {
|
||||
padding-left: 0.5rem;
|
||||
|
||||
.el-form-item {
|
||||
width: 5.4rem;
|
||||
|
||||
.el-form-item__label {
|
||||
font-size: 0.16rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #1e2736;
|
||||
}
|
||||
|
||||
.el-form-item__content {
|
||||
width: 4rem;
|
||||
|
||||
.el-input {
|
||||
width: 3.6rem;
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
.el-textarea__inner {
|
||||
// height: 100%;
|
||||
width: 3.6rem;
|
||||
height: 1.12rem;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 0.15rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.24rem;
|
||||
color: #8692b0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-table {
|
||||
border: 1px solid #e6e7eb;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
275
clientarea/hgcloud/css/regist.css
Normal file
275
clientarea/hgcloud/css/regist.css
Normal file
@@ -0,0 +1,275 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#regist {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.custom-form {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.custom-form .el-form-item__label {
|
||||
line-height: 1;
|
||||
}
|
||||
.custom-form .el-select {
|
||||
width: 100%;
|
||||
}
|
||||
.login-container {
|
||||
width: 15.7rem;
|
||||
height: 8.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
/* 背景板 开始 */
|
||||
.container-back {
|
||||
width: 15.7rem;
|
||||
height: 6.8rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: Source Han Sans CN;
|
||||
}
|
||||
.back-text {
|
||||
font-size: 0.27rem;
|
||||
z-index: 10;
|
||||
color: #FFFFFF;
|
||||
margin-top: 1.39rem;
|
||||
margin-left: 0.65rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.text-welcome {
|
||||
font-size: 0.74rem;
|
||||
font-family: Bahnschrift;
|
||||
line-height: 0.74rem;
|
||||
}
|
||||
.text-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.text-level {
|
||||
font-size: 0.12rem;
|
||||
margin-top: 0.81rem;
|
||||
}
|
||||
.back-line1,
|
||||
.back-line2,
|
||||
.back-line3 {
|
||||
width: 60px;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
.back-line1 {
|
||||
height: 5rem;
|
||||
opacity: 1;
|
||||
transform: rotate(45deg);
|
||||
top: -1.2rem;
|
||||
left: 4.15rem;
|
||||
}
|
||||
.back-line2 {
|
||||
height: 7rem;
|
||||
transform: rotate(110deg);
|
||||
top: 0px;
|
||||
left: 5rem;
|
||||
}
|
||||
.back-line3 {
|
||||
height: 5rem;
|
||||
transform: rotate(45deg);
|
||||
top: 2.3rem;
|
||||
left: 1.5rem;
|
||||
}
|
||||
/* 背景板结束 */
|
||||
/* 前景 登录框 开始 */
|
||||
.container-before {
|
||||
width: 7.5rem;
|
||||
height: 8rem;
|
||||
overflow-y: auto;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1);
|
||||
position: absolute;
|
||||
right: 0.9rem;
|
||||
border: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
.login {
|
||||
padding-top: 0.8rem;
|
||||
padding-left: 1.24rem;
|
||||
padding-right: 1.05rem;
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 14px;
|
||||
}
|
||||
.login-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.login-text-title {
|
||||
font-size: 0.32rem;
|
||||
color: #1E2736;
|
||||
line-height: 0.32rem;
|
||||
}
|
||||
.login-text-regist {
|
||||
font-weight: Regular;
|
||||
margin-top: 0.08rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.login-text-regist a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 0.68rem;
|
||||
}
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: 0.34rem;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
}
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
.login-email {
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.form-main {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.form-item {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.input-with-select .el-input-group__prepend {
|
||||
background: #FFFFFF;
|
||||
width: 60px;
|
||||
}
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.code-btn {
|
||||
margin-left: 0.1rem;
|
||||
background: var(--color-primary);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.rember-item {
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rember-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
background: var(--color-primary);
|
||||
}
|
||||
.read-text {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
padding: 0 10px;
|
||||
color: #606266;
|
||||
font-weight: 500;
|
||||
}
|
||||
.read-item {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.read-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.line-item {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.line-item text {
|
||||
font-size: 16px;
|
||||
color: #1E2736;
|
||||
}
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.login-btn {
|
||||
font-size: 0.34rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
.type-btn {
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.34rem;
|
||||
}
|
||||
.code-btn {
|
||||
font-size: 0.32rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
.login-container {
|
||||
height: calc(100vh - 1.2rem);
|
||||
width: 100vw;
|
||||
background: #F2F2FE;
|
||||
padding: 0.6rem 0;
|
||||
}
|
||||
.container-back {
|
||||
display: none;
|
||||
}
|
||||
.container-before {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0rem 0.3rem;
|
||||
position: unset;
|
||||
z-index: 0;
|
||||
}
|
||||
.login {
|
||||
padding-top: 1.17rem;
|
||||
padding-left: 0.3rem;
|
||||
padding-right: 0.3rem;
|
||||
font-size: 0.26rem;
|
||||
line-height: 0.3rem;
|
||||
}
|
||||
.login-text-title {
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
.login-text-regist {
|
||||
margin-top: 0.1rem;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 1.21rem;
|
||||
}
|
||||
.form-main {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: 0.34rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
padding-bottom: 0.13rem;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
font-size: 0.26rem;
|
||||
}
|
||||
.read-item {
|
||||
line-height: 0.3rem;
|
||||
}
|
||||
.read-item .check-div {
|
||||
display: flex;
|
||||
white-space: inherit;
|
||||
}
|
||||
}
|
||||
336
clientarea/hgcloud/css/regist.less
Normal file
336
clientarea/hgcloud/css/regist.less
Normal file
@@ -0,0 +1,336 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#regist {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.custom-form {
|
||||
margin-top: 0.3rem;
|
||||
|
||||
.el-form-item__label {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.el-select {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.login-container {
|
||||
width: 15.7rem;
|
||||
height: 8.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 背景板 开始 */
|
||||
.container-back {
|
||||
width: 15.7rem;
|
||||
height: 6.8rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: Source Han Sans CN;
|
||||
}
|
||||
|
||||
.back-text {
|
||||
font-size: .27rem;
|
||||
z-index: 10;
|
||||
color: #FFFFFF;
|
||||
margin-top: 1.39rem;
|
||||
margin-left: .65rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.text-welcome {
|
||||
font-size: .74rem;
|
||||
font-family: Bahnschrift;
|
||||
line-height: .74rem;
|
||||
}
|
||||
|
||||
.text-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.text-level {
|
||||
font-size: .12rem;
|
||||
margin-top: .81rem;
|
||||
}
|
||||
|
||||
.back-line1,
|
||||
.back-line2,
|
||||
.back-line3 {
|
||||
width: 60px;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.3000) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.back-line1 {
|
||||
height: 5rem;
|
||||
opacity: 1;
|
||||
transform: rotate(45deg);
|
||||
top: -1.2rem;
|
||||
left: 4.15rem;
|
||||
}
|
||||
|
||||
.back-line2 {
|
||||
height: 7rem;
|
||||
transform: rotate(110deg);
|
||||
top: 0px;
|
||||
left: 5rem;
|
||||
}
|
||||
|
||||
.back-line3 {
|
||||
height: 5rem;
|
||||
transform: rotate(45deg);
|
||||
top: 2.3rem;
|
||||
left: 1.5rem;
|
||||
}
|
||||
|
||||
/* 背景板结束 */
|
||||
|
||||
/* 前景 登录框 开始 */
|
||||
.container-before {
|
||||
width: 7.5rem;
|
||||
height: 8rem;
|
||||
// padding-bottom: 0.2rem;
|
||||
overflow-y: auto;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.1000);
|
||||
position: absolute;
|
||||
right: .9rem;
|
||||
border: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.login {
|
||||
padding-top: .8rem;
|
||||
padding-left: 1.24rem;
|
||||
padding-right: 1.05rem;
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
.login-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.login-text-title {
|
||||
font-size: .32rem;
|
||||
color: #1E2736;
|
||||
line-height: .32rem;
|
||||
}
|
||||
|
||||
.login-text-regist {
|
||||
font-weight: Regular;
|
||||
margin-top: .08rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.login-text-regist a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
margin-top: .68rem;
|
||||
}
|
||||
|
||||
.login-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: .34rem;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: var(--color-primary);
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.login-email {
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.input-with-select .el-input-group__prepend {
|
||||
background: #FFFFFF;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
|
||||
.code-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
margin-left: .1rem;
|
||||
background: var(--color-primary);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.rember-item {
|
||||
margin-top: .2rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.rember-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
background: var(--color-primary);
|
||||
}
|
||||
|
||||
.read-text {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
padding: 0 10px;
|
||||
color: #606266;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.read-item {
|
||||
margin-top: .2rem;
|
||||
|
||||
}
|
||||
|
||||
.read-item a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.line-item {
|
||||
margin-top: .4rem;
|
||||
}
|
||||
|
||||
.line-item text {
|
||||
font-size: 16px;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
width: 100%;
|
||||
height: 0.46rem;
|
||||
font-size: .16rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.login-btn {
|
||||
font-size: .34rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.type-btn {
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
font-size: .34rem;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
font-size: .32rem;
|
||||
height: .8rem;
|
||||
}
|
||||
|
||||
.login-container {
|
||||
height: calc(100vh - 1.2rem);
|
||||
width: 100vw;
|
||||
background: #F2F2FE;
|
||||
padding: .6rem 0;
|
||||
}
|
||||
|
||||
.container-back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.container-before {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0rem .3rem;
|
||||
position: unset;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.login {
|
||||
padding-top: 1.17rem;
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
font-size: .26rem;
|
||||
line-height: .3rem;
|
||||
}
|
||||
|
||||
.login-text-title {
|
||||
font-size: .4rem;
|
||||
}
|
||||
|
||||
.login-text-regist {
|
||||
margin-top: .1rem;
|
||||
font-size: .28rem;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
margin-top: 1.21rem;
|
||||
}
|
||||
|
||||
.form-main {
|
||||
margin-top: .6rem;
|
||||
}
|
||||
|
||||
.login-email,
|
||||
.login-phone {
|
||||
height: .34rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #666B80;
|
||||
cursor: pointer;
|
||||
padding-bottom: .13rem;
|
||||
}
|
||||
|
||||
|
||||
.el-checkbox__label {
|
||||
font-size: .26rem;
|
||||
}
|
||||
|
||||
|
||||
.read-item {
|
||||
line-height: .3rem;
|
||||
|
||||
.check-div {
|
||||
display: flex;
|
||||
white-space: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
263
clientarea/hgcloud/css/security.css
Normal file
263
clientarea/hgcloud/css/security.css
Normal file
@@ -0,0 +1,263 @@
|
||||
.main-card .main-card-title {
|
||||
font-size: 0.28rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .content-table {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .content-table .content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.main-card .content-table .content_searchbar .left-btn {
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .content-table .tabledata {
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .un-open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #EEEEEE;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #E1F0FF;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .setting {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: 0.08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg {
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 0.3rem;
|
||||
margin-top: 0.2rem;
|
||||
color: #757575;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item:last-child {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-label {
|
||||
min-width: 80px;
|
||||
flex-shrink: 0;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-vlaue {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .copy {
|
||||
margin-left: 5px;
|
||||
flex-shrink: 0;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.main-card .create-api-dialog .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .delete-dialog .el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
padding-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-title .del-icon {
|
||||
margin-right: 0.13rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-main {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 800;
|
||||
color: #1E2736;
|
||||
margin-top: 0.3rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-ok,
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #FFF;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-no {
|
||||
background: #E7E7E7;
|
||||
color: #1E2736;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.15rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert .el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status .ip-status-text {
|
||||
width: 0.84rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.3rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__core {
|
||||
background-color: #a6a6a6;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.3rem;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.more-operation .dot {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 2px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
.el-popover .operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-popover .operation .operation-item {
|
||||
margin-top: 0.05rem;
|
||||
margin-bottom: 0.05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
}
|
||||
.dialog-main {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.dialog-main .el-input__inner {
|
||||
height: 0.52rem;
|
||||
}
|
||||
.dialog-main .label {
|
||||
font-size: 0.16rem;
|
||||
color: #1E2736;
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.dialog-main .label:not(:first-child) {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.dialog-footer .btn-no {
|
||||
margin-left: 0.12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dialog-footer .btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.main-card .content-table .tabledata .open-show .open {
|
||||
width: auto;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .un-open {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
339
clientarea/hgcloud/css/security.less
Normal file
339
clientarea/hgcloud/css/security.less
Normal file
@@ -0,0 +1,339 @@
|
||||
.main-card {
|
||||
.main-card-title {
|
||||
font-size: .28rem;
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
.content-table {
|
||||
margin-top: .3rem;
|
||||
|
||||
.content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.left-btn {
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.tabledata {
|
||||
margin-top: .14rem;
|
||||
|
||||
.open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.un-open {
|
||||
width: .59rem;
|
||||
height: .26rem;
|
||||
background: #EEEEEE;
|
||||
border-radius: 3px;
|
||||
font-size: .13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.open {
|
||||
width: .59rem;
|
||||
height: .26rem;
|
||||
background: #E1F0FF;
|
||||
border-radius: 3px;
|
||||
font-size: .13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.setting {
|
||||
font-size: .14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: .08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.create-api-dialog {
|
||||
.dialog-main {
|
||||
.content-msg {
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: .2rem;
|
||||
|
||||
.msg-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: .3rem;
|
||||
margin-top: .2rem;
|
||||
color: #757575;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.item-label {
|
||||
min-width: 80px;
|
||||
flex-shrink: 0;
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.item-vlaue {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.copy {
|
||||
margin-left: 5px;
|
||||
flex-shrink: 0;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.delete-dialog {
|
||||
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
padding-bottom: .3rem;
|
||||
}
|
||||
|
||||
.del-dialog-title {
|
||||
font-size: .24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
|
||||
.del-icon {
|
||||
margin-right: .13rem;
|
||||
}
|
||||
}
|
||||
|
||||
.del-dialog-main {
|
||||
font-size: .16rem;
|
||||
font-weight: 800;
|
||||
color: #1E2736;
|
||||
margin-top: .3rem;
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
.del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.btn-ok,
|
||||
.btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: .16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
background: #E7E7E7;
|
||||
color: #1E2736;
|
||||
margin-top: .16rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.white-ip-dialog {
|
||||
|
||||
.dialog-main {
|
||||
.info-alert {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-primary);
|
||||
font-size: .15rem;
|
||||
|
||||
.el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: .3rem;
|
||||
|
||||
.ip-status-text {
|
||||
width: .84rem;
|
||||
margin-right: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: .2rem;
|
||||
margin-bottom: .3rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
|
||||
& * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-switch__core {
|
||||
background-color: rgba(166, 166, 166, 1);
|
||||
}
|
||||
|
||||
.el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: .3rem;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
|
||||
.dot {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 2px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: .05rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
min-width: .5rem !important;
|
||||
|
||||
.operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.operation-item {
|
||||
margin-top: .05rem;
|
||||
margin-bottom: .05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 弹窗 通用
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
}
|
||||
|
||||
.dialog-main {
|
||||
margin-top: .4rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: .52rem;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: .16rem;
|
||||
color: #1E2736;
|
||||
margin-bottom: .1rem;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
.btn-no {
|
||||
margin-left: .12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// 勾选框 文字换行
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.main-card .content-table .tabledata .open-show .open {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.main-card .content-table .tabledata .open-show .un-open {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
318
clientarea/hgcloud/css/security_group.css
Normal file
318
clientarea/hgcloud/css/security_group.css
Normal file
@@ -0,0 +1,318 @@
|
||||
.main-card .main-card-title {
|
||||
font-size: 0.28rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .content-table {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .content-table .content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.main-card .content-table .content_searchbar .left-btn {
|
||||
padding: 0 10px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .content-table .tabledata {
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .un-open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #EEEEEE;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #E1F0FF;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .setting {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: 0.08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .el-dialog {
|
||||
width: 6.2rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg {
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-left: 0.3rem;
|
||||
margin-top: 0.2rem;
|
||||
color: #757575;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item:last-child {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-label {
|
||||
width: 80px;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-vlaue .copy {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.main-card .create-api-dialog .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .create-api-dialog .el-dialog__header {
|
||||
display: none;
|
||||
}
|
||||
.main-card .create-api-dialog .dia-tit {
|
||||
font-size: 0.16rem;
|
||||
word-wrap: break-word;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
line-height: 1;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .create-api-dialog .el-select,
|
||||
.main-card .create-api-dialog .el-input {
|
||||
width: 100%;
|
||||
}
|
||||
.main-card .create-api-dialog .el-button {
|
||||
width: 0.8rem;
|
||||
height: 0.4rem;
|
||||
}
|
||||
.main-card .create-api-dialog .child {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.main-card .create-api-dialog .child .s-item {
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
.main-card .create-api-dialog .s-tit {
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.main-card .create-api-dialog .s-tit .red {
|
||||
color: var(--color-danger);
|
||||
margin-right: 4px;
|
||||
}
|
||||
.main-card .create-api-dialog .re-tip {
|
||||
margin-bottom: 0.15rem;
|
||||
}
|
||||
.main-card .create-api-dialog .re-tip .el-form-item__content {
|
||||
line-height: 1;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.15rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert .el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status .ip-status-text {
|
||||
width: 0.84rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.3rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__core {
|
||||
background-color: #a6a6a6;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
.delete-dialog .el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
padding-bottom: 0.3rem;
|
||||
}
|
||||
.delete-dialog .del-dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.delete-dialog .del-dialog-title .del-icon {
|
||||
margin-right: 0.13rem;
|
||||
}
|
||||
.delete-dialog .del-dialog-main {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 800;
|
||||
color: #1E2736;
|
||||
margin-top: 0.3rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.delete-dialog .del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.delete-dialog .del-dialog-footer .btn-ok,
|
||||
.delete-dialog .del-dialog-footer .btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
.delete-dialog .del-dialog-footer .btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #FFF;
|
||||
}
|
||||
.delete-dialog .del-dialog-footer .btn-no {
|
||||
background: #E7E7E7;
|
||||
color: #1E2736;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.3rem;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.more-operation .dot {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 2px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
.el-popover .operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-popover .operation .operation-item {
|
||||
margin-top: 0.05rem;
|
||||
margin-bottom: 0.05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-popover .operation .operation-item .link {
|
||||
color: inherit;
|
||||
}
|
||||
.el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
}
|
||||
.dialog-main {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.dialog-main .el-input__inner {
|
||||
height: 0.52rem;
|
||||
}
|
||||
.dialog-main .label {
|
||||
font-size: 0.16rem;
|
||||
color: #1E2736;
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.dialog-main .label:not(:first-child) {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.dialog-footer .btn-no {
|
||||
margin-left: 0.12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dialog-footer .btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
/* security-group */
|
||||
.security-group .el-textarea textarea {
|
||||
resize: none;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
.security-group .link {
|
||||
color: var(--color-primary);
|
||||
text-decoration: none;
|
||||
}
|
||||
.security-group .link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.security-group .left-btn {
|
||||
margin-right: 0.1rem;
|
||||
}
|
||||
.security-group .left-btn.add {
|
||||
color: var(--color-primary) !important;
|
||||
background: #f1f1fe !important;
|
||||
}
|
||||
.security-group .left-btn.del {
|
||||
background: #f2f1f6 !important;
|
||||
color: #525666 !important;
|
||||
}
|
||||
.security-group .el-table-column--selection .cell {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
415
clientarea/hgcloud/css/security_group.less
Normal file
415
clientarea/hgcloud/css/security_group.less
Normal file
@@ -0,0 +1,415 @@
|
||||
.main-card {
|
||||
.main-card-title {
|
||||
font-size: .28rem;
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
.content-table {
|
||||
margin-top: .3rem;
|
||||
|
||||
.content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.left-btn {
|
||||
padding: 0 10px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.tabledata {
|
||||
margin-top: .14rem;
|
||||
|
||||
.open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.un-open {
|
||||
width: .59rem;
|
||||
height: .26rem;
|
||||
background: #EEEEEE;
|
||||
border-radius: 3px;
|
||||
font-size: .13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.open {
|
||||
width: .59rem;
|
||||
height: .26rem;
|
||||
background: #E1F0FF;
|
||||
border-radius: 3px;
|
||||
font-size: .13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.setting {
|
||||
font-size: .14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: .08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.create-api-dialog {
|
||||
.el-dialog {
|
||||
width: 6.2rem;
|
||||
}
|
||||
|
||||
.dialog-main {
|
||||
.content-msg {
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: .2rem;
|
||||
|
||||
.msg-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-left: .3rem;
|
||||
margin-top: .2rem;
|
||||
color: #757575;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.item-label {
|
||||
width: 80px;
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.item-vlaue {
|
||||
.copy {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
|
||||
.el-dialog__header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dia-tit {
|
||||
font-size: .16rem;
|
||||
word-wrap: break-word;
|
||||
color: rgba(0, 0, 0, .85);
|
||||
line-height: 1;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.el-select,
|
||||
.el-input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.el-button {
|
||||
width: .8rem;
|
||||
height: .4rem;
|
||||
}
|
||||
|
||||
.child {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.s-item {
|
||||
margin-right: .3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.s-tit {
|
||||
margin-bottom: .1rem;
|
||||
|
||||
.red {
|
||||
color: var(--color-danger);
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.re-tip {
|
||||
margin-bottom: .15rem;
|
||||
|
||||
.el-form-item__content {
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.white-ip-dialog {
|
||||
|
||||
.dialog-main {
|
||||
.info-alert {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-primary);
|
||||
font-size: .15rem;
|
||||
|
||||
.el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: .3rem;
|
||||
|
||||
.ip-status-text {
|
||||
width: .84rem;
|
||||
margin-right: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: .2rem;
|
||||
margin-bottom: .3rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
|
||||
& * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-switch__core {
|
||||
background-color: rgba(166, 166, 166, 1);
|
||||
}
|
||||
|
||||
.el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.delete-dialog {
|
||||
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
padding-bottom: .3rem;
|
||||
}
|
||||
|
||||
|
||||
.del-dialog-title {
|
||||
font-size: .24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
|
||||
.del-icon {
|
||||
margin-right: .13rem;
|
||||
}
|
||||
}
|
||||
|
||||
.del-dialog-main {
|
||||
font-size: .16rem;
|
||||
font-weight: 800;
|
||||
color: #1E2736;
|
||||
margin-top: .3rem;
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
.del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.btn-ok,
|
||||
.btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: .16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
background: #E7E7E7;
|
||||
color: #1E2736;
|
||||
margin-top: .16rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: .3rem;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
|
||||
.dot {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 2px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: .05rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
min-width: .5rem !important;
|
||||
|
||||
.operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.operation-item {
|
||||
margin-top: .05rem;
|
||||
margin-bottom: .05rem;
|
||||
cursor: pointer;
|
||||
.link{
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 弹窗 通用
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
}
|
||||
|
||||
.dialog-main {
|
||||
margin-top: .4rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: .52rem;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: .16rem;
|
||||
color: #1E2736;
|
||||
margin-bottom: .1rem;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
.btn-no {
|
||||
margin-left: .12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// 勾选框 文字换行
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* security-group */
|
||||
.security-group {
|
||||
.el-textarea textarea {
|
||||
resize: none;
|
||||
font-family: PingFang SC;
|
||||
}
|
||||
|
||||
.link {
|
||||
color: var(--color-primary);
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.left-btn {
|
||||
margin-right: .1rem;
|
||||
|
||||
&.add {
|
||||
color: var(--color-primary) !important;
|
||||
background: #f1f1fe !important;
|
||||
}
|
||||
|
||||
&.del {
|
||||
background: #f2f1f6 !important;
|
||||
color: #525666 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table-column--selection .cell {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
258
clientarea/hgcloud/css/security_log.css
Normal file
258
clientarea/hgcloud/css/security_log.css
Normal file
@@ -0,0 +1,258 @@
|
||||
.main-card .main-card-title {
|
||||
font-size: 0.28rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .content-table {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .content-table .top-text {
|
||||
margin-bottom: 0.38rem;
|
||||
}
|
||||
.main-card .content-table .content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.main-card .content-table .content_searchbar .left-btn {
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .content-table .tabledata {
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .un-open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #EEEEEE;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #E1F0FF;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .setting {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: 0.08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg {
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-left: 0.3rem;
|
||||
margin-top: 0.2rem;
|
||||
color: #757575;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item:last-child {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-label {
|
||||
width: 80px;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-vlaue .copy {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.main-card .create-api-dialog .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .delete-dialog .el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
padding-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-title .del-icon {
|
||||
margin-right: 0.13rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-main {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 800;
|
||||
color: #1E2736;
|
||||
margin-top: 0.3rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-ok,
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #FFF;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-no {
|
||||
background: #E7E7E7;
|
||||
color: #1E2736;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.15rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert .el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status .ip-status-text {
|
||||
width: 0.84rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.3rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__core {
|
||||
background-color: #a6a6a6;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.3rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.more-operation .dot {
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
border: 3px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
.el-popover .operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-popover .operation .operation-item {
|
||||
margin-top: 0.05rem;
|
||||
margin-bottom: 0.05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
}
|
||||
.dialog-main {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.dialog-main .el-input__inner {
|
||||
height: 0.52rem;
|
||||
}
|
||||
.dialog-main .label {
|
||||
font-size: 0.16rem;
|
||||
color: #1E2736;
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.dialog-main .label:not(:first-child) {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.dialog-main .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.dialog-footer .btn-no {
|
||||
margin-left: 0.12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dialog-footer .btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.searchbar .el-input {
|
||||
width: auto !important;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
340
clientarea/hgcloud/css/security_log.less
Normal file
340
clientarea/hgcloud/css/security_log.less
Normal file
@@ -0,0 +1,340 @@
|
||||
.main-card {
|
||||
.main-card-title {
|
||||
font-size: .28rem;
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
.content-table {
|
||||
margin-top: .3rem;
|
||||
|
||||
.top-text {
|
||||
margin-bottom: .38rem;
|
||||
}
|
||||
|
||||
.content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.left-btn {
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.tabledata {
|
||||
margin-top: .14rem;
|
||||
|
||||
.open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.un-open {
|
||||
width: .59rem;
|
||||
height: .26rem;
|
||||
background: #EEEEEE;
|
||||
border-radius: 3px;
|
||||
font-size: .13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.open {
|
||||
width: .59rem;
|
||||
height: .26rem;
|
||||
background: #E1F0FF;
|
||||
border-radius: 3px;
|
||||
font-size: .13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.setting {
|
||||
font-size: .14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: .08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.create-api-dialog {
|
||||
.dialog-main {
|
||||
.content-msg {
|
||||
border: 1px solid #E6E7EB;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: .2rem;
|
||||
|
||||
.msg-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-left: .3rem;
|
||||
margin-top: .2rem;
|
||||
color: #757575;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.item-label {
|
||||
width: 80px;
|
||||
margin-right: .4rem;
|
||||
}
|
||||
|
||||
.item-vlaue {
|
||||
.copy {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.delete-dialog {
|
||||
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
padding-bottom: .3rem;
|
||||
}
|
||||
|
||||
.del-dialog-title {
|
||||
font-size: .24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
|
||||
.del-icon {
|
||||
margin-right: .13rem;
|
||||
}
|
||||
}
|
||||
|
||||
.del-dialog-main {
|
||||
font-size: .16rem;
|
||||
font-weight: 800;
|
||||
color: #1E2736;
|
||||
margin-top: .3rem;
|
||||
margin-bottom: .4rem;
|
||||
}
|
||||
|
||||
.del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.btn-ok,
|
||||
.btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: .16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
background: #E7E7E7;
|
||||
color: #1E2736;
|
||||
margin-top: .16rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.white-ip-dialog {
|
||||
|
||||
.dialog-main {
|
||||
.info-alert {
|
||||
background: #E1F0FF;
|
||||
color: var(--color-primary);
|
||||
font-size: .15rem;
|
||||
|
||||
.el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: .3rem;
|
||||
|
||||
.ip-status-text {
|
||||
width: .84rem;
|
||||
margin-right: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: .2rem;
|
||||
margin-bottom: .3rem;
|
||||
color: #8692B0;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
|
||||
& * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-switch__core {
|
||||
background-color: rgba(166, 166, 166, 1);
|
||||
}
|
||||
|
||||
.el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: .3rem;
|
||||
cursor: pointer;
|
||||
|
||||
.dot {
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
border: 3px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: .05rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
min-width: .5rem !important;
|
||||
|
||||
.operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.operation-item {
|
||||
margin-top: .05rem;
|
||||
margin-bottom: .05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 弹窗 通用
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
}
|
||||
|
||||
.dialog-main {
|
||||
margin-top: .4rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: .52rem;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: .16rem;
|
||||
color: #1E2736;
|
||||
margin-bottom: .1rem;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
.btn-no {
|
||||
margin-left: .12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// 勾选框 文字换行
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.searchbar {
|
||||
.el-input {
|
||||
width: auto !important;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
258
clientarea/hgcloud/css/security_ssh.css
Normal file
258
clientarea/hgcloud/css/security_ssh.css
Normal file
@@ -0,0 +1,258 @@
|
||||
.main-card .main-card-title {
|
||||
font-size: 0.28rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .content-table {
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .content-table .top-text {
|
||||
margin-bottom: 0.38rem;
|
||||
}
|
||||
.main-card .content-table .top-text .top-link {
|
||||
margin-left: 0.1rem;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .content-table .content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.main-card .content-table .content_searchbar .left-btn {
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #fff;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .content-table .tabledata {
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .un-open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #eeeeee;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #e1f0ff;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .content-table .tabledata .open-show .setting {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: 0.08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg {
|
||||
border: 1px solid #e6e7eb;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-left: 0.3rem;
|
||||
margin-top: 0.2rem;
|
||||
color: #757575;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item:last-child {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-label {
|
||||
width: 80px;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .content-msg .msg-item .item-vlaue .copy {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .create-api-dialog .dialog-main .yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.main-card .create-api-dialog .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .delete-dialog .el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
padding-bottom: 0.3rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-title .del-icon {
|
||||
margin-right: 0.13rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-main {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 800;
|
||||
color: #1e2736;
|
||||
margin-top: 0.3rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-ok,
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #fff;
|
||||
}
|
||||
.main-card .delete-dialog .del-dialog-footer .btn-no {
|
||||
background: #e7e7e7;
|
||||
color: #1e2736;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert {
|
||||
background: #e1f0ff;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.15rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .info-alert .el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .ip-status .ip-status-text {
|
||||
width: 0.84rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.3rem;
|
||||
color: #8692b0;
|
||||
}
|
||||
.main-card .white-ip-dialog .dialog-main .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__core {
|
||||
background-color: #a6a6a6;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
.main-card .white-ip-dialog .el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.3rem;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.more-operation .dot {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 2px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
}
|
||||
.el-popover .operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.el-popover .operation .operation-item {
|
||||
margin-top: 0.05rem;
|
||||
margin-bottom: 0.05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
}
|
||||
.dialog-main {
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
.dialog-main .el-input__inner {
|
||||
height: 0.52rem;
|
||||
}
|
||||
.dialog-main .label {
|
||||
font-size: 0.16rem;
|
||||
color: #1e2736;
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.dialog-main .label:not(:first-child) {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.dialog-main .alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.dialog-footer .btn-no {
|
||||
margin-left: 0.12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dialog-footer .btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
330
clientarea/hgcloud/css/security_ssh.less
Normal file
330
clientarea/hgcloud/css/security_ssh.less
Normal file
@@ -0,0 +1,330 @@
|
||||
.main-card {
|
||||
.main-card-title {
|
||||
font-size: 0.28rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
|
||||
.content-table {
|
||||
margin-top: 0.3rem;
|
||||
|
||||
.top-text {
|
||||
margin-bottom: 0.38rem;
|
||||
|
||||
.top-link {
|
||||
margin-left: 0.1rem;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.content_searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.left-btn {
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: var(--color-primary);
|
||||
color: #fff;
|
||||
opacity: 1;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.tabledata {
|
||||
margin-top: 0.14rem;
|
||||
|
||||
.open-show {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.un-open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #eeeeee;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
color: #757575;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.open {
|
||||
width: 0.59rem;
|
||||
height: 0.26rem;
|
||||
background: #e1f0ff;
|
||||
border-radius: 3px;
|
||||
font-size: 0.13rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.setting {
|
||||
font-size: 0.14rem;
|
||||
color: var(--color-primary);
|
||||
margin-left: 0.08rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.create-api-dialog {
|
||||
.dialog-main {
|
||||
.content-msg {
|
||||
border: 1px solid #e6e7eb;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.2rem;
|
||||
|
||||
.msg-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-left: 0.3rem;
|
||||
margin-top: 0.2rem;
|
||||
color: #757575;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
|
||||
.item-label {
|
||||
width: 80px;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
|
||||
.item-vlaue {
|
||||
.copy {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.yellow {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.delete-dialog {
|
||||
.el-dialog__body {
|
||||
padding-left: .8rem;
|
||||
padding-right: .8rem;
|
||||
padding-bottom: .3rem;
|
||||
}
|
||||
|
||||
.del-dialog-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-danger);
|
||||
|
||||
.del-icon {
|
||||
margin-right: 0.13rem;
|
||||
}
|
||||
}
|
||||
|
||||
.del-dialog-main {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 800;
|
||||
color: #1e2736;
|
||||
margin-top: 0.3rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.del-dialog-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.btn-ok,
|
||||
.btn-no {
|
||||
height: 0.46rem;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.16rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
background: var(--color-danger);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
background: #e7e7e7;
|
||||
color: #1e2736;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.white-ip-dialog {
|
||||
.dialog-main {
|
||||
.info-alert {
|
||||
background: #e1f0ff;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.15rem;
|
||||
|
||||
.el-alert__closebtn {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.ip-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: 0.3rem;
|
||||
|
||||
.ip-status-text {
|
||||
width: 0.84rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.status-remind {
|
||||
margin-left: 1.04rem;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.3rem;
|
||||
color: #8692b0;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-switch__label {
|
||||
position: absolute;
|
||||
display: none;
|
||||
color: #fff;
|
||||
|
||||
& * {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-switch__core {
|
||||
background-color: rgba(166, 166, 166, 1);
|
||||
}
|
||||
|
||||
.el-switch__label--left {
|
||||
z-index: 9;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.el-switch__label--right {
|
||||
z-index: 9;
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.el-switch__label.is-active {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.more-operation {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.3rem;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
|
||||
.dot {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 2px solid var(--color-primary);
|
||||
border-radius: 50%;
|
||||
margin-right: 0.05rem;
|
||||
}
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
min-width: 0.5rem !important;
|
||||
|
||||
.operation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.operation-item {
|
||||
margin-top: 0.05rem;
|
||||
margin-bottom: 0.05rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 弹窗 通用
|
||||
.el-dialog__body {
|
||||
padding-left: 0.8rem;
|
||||
padding-right: 0.8rem;
|
||||
}
|
||||
|
||||
.dialog-main {
|
||||
margin-top: 0.4rem;
|
||||
|
||||
.el-input__inner {
|
||||
height: 0.52rem;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 0.16rem;
|
||||
color: #1e2736;
|
||||
margin-bottom: 0.1rem;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
.btn-no {
|
||||
margin-left: 0.12rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-ok {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// 勾选框 文字换行
|
||||
.el-checkbox__label {
|
||||
display: inline-grid;
|
||||
white-space: initial;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
0
clientarea/hgcloud/css/template.css
Normal file
0
clientarea/hgcloud/css/template.css
Normal file
57
clientarea/hgcloud/css/transfer.css
Normal file
57
clientarea/hgcloud/css/transfer.css
Normal file
@@ -0,0 +1,57 @@
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
body,
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.transfer {
|
||||
display: flex !important;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #E6E7EB;
|
||||
}
|
||||
.transfer .con {
|
||||
width: 6.9rem;
|
||||
}
|
||||
.transfer .info {
|
||||
padding: 0.4rem 0.5rem;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
font-size: 0.14rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.transfer .logo {
|
||||
background: var(--color-primary);
|
||||
padding: 0.1rem 0.5rem;
|
||||
font-size: 0;
|
||||
}
|
||||
.transfer .logo img {
|
||||
height: 0.3rem;
|
||||
}
|
||||
.transfer .tit {
|
||||
font-size: 0.24rem;
|
||||
line-height: 1.3;
|
||||
margin-bottom: 0.16rem;
|
||||
}
|
||||
.transfer .des {
|
||||
margin: 0.16rem 0 0.24rem;
|
||||
}
|
||||
.transfer .jump {
|
||||
margin-top: 0.3rem;
|
||||
border-top: 1px solid #E6E7EB;
|
||||
text-align: right;
|
||||
}
|
||||
.transfer .jump .btn {
|
||||
padding: 0.12rem 0.24rem;
|
||||
background: var(--color-primary);
|
||||
font-size: 0.16rem;
|
||||
color: #fff;
|
||||
border-radius: 0.03rem;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
67
clientarea/hgcloud/css/transfer.less
Normal file
67
clientarea/hgcloud/css/transfer.less
Normal file
@@ -0,0 +1,67 @@
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body,
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.transfer {
|
||||
display: flex !important;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #E6E7EB;
|
||||
|
||||
.con {
|
||||
width: 6.9rem;
|
||||
}
|
||||
|
||||
.info {
|
||||
padding: .4rem .5rem;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
font-size: .14rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.logo {
|
||||
background: var(--color-primary);
|
||||
padding: .1rem .5rem;
|
||||
font-size: 0;
|
||||
|
||||
img {
|
||||
height: .3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
font-size: .24rem;
|
||||
line-height: 1.3;
|
||||
margin-bottom: .16rem;
|
||||
}
|
||||
|
||||
.des {
|
||||
margin: .16rem 0 .24rem;
|
||||
}
|
||||
|
||||
.jump {
|
||||
margin-top: .3rem;
|
||||
border-top: 1px solid #E6E7EB;
|
||||
text-align: right;
|
||||
|
||||
.btn {
|
||||
padding: .12rem .24rem;
|
||||
background: var(--color-primary);
|
||||
font-size: .16rem;
|
||||
color: #fff;
|
||||
border-radius: .03rem;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-top: .4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
238
clientarea/hgcloud/css/voucher.css
Normal file
238
clientarea/hgcloud/css/voucher.css
Normal file
@@ -0,0 +1,238 @@
|
||||
.voucher-box .get-voucher {
|
||||
margin: 0.2rem 0;
|
||||
}
|
||||
.voucher-search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.voucher-page .el-pagination {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.voucher-content .basic {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
.voucher-content ul {
|
||||
clear: both;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
width: 100%;
|
||||
gap: 0.24rem;
|
||||
}
|
||||
.voucher-content .item {
|
||||
background-color: #F7F8FC;
|
||||
border-radius: 0px 3px 3px 0px;
|
||||
box-shadow: 0 0 0.1rem 0.02rem rgba(0, 0, 0, 0.08);
|
||||
position: relative;
|
||||
}
|
||||
.voucher-content .price {
|
||||
min-width: 2.03rem;
|
||||
height: 100%;
|
||||
background-color: var(--color-primary);
|
||||
color: #fff;
|
||||
font-size: 0.12rem;
|
||||
padding: 0.24rem 0.1rem;
|
||||
box-sizing: border-box;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.voucher-content .price::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: -4px;
|
||||
transform: translateY(-50%);
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
.voucher-content .price::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 93%;
|
||||
height: 90%;
|
||||
border: 1px dashed #fff;
|
||||
border-radius: 5px;
|
||||
z-index: -1;
|
||||
}
|
||||
.voucher-content .price.used {
|
||||
background-color: #8692b0;
|
||||
}
|
||||
.voucher-content .price.overdue {
|
||||
background-color: #cfd3d6;
|
||||
}
|
||||
.voucher-content .price .num {
|
||||
font-family: 'PingFang SC';
|
||||
font-size: 0.32rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
.voucher-content .price span {
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
.voucher-content .price .des {
|
||||
margin-top: 0.15rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.voucher-content .r-item {
|
||||
line-height: 1;
|
||||
font-size: 0.12rem;
|
||||
color: #8692B0;
|
||||
flex: 1;
|
||||
padding: 0.24rem 0.1rem 0.1rem 0.3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.voucher-content .r-item .tit {
|
||||
font-size: 0.2rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
.voucher-content .r-item .time {
|
||||
margin: 0.1rem 0;
|
||||
}
|
||||
.voucher-content .r-item .bot {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.voucher-content .r-item .detail-btn {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
.voucher-content .r-item .receive {
|
||||
line-height: 0.24rem;
|
||||
padding: 0 0.08rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 0.03rem;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-size: 0.12rem;
|
||||
}
|
||||
.voucher-content .r-item .receive.is_get {
|
||||
background: #8692B0;
|
||||
color: #fff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.voucher-content .more {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
}
|
||||
.voucher-content .more img {
|
||||
width: 0.12rem;
|
||||
height: 0.12rem;
|
||||
}
|
||||
.voucher-content .more.active img {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.voucher-content img {
|
||||
transition: all 0.3s;
|
||||
margin-left: 0.04rem;
|
||||
}
|
||||
.voucher-content .bg {
|
||||
width: 0.72rem;
|
||||
height: 0.54rem;
|
||||
position: absolute;
|
||||
top: 0.08rem;
|
||||
right: 0.11rem;
|
||||
z-index: 1;
|
||||
}
|
||||
.voucher-content .bg.used {
|
||||
background: url(../img/voucher/voucher_05.png) no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.voucher-content .bg.overdue {
|
||||
background: url(../img/voucher/voucher_04.png) no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.voucher-content .detail {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 100%;
|
||||
width: 100%;
|
||||
max-height: 2rem;
|
||||
overflow-y: auto;
|
||||
box-sizing: border-box;
|
||||
padding: 0.32rem 0.13rem 0.13rem 0.13rem;
|
||||
font-size: 0.12rem;
|
||||
color: #8692B0;
|
||||
text-align: justify;
|
||||
display: none;
|
||||
z-index: 10;
|
||||
}
|
||||
.voucher-content .detail.active {
|
||||
background: #F5F7FC;
|
||||
display: block;
|
||||
}
|
||||
.voucher-content .detail::after {
|
||||
content: '';
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0.16rem;
|
||||
left: 0;
|
||||
letter-spacing: 2em;
|
||||
z-index: 10;
|
||||
border: 1px dashed #E6E7EB;
|
||||
}
|
||||
.voucher-content .empty {
|
||||
margin: 0 auto;
|
||||
}
|
||||
.voucher-dialog .el-dialog {
|
||||
width: 10.26rem;
|
||||
}
|
||||
.voucher-dialog .el-dialog__body {
|
||||
max-height: 5rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.voucher-dialog ul {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
.voucher-dialog ul::after {
|
||||
width: 0;
|
||||
display: none;
|
||||
}
|
||||
.voucher-dialog .r-item .time {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
.voucher-dialog .el-dialog__body {
|
||||
padding: 0.4rem 0.8rem;
|
||||
}
|
||||
@media screen and (max-width: 1024px) {
|
||||
.voucher-content ul {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 750px) {
|
||||
.voucher-content ul {
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
}
|
||||
.form-footer .btn-no {
|
||||
margin-left: 0;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.voucher-content ul .item {
|
||||
width: 100%;
|
||||
}
|
||||
.voucher-dialog .el-dialog {
|
||||
width: 7rem;
|
||||
}
|
||||
.voucher-dialog ul .item {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
304
clientarea/hgcloud/css/voucher.less
Normal file
304
clientarea/hgcloud/css/voucher.less
Normal file
@@ -0,0 +1,304 @@
|
||||
.voucher-box {
|
||||
|
||||
.get-voucher {
|
||||
margin: .2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.voucher-search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.voucher-page {
|
||||
.el-pagination {
|
||||
margin-top: .2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.voucher-content {
|
||||
|
||||
.basic {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
ul {
|
||||
clear: both;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
width: 100%;
|
||||
gap: .24rem;
|
||||
}
|
||||
|
||||
.item {
|
||||
background-color: #F7F8FC;
|
||||
border-radius: 0px 3px 3px 0px;
|
||||
box-shadow: 0 0 .1rem .02rem rgba(0, 0, 0, .08);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.price {
|
||||
min-width: 2.03rem;
|
||||
height: 100%;
|
||||
background-color: var(--color-primary);
|
||||
color: #fff;
|
||||
font-size: .12rem;
|
||||
padding: .24rem .1rem;
|
||||
box-sizing: border-box;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: -4px;
|
||||
transform: translateY(-50%);
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 93%;
|
||||
height: 90%;
|
||||
border: 1px dashed #fff;
|
||||
border-radius: 5px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&.used {
|
||||
background-color: #8692b0;
|
||||
}
|
||||
|
||||
&.overdue {
|
||||
background-color: #cfd3d6;
|
||||
}
|
||||
|
||||
.num {
|
||||
font-family: 'PingFang SC';
|
||||
font-size: .32rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: .16rem;
|
||||
}
|
||||
|
||||
.des {
|
||||
margin-top: .15rem;
|
||||
line-height: 1.2;
|
||||
// white-space: nowrap;
|
||||
// overflow: hidden;
|
||||
// text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.r-item {
|
||||
line-height: 1;
|
||||
font-size: .12rem;
|
||||
color: #8692B0;
|
||||
flex: 1;
|
||||
padding: .24rem .1rem .1rem .3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.tit {
|
||||
font-size: .2rem;
|
||||
color: #1E2736;
|
||||
}
|
||||
|
||||
.time {
|
||||
margin: 0.1rem 0;
|
||||
}
|
||||
|
||||
.bot {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.detail-btn {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.receive {
|
||||
line-height: .24rem;
|
||||
padding: 0 .08rem;
|
||||
background: var(--color-primary);
|
||||
border-radius: 0.03rem;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-size: .12rem;
|
||||
|
||||
&.is_get {
|
||||
background: #8692B0;
|
||||
color: #fff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.more {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
|
||||
img {
|
||||
width: .12rem;
|
||||
height: .12rem;
|
||||
}
|
||||
|
||||
&.active img {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
transition: all .3s;
|
||||
margin-left: .04rem;
|
||||
}
|
||||
|
||||
.bg {
|
||||
width: .72rem;
|
||||
height: .54rem;
|
||||
position: absolute;
|
||||
top: .08rem;
|
||||
right: .11rem;
|
||||
z-index: 1;
|
||||
|
||||
&.used {
|
||||
background: url(../img/voucher/voucher_05.png) no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
&.overdue {
|
||||
background: url(../img/voucher/voucher_04.png) no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.detail {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 100%;
|
||||
width: 100%;
|
||||
max-height: 2rem;
|
||||
overflow-y: auto;
|
||||
box-sizing: border-box;
|
||||
padding: .32rem .13rem .13rem .13rem;
|
||||
font-size: .12rem;
|
||||
color: #8692B0;
|
||||
text-align: justify;
|
||||
display: none;
|
||||
z-index: 10;
|
||||
|
||||
&.active {
|
||||
background: #F5F7FC;
|
||||
display: block;
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: .16rem;
|
||||
left: 0;
|
||||
letter-spacing: 2em;
|
||||
z-index: 10;
|
||||
border: 1px dashed #E6E7EB;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.empty {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.voucher-dialog {
|
||||
.el-dialog {
|
||||
width: 10.26rem;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
max-height: 5rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
ul {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
|
||||
&::after {
|
||||
width: 0;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.r-item .time {
|
||||
margin-bottom: .25rem;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: .4rem .8rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.voucher-content ul {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
|
||||
.voucher-content ul {
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
}
|
||||
|
||||
.form-footer .btn-no {
|
||||
margin-left: 0;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.voucher-content ul .item {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.voucher-dialog .el-dialog {
|
||||
width: 7rem;
|
||||
}
|
||||
|
||||
.voucher-dialog ul .item {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
44
clientarea/hgcloud/css/withdrawal.css
Normal file
44
clientarea/hgcloud/css/withdrawal.css
Normal file
@@ -0,0 +1,44 @@
|
||||
.main-card header {
|
||||
height: 0.6rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 0.01rem solid #e6e7eb;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.main-card header .back-icon {
|
||||
margin-right: 0.24rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.main-card header h2 {
|
||||
font-size: 0.28rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.25rem;
|
||||
color: #171725;
|
||||
}
|
||||
.main-card .withdrawal-content {
|
||||
border-radius: 0.03rem;
|
||||
}
|
||||
.main-card .withdrawal-content .myPage {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
.main-card .withdrawal-content .el-tag {
|
||||
border: none;
|
||||
}
|
||||
.main-card .el-table {
|
||||
opacity: 1;
|
||||
}
|
||||
.main-card .el-table .el-table__header-wrapper .cell {
|
||||
font-size: 0.14rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.22rem;
|
||||
color: #757575;
|
||||
}
|
||||
.main-card .el-table .el-table__body-wrapper .cell {
|
||||
font-size: 0.14rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.22rem;
|
||||
color: #171725;
|
||||
}
|
||||
60
clientarea/hgcloud/css/withdrawal.less
Normal file
60
clientarea/hgcloud/css/withdrawal.less
Normal file
@@ -0,0 +1,60 @@
|
||||
.main-card {
|
||||
header {
|
||||
height: 0.6rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 0.01rem solid #e6e7eb;
|
||||
margin-bottom: 0.4rem;
|
||||
|
||||
.back-icon {
|
||||
margin-right: 0.24rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 0.28rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.25rem;
|
||||
color: #171725;
|
||||
}
|
||||
}
|
||||
|
||||
.withdrawal-content {
|
||||
border-radius: 0.03rem;
|
||||
|
||||
.myPage {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.el-tag {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table {
|
||||
// border: 0.01rem solid #e6e7eb;
|
||||
opacity: 1;
|
||||
|
||||
// border-radius: 0.03rem;
|
||||
.el-table__header-wrapper {
|
||||
.cell {
|
||||
font-size: 0.14rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.22rem;
|
||||
color: #757575;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table__body-wrapper {
|
||||
.cell {
|
||||
font-size: 0.14rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 0.22rem;
|
||||
color: #171725;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user