From f21c98c6234b85dbe2287ea5199bb48a1aa22af3 Mon Sep 17 00:00:00 2001 From: X1627315083 <1627315083@qq.com> Date: Fri, 27 Dec 2024 14:38:21 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4library=E5=B8=83=E5=B1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/images/homePage/bankCard.svg | 3 - src/assets/images/homePage/stripe.svg | 1 + src/assets/style/style.css | 155 +++++--- src/assets/style/style.less | 167 ++++++--- src/component/Account/frontPage/bindPage.vue | 2 +- src/component/HomePage/ExportModel.vue | 42 ++- src/component/HomePage/Generate.vue | 24 +- src/component/HomePage/UpgradePlan.vue | 5 +- src/component/HomePage/renew.vue | 2 +- src/component/HomePage/scaleImage.vue | 4 +- src/component/Pay/payMethod.vue | 27 +- src/views/HomeView/HomeView.vue | 40 +- src/views/HomeView/library.vue | 373 +++++++------------ src/views/LoginPage.vue | 1 - 14 files changed, 452 insertions(+), 394 deletions(-) delete mode 100644 src/assets/images/homePage/bankCard.svg create mode 100644 src/assets/images/homePage/stripe.svg diff --git a/src/assets/images/homePage/bankCard.svg b/src/assets/images/homePage/bankCard.svg deleted file mode 100644 index d81974d9..00000000 --- a/src/assets/images/homePage/bankCard.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/assets/images/homePage/stripe.svg b/src/assets/images/homePage/stripe.svg new file mode 100644 index 00000000..a5db7e9b --- /dev/null +++ b/src/assets/images/homePage/stripe.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/style/style.css b/src/assets/style/style.css index 95230540..5acffe2e 100644 --- a/src/assets/style/style.css +++ b/src/assets/style/style.css @@ -7,7 +7,7 @@ body, font-family: 'Roboto', sans-serif; overflow: hidden; --aida-fsize2: calc(2.6rem); - --aida-fsize1-8: calc(1.8rem*1.2); + --aida-fsize1-8: calc(1.8rem); --aida-fsize1-6: calc(1.6rem); --aida-fsize1-4: calc(1.4rem*1.2); --antd-wave-shadow-color: #39215b; @@ -261,58 +261,9 @@ li { transform: rotate(360deg); } } -.el-cascader { - font-size: 1.2rem; - width: 100%; - height: 3rem; - --el-color-primary: #d9d9d9; - --el-cascader-tag-background: #e1d9ec; -} -.el-cascader .el-input { - height: 100%; -} -.el-cascader .el-input .el-input__wrapper .el-input__inner { - height: 80% !important; - font-size: 1.2rem; -} .el-popper { padding: 0.5rem 1.1rem; } -.el-cascader__tags, -.el-cascader__collapse-tag { - --el-color-primary: #d9d9d9; - --el-cascader-tag-background: #e1d9ec; - --el-fill-color: #e1d9ec; - height: 100%; - width: 90% !important; - flex-wrap: nowrap; - overflow: hidden; - align-items: center; -} -.el-cascader__tags .el-tag--light, -.el-cascader__collapse-tag .el-tag--light { - margin: 0 0 0 0.6rem; - padding-right: 0.5rem; - height: 80%; - --el-icon-size: 1.4rem; - display: flex; -} -.el-cascader__tags .el-tag--light .el-tag__content, -.el-cascader__collapse-tag .el-tag--light .el-tag__content { - font-size: 1.4rem; - color: #000; -} -.el-cascader__tags .el-cascader__search-input, -.el-cascader__collapse-tag .el-cascader__search-input { - height: 100%; - margin: 0 0 0 1.1rem; -} -.el-cascader__collapse-tag { - margin-bottom: 0.5rem; -} -.el-cascader__collapse-tag .el-cascader__collapse-tag .el-tag--light { - display: flex !important; -} .hideEvents { pointer-events: none !important; } @@ -729,6 +680,17 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte align-items: center; margin-right: 5rem; } +.generalModel_state .generalModel_state_item.smail > input { + padding: 1rem 2rem !important; +} +.generalModel_state .generalModel_state_item.smail .ant-picker-range, +.generalModel_state .generalModel_state_item.smail .ant-select-selector, +.generalModel_state .generalModel_state_item.smail .range_picker { + padding: 1rem 2rem !important; +} +.generalModel_state .generalModel_state_item.smail .el-cascader { + padding: 1rem 2rem; +} .generalModel_state .generalModel_state_item > input { height: 2.5rem !important; border-radius: 4rem; @@ -761,6 +723,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte box-sizing: content-box; background-color: #f3f3f3; width: calc(100% - 4rem); + border: 1px solid #000; } .generalModel_state .generalModel_state_item .ant-picker-input > input { font-size: 1.8rem; @@ -773,6 +736,79 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte display: flex; align-items: center; } +.generalModel_state .generalModel_state_item .el-cascader { + font-size: 1.8rem; + width: 100%; + border: 1px solid #dcdfe6; + border-radius: 4rem; + background-color: #fff; + height: 2.5rem; + padding: 2rem; + transition: all 0.3s; + box-sizing: content-box; +} +.generalModel_state .generalModel_state_item .el-cascader .el-cascader__tags, +.generalModel_state .generalModel_state_item .el-cascader .el-input { + height: 100%; +} +.generalModel_state .generalModel_state_item .el-cascader .el-input .el-input__wrapper { + box-shadow: none; + padding: 0; + width: 100%; +} +.generalModel_state .generalModel_state_item .el-cascader .el-input .el-input__wrapper .el-input__inner { + font-size: 1.8rem; +} +.generalModel_state .generalModel_state_item .el-cascader:hover { + border: 1px solid; +} +.generalModel_state .generalModel_state_item .el-cascader__tags { + padding-left: 1rem; +} +.generalModel_state .generalModel_state_item .el-cascader__tags, +.generalModel_state .generalModel_state_item .el-cascader__collapse-tag { + --el-color-primary: #d9d9d9; + --el-cascader-tag-background: #000; + --el-fill-color: #e1d9ec; + box-sizing: content-box; + width: 90% !important; + flex-wrap: nowrap; + overflow: hidden; + align-items: center; +} +.generalModel_state .generalModel_state_item .el-cascader__tags .el-tag--light, +.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-tag--light { + margin: 0 0 0 0.6rem; + padding-right: 0.5rem; + height: 70%; + --el-icon-size: 1.4rem; + display: flex; +} +.generalModel_state .generalModel_state_item .el-cascader__tags .el-tag--light .el-tag__content, +.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-tag--light .el-tag__content { + font-size: 1.4rem; + color: #fff; +} +.generalModel_state .generalModel_state_item .el-cascader__tags .el-cascader__search-input, +.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-cascader__search-input { + height: 100%; +} +.generalModel_state .generalModel_state_item .el-cascader__search-input, +.generalModel_state .generalModel_state_item .el-input__inner { + margin: 0; + width: 100%; + height: 4.6rem; + padding-left: 2.1rem; + line-height: 4.6rem; + font-size: 1.8rem; + box-sizing: border-box; +} +.generalModel_state .generalModel_state_item .el-cascader__collapse-tag { + margin-bottom: 0.5rem; +} +.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-cascader__collapse-tag .el-tag--light { + display: flex !important; +} .generalModel_state .generalModel_current { background: #fff; width: 100%; @@ -801,6 +837,13 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte .generalModel_state .header_user_content.active { display: block; } +.ant-select-dropdown { + border: 1px solid #000; + border-radius: 1rem; +} +.ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) { + background-color: #f3f3f6; +} .generalModel { -moz-user-select: none; -webkit-user-select: none; @@ -1088,7 +1131,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte background: #543087 !important; } .ant-spin-dot-item { - background-color: #543087; + background-color: #000000; } .ant-spin { color: #000; @@ -1169,6 +1212,16 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte .ant-pagination-prev:hover .ant-pagination-item-link, .ant-pagination-next:hover .ant-pagination-item-link { color: #000; + background-color: #fff; + border: 1px solid #000; +} +.ant-pagination-item:hover { + border: 1px solid #000; +} +.ant-pagination-prev .ant-pagination-item-link, +.ant-pagination-next .ant-pagination-item-link { + background-color: #000; + color: #fff; } .ant-pagination-item:hover a { color: #000; diff --git a/src/assets/style/style.less b/src/assets/style/style.less index 86e6d3d4..89f15aa5 100644 --- a/src/assets/style/style.less +++ b/src/assets/style/style.less @@ -7,7 +7,7 @@ html,body,#app{ overflow: hidden; // --antd-wave-shadow-color: #341e57; --aida-fsize2: calc(2.6rem); - --aida-fsize1-8: calc(1.8rem*1.2); + --aida-fsize1-8: calc(1.8rem); --aida-fsize1-6: calc(1.6rem); --aida-fsize1-4: calc(1.4rem*1.2); --antd-wave-shadow-color:#39215b; @@ -272,59 +272,11 @@ input:focus{ -.el-cascader{ - font-size: 1.2rem; - width: 100%; - height: 3rem; - --el-color-primary: #d9d9d9; - --el-cascader-tag-background:#e1d9ec; - .el-input{ - height: 100%; - .el-input__wrapper{ - .el-input__inner{ - height: 80% !important; - font-size: 1.2rem; - } - } - } -} + .el-popper{ padding: .5rem 1.1rem; } -.el-cascader__tags,.el-cascader__collapse-tag{ - --el-color-primary: #d9d9d9; - --el-cascader-tag-background:#e1d9ec; - --el-fill-color:#e1d9ec; - height: 100%; - width: 90% !important; - flex-wrap: nowrap; - overflow: hidden; - align-items: center; - .el-tag--light{ - margin: 0 0 0 .6rem; - padding-right: .5rem; - height: 80%; - --el-icon-size: 1.4rem; - display: flex; - .el-tag__content{ - font-size: 1.4rem; - color: #000; - - } - } - .el-cascader__search-input{ - height: 100%; - margin: 0 0 0 1.1rem; - } -} -.el-cascader__collapse-tag{ - margin-bottom: .5rem; - .el-cascader__collapse-tag{ - .el-tag--light{ - display: flex !important; - } - } -} + .hideEvents{ pointer-events:none !important; *{ @@ -794,6 +746,18 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte display: flex; align-items: center; margin-right: 5rem; + &.smail{ + >input{ + padding: 1rem 2rem !important; + } + .ant-picker-range,.ant-select-selector,.range_picker{ + padding: 1rem 2rem !important; + } + .el-cascader{ + padding: 1rem 2rem; + } + + } >input{ height: 2.5rem !important; border-radius: 4rem; @@ -824,6 +788,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte box-sizing: content-box; background-color: #f3f3f3; width: calc(100% - 4rem); + border: 1px solid #000; } .ant-picker-input > input{ font-size: 1.8rem; @@ -838,6 +803,78 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte } } } + + .el-cascader{ + font-size: 1.8rem; + width: 100%; + border: 1px solid #dcdfe6; + border-radius: 4rem; + background-color: #fff; + height: 2.5rem; + padding: 2rem; + transition: all .3s; + box-sizing: content-box; + .el-cascader__tags,.el-input{ + height: 100%; + } + .el-input{ + .el-input__wrapper{ + box-shadow: none; + padding: 0; + width: 100%; + .el-input__inner{ + font-size: 1.8rem; + } + } + } + } + .el-cascader:hover{ + border: 1px solid; + } + .el-cascader__tags{ + padding-left: 1rem; + } + .el-cascader__tags,.el-cascader__collapse-tag{ + --el-color-primary: #d9d9d9; + --el-cascader-tag-background:#000; + --el-fill-color:#e1d9ec; + box-sizing: content-box; + width: 90% !important; + flex-wrap: nowrap; + overflow: hidden; + align-items: center; + .el-tag--light{ + margin: 0 0 0 .6rem; + padding-right: .5rem; + height: 70%; + --el-icon-size: 1.4rem; + display: flex; + .el-tag__content{ + font-size: 1.4rem; + color: #fff; + } + } + .el-cascader__search-input{ + height: 100%; + } + } + .el-cascader__search-input,.el-input__inner{ + margin: 0; + width: 100%; + height: 4.6rem; + padding-left: 2.1rem; + line-height: 4.6rem; + font-size: 1.8rem; + box-sizing: border-box; + } + .el-cascader__collapse-tag{ + margin-bottom: .5rem; + .el-cascader__collapse-tag{ + .el-tag--light{ + display: flex !important; + } + } + } } .generalModel_current{ background: #fff; @@ -869,6 +906,14 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte } } +//下拉的内容 +.ant-select-dropdown{ + border: 1px solid #000; + border-radius: 1rem; + .ant-select-item-option-selected:not(.ant-select-item-option-disabled){ + background-color: #f3f3f6; + } +} .generalModel{//自带关闭的页面 -moz-user-select: none; @@ -1192,7 +1237,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte } //loding样式 .ant-spin-dot-item{ - background-color: #543087; + background-color: #000000; } .ant-spin{ color: #000; @@ -1271,9 +1316,21 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte border-color: #000; box-shadow: none; } -.ant-pagination-prev:hover .ant-pagination-item-link, -.ant-pagination-next:hover .ant-pagination-item-link{ - color: #000; +.ant-pagination-prev:hover .ant-pagination-item-link, +.ant-pagination-next:hover .ant-pagination-item-link { + color: #000; + background-color: #fff; + border: 1px solid #000; +} +.ant-pagination-item:hover{ + border: 1px solid #000; +} +.ant-pagination-prev, +.ant-pagination-next{ + .ant-pagination-item-link{ + background-color: #000; + color: #fff; + } } .ant-pagination-item:hover a{ color: #000; diff --git a/src/component/Account/frontPage/bindPage.vue b/src/component/Account/frontPage/bindPage.vue index 78659521..2ddcfda3 100644 --- a/src/component/Account/frontPage/bindPage.vue +++ b/src/component/Account/frontPage/bindPage.vue @@ -23,7 +23,7 @@
- +
diff --git a/src/component/HomePage/ExportModel.vue b/src/component/HomePage/ExportModel.vue index 6e003e46..55456b2b 100644 --- a/src/component/HomePage/ExportModel.vue +++ b/src/component/HomePage/ExportModel.vue @@ -169,9 +169,8 @@
{{ item.name }}
-
{{ item.winDowKey }}
- / -
{{ item.macKey }}
+
{{ item.macKey }}
+
{{ item.winDowKey }}
@@ -186,14 +185,14 @@
- - - + + + - - + + -
- + + Stripe -