diff --git a/.env.dev b/.env.dev index 926a368f..6289e460 100644 --- a/.env.dev +++ b/.env.dev @@ -6,7 +6,8 @@ NODE_ENV = 'development' VUE_APP_BASE_URL = 'https://develop.api.aida.com.hk' # VUE_APP_BASE_URL = 'https://www.api.aida.com.hk' # 佩佩 -# VUE_APP_BASE_URL = 'http://192.168.1.4:5567' +VUE_APP_BASE_URL = 'http://192.168.1.4:5567' # 海波 -# VUE_APP_BASE_URL = 'http://192.168.1.9:5567' +# VUE_APP_BASE_URL = 'http://18.167.251.121:15567' +# VUE_APP_BASE_URL = 'http://192.168.1.6:5567' diff --git a/public/image/homeIntroduct/introduct1.png b/public/image/homeIntroduct/introduct1.png new file mode 100644 index 00000000..3683dc94 Binary files /dev/null and b/public/image/homeIntroduct/introduct1.png differ diff --git a/public/image/homeIntroduct/introduct2.png b/public/image/homeIntroduct/introduct2.png new file mode 100644 index 00000000..a388373a Binary files /dev/null and b/public/image/homeIntroduct/introduct2.png differ diff --git a/public/image/homeIntroduct/introduct3.png b/public/image/homeIntroduct/introduct3.png new file mode 100644 index 00000000..bfdc74c7 Binary files /dev/null and b/public/image/homeIntroduct/introduct3.png differ diff --git a/public/image/homeIntroduct/introduct4.png b/public/image/homeIntroduct/introduct4.png new file mode 100644 index 00000000..122600c0 Binary files /dev/null and b/public/image/homeIntroduct/introduct4.png differ diff --git a/public/image/homeIntroduct/introduct5.png b/public/image/homeIntroduct/introduct5.png new file mode 100644 index 00000000..a310af46 Binary files /dev/null and b/public/image/homeIntroduct/introduct5.png differ diff --git a/public/image/homeIntroduct/introduct6.png b/public/image/homeIntroduct/introduct6.png new file mode 100644 index 00000000..9ef7f9ac Binary files /dev/null and b/public/image/homeIntroduct/introduct6.png differ diff --git a/src/assets/images/homePage/home-bg.png b/src/assets/images/homePage/home-bg.png new file mode 100644 index 00000000..de78fc0f Binary files /dev/null and b/src/assets/images/homePage/home-bg.png differ diff --git a/src/assets/images/loginPage/aida_logo_centent.jpg b/src/assets/images/loginPage/aida_logo_centent.jpg index 22fc475c..5e5ab53f 100644 Binary files a/src/assets/images/loginPage/aida_logo_centent.jpg and b/src/assets/images/loginPage/aida_logo_centent.jpg differ diff --git a/src/assets/images/loginPage/aida_logo_centent.png b/src/assets/images/loginPage/aida_logo_centent.png new file mode 100644 index 00000000..e25a05c8 Binary files /dev/null and b/src/assets/images/loginPage/aida_logo_centent.png differ diff --git a/src/assets/images/loginPage/phone.svg b/src/assets/images/loginPage/phone.svg new file mode 100644 index 00000000..b1c9c4a7 --- /dev/null +++ b/src/assets/images/loginPage/phone.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/src/assets/images/loginPage/weiXinIcon.svg b/src/assets/images/loginPage/weiXinIcon.svg new file mode 100644 index 00000000..4a6a130d --- /dev/null +++ b/src/assets/images/loginPage/weiXinIcon.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/style/style.css b/src/assets/style/style.css index 49cff822..909de66a 100644 --- a/src/assets/style/style.css +++ b/src/assets/style/style.css @@ -6,9 +6,9 @@ body, height: 100%; font-family: 'Roboto', sans-serif; overflow: hidden; - --aida-fsize2: calc(2.2rem*1.2); + --aida-fsize2: calc(2.6rem); --aida-fsize1-8: calc(1.8rem*1.2); - --aida-fsize1-6: calc(1.6rem*1.2); + --aida-fsize1-6: calc(1.6rem); --aida-fsize1-4: calc(1.4rem*1.2); --antd-wave-shadow-color: #39215b; } @@ -43,18 +43,6 @@ li { height: 100%; margin: 0 auto; } -.button_first { - width: 11.85rem; - text-align: center; - height: 4rem; - line-height: 4rem; - font-size: 1.4rem; - font-weight: 400; - color: #000; - cursor: pointer; - border-radius: 1.5rem; - border: 2px solid; -} .button_second { width: 14rem; text-align: center; @@ -67,48 +55,41 @@ li { border-radius: 1.5rem; border: 2px solid; } -.system_silder { +.ant-slider.system_silder { + margin: 0; width: 100%; } -.system_silder .ant-slider { - margin: 0; - width: 12rem; -} -.system_silder .ant-slider .ant-slider-rail { +.ant-slider.system_silder .ant-slider-rail { height: 0.6rem; border-radius: 0.3rem; background: #F2F0FD; } -.system_silder .ant-slider .ant-slider-track { +.ant-slider.system_silder .ant-slider-track { height: 0.6rem; border-radius: 0.3rem; - background: #343579; + background: #000; } -.system_silder .ant-slider .ant-slider-handle { +.ant-slider.system_silder .ant-slider-handle { margin-top: -0.4rem; - border: solid 0.2rem #343579; -} -.ant-slider:hover .ant-slider-track { - background-color: #e1e1e1; + border: solid 0.2rem #000; } .ant-slider:hover .ant-slider-handle { - box-shadow: rgba(41, 62, 141, 0.16) 0px 0 0 4px; + box-shadow: rgba(0, 0, 0, 0.16) 0px 0 0 4px; } .ant-slider-track, .ant-slider-rail { height: calc(0.6rem*1.2); - background-color: #e1e1e1; background-size: 100% 100%; border-radius: calc(0.5rem*1.2); } .ant-slider .ant-slider-handle:not(.ant-tooltip-open), .ant-slider-handle { - background-color: #2d2e76 !important; + background-color: #000000 !important; border: none !important; margin-top: -4px; } .ant-slider-handle:hover { - box-shadow: 0 0 0 5px rgba(45, 46, 118, 0.2); + box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2); } .cliAdmin_like { animation: adminLike 0.5s ease-in-out forwards; @@ -156,6 +137,9 @@ li { border-radius: 5px; padding: 0.6rem 0.5rem; } +.ant-modal-mask { + background-color: #666666; +} .select_block { height: 4rem; } @@ -183,6 +167,70 @@ li { .select_block .ant-select-single:not(.ant-select-customize-input) .ant-select-selector { padding: 0 1rem; } +.gallery_input { + font-size: 1.8rem; + background-color: #f3f3f3; + border: 1px solid #d9d9d9; + border-radius: 4rem; + padding: 2rem; + box-sizing: content-box; + height: 2.5rem; + transition: all 0.3s; + font-weight: 600; + line-height: 1.5715; +} +.ant-select:not(.ant-select-disabled):hover .ant-select-selector { + border: 1px solid #000; +} +.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector { + box-shadow: none; + border: 1px solid #000; +} +.ant-picker:hover, +.ant-picker-focused, +.gallery_input:hover { + border: 1px solid #000; +} +.ant-picker-focused { + box-shadow: none; + border: 1px solid #000; +} +.ant-picker-suffix { + display: flex; +} +.ant-picker-range .ant-picker-active-bar { + background: #353535; +} +.gallery_btn { + padding: 0 1.8rem; + line-height: 6rem; + border-radius: 4rem; + font-size: 1.8rem; + transition: all 0.3s; + display: inline-block; + color: #fff; + background-color: #000; + text-align: center; + font-weight: 600; + border: 2px solid #000; + cursor: pointer; + box-sizing: border-box; +} +.gallery_btn.gallery_btn_radius { + border-radius: 1.4rem; +} +.gallery_btn.gallery_btn:hover { + background-color: #fff; + color: #000; +} +.gallery_btn.white { + background-color: #fff; + color: #000; +} +.gallery_btn.white.white:hover { + color: #fff; + background-color: #000; +} .started_btn { padding: 0 calc(1.8rem*1.2); display: inline-block; @@ -421,27 +469,6 @@ li { top: 0.1rem; width: 0.3rem; } -.ant-select:not(.ant-select-disabled):hover .ant-select-selector { - border: 1px solid #d9d9d9; -} -.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector { - box-shadow: 0 0 0 2px rgba(83, 83, 83, 0.3); - border: 1px solid #d9d9d9; -} -.ant-picker:hover, -.ant-picker-focused { - border: 1px solid #d9d9d9; -} -.ant-picker-focused { - box-shadow: 0 0 0 2px rgba(83, 83, 83, 0.3); - border: 1px solid #d9d9d9; -} -.ant-picker-suffix { - display: flex; -} -.ant-picker-range .ant-picker-active-bar { - background: #353535; -} .trial_page .ant-select-allow-clear { height: 100%; } @@ -529,21 +556,6 @@ li { .trial_page .ant-checkbox-wrapper-disabled .ant-checkbox-disabled .ant-checkbox-inner::after { border-color: #eeeeee; } -.ant-modal-mask { - background: linear-gradient(45deg, #eee4f3, #f3f4e6); - border-radius: 1rem; - overflow: hidden; - height: calc(100% - 7rem); - bottom: 0; - top: auto; - margin: 0 9rem; -} -.ant-modal { - box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); -} -.ant-modal div[aria-hidden="true"] { - display: none !important; -} .ant-modal-confirm-confirm .ant-modal-content { border-radius: 1rem; } @@ -556,27 +568,123 @@ li { color: #fff; margin-left: 10rem; } -.modal_component.ant-modal { - top: 0; -} -.modal_component .ant-modal-content { - overflow: hidden; -} -.modal_component .ant-modal-content .ant-modal-header { - padding: 2.4rem 2.6rem; - background: #F7F7F7; -} -.modal_component .ant-modal-content .ant-modal-header .ant-modal-title { - font-size: 1.8rem; - line-height: 1.8rem; - color: #030303; -} -.modal_component .ant-modal-content .ant-modal-body { - padding: 0; -} .ant-drawer-content-wrapper { width: 50rem !important; } +.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner { + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-in-range::before { + background-color: #ededed; +} +.ant-btn-primary { + background-color: #000; +} +.ant-picker-range-wrapper { + border-radius: 2rem; + overflow: hidden; + background-color: #fff; + border: 2px solid #000; +} +.ant-picker-range-wrapper .ant-picker-range-arrow { + display: none; +} +.ant-picker-date-panel .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start .ant-picker-cell-inner::after, +.ant-picker-date-panel .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end .ant-picker-cell-inner::after { + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before { + border-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single).ant-picker-cell-range-hover-start::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single).ant-picker-cell-range-hover-end::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end::before { + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before { + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before { + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner, +.ant-picker-cell-in-view.ant-picker-cell-range-start .ant-picker-cell-inner, +.ant-picker-cell-in-view.ant-picker-cell-range-end .ant-picker-cell-inner { + background-color: #000; +} +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single):not(.ant-picker-cell-range-start) .ant-picker-cell-inner { + border-radius: 0 2rem 2rem 0; +} +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single):not(.ant-picker-cell-range-end) .ant-picker-cell-inner { + border-radius: 2rem 0 0 2rem; +} +.ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single).ant-picker-cell-range-hover-start::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single).ant-picker-cell-range-hover-end::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end::before { + background-color: #c9c9c9; +} +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover:first-child::after, +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-end:first-child::after, +.ant-picker-cell-in-view.ant-picker-cell-start.ant-picker-cell-range-hover-edge-start.ant-picker-cell-range-hover-edge-start-near-range::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-start:not(.ant-picker-cell-range-hover-edge-start-near-range)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start::after { + border-left: 1px dashed #c9c9c9; +} +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover:last-child::after, +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::after, +.ant-picker-cell-in-view.ant-picker-cell-end.ant-picker-cell-range-hover-edge-end.ant-picker-cell-range-hover-edge-end-near-range::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-end:not(.ant-picker-cell-range-hover-edge-end-near-range)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end::after { + border-right: 1px dashed #c9c9c9; +} +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start:not(.ant-picker-cell-in-range):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end:not(.ant-picker-cell-in-range):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start.ant-picker-cell-range-start-single::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start.ant-picker-cell-range-start.ant-picker-cell-range-end.ant-picker-cell-range-end-near-hover::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end.ant-picker-cell-range-start.ant-picker-cell-range-end.ant-picker-cell-range-start-near-hover::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end.ant-picker-cell-range-end-single::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover:not(.ant-picker-cell-in-range)::after { + border-top: 1px dashed #c9c9c9; + border-bottom: 1px dashed #c9c9c9; +} +.ant-select-single.ant-select-show-arrow .ant-select-selection-search { + height: 2.5rem; + top: 50%; + transform: translateY(-50%); + display: flex; +} +.ant-select-single.ant-select-show-arrow .ant-select-selection-search .ant-select-selection-search-input { + height: 100% !important; +} +.gallerySelect .ant-select-selector { + height: 2.5rem; + border-radius: 4rem; + padding: 2rem; + box-sizing: content-box; + width: 100%; + box-sizing: border-box; +} +.gallerySelect.ant-select-lg { + font-size: 1.6rem; +} +.gallerySelect.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector { + height: 5.5rem; +} +.gallerySelect.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector::after, +.gallerySelect.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-item, +.gallerySelect.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-placeholder { + line-height: 5.5rem; +} .generalModel_page { width: 100%; height: 100%; @@ -630,21 +738,22 @@ li { min-width: 5rem; text-align: left; } -.generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-picker-range { - height: 5rem; +.generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-picker-range, +.generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-select-selector { + height: 2.5rem; + border-radius: 4rem; + padding: 2rem; + box-sizing: content-box; + background-color: #f3f3f3; + width: calc(100% - 4rem); } .generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-select-lg { font-size: 14px; } -.generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-select-lg .ant-select-selector { - height: 5rem; -} .generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-select-lg .ant-select-selector .ant-select-selection-item { - line-height: 5rem; -} -.generalModel_page .generalModel_table_search .generalModel_state .generalModel_state_item .ant-select-lg .ant-select-selector input { - line-height: 5rem; - height: 5rem; + height: 100%; + display: flex; + align-items: center; } .generalModel_page .generalModel_table_search .generalModel_state .generalModel_current { background: #fff; @@ -681,19 +790,42 @@ li { -khtml-user-select: none; user-select: none; position: relative; - border-radius: 1rem; - overflow: hidden; + box-shadow: none; + height: calc(65rem*1.2); +} +.generalModel .ant-modal-content { + border-radius: 3rem; + height: 100%; +} +.generalModel .mark_loading[state="true"] { + border-radius: 3rem; } .generalModel .ant-modal-body { padding: 0; - height: calc(65rem*1.2); + height: 100%; + font-size: 1.4rem; padding: calc(5rem*1.2) calc(6rem*1.2); + position: relative; } .generalModel .fi-rr-down-to-line, .generalModel .fi-rr-arrow-small-right, .generalModel .fi-rr-arrow-small-left { font-size: 2rem; } +.generalModel .generalModelTitle { + font-weight: 600; + font-size: 3.5rem; + margin-bottom: 4rem; +} +.generalModel .generalModelInfo { + font-weight: 600; + font-size: 3rem; + margin-bottom: 3rem; +} +.generalModel .generalModelDescription { + font-size: 1.5rem; + font-weight: 400; +} .generalModel .collection_title { position: absolute; top: calc(4rem*1.2); @@ -713,8 +845,9 @@ li { } .generalModel .generalModel_btn .generalModel_closeIcon { position: absolute; - top: calc(2rem*1.2); - right: calc(2rem*1.2); + top: 0; + right: 0; + transform: translate(100%, -100%); cursor: pointer; width: calc(4rem*1.2); height: calc(4rem*1.2); @@ -722,8 +855,8 @@ li { align-items: center; justify-content: center; } -.generalModel .generalModel_btn .generalModel_closeIcon.left { - left: calc(2rem*1.2); +.generalModel .generalModel_btn .generalModel_closeIcon.download { + transform: translate(-100%, 100%); } .generalModel .generalModel_btn .generalModel_closeIcon .fi-rr-cross-small::before { padding: calc(0.2rem*1.2); @@ -747,11 +880,19 @@ li { width: 100%; height: 100%; flex: 1; - padding-bottom: 3rem; background: #fff; border-radius: 2rem; overflow: hidden; } +.generalModel_table_content .ant-table-wrapper, +.generalModel_table_content .ant-spin-nested-loading, +.generalModel_table_content .ant-spin-container { + height: 100%; +} +.generalModel_table_content .ant-spin-container { + display: flex; + flex-direction: column; +} .generalModel_table_content .ant-table { background: transparent; } @@ -783,6 +924,10 @@ li { .generalModel_table_content .ant-table-pagination-right { padding-right: 3.5rem; } +.generalModel_table_content .ant-table-pagination.ant-pagination { + margin: 0; + margin-top: auto; +} .generalModel_table_content .operate_list { display: flex; align-items: center; @@ -797,99 +942,6 @@ li { color: #343579; cursor: pointer; } -.generalModelOperate { - display: flex; - flex-direction: column; - border-right: 1px solid #e5e5e5; - position: relative; -} -.generalModelOperate .ant-modal-content { - border-radius: calc(1rem * 1.2); - overflow: hidden; -} -.generalModelOperate .ant-modal-content .ant-modal-header { - background-color: #fff; - border-bottom: none; -} -.generalModelOperate .ant-modal-content .ant-modal-body { - display: flex; - flex-direction: column; - padding: calc(5rem * 1.2) calc(5rem * 1.2) !important; - background: #f9fafb; -} -.generalModelOperate .ant-modal-content .ant-progress-circle.ant-progress-status-success .ant-progress-text { - color: #000; -} -.generalModelOperate .ant-modal-content .ant-progress-circle .ant-progress-text { - color: rgba(0, 0, 0, 0.55); - font-size: calc(1.6rem * 1.2); -} -.generalModelOperate .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector { - border-color: #d9d9d9; - box-shadow: none; -} -.generalModelOperate .ant-select:hover .ant-select-selector { - border-color: #d9d9d9; -} -.generalModelOperate .generalModelOperate_title { - font-size: var(--aida-fsize2); - font-weight: 900; - color: rgba(0, 0, 0, 0.65); -} -.generalModelOperate .generalModelOperate_closeIcon { - top: calc(2rem * 1.2); - right: calc(2rem * 1.2); - cursor: pointer; - width: calc(4rem * 1.2); - height: calc(4rem * 1.2); - display: flex; - align-items: center; - justify-content: center; - position: absolute; -} -.generalModelOperate .generalModelOperate_closeIcon .fi-rr-cross-small::before { - padding: calc(0.2rem * 1.2); - border-radius: 5px; - border: solid 2px rgba(0, 0, 0, 0.25); - transition: 1s all; - color: rgba(0, 0, 0, 0.55); -} -.generalModelOperate .generalModelOperate_closeIcon.generalModelOperate_closeIcon:hover .fi-rr-cross-small::before { - border: solid 2px rgba(0, 0, 0, 0.55); - color: #000000; -} -.generalModelOperate .generalModelOperate_endBtn { - display: flex; - justify-content: center; -} -.generalModelOperate .generalModelOperate_endBtn > div { - height: 3.2rem; - padding: 4px 1.5rem; - font-size: 1.4rem; - transition: all 0.3s; - border: 1px solid; - cursor: pointer; -} -.generalModelOperate .generalModelOperate_endBtn .generalModelOperate_btn_cancel { - border-color: #d9d9d9; -} -.generalModelOperate .generalModelOperate_endBtn .generalModelOperate_btn_cancel:hover { - color: #39215b; - border-color: #39215b; -} -.generalModelOperate .generalModelOperate_endBtn .generalModelOperate_btn_ok { - margin-left: 10rem; - background: #39215b; - border-color: #39215b; - color: #fff; -} -.generalModelOperate .generalModelOperate_endBtn .generalModelOperate_btn_ok:hover { - border-color: #543087; - background: #543087; -} -.ant-modal-body { - font-size: 1.4rem; -} .operate_file_block { width: 100%; height: 3rem; @@ -961,15 +1013,16 @@ li { } .ant-modal-wrap { height: 100vh; - overflow: hidden; + overflow: auto; } .ant-btn:hover, .ant-btn:focus, .ant-btn:active, .ant-btn::after { - color: #000; + color: #fff; border-color: #000 !important; box-shadow: none !important; + background-color: #000; } .ant-switch-checked { background-color: #000; @@ -1067,14 +1120,41 @@ li { height: 100%; } .ant-checkbox-checked .ant-checkbox-inner { - background-color: #767676; + background-color: #000000; border-color: #d9d9d9 !important; } +.ant-checkbox-indeterminate .ant-checkbox-inner::after { + background-color: #000000; +} .ant-checkbox-wrapper:hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner, .ant-checkbox-input:focus + .ant-checkbox-inner { border-color: #d9d9d9 !important; } +.ant-pagination-item-active { + border-color: #000; +} +.ant-pagination-item-active a { + color: #000; +} +.ant-pagination-item-active:hover { + border-color: #000; +} +.ant-pagination-options-quick-jumper input:hover { + border-color: #000; +} +.ant-pagination-options-quick-jumper input:focus, +.ant-pagination-options-quick-jumper input-focused { + 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-item:hover a { + color: #000; +} .libraryPageCascader { border-radius: 1rem; } @@ -1282,28 +1362,6 @@ li { color: #343579; cursor: pointer; } -.closeIcon { - position: absolute; - top: calc(2rem*1.2); - right: calc(2rem*1.2); - cursor: pointer; - width: calc(4rem*1.2); - height: calc(4rem*1.2); - display: flex; - align-items: center; - justify-content: center; -} -.closeIcon .fi-rr-cross-small::before { - padding: calc(0.2rem*1.2); - border-radius: 5px; - border: solid 2px rgba(0, 0, 0, 0.25); - transition: 1s all; - color: rgba(0, 0, 0, 0.55); -} -.closeIcon.collection_closeIcon:hover .fi-rr-cross-small::before { - border: solid 2px rgba(0, 0, 0, 0.55); - color: #000000; -} .homeMain_heade .ant-badge, .account_message .ant-badge { width: auto; @@ -1366,129 +1424,12 @@ li { font-weight: 400; color: #000000; } -.collection_modal .ant-modal-body, -.generalModel_modal .ant-modal-body, -.payOrder_modal .ant-modal-body, -.design_detail_modal_component .ant-modal-body, -.designOpenrtion_modal .ant-modal-body, -.library_page .ant-modal-body, -.Export .ant-modal-body, -.productImg_modal .ant-modal-body { - overflow-y: hidden; -} -.collection_modal .ant-upload.ant-upload-select-picture-card, -.generalModel_modal .ant-upload.ant-upload-select-picture-card, -.payOrder_modal .ant-upload.ant-upload-select-picture-card, -.design_detail_modal_component .ant-upload.ant-upload-select-picture-card, -.designOpenrtion_modal .ant-upload.ant-upload-select-picture-card, -.library_page .ant-upload.ant-upload-select-picture-card, -.Export .ant-upload.ant-upload-select-picture-card, -.productImg_modal .ant-upload.ant-upload-select-picture-card { - background: #FFFFFF; - width: calc(6rem*1.2); - height: calc(6rem*1.2); - border: calc(0.3rem*1.2) solid #ededed; - border-radius: calc(1rem*1.2); - margin: 0; -} -.collection_modal .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.generalModel_modal .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.payOrder_modal .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.design_detail_modal_component .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.designOpenrtion_modal .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.library_page .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.Export .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao, -.productImg_modal .ant-upload.ant-upload-select-picture-card .upload_tip_block .icon-jiahao { - font-size: calc(3.2rem*1.2); - color: #B7B7B7; -} -.collection_modal .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.generalModel_modal .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.payOrder_modal .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.design_detail_modal_component .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.designOpenrtion_modal .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.library_page .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.Export .ant-upload.ant-upload-select-picture-card .ant-upload-text, -.productImg_modal .ant-upload.ant-upload-select-picture-card .ant-upload-text { - font-size: calc(1.6rem*1.2); - color: #B7B7B7; -} -.collection_modal .ant-upload-list-picture-card-container, -.generalModel_modal .ant-upload-list-picture-card-container, -.payOrder_modal .ant-upload-list-picture-card-container, -.design_detail_modal_component .ant-upload-list-picture-card-container, -.designOpenrtion_modal .ant-upload-list-picture-card-container, -.library_page .ant-upload-list-picture-card-container, -.Export .ant-upload-list-picture-card-container, -.productImg_modal .ant-upload-list-picture-card-container { +.ant-modal div[aria-hidden="true"] { display: none !important; } -.collection_modal .ant-upload-picture-card-wrapper, -.generalModel_modal .ant-upload-picture-card-wrapper, -.payOrder_modal .ant-upload-picture-card-wrapper, -.design_detail_modal_component .ant-upload-picture-card-wrapper, -.designOpenrtion_modal .ant-upload-picture-card-wrapper, -.library_page .ant-upload-picture-card-wrapper, -.Export .ant-upload-picture-card-wrapper, -.productImg_modal .ant-upload-picture-card-wrapper { - width: auto; - vertical-align: top; -} -.designOpenrtion_modal .design_closeIcon, -.designOpenrtionMobile_modal .design_closeIcon, -.design_detail_modal_component .design_closeIcon, -.designElements_modal .design_closeIcon, -.designElementsMobile_modal .design_closeIcon { - top: 2rem; - right: 2rem; - cursor: pointer; - width: 4rem; - height: 4rem; - display: flex; - align-items: center; - justify-content: center; - position: absolute; -} -.designOpenrtion_modal .design_closeIcon .fi-rr-cross-small::before, -.designOpenrtionMobile_modal .design_closeIcon .fi-rr-cross-small::before, -.design_detail_modal_component .design_closeIcon .fi-rr-cross-small::before, -.designElements_modal .design_closeIcon .fi-rr-cross-small::before, -.designElementsMobile_modal .design_closeIcon .fi-rr-cross-small::before { - padding: 0.2rem; - border-radius: 5px; - border: solid 2px rgba(0, 0, 0, 0.25); - transition: 1s all; - color: rgba(0, 0, 0, 0.55); -} -.designOpenrtion_modal .design_closeIcon.collection_closeIcon:hover .fi-rr-cross-small::before, -.designOpenrtionMobile_modal .design_closeIcon.collection_closeIcon:hover .fi-rr-cross-small::before, -.design_detail_modal_component .design_closeIcon.collection_closeIcon:hover .fi-rr-cross-small::before, -.designElements_modal .design_closeIcon.collection_closeIcon:hover .fi-rr-cross-small::before, -.designElementsMobile_modal .design_closeIcon.collection_closeIcon:hover .fi-rr-cross-small::before { - border: solid 2px rgba(0, 0, 0, 0.55); - color: #000000; -} -.design_detail_modal_component .ant-upload-list-picture-card-container, -.designOpenrtion_modal .ant-upload-list-picture-card-container, -.designElements_modal .ant-upload-list-picture-card-container, -.UpgradePlan_modal .ant-upload-list-picture-card-container, -.refund_reason .ant-upload-list-picture-card-container, -.Export .ant-upload-list-picture-card-container, -.designOpenrtionMobile_modal .ant-upload-list-picture-card-container, -.designElementsMobile_modal .ant-upload-list-picture-card-container { +.ant-upload-list-picture-card-container { display: none !important; } -.design_detail_modal_component .ant-upload-picture-card-wrapper, -.designOpenrtion_modal .ant-upload-picture-card-wrapper, -.designElements_modal .ant-upload-picture-card-wrapper, -.UpgradePlan_modal .ant-upload-picture-card-wrapper, -.refund_reason .ant-upload-picture-card-wrapper, -.Export .ant-upload-picture-card-wrapper, -.designOpenrtionMobile_modal .ant-upload-picture-card-wrapper, -.designElementsMobile_modal .ant-upload-picture-card-wrapper { - width: auto; - vertical-align: top; -} .design_detail_modal_component .subitOkPreviewBtn, .designOpenrtion_modal .subitOkPreviewBtn, .designElements_modal .subitOkPreviewBtn, @@ -1531,6 +1472,109 @@ textarea:focus { outline: none; /* 清除默认焦点样式 */ } +.upload_item { + display: flex; + flex-wrap: wrap; +} +.upload_item .upload_file_item { + margin: 0 calc(2rem) calc(2rem) 0; + display: inline-block; + width: calc(10rem); + height: calc(10rem); + border: 1px solid #f5f5f5; + vertical-align: top; + position: relative; + cursor: pointer; + border: none; +} +.upload_item .upload_file_item.active { + opacity: 0.5; + border-radius: calc(1rem*1.2); + transform: scale(0.9); +} +.upload_item .upload_file_item.active .delete_file_block { + pointer-events: none; +} +.upload_item .upload_file_item.active .operate_file_block { + pointer-events: none; +} +.upload_item .upload_file_item.upload_component { + border: none; + display: flex; + align-items: center; + justify-content: center; +} +.upload_item .upload_file_item .ant-upload-picture-card-wrapper.ant-upload-picture-card-wrapper { + position: absolute; + width: auto; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} +.upload_item .upload_file_item .ant-upload-picture-card-wrapper .ant-upload-select-picture-card { + width: calc(6rem*1.2); + height: calc(6rem*1.2); + border: calc(0.3rem*1.2) solid #ededed; + border-radius: calc(1rem*1.2); + margin: 0; +} +.upload_item .upload_file_item.upload_file_item:last-child { + margin: 0; +} +.upload_item .upload_file_item .upload_img_icon { + width: calc(4.6rem*1.2); +} +.upload_item .upload_file_item .upload_file_item_content { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + width: 100%; + position: relative; +} +.upload_item .upload_file_item .upload_file_item_content:hover div { + opacity: 1; +} +.upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block { + display: block; +} +.upload_item .upload_file_item .upload_file_item_content .upload_img { + display: block; + height: 100%; + width: auto; + max-width: 100%; + object-fit: cover; +} +.upload_item .upload_file_item .upload_file_item_content .delete_file_block { + display: none; + width: 100%; + cursor: pointer; + height: calc(3rem*1.2); + background: rgba(0, 0, 0, 0.2); + font-size: calc(1.6rem*1.2); + color: #ffffff; + line-height: calc(3rem*1.2); + text-align: center; + position: absolute; + left: 0; + bottom: 0; +} +.upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop { + width: calc(3.2rem*1.2); + height: calc(3.2rem*1.2); + background: rgba(0, 0, 0, 0.6); + border-radius: calc(0.4rem*1.2); + position: absolute; + top: calc(0.9rem*1.2); + right: calc(0.9rem*1.2); + text-align: center; + line-height: calc(3.2rem*1.2); + left: auto; +} +.upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu { + font-size: calc(1.6rem*1.2); + color: #fff; +} .collection_modal_body .input_border, .design_detail_modal_component .input_border, .library_page .input_border, @@ -1690,15 +1734,6 @@ textarea:focus { font-size: 1.2rem; border-right: calc(0.1rem*1.2) solid #F1F1F1; } -.collection_modal_body .input_border .upload_item .upload_file_item, -.design_detail_modal_component .input_border .upload_item .upload_file_item, -.library_page .input_border .upload_item .upload_file_item, -.productImg_modal .input_border .upload_item .upload_file_item, -.accountEdit_page .input_border .upload_item .upload_file_item, -.generalMenu_printModel_upload .input_border .upload_item .upload_file_item { - width: 8rem; - height: 8rem; -} .collection_modal_body .input_border input, .design_detail_modal_component .input_border input, .library_page .input_border input, @@ -1851,225 +1886,12 @@ textarea:focus { .generalMenu_printModel_upload .input_border .generage_btn { margin-left: 2rem; } -.collection_modal_body .upload_item, -.design_detail_modal_component .upload_item, -.library_page .upload_item, -.productImg_modal .upload_item, -.accountEdit_page .upload_item, -.generalMenu_printModel_upload .upload_item { - display: flex; - flex-wrap: wrap; -} -.collection_modal_body .upload_item .upload_file_item, -.design_detail_modal_component .upload_item .upload_file_item, -.library_page .upload_item .upload_file_item, -.productImg_modal .upload_item .upload_file_item, -.accountEdit_page .upload_item .upload_file_item, -.generalMenu_printModel_upload .upload_item .upload_file_item { - margin: 0 calc(2rem*1.2) calc(2rem*1.2) 0; - display: inline-block; - width: calc(10rem*1.2); - height: calc(10rem*1.2); - border: 1px solid #f5f5f5; - vertical-align: top; - position: relative; - cursor: pointer; -} -.collection_modal_body .upload_item .upload_file_item.active, -.design_detail_modal_component .upload_item .upload_file_item.active, -.library_page .upload_item .upload_file_item.active, -.productImg_modal .upload_item .upload_file_item.active, -.accountEdit_page .upload_item .upload_file_item.active, -.generalMenu_printModel_upload .upload_item .upload_file_item.active { - opacity: 0.5; - border-radius: calc(1rem*1.2); - transform: scale(0.9); -} -.collection_modal_body .upload_item .upload_file_item.active .delete_file_block, -.design_detail_modal_component .upload_item .upload_file_item.active .delete_file_block, -.library_page .upload_item .upload_file_item.active .delete_file_block, -.productImg_modal .upload_item .upload_file_item.active .delete_file_block, -.accountEdit_page .upload_item .upload_file_item.active .delete_file_block, -.generalMenu_printModel_upload .upload_item .upload_file_item.active .delete_file_block { - pointer-events: none; -} -.collection_modal_body .upload_item .upload_file_item.active .operate_file_block, -.design_detail_modal_component .upload_item .upload_file_item.active .operate_file_block, -.library_page .upload_item .upload_file_item.active .operate_file_block, -.productImg_modal .upload_item .upload_file_item.active .operate_file_block, -.accountEdit_page .upload_item .upload_file_item.active .operate_file_block, -.generalMenu_printModel_upload .upload_item .upload_file_item.active .operate_file_block { - pointer-events: none; -} -.collection_modal_body .upload_item .upload_file_item.upload_component, -.design_detail_modal_component .upload_item .upload_file_item.upload_component, -.library_page .upload_item .upload_file_item.upload_component, -.productImg_modal .upload_item .upload_file_item.upload_component, -.accountEdit_page .upload_item .upload_file_item.upload_component, -.generalMenu_printModel_upload .upload_item .upload_file_item.upload_component { - border: none; - display: flex; - align-items: center; - justify-content: center; -} -.collection_modal_body .upload_item .upload_file_item :deep(.ant-upload-picture-card-wrapper), -.design_detail_modal_component .upload_item .upload_file_item :deep(.ant-upload-picture-card-wrapper), -.library_page .upload_item .upload_file_item :deep(.ant-upload-picture-card-wrapper), -.productImg_modal .upload_item .upload_file_item :deep(.ant-upload-picture-card-wrapper), -.accountEdit_page .upload_item .upload_file_item :deep(.ant-upload-picture-card-wrapper), -.generalMenu_printModel_upload .upload_item .upload_file_item :deep(.ant-upload-picture-card-wrapper) { - position: absolute; - width: auto; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); -} -.collection_modal_body .upload_item .upload_file_item :deep(.ant-upload-select-picture-card), -.design_detail_modal_component .upload_item .upload_file_item :deep(.ant-upload-select-picture-card), -.library_page .upload_item .upload_file_item :deep(.ant-upload-select-picture-card), -.productImg_modal .upload_item .upload_file_item :deep(.ant-upload-select-picture-card), -.accountEdit_page .upload_item .upload_file_item :deep(.ant-upload-select-picture-card), -.generalMenu_printModel_upload .upload_item .upload_file_item :deep(.ant-upload-select-picture-card) { - width: calc(6rem*1.2); - height: calc(6rem*1.2); - border: calc(0.3rem*1.2) solid #ededed; - border-radius: calc(1rem*1.2); - margin: 0; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content, -.library_page .upload_item .upload_file_item .upload_file_item_content, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content { - display: flex; - align-items: center; - justify-content: center; - height: 100%; - width: 100%; - position: relative; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content:hover div, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content:hover div, -.library_page .upload_item .upload_file_item .upload_file_item_content:hover div, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content:hover div, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content:hover div, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content:hover div { - opacity: 1; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block, -.library_page .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block { - display: block; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content .upload_img, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content .upload_img, -.library_page .upload_item .upload_file_item .upload_file_item_content .upload_img, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content .upload_img, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content .upload_img, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content .upload_img { - display: block; - height: 100%; - width: auto; - max-width: 100%; - object-fit: cover; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content .delete_file_block, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content .delete_file_block, -.library_page .upload_item .upload_file_item .upload_file_item_content .delete_file_block, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content .delete_file_block, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content .delete_file_block, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content .delete_file_block { - display: none; - width: 100%; - cursor: pointer; - height: calc(3rem*1.2); - background: rgba(0, 0, 0, 0.2); - font-size: calc(1.6rem*1.2); - color: #ffffff; - line-height: calc(3rem*1.2); - text-align: center; - position: absolute; - left: 0; - bottom: 0; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop, -.library_page .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop { - width: calc(3.2rem*1.2); - height: calc(3.2rem*1.2); - background: rgba(0, 0, 0, 0.6); - border-radius: calc(0.4rem*1.2); - position: absolute; - top: calc(0.9rem*1.2); - right: calc(0.9rem*1.2); - text-align: center; - line-height: calc(3.2rem*1.2); - left: auto; -} -.collection_modal_body .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu, -.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu, -.library_page .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu, -.productImg_modal .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu, -.accountEdit_page .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_file_item_content .delete_file_block.rightTop .icon-shanchu { - font-size: calc(1.6rem*1.2); - color: #fff; -} -.collection_modal_body .upload_item .upload_file_item .upload_img_icon, -.design_detail_modal_component .upload_item .upload_file_item .upload_img_icon, -.library_page .upload_item .upload_file_item .upload_img_icon, -.productImg_modal .upload_item .upload_file_item .upload_img_icon, -.accountEdit_page .upload_item .upload_file_item .upload_img_icon, -.generalMenu_printModel_upload .upload_item .upload_file_item .upload_img_icon { - width: calc(4.6rem*1.2); -} -.collection_modal_body .upload_item .upload_file_item:last-child, -.design_detail_modal_component .upload_item .upload_file_item:last-child, -.library_page .upload_item .upload_file_item:last-child, -.productImg_modal .upload_item .upload_file_item:last-child, -.accountEdit_page .upload_item .upload_file_item:last-child, -.generalMenu_printModel_upload .upload_item .upload_file_item:last-child { - margin: 0; -} -.generalModel_modal .ant-modal-content { - border-radius: calc(1rem * 1.2); - overflow: hidden; -} -.generalModel_modal .ant-modal-content .ant-modal-header { - background-color: #fff; - border-bottom: none; -} -.generalModel_modal .ant-modal-content .ant-modal-body { - height: calc(65rem * 1.2); -} -.generalModel_modal .ant-modal-content .ant-progress-circle.ant-progress-status-success .ant-progress-text { - color: #000; -} -.generalModel_modal .ant-modal-content .ant-progress-circle .ant-progress-text { - color: rgba(0, 0, 0, 0.55); - font-size: calc(1.6rem * 1.2); -} .hideChecked { user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } -.cut_pricture_modal .ant-modal-content { - border-radius: 1rem; -} -.cut_pricture_modal .ant-modal-body { - height: calc(65rem*1.2); - padding: 8rem 5rem !important; - overflow-y: hidden; -} .generalScroll { /* 进度 */ /* 轨道 */ @@ -2145,53 +1967,3 @@ textarea:focus { background: #ffffff; color: #000; } -.mark_loading .mark_loading_text { - text-align: center; - font-size: 1.2rem; - position: absolute; - bottom: 2%; - right: 2%; -} -.mark_loading .mark_loading_text div { - margin-top: 10px; -} -.mark_loading .mark_loading_text div span { - margin: 0 5px; - color: red; -} -.mark_loading .mark_loading_title { - font-size: 3rem; - font-weight: 600; - margin-bottom: 2rem; -} -.mark_loading .mark_loading_intro { - color: rgba(0, 0, 0, 0.6); - font-size: 1.4rem; - margin-bottom: 2rem; - text-align: center; - width: 80%; -} -.mark_loading .mark_loading_title_box { - display: flex; -} -.mark_loading .mark_loading_btn, -.mark_loading .mark_loading_btn2 { - display: flex; - margin-top: 10px; - text-align: center; - border: 2px solid; - padding: 0 20px; - border-radius: 10px; - cursor: pointer; - padding: 0.3rem 4rem; - background: #39215b; - color: #fff; - border: none; - margin: 0 2rem; - align-items: center; -} -.mark_loading .mark_loading_btn2 { - border: 2px solid #000; - color: #000; - background: rgba(0, 0, 0, 0); -} diff --git a/src/assets/style/style.less b/src/assets/style/style.less index 847e88eb..832b83d8 100644 --- a/src/assets/style/style.less +++ b/src/assets/style/style.less @@ -6,9 +6,9 @@ html,body,#app{ font-family: 'Roboto', sans-serif; overflow: hidden; // --antd-wave-shadow-color: #341e57; - --aida-fsize2: calc(2.2rem*1.2); + --aida-fsize2: calc(2.6rem); --aida-fsize1-8: calc(1.8rem*1.2); - --aida-fsize1-6: calc(1.6rem*1.2); + --aida-fsize1-6: calc(1.6rem); --aida-fsize1-4: calc(1.4rem*1.2); --antd-wave-shadow-color:#39215b; } @@ -45,19 +45,6 @@ input:focus{ height: 100%; margin: 0 auto; } -.button_first{ - width: 11.85rem; - text-align: center; - // background: #343579; - height: 4rem; - line-height: 4rem; - font-size: 1.4rem; - font-weight: 400; - color: #000; - cursor: pointer; - border-radius: 1.5rem; - border: 2px solid; -} .button_second{ width: 14rem; text-align: center; @@ -72,13 +59,9 @@ input:focus{ border: 2px solid; } -.system_silder{ - width: 100%; - .ant-slider{ + .ant-slider.system_silder{ margin: 0; - width: 12rem; - - + width: 100%; .ant-slider-rail{ height: 0.6rem; @@ -88,38 +71,32 @@ input:focus{ .ant-slider-track{ height: 0.6rem; border-radius: 0.3rem; - background: #343579; + background: #000; } .ant-slider-handle{ margin-top: -0.4rem; - border: solid 0.2rem #343579; + border: solid 0.2rem #000; } } -} .ant-slider:hover{ - .ant-slider-track{ - background-color: #e1e1e1; - } .ant-slider-handle{ - box-shadow: rgba(41,62,141,.16) 0px 0 0 4px; + box-shadow: rgba(0, 0, 0, 0.16) 0px 0 0 4px; } } .ant-slider-track, .ant-slider-rail { height: calc(.6rem*1.2); - background-color: #e1e1e1; - // background-image: url(@../../../../assets/images/homePage/slider.png); background-size: 100% 100%; border-radius: calc(0.5rem*1.2); } .ant-slider .ant-slider-handle:not(.ant-tooltip-open), .ant-slider-handle { - background-color: #2d2e76 !important; + background-color: #000000 !important; border: none !important; margin-top: -4px; } .ant-slider-handle:hover { - box-shadow: 0 0 0 5px rgba(45, 46, 118, 0.2); + box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2); } .cliAdmin_like{ animation: adminLike .5s ease-in-out forwards; @@ -166,7 +143,9 @@ input:focus{ padding: 0.6rem 0.5rem; } } - +.ant-modal-mask{ + background-color: #666666; +} .select_block{ height: 4rem; .ant-select{ @@ -194,6 +173,70 @@ input:focus{ padding: 0 1rem; } } +.gallery_input{ + font-size: 1.8rem; + background-color: #f3f3f3; + border: 1px solid #d9d9d9; + border-radius: 4rem; + padding: 2rem; + box-sizing: content-box; + height: 2.5rem; + transition: all .3s; + font-weight: 600; + line-height: 1.5715; +} +.ant-select:not(.ant-select-disabled):hover .ant-select-selector{ + border: 1px solid #000; +} +.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{ + box-shadow: none; + border: 1px solid #000; +} +.ant-picker:hover, .ant-picker-focused, .gallery_input:hover{ + border: 1px solid #000; +} +.ant-picker-focused{ + box-shadow: none; + border: 1px solid #000; +} +.ant-picker-suffix{ + display: flex; +} +.ant-picker-range .ant-picker-active-bar{ + background: #353535; +} +.gallery_btn{ + padding: 0 1.8rem; + line-height: 6rem; + border-radius: 4rem; + // line-height: 6rem; + font-size: 1.8rem; + transition: all .3s; + display: inline-block; + color: #fff; + background-color: #000; + text-align: center; + font-weight: 600; + border: 2px solid #000; + cursor: pointer; + box-sizing: border-box; + &.gallery_btn_radius{ + border-radius: 1.4rem; + } + &.gallery_btn:hover{ + background-color: #fff; + color: #000; + } + &.white{ + background-color: #fff; + color: #000; + &.white:hover{ + color: #fff; + background-color: #000; + } + } +} + //started公共按钮样式 .started_btn{ padding: 0 calc(1.8rem*1.2); @@ -467,26 +510,7 @@ input:focus{ } } -.ant-select:not(.ant-select-disabled):hover .ant-select-selector{ - border: 1px solid #d9d9d9; -} -.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{ - box-shadow: 0 0 0 2px rgba(83, 83, 83, 0.3); - border: 1px solid #d9d9d9; -} -.ant-picker:hover, .ant-picker-focused{ - border: 1px solid #d9d9d9; -} -.ant-picker-focused{ - box-shadow: 0 0 0 2px rgba(83, 83, 83, 0.3); - border: 1px solid #d9d9d9; -} -.ant-picker-suffix{ - display: flex; -} -.ant-picker-range .ant-picker-active-bar{ - background: #353535; -} + .trial_page{ //Library多级菜单 @@ -585,30 +609,7 @@ input:focus{ } } } -.ant-modal-mask{ - background: linear-gradient(45deg, #eee4f3, #f3f4e6); - // min-width: 1440px; - border-radius: 1rem; - overflow: hidden; - // height: 100%; - height: calc(100% - 7rem); - bottom: 0; - top: auto; - margin: 0 9rem; - // z-index: 10001; -} -//弹窗公共样式 -.ant-modal{ - box-shadow: 0px 0px 6px rgba(0, 0, 0, .2); - div[aria-hidden="true"] {display: none !important;} - &.ant-modal-confirm{ - &.ant-modal-confirm-confirm{ - // top: 50%; - // transform: translateY(-50%); - } - } -} .ant-modal-confirm-confirm{ .ant-modal-content{ border-radius: 1rem; @@ -625,32 +626,128 @@ input:focus{ } } } -.modal_component{ - - &.ant-modal{ - top: 0; - } - .ant-modal-content{ - overflow: hidden; - .ant-modal-header{ - padding: 2.4rem 2.6rem; - background: #F7F7F7; - - .ant-modal-title{ - font-size: 1.8rem; - line-height: 1.8rem; - color: #030303; - } - } - - .ant-modal-body{ - padding: 0; - } - } -} .ant-drawer-content-wrapper{//抽屉 width: 50rem !important; } + +//日期样式 +.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner{ + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-in-range::before{ + background-color: #ededed; +} +.ant-btn-primary{ + background-color: #000; +} +.ant-picker-range-wrapper{ + border-radius: 2rem; + overflow: hidden; + background-color: #fff; + border: 2px solid #000; + .ant-picker-range-arrow{ + display: none; + } +} +.ant-picker-date-panel .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start .ant-picker-cell-inner::after, +.ant-picker-date-panel .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end .ant-picker-cell-inner::after{ + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before{ + border-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single).ant-picker-cell-range-hover-start::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single).ant-picker-cell-range-hover-end::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end::before{ + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before, .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before{ + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before, .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before{ + background-color: #ededed; +} +.ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner, +.ant-picker-cell-in-view.ant-picker-cell-range-start .ant-picker-cell-inner, +.ant-picker-cell-in-view.ant-picker-cell-range-end .ant-picker-cell-inner{ + background-color: #000; +} +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single):not(.ant-picker-cell-range-start) .ant-picker-cell-inner{ + border-radius: 0 2rem 2rem 0; +} +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single):not(.ant-picker-cell-range-end) .ant-picker-cell-inner{ + border-radius: 2rem 0 0 2rem; +} +.ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end.ant-picker-cell-range-hover::before, +.ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single).ant-picker-cell-range-hover-start::before, +.ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single).ant-picker-cell-range-hover-end::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start::before, +.ant-picker-panel > :not(.ant-picker-date-panel) .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end::before{ + background-color: #c9c9c9; +} +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover:first-child::after, +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-end:first-child::after, +.ant-picker-cell-in-view.ant-picker-cell-start.ant-picker-cell-range-hover-edge-start.ant-picker-cell-range-hover-edge-start-near-range::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-start:not(.ant-picker-cell-range-hover-edge-start-near-range)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start::after{ + border-left: 1px dashed #c9c9c9; +} +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover:last-child::after, +tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::after, +.ant-picker-cell-in-view.ant-picker-cell-end.ant-picker-cell-range-hover-edge-end.ant-picker-cell-range-hover-edge-end-near-range::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-edge-end:not(.ant-picker-cell-range-hover-edge-end-near-range)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end::after{ + border-right: 1px dashed #c9c9c9; +} +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start:not(.ant-picker-cell-in-range):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end:not(.ant-picker-cell-in-range):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end)::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start.ant-picker-cell-range-start-single::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-start.ant-picker-cell-range-start.ant-picker-cell-range-end.ant-picker-cell-range-end-near-hover::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end.ant-picker-cell-range-start.ant-picker-cell-range-end.ant-picker-cell-range-start-near-hover::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover-end.ant-picker-cell-range-end-single::after, +.ant-picker-cell-in-view.ant-picker-cell-range-hover:not(.ant-picker-cell-in-range)::after{ + border-top: 1px dashed #c9c9c9; + border-bottom: 1px dashed #c9c9c9; +} + + + +.ant-select-single.ant-select-show-arrow .ant-select-selection-search{ + height: 2.5rem; + top: 50%; + transform: translateY(-50%); + display: flex; + .ant-select-selection-search-input{ + height: 100% !important; + } +} +.gallerySelect{ + .ant-select-selector{ + height: 2.5rem; + border-radius: 4rem; + padding: 2rem; + box-sizing: content-box; + width: 100%; + box-sizing: border-box; + } + &.ant-select-lg{ + font-size: 1.6rem; + } + &.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector{ + height: 5.5rem; + } + &.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector::after, + &.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-item, + &.ant-select-single.ant-select-lg:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-placeholder{ + line-height: 5.5rem; + } +} .generalModel_page {//常用查询列表样式 width: 100%; height: 100%; @@ -703,19 +800,21 @@ input:focus{ min-width: 5rem; text-align: left; } - .ant-picker-range{ - height: 5rem; + .ant-picker-range,.ant-select-selector{ + height: 2.5rem; + border-radius: 4rem; + padding: 2rem; + box-sizing: content-box; + background-color: #f3f3f3; + width: calc(100% - 4rem); } .ant-select-lg{ font-size: 14px; .ant-select-selector{ - height: 5rem; .ant-select-selection-item{ - line-height: 5rem; - } - input{ - line-height: 5rem; - height: 5rem; + height: 100%; + display: flex; + align-items: center; } } } @@ -759,21 +858,41 @@ input:focus{ -khtml-user-select: none; user-select: none; position: relative; - border-radius: 1rem; - overflow: hidden; + box-shadow: none; + height: calc(65rem*1.2); + .ant-modal-content{ + border-radius: 3rem; + height: 100%; + } + .mark_loading{ + &[state="true"] { + border-radius: 3rem; + } + } .ant-modal-body { padding: 0; - // height: calc(65vh - 6.4rem); - height: calc(65rem*1.2); - // background-color: #181818; + height: 100%; + font-size: 1.4rem; padding: calc(5rem*1.2) calc(6rem*1.2); - } - .ant-modal-btn{ - + position: relative; } .fi-rr-down-to-line,.fi-rr-arrow-small-right,.fi-rr-arrow-small-left{ font-size: 2rem; } + .generalModelTitle{ + font-weight: 600; + font-size: 3.5rem; + margin-bottom: 4rem; + } + .generalModelInfo{ + font-weight: 600; + font-size: 3rem; + margin-bottom: 3rem; + } + .generalModelDescription{ + font-size: 1.5rem; + font-weight: 400; + } .collection_title{ position: absolute; top: calc(4rem*1.2); @@ -794,16 +913,17 @@ input:focus{ .generalModel_btn { .generalModel_closeIcon{ position: absolute; - top: calc(2rem*1.2); - right: calc(2rem*1.2); + top: 0; + right: 0; + transform: translate(100%, -100%); cursor: pointer; width: calc(4rem*1.2); height: calc(4rem*1.2); display: flex; align-items: center; justify-content: center; - &.left{ - left: calc(2rem*1.2); + &.download{ + transform: translate(-100%, 100%); } .fi-rr-cross-small::before{ padding: calc(.2rem*1.2); @@ -831,10 +951,16 @@ input:focus{ // height: 100%; height: 100%; flex: 1; - padding-bottom: 3rem; background: #fff; border-radius: 2rem; overflow: hidden; + .ant-table-wrapper,.ant-spin-nested-loading,.ant-spin-container{ + height: 100%; + } + .ant-spin-container{ + display: flex; + flex-direction: column; + } .ant-table { background: transparent; } @@ -872,6 +998,10 @@ input:focus{ .ant-table-pagination-right { padding-right: 3.5rem; } + .ant-table-pagination.ant-pagination{ + margin: 0; + margin-top: auto; + } .operate_list { display: flex; align-items: center; @@ -887,103 +1017,7 @@ input:focus{ } } } -.generalModelOperate{//常用model样式 - display: flex; - flex-direction: column; - border-right: 1px solid #e5e5e5; - position: relative; - .ant-modal-content { - border-radius: calc(1rem * 1.2); - overflow: hidden; - .ant-modal-header { - background-color: #fff; - border-bottom: none; - } - .ant-modal-body { - display: flex; - flex-direction: column; - padding: calc(5rem * 1.2) calc(5rem * 1.2) !important; - // height: calc(65vh - 6.4rem); - background: #f9fafb; - } - //进度完成字体颜色 - .ant-progress-circle.ant-progress-status-success .ant-progress-text { - color: #000; - } - .ant-progress-circle .ant-progress-text { - color: rgba(0, 0, 0, 0.55); - font-size: calc(1.6rem * 1.2); - } - } - .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{ - border-color: #d9d9d9; - box-shadow: none; - } - .ant-select:hover .ant-select-selector{ - border-color: #d9d9d9; - } - .generalModelOperate_title { - font-size: var(--aida-fsize2); - font-weight: 900; - color: rgba(0, 0, 0, 0.65); - } - .generalModelOperate_closeIcon { - top: calc(2rem * 1.2); - right: calc(2rem * 1.2); - cursor: pointer; - width: calc(4rem * 1.2); - height: calc(4rem * 1.2); - display: flex; - align-items: center; - justify-content: center; - position: absolute; - .fi-rr-cross-small::before { - padding: calc(0.2rem * 1.2); - border-radius: 5px; - border: solid 2px rgba(0, 0, 0, 0.25); - transition: 1s all; - color: rgba(0, 0, 0, 0.55); - } - &.generalModelOperate_closeIcon:hover .fi-rr-cross-small::before { - border: solid 2px rgba(0, 0, 0, 0.55); - color: rgba(0, 0, 0, 1); - } - } - .generalModelOperate_endBtn{ - display: flex; - justify-content: center; - >div{ - height: 3.2rem; - padding: 4px 1.5rem; - font-size: 1.4rem; - transition: all .3s; - border: 1px solid; - cursor: pointer; - } - .generalModelOperate_btn_cancel{ - border-color: #d9d9d9; - } - .generalModelOperate_btn_cancel:hover{ - color: #39215b; - border-color: #39215b; - } - - .generalModelOperate_btn_ok{ - margin-left: 10rem; - background: #39215b; - border-color: #39215b; - color: #fff; - } - .generalModelOperate_btn_ok:hover{ - border-color: #543087; - background: #543087; - } - } -} -.ant-modal-body{ - font-size: 1.4rem; -} //衣服类型下拉菜单 .operate_file_block{ width: 100%; @@ -1068,7 +1102,9 @@ input:focus{ .ant-modal-wrap{ height: 100vh; - overflow: hidden; + // overflow: hidden; + overflow: auto; + // position: fixed; } // .driver-overlay-animated{ // z-index: 10002 !important; @@ -1084,9 +1120,10 @@ input:focus{ .ant-btn:focus, .ant-btn:active, .ant-btn::after { - color: #000; + color: #fff; border-color: #000 !important; box-shadow: none !important; + background-color: #000; } .ant-switch-checked { background-color: #000; @@ -1187,12 +1224,43 @@ input:focus{ height: 100%; } .ant-checkbox-checked .ant-checkbox-inner{ - background-color: #767676; + background-color: #000000; border-color: #d9d9d9 !important; } +.ant-checkbox-indeterminate .ant-checkbox-inner::after{ + background-color: #000000; +} .ant-checkbox-wrapper:hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner, .ant-checkbox-input:focus + .ant-checkbox-inner{ border-color: #d9d9d9 !important; } + +//分页悬浮样式 +.ant-pagination-item-active { + border-color: #000; + a{ + color: #000; + } + &:hover{ + border-color: #000; + } +} +.ant-pagination-options-quick-jumper input:hover{ + border-color: #000; +} +.ant-pagination-options-quick-jumper input:focus, +.ant-pagination-options-quick-jumper input-focused{ + 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-item:hover a{ + color: #000; +} + + .libraryPageCascader{ border-radius: 1rem; .cascader_btn_max{ @@ -1417,29 +1485,6 @@ input:focus{ } } } -.closeIcon{ - position: absolute; - top: calc(2rem*1.2); - right: calc(2rem*1.2); - cursor: pointer; - width: calc(4rem*1.2); - height: calc(4rem*1.2); - display: flex; - align-items: center; - justify-content: center; - - .fi-rr-cross-small::before{ - padding: calc(.2rem*1.2); - border-radius: 5px; - border: solid 2px rgba(0, 0, 0, 0.25); - transition: 1s all; - color: rgba(0, 0, 0, 0.55); - } - &.collection_closeIcon:hover .fi-rr-cross-small::before{ - border: solid 2px rgba(0, 0, 0, 0.55); - color: rgba(0, 0, 0, 1); - } -} .homeMain_heade,.account_message{ .ant-badge{ width: auto; @@ -1501,73 +1546,14 @@ input:focus{ color: rgba(0,0,0,1); } } -//collection 弹窗 -.collection_modal,.generalModel_modal,.payOrder_modal,.design_detail_modal_component,.designOpenrtion_modal,.library_page,.Export,.productImg_modal{ - - .ant-modal-body{ - overflow-y: hidden; - } - - .ant-upload.ant-upload-select-picture-card{ - background: #FFFFFF; - width: calc(6rem*1.2); - height: calc(6rem*1.2); - border: calc(0.3rem*1.2) solid #ededed; - border-radius: calc(1rem*1.2); - margin: 0; - .upload_tip_block{ - .icon-jiahao{ - font-size: calc(3.2rem*1.2); - color: #B7B7B7; - } - } - - .ant-upload-text{ - font-size: calc(1.6rem*1.2); - color: #B7B7B7; - } - } - .ant-upload-list-picture-card-container{ - display: none !important; - } - .ant-upload-picture-card-wrapper{ - width: auto; - vertical-align: top; - } +.ant-modal{ + div[aria-hidden="true"] {display: none !important;} } -//desing 关闭按钮 -.designOpenrtion_modal,.designOpenrtionMobile_modal,.design_detail_modal_component,.designElements_modal,.designElementsMobile_modal{ - .design_closeIcon{ - top: 2rem; - right: 2rem; - cursor: pointer; - width: 4rem; - height: 4rem; - display: flex; - align-items: center; - justify-content: center; - position: absolute; - .fi-rr-cross-small::before{ - padding: .2rem; - border-radius: 5px; - border: solid 2px rgba(0, 0, 0, 0.25); - transition: 1s all; - color: rgba(0, 0, 0, 0.55); - } - &.collection_closeIcon:hover .fi-rr-cross-small::before{ - border: solid 2px rgba(0, 0, 0, 0.55); - color: rgba(0, 0, 0, 1); - } - } + +.ant-upload-list-picture-card-container{ + display: none !important; } .design_detail_modal_component,.designOpenrtion_modal,.designElements_modal,.UpgradePlan_modal,.refund_reason,.Export,.designOpenrtionMobile_modal,.designElementsMobile_modal{ - .ant-upload-list-picture-card-container{ - display: none !important; - } - .ant-upload-picture-card-wrapper{ - width: auto; - vertical-align: top; - } .subitOkPreviewBtn{ background-color: #38205b; color: #fff; @@ -1607,6 +1593,120 @@ input[type=number]::-webkit-outer-spin-button { textarea:focus{ outline: none; /* 清除默认焦点样式 */ } +.upload_item{ + display: flex; + flex-wrap: wrap; + .upload_file_item { + margin: 0 calc(2rem) calc(2rem) 0; + display: inline-block; + // width: calc(16.5rem); + // height: calc(16.5rem); + width: calc(10rem); + height: calc(10rem); + border: 1px solid #f5f5f5; + vertical-align: top; + position: relative; + cursor: pointer; + border: none; + &.active { + opacity: 0.5; + // border: 2px solid; + border-radius: calc(1rem*1.2); + transform: scale(0.9); + .delete_file_block{ + pointer-events:none; + } + .operate_file_block{ + pointer-events:none; + } + img { + } + } + &.upload_component { + border: none; + display: flex; + align-items: center; + justify-content: center; + } + .ant-upload-picture-card-wrapper{ + &.ant-upload-picture-card-wrapper { + position: absolute; + width: auto; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + .ant-upload-select-picture-card { + width: calc(6rem*1.2); + height: calc(6rem*1.2); + border: calc(0.3rem*1.2) solid #ededed; + border-radius: calc(1rem*1.2); + margin: 0; + } + + + } + &.upload_file_item:last-child{ + margin: 0; + } + .upload_img_icon { + width: calc(4.6rem*1.2); + } + .upload_file_item_content { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + width: 100%; + position: relative; + &:hover div { + opacity: 1; + } + &:hover .delete_file_block { + display: block; + } + + .upload_img { + display: block; + height: 100%; + width: auto; + max-width: 100%; + object-fit: cover; + } + .delete_file_block { + display: none; + width: 100%; + cursor: pointer; + height: calc(3rem*1.2); + background: rgba(0, 0, 0, 0.2); + font-size: calc(1.6rem*1.2); + color: #ffffff; + line-height: calc(3rem*1.2); + text-align: center; + position: absolute; + left: 0; + bottom: 0; + &.rightTop { + width: calc(3.2rem*1.2); + height: calc(3.2rem*1.2); + background: rgba(0, 0, 0, 0.6); + border-radius: calc(0.4rem*1.2); + position: absolute; + top: calc(0.9rem*1.2); + right: calc(0.9rem*1.2); + text-align: center; + line-height: calc(3.2rem*1.2); + left: auto; + .icon-shanchu { + font-size: calc(1.6rem*1.2); + color: #fff; + } + } + } + } + } + +} //设计input和上传按钮样式 .collection_modal_body,.design_detail_modal_component,.library_page,.productImg_modal,.accountEdit_page,.generalMenu_printModel_upload{ .input_border{ @@ -1700,12 +1800,7 @@ textarea:focus{ border-right: calc(0.1rem* 1.2) solid #F1F1F1; } } - .upload_item{ - .upload_file_item{ - width: 8rem; - height: 8rem; - } - } + input{ width: 100%; border-radius: calc(.5rem*1.2); @@ -1800,159 +1895,16 @@ textarea:focus{ } } - .upload_item{ - display: flex; - flex-wrap: wrap; - .upload_file_item { - margin: 0 calc(2rem*1.2) calc(2rem*1.2) 0; - display: inline-block; - // width: calc(16.5rem*1.2); - // height: calc(16.5rem*1.2); - width: calc(10rem*1.2); - height: calc(10rem*1.2); - border: 1px solid #f5f5f5; - vertical-align: top; - position: relative; - cursor: pointer; - - &.active { - opacity: 0.5; - // border: 2px solid; - border-radius: calc(1rem*1.2); - transform: scale(0.9); - .delete_file_block{ - pointer-events:none; - } - .operate_file_block{ - pointer-events:none; - } - img { - } - } - &.upload_component { - border: none; - display: flex; - align-items: center; - justify-content: center; - } - :deep(.ant-upload-picture-card-wrapper) { - position: absolute; - width: auto; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } - :deep(.ant-upload-select-picture-card) { - width: calc(6rem*1.2); - height: calc(6rem*1.2); - border: calc(0.3rem*1.2) solid #ededed; - border-radius: calc(1rem*1.2); - margin: 0; - } - .upload_file_item_content { - display: flex; - align-items: center; - justify-content: center; - height: 100%; - width: 100%; - position: relative; - &:hover div { - opacity: 1; - } - &:hover .delete_file_block { - display: block; - } - - .upload_img { - display: block; - height: 100%; - width: auto; - max-width: 100%; - object-fit: cover; - } - .delete_file_block { - display: none; - width: 100%; - cursor: pointer; - height: calc(3rem*1.2); - background: rgba(0, 0, 0, 0.2); - font-size: calc(1.6rem*1.2); - color: #ffffff; - line-height: calc(3rem*1.2); - text-align: center; - position: absolute; - left: 0; - bottom: 0; - &.rightTop { - width: calc(3.2rem*1.2); - height: calc(3.2rem*1.2); - background: rgba(0, 0, 0, 0.6); - border-radius: calc(0.4rem*1.2); - position: absolute; - top: calc(0.9rem*1.2); - right: calc(0.9rem*1.2); - text-align: center; - line-height: calc(3.2rem*1.2); - left: auto; - .icon-shanchu { - font-size: calc(1.6rem*1.2); - color: #fff; - } - } - } - } - - .upload_img_icon { - width: calc(4.6rem*1.2); - } - } - .upload_file_item:last-child{ - margin: 0; - } - } + } -.generalModel_modal{//公共弹窗 - // max-width: 1200px ; - // max-width: 1150px ; - .ant-modal-content { - border-radius: calc(1rem * 1.2); - overflow: hidden; - .ant-modal-header { - background-color: #fff; - border-bottom: none; - } - .ant-modal-body { - // height: calc(65vh - 6.4rem); - height: calc(65rem * 1.2); - } - //进度完成字体颜色 - .ant-progress-circle.ant-progress-status-success .ant-progress-text { - color: #000; - } - .ant-progress-circle .ant-progress-text { - color: rgba(0, 0, 0, 0.55); - font-size: calc(1.6rem * 1.2); - } - } -} .hideChecked{ user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } -//剪裁弹窗 -.cut_pricture_modal{ - .ant-modal-content{ - border-radius: 1rem; - } - .ant-modal-body{ - height: calc(65rem*1.2); - padding: 8rem 5rem !important; - overflow-y: hidden; - } -} + .generalScroll{ &.generalScroll::-webkit-scrollbar { width: calc(1rem*1.2); @@ -2037,61 +1989,4 @@ textarea:focus{ background: rgba(255,255,255, 1); color: #000; } - .mark_loading_text{ - text-align: center; - font-size: 1.2rem; - position: absolute; - bottom: 2%; - right: 2%; - div{ - margin-top: 10px; - span{ - // font-size: 1.8rem; - margin: 0 5px; - color: red; - - } - } - - } - .mark_loading_title{ - font-size: 3rem; - // text-decoration: underline; - font-weight: 600; - margin-bottom: 2rem; - // color: #fff; - } - .mark_loading_intro{ - color: rgba(0, 0, 0, 0.6); - font-size: 1.4rem; - margin-bottom: 2rem; - text-align: center; - width: 80%; - } - .mark_loading_title_box{ - display: flex; - } - - .mark_loading_btn,.mark_loading_btn2{ - // border: #000; - // color: #fff; - display: flex; - margin-top: 10px; - text-align: center; - border: 2px solid; - padding: 0 20px; - border-radius: 10px; - cursor: pointer; - padding: .3rem 4rem; - background: #39215b; - color: #fff; - border: none; - margin: 0 2rem; - align-items: center; - } - .mark_loading_btn2{ - border: 2px solid #000; - color: #000; - background: rgba(0,0,0,0); - } } diff --git a/src/component/Account/account.vue b/src/component/Account/account.vue index c6ec60f7..21f6a292 100644 --- a/src/component/Account/account.vue +++ b/src/component/Account/account.vue @@ -4,11 +4,29 @@ -->
+
+
+
+ +
+
+ +
+
+ {{$t('account.Follow')}}:{{ userInfo?.followeeCount }} +
+
+ {{$t('account.Fans')}}:{{ userInfo?.followerCount }} +
+
+
+
+