@import url(./theme-g.scss); :root { // color palettes --color-theme: #ed6d00; --color-mode: #fff; --color-neutral-1: #2b2f36; --color-neutral-2: #646a73; --color-neutral-3: #b5b9bf; --color-neutral-4: #f5f7fa; --color-neutral-5: #bfc1c3; --color-white: #fff; --color-success: #00a870; --color-warning: #edb82f; --color-warning-2: #E0A100; --color-danger: #c9353f; --color-grey: #f4f5f5; --color-accent-1: #2b2f36; --color-accent-2: #ed6d00; --color-accent-3: #e35963; --color-accent-4: #7959c8; --color-accent-5: #21bba9; --color-accent-6: #7eb813; --color-accent-7: #8f9097; --color-accent-8: #ffe1c8; --color-accent-9: #f7cdd0; --color-accent-10: #d7cdef; --color-accent-11: #d3f1ee; --color-accent-12: #d8eab8; --color-accent-13: #d9dddf; --color-accent-14: #fbf3de; --color-accent-15: #f2e7e8; --color-accent-16: #ebe7f3; --color-accent-17: #e5f2f0; --color-accent-18: #ecf2e1; // 同色渐变 --color-brown-1: #5d2a01; --color-brown-2: #7f3b02; --color-brown-3: #a14c00; --color-brown-4: #c65b00; --color-brown-5: #ed6d00; --color-orange-1: #cd4c01; --color-orange-2: #ed6d00; --color-orange-3: #fb8e00; --color-orange-4: #ffb74d; --color-orange-5: #ffd393; --color-orange-6: #fdf0e6; --color-tag-confirmed: #5bb462; --color-tag-cancelled: #243041; --color-tag-created: #2b65f2; --color-tag-booked: #bf66ea; --color-tag-all: #ed6d00; --color-tag-cargo-received: #5963c0; --color-tag-departure: #0090e9; --color-tag-arrived: #01b7a1; --color-tag-completed: #5bb462; --color-tag-Departed: #0090e9; --color-tag-confirmed-bg: #e8fbe4; --color-tag-cancelled-bg: #ebeef1; --color-tag-created-bg: #e5f0fb; --color-tag-booked-bg: #f3e6fa; --color-tag-all-bg: #ffe5cf; --color-tag-all-bg-color: #feecf3; --color-tag-cargo-received-bg: #eaecff; --color-tag-departure-bg: #d9edfa; --color-tag-arrived-bg: #e7faf8; --color-tag-completed-bg: #e8fbe4; --color-tag-Departed-bg: #d9edfa; --color-tag-unfinished-approval-bg: #fff4d1; --color-tag-unfinished-approval: #e0a100; --color-tag-approved-bg: rgb(232, 251, 228); --color-tag-approved: rgb(91, 180, 98); --color-tag-rejected-bg: rgba(201, 53, 63,0.2); --color-tag-rejected: rgb(201, 53, 63); --color-border: #eaebed; --color-select-border: #eaebed; --border-color-2: #eaebed; --color-mune-active-bg: #fdf5f1; --color-dialog-header-bg: #f6f8fa; --color-dialog-body-bg: #ffffff; --color-drawer-body-bg: #fff; // 按钮 // default --color-btn-default-bg-hover: #fff1e6; --color-btn-default-bg-color: #fff; // dark --color-btn-default-dark-bg: #2b2f36; --color-btn-default-dark-hover: #ff7500; // main-plain --color-btn-main-plain-bg-hover: hsl(26, 100%, 95%); --color-btn-action-bg-hover: rgba(255, 117, 0, 0.2); // main --color-btn-main-bg-hover: #d56200; --color-btn-main-bg-disabled: rgba(237, 109, 0, 0.3); // success --color-btn-success-bg-hover: #009765; // warning --color-btn-warning-bg: #e9b227; --color-btn-warning-bg-hover: #d2a023; // danger --color-btn-danger-bg: #c9353f; --color-btn-danger-bg-hover: #b53039; --color-tag-checked-all: #fff2e8; --color-tag-checked-created: #e5f0fb; --color-tag-checked-cancelled: #ebeef1; --color-tag-checked-confirmed: #e8fbe4; --color-border-top: #eff0f1; --color-header-bg: #f6f8fa; --management-bg-color: #fff; --more-type-bg-color: #fff; // 字体 --font-size-1: 10px; --font-size-2: 12px; --font-size-3: 14px; --font-size-4: 16px; --font-size-5: 18px; --font-size-6: 24px; --font-size-7: 32px; --font-size-8: 40px; //圆角 --border-radius-6: 6px; --border-radius-12: 12px; --border-radius-22: 22px; --border-hover-color: #fff1e6; --border-cancel-hover-color: #f4f5f5; --icon-color-black: #202020; --more-filters-background-color: #f9f9f9; --add-rules-background-color: #f9f9f9; --addparties-background-color: #eff1f5; --badge__content--warning: #ed6d00; --tag-info-bg-color: #f2f2f2; --tag-info-text-color: #2b2f36; --dashboard-text-color: #646a73; --el-input-focus: #fff; .el-radio { --el-radio-input-border: #dcdfe6; } // 发送邮件部分 --color-avatar: #fff; --color-email-bg: #f6f8fa; --color-detail-email-record-bg: #eceef1; --color-email-border: #eaebed; --w-e-textarea-bg-color: #ffffff; --color-divider: #eaebed; // 横幅 --dashboard-scoring-bg-color: linear-gradient( 251deg, rgba(255, 255, 255, 0.3), rgba(255, 244, 235, 0.5) 22.66%, rgba(240, 243, 255, 0.5) 44.57%, rgba(224, 247, 249, 0.6) 80.46%, rgba(255, 255, 255, 0.3) ); --color-range-text: #2b2f36; --tag-bg-color: rgba(239, 239, 240); --tag-boder-color: #efeff0; --tips-bg-color: rgba(26, 28, 32, 1); --scoring-bg-color: #f2f4f7; --scoring-colurful-color: linear-gradient( 251deg, rgba(242, 244, 247) 0%, rgba(255, 237, 230) 100% ); --scoring-smile-radio-color: #e0e2e6; --color-el-popper-bg: #303133; // 滚动条 --color-scrollbar-thumb: #d9dddf; --color-message-box-header-bg: #f6f8fa; --color-table-header-bg: #f8f9fd; --color-table-click-row-bg: #fff1e6; --color-download-file-filter-tag-bg: #eceef0; --color-download-file-selected-column-tag-bg: #eceef0; --color-tracking-routes-item-bg: #fef8f3; --color-tracking-routes-item-leg-bg: #f6f2ee; --color-customize-column-right-section-bg: #fffbf7; --color-customize-column-right-section-border: #eaebed; --color-customize-column-item-bg: #fff; --color-customize-column-item-hover-bg: #fff1e5; --color-customize-column-item-drag-icon: var(--color-neutral-3); --color-customize-column-item-drag-border: var(--color-customize-column-right-section-bg); --color-customize-column-item-drag-bg: var(--color-customize-column-right-section-bg); --color-customize-column-tabs-header-border: #ebeef5; --color-shipment-status-header-bg: #f6f8fa; --color-shipment-status-label-bg: #ccd1db; --color-shipment-status-shadow: rgba(0, 0, 0, 0.1); --color-slider-bg: #fff; --color-slider-thumb-start: #2b2f36; --color-public-tracking-bg-mask: rgba(255, 255, 255, 0.85); --color-public-tracking-search-input-btn: #000; --color-public-tracking-search-input-border: #2b2f36; --color-v-box-content-drag-bg: #fff; --color-toggle-btn-module-bg: #f0f1f3; --color-toggle-btn-module-active-bg: #fff; --color-user-config-title-bottom-border: #eeeeed; --color-container-status-node-bg: #f8f9fd; --color-table-stripe-bg: #ffffff; --color-table-row-hover-bg: rgba(255, 117, 0, 0.1); --color-share-link-bg: #f8f9fd; // 输入框禁用的颜色 --input-disabled-bg-color: #f5f7fa; --input-disabled-text-color: #a8abb2; --el-disabled-bg-color: #f4f4f4; --color-btn-icon-bg: #f6f6fe; --color-btn-blue-bg: #f6f6fe; --color-btn-default-dark-hover-bg: #2b2f36; --color-recent-name: rgba(43, 47, 54, 0.05); --color-disabled-bg: #eaebed; .el-input { --el-border: #eaebed; } --color-vxe-table-visited-row-bg: #f2f2f2; --color-public-tracking-empty-bg: #fff; --color-dot-unchecked: #eeeeee; --color-dot-checked: #ed6d00; --color-system-message-nav-bg: #f6f6f6; --color-upload-file-bg: #fef8f2; --color-upload-file-color: #b5b9bf; --color-upload-file-border-bg: #f5b279; --color-personal-preference-bg: #f5f7fa; --color-password-card-first-bg: #ffe294; --color-password-card-second-bg: #f6f8fa; --color-password-expired-card-first-bg: #ef99a0; --color-password-expired-card-second-bg: #f6f8fa; --color-feature-card-first-bg: #fff4eb; --color-feature-card-second-bg: #f0f3ff; --color-feature-card-third-bg: #f0f3ff; --color-milestone-tag-bg: #e6f1eb; --color-delay-tag-bg: #f7e7e9; --color-change-tag-bg: #f5f2e6; --color-previous-bg: #e1e3e9; --color-system-color-bg: #f6f8fa; --color-system-border: #eaebed; --color-system-checkbox-bg: #fff; --color-system-checkbox-border: #eaebed; --color-system-body-bg: #fff; --color-system-notification-bg: #f6f8fa; --color-system-card-bg: #fff; --color-system-border-1: #e8eaee; --color-system-input-border: #e8eaee; --color-personal-preference-bg: #f5f7fa; // AI Robot --color-dialogue-bg: #fff; --color-dialogue_container-border: #fff; --color-carousel-card-bg: #fff; --color-dialogue-icon-bg: radial-gradient(50% 43% at 50% 54.79%, #d5b4f3 0%, #fff9fc 100%); --color-dialogue-text-bg: linear-gradient(92deg, #eaecff 1.33%, #f1e3fb 99.63%); --color-dialogue_title: linear-gradient(90deg, #a71549 1.77%, #06256e 46.77%); --color-dialogue_container-bg: rgba(255, 255, 255, 0.5); --color-dialogue_content-bg: linear-gradient( 117deg, var(--1-gradient-ai-robot-0, #b5fef3) 4.31%, var(--1-gradient-ai-robot-15, #f9eeec) 14.24%, var(--1-gradient-ai-robot-38, #fbd3ee) 29.71%, var(--1-gradient-ai-robot-59, #ddd5f7) 43.72%, var(--1-gradient-ai-robot-83, #c8f4f3) 59.35%, var(--1-gradient-ai-robot-100, #cadff8) 70.56% ); --color-ai-chat-header-bg-gradient-begin: #eaecff; --color-ai-chat-header-bg-gradient-end: #fefdff; --color-ai-user-bubble-bg-gradient-begin: #ffede6; --color-ai-user-bubble-bg-gradient-end: #f2f4f7; --input-border: #eaebed; --color-pause-btn-bg: #fff1e6; --color-arrow-hoverL: #fceee3; --color-output-type-bg: #4361ed; --color-output-type-string-bg: #6c757e; --color-output-select-text: #f9a725; --color-loading-text: #b5b9bf; --color-warning-tips-bg: #fff4d1; --color-prompt-preview-bg: #fcf7ff; --color-prompt-diaolog-bg: #f8f9fd; --color-prompt-disabled-bg: #f4f4f4; --color-prompt-disabled-border: rgba(234, 235, 237, 0.3); --color-card-icon-box-bg: #f0f1fb; --color-card-number-cancelled: #243041; --color-steps-unfinished-line: #b5b9bf; --color-steps-current-icon-color: #e0a100; --color-steps-current-icon-bg: #fff4d1; --color-steps-rejected-bg: #fedcde; --color-steps-approved-bg: #e8fbe4; --color-steps-cancelled-bg: #ebeef1; --color-booking-info-linear-bg: linear-gradient(90deg, #c4c9ee 0%, #e8e8ff 49.52%, #bfe1ff 100%); --color-process-data-value-bg: #e8ebef; --color-delivery-date-cell-hover-bg: #fff1e6; --color-tour-popover-bg: #fff; --color-tour-prev-btn-border: #eaebed; --color-tour-next-btn-bg: #2b2f36; --color-tour-next-btn-hover-bg: #2b2f36; --color-tour-next-btn-color: #fff; --color-tour-step-color: #b5b9bf; --color-tour-mask-bg: rgba(43, 47, 54, 0.7); --color-guide-icon-bg: rgba(237, 237, 237, 0.6); --color-guide-icon-hover-bg: rgba(237, 237, 237, 0.45); --color--process-data-tips-bg: #e8ebef; } :root.dark { --color-mode: #2b2f36; // 文字颜色 --color-neutral-1: #f0f1f3; --color-neutral-2: rgba(240, 241, 243, 0.7); --color-neutral-3: rgba(240, 241, 243, 0.3); --color-border: #3f434a; --color-header-bg: #30353c; --border-hover-color: #654f3f; --color-download-file-filter-tag-bg: #3f4249; --color-download-file-selected-column-tag-bg: #474e57; --color-customize-column-right-section-bg: #453b36; --color-customize-column-right-section-border: var(--color-theme); --color-customize-column-item-bg: #3a4149; --color-customize-column-item-hover-bg: #585b60; --color-customize-column-item-drag-icon: var(--color-neutral-1); --color-customize-column-item-drag-border: var(--color-theme); --color-customize-column-item-drag-bg: #7d4c26; --color-customize-column-tabs-header-border: #3f434a; --color-shipment-status-header-bg: #3f434a; --color-shipment-status-shadow: rgba(0, 0, 0, 0.5); --color-shipment-status-label-bg: #656f7d; --color-shipment-status-detail-path-font-color: #b5b7ba; --color-shipment-status-label-font-color: #c6cad0; --color-slider-bg: #3f434a; --color-slider-thumb-start: #646a73; --color-public-tracking-bg-mask: rgba(43, 47, 54, 0.75); --color-public-tracking-search-input-btn: #ed6d00; --color-public-tracking-search-input-border: #656f7d; --color-toggle-btn-module-bg: #434b53; --color-toggle-btn-module-active-bg: #656f7d; --color-user-config-title-bottom-border: #3f434a; --color-container-status-node-bg: #3e454f; --color-btn-blue-bg: rgba(248, 249, 253, 0.1); --color-el-btn-pain-theme-border: #ed6d00; --color-el-btn-pain-theme-text: #ed6d00; --color-el-btn-pain-theme-bg: rgba(237, 109, 0, 0.1); --color-el-btn-pain-theme-bg-hover: rgba(237, 109, 0, 0.3); --color-btn-default-dark-hover-bg: #d56200; --color-btn-icon-bg: #3f434a; --color-table-stripe-bg: #2b2f36; --color-table-row-hover-bg: rgba(255, 117, 0, 0.1); --color-share-link-bg: #3a4149; --color-public-tracking-empty-bg: #2b2f36; --color-upload-file-bg: rgba(237, 109, 0, 0.2); --color-upload-file-color: rgba(240, 241, 243, 0.7); --color-upload-file-border-bg: rgba(237, 109, 0, 0.5); --color-personal-preference-bg: #343a43; // 滚动条 --color-scrollbar-thumb: #656f7d; // 菜单选中背景 --color-mune-active-bg: #553d2b; --color-tracking-routes-item-bg: #403631; --color-tracking-routes-item-leg-bg: #524843; --color-v-box-content-drag-bg: #2b2f36; --color-input-disabled-border: #656f7d; --color-password-card-first-bg: #ffa000; --color-password-card-second-bg: #d6c587; --color-password-expired-card-first-bg: #f25a66; --color-password-expired-card-second-bg: #cda9ac; --color-feature-card-first-bg: #334181; --color-feature-card-second-bg: #c651bd; --color-feature-card-third-bg: #ffca6e; --color-milestone-tag-bg: #3c5249; --color-delay-tag-bg: #523942; --color-change-tag-bg: #564f36; --color-previous-bg: #454b54; --color-system-message-nav-bg: #343a43; // 邮件 --w-e-toolbar-bg-color: var(--color-email-bg); --w-e-textarea-bg-color: var(--color-email-bg); --w-e-toolbar-border-color: #656f7d; --w-e-toolbar-color: var(--color-neutral-1); --w-e-toolbar-active-bg-color: rgba(255, 117, 0, 0.2); --w-e-toolbar-active-color: #1a1c20; button.w-e-menu-tooltip-v5::before { color: var(--color-neutral-1); } div.w-e-bar-item button:hover { color: var(--color-neutral-1); } --color-email-border: #656f7d; --color-email-bg: #3c414a; --color-detail-email-record-bg: #343a43; --color-divider: #4c515a; --color-avatar: var(--color-mode); --color-header-bg: #343a43; // ElementUI --color-message-box-header-bg: #3e454f; // 整体背景颜色 --el-bg-color: #30353c; // 按钮边框颜色 --color-accent-13: #656f7d; // 输入框边框颜色 --el-border: #656f7d; .el-input { --el-border: #656f7d; } .el-radio { --el-radio-input-border: #656f7d; } --el-radio-input-border: #656f7d; --color-table-header-bg: #34383f; --el-input-focus: #2b2f36; --color-dialog-header-bg: #3e454f; --color-dialog-body-bg: #30353c; --color-drawer-body-bg: #2b2f36; div.el-card { --el-card-bg-color: #30353c; } --color-el-popper-bg: #1a1c20; // --el-bg-color: var(--color-neutral-1); --el-bg-color-overlay: #3e454f; div.el-popper.is-dark { --el-bg-color: var(--color-neutral-1); } --el-disabled-bg-color: rgba(244, 244, 244, 0.2); // vxe-table --vxe-ui-layout-background-color: #2b2f36; --vxe-ui-table-border-color: #3f434a; --vxe-ui-table-column-icon-border-color: #6a6d73; --color-table-header-bg: #30353c; --vxe-ui-table-header-background-color: #30353c; --color-table-click-row-bg: #403631; --vxe-ui-input-border-color: #656f7d; --vxe-ui-table-menu-background-color: #3e454f; --color-vxe-table-visited-row-bg: #3c4149; --vxe-ui-tooltip-dark-background-color: #3e454f; button.el-button.el-button--pain-theme { border: 1px solid var(--color-el-btn-pain-theme-border); background-color: var(--color-el-btn-pain-theme-bg); fill: var(--color-el-btn-pain-theme-text); color: var(--color-el-btn-pain-theme-text); span { color: var(--color-el-btn-pain-theme-text); } &:hover { border-color: var(--color-el-btn-pain-theme-border); background-color: var(--color-el-btn-pain-theme-bg-hover); color: var(--color-white); fill: var(--color-white); } } --color-ai-chat-header-bg-gradient-begin: #484f82; --color-ai-chat-header-bg-gradient-end: #31363d; --color-ai-user-bubble-bg-gradient-begin: #716763; --color-ai-user-bubble-bg-gradient-end: #5c6a7d; --input-border: #656f7d; --color-pause-btn-bg: #453b36; --color-loading-text: #818892; --color-warning-tips-bg: #85681b; --color-warning-tips-text: #edb82f; div.markdown-body { tr { background-color: #30353c; } th, td { border-color: #3f434a; } } --color-tag-unfinished-approval-bg: rgba(224, 161, 0, 0.2); --color-tag-approved-bg: rgba(91, 180, 98, 0.2); --color-tag-rejected-bg: rgb(255, 220, 222); --color-card-icon-box-bg: #4f535c; --color-card-number-cancelled: #babcc0; --color-steps-unfinished-line: #6a6d73; --color-steps-current-icon-color: #e0a100; --color-steps-current-icon-bg: #534b30; --color-steps-rejected-bg: #4f353d; --color-steps-approved-bg: #394e44; --color-steps-cancelled: #c2c4c7; --color-steps-cancelled-bg: rgba(240, 241, 243, 0.2); --color-booking-info-linear-bg: linear-gradient(90deg, #636db7 0%, #515195 49.52%, #7b9bc9 100%); --color-process-data-value-bg: #4f5760; --color-delivery-date-cell-hover-bg: rgba(255, 117, 0, 0.2); --color-tour-popover-bg: #cf5f00; --color-tour-prev-btn-border: #e6c5aa; --color-tour-next-btn-bg: #f0f1f3; --color-tour-next-btn-hover-bg: #e3e5e8; --color-tour-next-btn-color: #ed6d00; --color-tour-step-color: rgba(240, 241, 243, 0.7); --color-tour-mask-bg: rgba(0, 0, 0, 0.7); --color-guide-icon-bg: rgba(237, 237, 237, 0.1); --color-guide-icon-hover-bg: rgba(237, 237, 237, 0.15); --color--process-data-tips-bg: #4f5760; }