| | |
| | | font-size: 12px; |
| | | } |
| | | |
| | | .merchant-management-table .merchant-action-cell { |
| | | display: grid; |
| | | grid-template-columns: 32px 48px 80px; |
| | | justify-content: center; |
| | | align-items: center; |
| | | column-gap: 4px; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .merchant-management-table .merchant-action-cell .el-button { |
| | | margin-left: 0; |
| | | width: 100%; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .merchant-create-page { |
| | | display: grid; |
| | | gap: 14px; |
| | |
| | | |
| | | .merchant-form-row.address-row { |
| | | grid-template-columns: 68px minmax(0, 1fr) 88px; |
| | | align-items: start; |
| | | } |
| | | |
| | | .merchant-form-row.address-row > .el-form-item__label { |
| | | line-height: 32px; |
| | | } |
| | | |
| | | .merchant-form-row.three-columns { |
| | |
| | | grid-template-columns: 58px minmax(0, 1fr); |
| | | align-items: center; |
| | | margin: 84px 0 18px; |
| | | } |
| | | |
| | | .merchant-create-right .merchant-form-row, |
| | | .merchant-create-right .merchant-hours-block { |
| | | column-gap: 18px; |
| | | } |
| | | |
| | | .merchant-hours-list { |
| | |
| | | text-align: left; |
| | | } |
| | | |
| | | .merchant-fuel-hero-tip { |
| | | margin: -6px 0 14px; |
| | | color: #8a94a6; |
| | | font-size: 12px; |
| | | line-height: 18px; |
| | | } |
| | | |
| | | .merchant-fuel-hero-preview { |
| | | width: 108px; |
| | | height: 84px; |
| | | border: 1px solid #e5e7eb; |
| | | border-radius: 6px; |
| | | object-fit: cover; |
| | | background-color: #f3f4f6; |
| | | } |
| | | |
| | | .merchant-school-address-actions, |
| | | .merchant-parking-address-actions { |
| | | display: flex; |
| | |
| | | |
| | | .movie-merchant-rights-panel .merchant-rights-level-row { |
| | | grid-column: 1 / 3; |
| | | grid-template-columns: 82px 38px 32px 160px; |
| | | /* 第三列放"*标签",32px 放不下两个字,会折成两行;留出足够宽度。 */ |
| | | grid-template-columns: 82px 38px 54px 160px; |
| | | gap: 10px; |
| | | min-width: 0; |
| | | padding-left: 0; |
| | | } |
| | | |
| | | .merchant-rights-level-row > span { |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .movie-merchant-rights-panel .merchant-rights-level-row > .el-switch { |
| | |
| | | } |
| | | |
| | | .hotel-voucher-row { |
| | | grid-template-columns: 76px 42px 104px 24px 64px 104px 96px 42px; |
| | | grid-template-columns: 76px 42px 104px 24px 72px 104px 96px 42px; |
| | | } |
| | | |
| | | .hotel-reset-label { |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .hotel-consume-row { |
| | | display: flex; |
| | | align-items: flex-start; |
| | | display: grid; |
| | | grid-template-columns: 76px 42px max-content; |
| | | align-items: stretch; |
| | | padding-left: 186px; |
| | | padding-top: 20px; |
| | | gap: 12px; |
| | |
| | | } |
| | | |
| | | .hotel-consume-row > strong { |
| | | width: 76px; |
| | | flex-shrink: 0; |
| | | margin-top: 6px; |
| | | grid-column: 1; |
| | | align-self: start; |
| | | margin-top: 7px; |
| | | } |
| | | |
| | | .hotel-consume-row > .el-switch { |
| | | margin-top: 6px; |
| | | grid-column: 2; |
| | | align-self: start; |
| | | } |
| | | |
| | | .hotel-consume-options { |
| | | grid-column: 3; |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 12px; |
| | |
| | | box-shadow: 0 0 0 1px #d9dee8 inset !important; |
| | | } |
| | | |
| | | /* Keep every editable product control visually consistent with the merchant form. */ |
| | | .merchant-product-form-panel { |
| | | --el-fill-color-blank: #ffffff; |
| | | --el-fill-color-light: #ffffff; |
| | | --el-disabled-bg-color: #ffffff; |
| | | --el-disabled-text-color: #334155; |
| | | } |
| | | |
| | | .merchant-product-form-panel .el-input__wrapper, |
| | | .merchant-product-form-panel .el-input-number .el-input__wrapper, |
| | | .merchant-product-form-panel .el-select__wrapper, |
| | | .merchant-product-form-panel .el-date-editor.el-input__wrapper, |
| | | .merchant-product-form-panel .el-time-editor.el-input__wrapper { |
| | | background: #ffffff !important; |
| | | box-shadow: 0 0 0 1px #d9dee8 inset !important; |
| | | } |
| | | |
| | | .merchant-product-form-panel .el-input__wrapper:hover, |
| | | .merchant-product-form-panel .el-input__wrapper.is-focus, |
| | | .merchant-product-form-panel .el-select__wrapper:hover, |
| | | .merchant-product-form-panel .el-select__wrapper.is-focused, |
| | | .merchant-product-form-panel .el-date-editor.el-input__wrapper:hover, |
| | | .merchant-product-form-panel .el-date-editor.el-input__wrapper.is-focus, |
| | | .merchant-product-form-panel .el-time-editor.el-input__wrapper:hover, |
| | | .merchant-product-form-panel .el-time-editor.el-input__wrapper.is-focus { |
| | | box-shadow: 0 0 0 1px #b8c2d1 inset !important; |
| | | } |
| | | |
| | | .merchant-product-form-panel .el-button, |
| | | .product-form-actions .el-button { |
| | | height: 28px; |
| | |
| | | |
| | | .coupon-requirement-row .coupon-full-amount-control > span { |
| | | color: #334155; |
| | | font-size: 12px; |
| | | font-size: 14px; |
| | | line-height: 28px; |
| | | white-space: nowrap; |
| | | } |
| | |
| | | } |
| | | |
| | | .coupon-switch-row { |
| | | grid-template-columns: 130px 44px; |
| | | /* 内容列要留足宽度:开关本身靠左对齐,不受影响;而"适用范围"这类纯文案不会被挤成两行。 */ |
| | | grid-template-columns: 130px minmax(0, 1fr); |
| | | gap: 6px; |
| | | margin-bottom: 18px; |
| | | } |
| | |
| | | justify-content: flex-start; |
| | | white-space: nowrap; |
| | | word-break: keep-all; |
| | | } |
| | | |
| | | .coupon-switch-row > span { |
| | | line-height: 30px; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .coupon-switch-row .el-switch { |
| | |
| | | |
| | | .detail-money-field { |
| | | grid-template-columns: 56px 160px auto; |
| | | } |
| | | |
| | | .detail-period-field { |
| | | grid-template-columns: 84px minmax(0, 1fr); |
| | | } |
| | | |
| | | .detail-period-field label { |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .detail-field label, |
| | |
| | | padding: 18px 22px 20px; |
| | | } |
| | | |
| | | .business-fill-page.role-management-page > .panel { |
| | | padding-left: 16px; |
| | | padding-right: 16px; |
| | | } |
| | | |
| | | .business-fill-filter-form { |
| | | display: grid; |
| | | grid-template-columns: minmax(250px, 1.15fr) minmax(240px, 1fr) minmax(220px, 0.9fr) minmax(260px, 1.1fr) auto; |
| | |
| | | |
| | | /* 角色管理筛选项与标题左边缘对齐。 */ |
| | | .role-management-filter-form .el-form-item__label { |
| | | flex: 0 0 42px; |
| | | width: 42px !important; |
| | | flex: 0 0 auto; |
| | | width: auto; |
| | | justify-content: flex-start; |
| | | } |
| | | |
| | | .role-management-filter-form .business-fill-filter-actions { |
| | | grid-column: -2 / -1; |
| | | grid-row: 1; |
| | | justify-self: end; |
| | | } |
| | | |
| | | .upgrade-management-filter-form .el-form-item__label { |
| | | justify-content: flex-end; |
| | | } |
| | | |
| | | .upgrade-management-filter-form { |
| | | grid-template-columns: minmax(220px, 1fr) minmax(280px, 1.15fr) minmax(220px, 0.9fr) auto; |
| | | gap: 14px 34px; |
| | | } |
| | | |
| | | .upgrade-management-filter-form .upgrade-management-filter-date { |
| | | grid-column: 1; |
| | | } |
| | | |
| | | .upgrade-management-filter-form .business-fill-filter-actions { |
| | | grid-row: 1 / span 2; |
| | | grid-column: 4; |
| | | align-content: start; |
| | | } |
| | | |
| | | .upgrade-management-filter-form .el-date-editor { |
| | | width: 100% !important; |
| | | } |
| | | |
| | | .business-fill-filter-form .el-input, |
| | |
| | | |
| | | .equity-upload-row { |
| | | display: grid; |
| | | grid-template-columns: 42px 180px repeat(2, 72px); |
| | | /* 最后一列放推荐尺寸提示,跟随上传按钮显示。 */ |
| | | grid-template-columns: 42px 180px repeat(2, 72px) minmax(0, 1fr); |
| | | gap: 12px 24px; |
| | | align-items: center; |
| | | margin: 24px 0 0 18px; |
| | | } |
| | | |
| | | .equity-upload-tip { |
| | | color: #8a94a6; |
| | | font-size: 12px; |
| | | line-height: 18px; |
| | | /* 图片只有一张时没有"移除"按钮,提示会落到 72px 的按钮列里被挤成"一字一行", |
| | | 所以这里固定让它跨满整行、单独一行显示。 */ |
| | | grid-column: 1 / -1; |
| | | } |
| | | |
| | | /* 上传图片处的推荐尺寸提示:各处复用同一套样式,避免每个页面各写一份。 */ |
| | | .admin-image-size-tip { |
| | | color: #8a94a6; |
| | | font-size: 12px; |
| | | line-height: 18px; |
| | | /* 独占一行,别被同一行的 flex/grid 挤成"一字一行": |
| | | grid 里跨满所有列,flex 里占满整行(配合下面的 flex-wrap)。 */ |
| | | grid-column: 1 / -1; |
| | | flex: 0 0 100%; |
| | | width: 100%; |
| | | max-width: 100%; |
| | | } |
| | | |
| | | /* 提示所在的弹性容器要允许换行,否则 100% 宽度的提示会把整行撑出容器。 */ |
| | | .admin-image-size-form-item .el-form-item__content { |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | /* 不用逐页加类:凡是把提示直接放在 el-form-item 里的地方都自动允许换行。 */ |
| | | .el-form-item__content:has(> .admin-image-size-tip) { |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .merchant-parking-address-actions { |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .equity-upload-row .el-button { |
| | |
| | | |
| | | .movie-ticket-record-tools { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | /* 只剩"下载"一个按钮,靠右对齐(原来左边是"补录发放",该功能已下线)。 */ |
| | | justify-content: flex-end; |
| | | padding: 18px 0 16px; |
| | | } |
| | | |
| | |
| | | padding: 18px 0 16px; |
| | | } |
| | | |
| | | .movie-ticket-code-pool-tools { |
| | | justify-content: flex-start; |
| | | gap: 12px; |
| | | } |
| | | |
| | | .movie-ticket-code-pool-filters { |
| | | container-type: inline-size; |
| | | container-name: movie-ticket-code-pool; |
| | | min-width: 0; |
| | | } |
| | | |
| | | .movie-ticket-code-pool-filter-form .el-form-item, |
| | | .movie-ticket-code-pool-filter-form .el-form-item__content { |
| | | min-width: 0; |
| | | } |
| | | |
| | | @container movie-ticket-code-pool (max-width: 1311px) { |
| | | .movie-ticket-code-pool-filter-form { |
| | | grid-template-columns: repeat(2, minmax(0, 1fr)) 80px; |
| | | } |
| | | |
| | | .movie-ticket-code-pool-filter-form .movie-ticket-package-filter-actions { |
| | | grid-column: 3; |
| | | } |
| | | } |
| | | |
| | | @container movie-ticket-code-pool (max-width: 620px) { |
| | | .movie-ticket-code-pool-filter-form { |
| | | grid-template-columns: minmax(0, 1fr); |
| | | } |
| | | |
| | | .movie-ticket-code-pool-filter-form .movie-ticket-package-filter-actions { |
| | | grid-column: 1; |
| | | grid-row: auto; |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | } |
| | | } |
| | | |
| | | .movie-ticket-package-table { |
| | | color: #111827; |
| | | font-size: 12px; |
| | |
| | | |
| | | .movie-ticket-create-row { |
| | | display: grid; |
| | | grid-template-columns: 58px minmax(180px, 600px) 36px 180px 86px; |
| | | grid-template-columns: 58px 544px 36px 180px 86px; |
| | | gap: 12px; |
| | | align-items: center; |
| | | color: #111827; |
| | |
| | | grid-template-columns: 58px 180px 20px 180px 36px 80px; |
| | | } |
| | | |
| | | .movie-ticket-cover-row { |
| | | display: grid; |
| | | grid-template-columns: 58px 160px; |
| | | align-items: start; |
| | | gap: 12px; |
| | | margin-top: 18px; |
| | | color: #111827; |
| | | font-size: 13px; |
| | | } |
| | | |
| | | .movie-ticket-cover-upload { |
| | | display: block; |
| | | width: 160px; |
| | | height: 90px; |
| | | } |
| | | |
| | | .movie-ticket-cover-upload .el-upload { |
| | | display: block; |
| | | width: 160px; |
| | | height: 90px; |
| | | } |
| | | |
| | | .movie-ticket-cover-preview, |
| | | .movie-ticket-cover-placeholder { |
| | | display: flex; |
| | | width: 160px; |
| | | height: 90px; |
| | | overflow: hidden; |
| | | border: 1px dashed #cbd5e1; |
| | | border-radius: 4px; |
| | | background: #f8fafc; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .movie-ticket-cover-preview { |
| | | border-style: solid; |
| | | object-fit: cover; |
| | | } |
| | | |
| | | .movie-ticket-cover-placeholder { |
| | | flex-direction: column; |
| | | align-items: center; |
| | | justify-content: center; |
| | | color: #94a3b8; |
| | | } |
| | | |
| | | .movie-ticket-cover-placeholder > span { |
| | | font-size: 26px; |
| | | line-height: 28px; |
| | | } |
| | | |
| | | .movie-ticket-cover-placeholder small { |
| | | margin-top: 3px; |
| | | font-size: 12px; |
| | | } |
| | | |
| | | .movie-ticket-merchant-row .el-select, |
| | | .movie-ticket-valid-row .el-input, |
| | | .movie-ticket-valid-row .el-select { |