| | |
| | | --vc-menu-sub-font-color: #545761; |
| | | --vc-menu-sub-bg-active-color: #EAF0FE; |
| | | --vc-menu-sub-active-font-color: #3E77FC; |
| | | --vc-menu-sub-title-font-color: #4F525C; |
| | | --vc-menu-sub-title-font-color: #404357; |
| | | --vc-menu-sub-footer: #F6F6F7; |
| | | --vc-nav-bg: #1D1F2D; |
| | | --vc-nav-color: #888888; |
| | |
| | | } |
| | | |
| | | .border-bottom { |
| | | border-bottom: 1px solid #e7eaec !important; |
| | | border-bottom: 1px solid #e7eaec; |
| | | } |
| | | |
| | | .border-radius { |
| | |
| | | |
| | | .vc-nav ul li.active { |
| | | color: var(--vc-nav-active-color); |
| | | border-bottom: 2px solid var(--vc-nav-active-color) !important; |
| | | border-bottom: 2px solid var(--vc-nav-active-color); |
| | | } |
| | | |
| | | .vc-main .vc-main-content { |
| | |
| | | overflow: hidden; |
| | | overflow-x: scroll; |
| | | } |
| | | .table-scroll{ |
| | | overflow-y: scroll !important; |
| | | |
| | | .table-scroll { |
| | | overflow-y: scroll; |
| | | } |
| | | |
| | | .hc-table-div::-webkit-scrollbar { |
| | |
| | | |
| | | .simplify-acceptance .form-group { |
| | | margin-bottom: 0px; |
| | | } |
| | | |
| | | /* community add page */ |
| | | .community-add { |
| | | font-family: Arial, sans-serif; |
| | | margin: 20px; |
| | | line-height: 1.6; |
| | | } |
| | | |
| | | .community-add .form-group p { |
| | | margin-top: 15px; |
| | | } |
| | | |
| | | .community-add .page-title { |
| | | font-size: 18px; |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | .community-add .section { |
| | | margin-bottom: 30px; |
| | | padding: 15px; |
| | | border: 1px solid #eee; |
| | | border-radius: 6px; |
| | | } |
| | | |
| | | .community-add .section h3 { |
| | | color: #404357; |
| | | margin: 0 0 15px; |
| | | padding-bottom: 8px; |
| | | border-bottom: 1px solid #ddd; |
| | | font-size: 20px; |
| | | } |
| | | |
| | | .community-add .form-group { |
| | | margin-bottom: 12px; |
| | | display: flex; |
| | | align-items: center; |
| | | flex-wrap: wrap; |
| | | gap: 15px; |
| | | } |
| | | |
| | | .community-add .form-group label { |
| | | margin: 0; |
| | | padding: 0; |
| | | align-items: center; |
| | | text-align: right; |
| | | min-width: 100px; |
| | | /* color: #000; */ |
| | | font-weight: 900; |
| | | color: #404357; |
| | | |
| | | } |
| | | |
| | | .community-add .form-group input, |
| | | .community-add .form-group select { |
| | | padding: 4px 8px; |
| | | border: 1px solid #ccc; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .community-add .radio-group, |
| | | .community-add .checkbox-group { |
| | | display: flex; |
| | | align-items: center; |
| | | /* gap: 10px; */ |
| | | } |
| | | |
| | | .community-add .sub-title { |
| | | font-size: 14px; |
| | | font-weight: bold; |
| | | margin: 10px 0 5px; |
| | | color: #404357; |
| | | } |
| | | |
| | | .community-add .detail-note { |
| | | font-size: 12px; |
| | | color: #666; |
| | | margin-top: 5px; |
| | | } |
| | | |
| | | .community-add .btn-group { |
| | | position: relative; |
| | | left: 80%; |
| | | transform: translateX(-60%); |
| | | margin-top: 20px; |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | width: 600px; |
| | | } |
| | | |
| | | .community-add .btn { |
| | | padding: 6px 12px; |
| | | border: none; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | margin-right: 10px; |
| | | width: 80px; |
| | | } |
| | | |
| | | .community-add .btn-reset { |
| | | background: #f5f5f5; |
| | | border: 1px solid #ccc; |
| | | } |
| | | |
| | | .community-add .btn-close { |
| | | background: #e9ecef; |
| | | } |
| | | |
| | | .community-add .btn-submit { |
| | | background: #007bff; |
| | | color: white; |
| | | } |
| | | |
| | | .community-add input.error, |
| | | .community-add select.error { |
| | | border-color: #dc3545; |
| | | background-color: #fff5f5; |
| | | box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25); |
| | | } |
| | | |
| | | .community-add input.error:focus, |
| | | .community-add select.error:focus { |
| | | border-color: #dc3545; |
| | | box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25); |
| | | } |
| | | |
| | | .cost-detail-container { |
| | | width: 98%; |
| | | margin: 20px auto; |
| | | font-family: "微软雅黑", sans-serif; |
| | | background: transparent; |
| | | padding: 0; |
| | | } |
| | | |
| | | .cost-detail-container * { |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .cost-detail-container h2 { |
| | | margin-bottom: 20px; |
| | | color: #333; |
| | | font-size: 18px; |
| | | font-weight: 600; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar { |
| | | margin-bottom: 15px; |
| | | padding: 15px; |
| | | background: #f5f5f5; |
| | | border-radius: 4px; |
| | | display: flex; |
| | | align-items: center; |
| | | flex-wrap: wrap; |
| | | gap: 12px; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar div { |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 8px; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar label { |
| | | position: relative; |
| | | top: 4px; |
| | | font-size: 14px; |
| | | color: #333; |
| | | white-space: nowrap; |
| | | font-weight: 500; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar input, |
| | | .cost-detail-container .search-bar select { |
| | | padding: 0 12px; |
| | | border: 1px solid #d9d9d9; |
| | | border-radius: 4px; |
| | | font-size: 14px; |
| | | height: 32px; |
| | | min-width: 150px; |
| | | background: #fff; |
| | | line-height: 32px; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar .queryDate { |
| | | position: relative; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar input:focus, |
| | | .cost-detail-container .search-bar select:focus { |
| | | outline: none; |
| | | border-color: #1677ff; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar button { |
| | | padding: 6px 16px; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | font-size: 14px; |
| | | height: 32px; |
| | | transition: all 0.3s; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar .query-btn { |
| | | background: #1677ff; |
| | | color: #fff; |
| | | border: 1px solid #1677ff; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar .query-btn:hover { |
| | | background: #4096ff; |
| | | color: #fff; |
| | | border-color: #4096ff; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar .reset-btn { |
| | | background: #fff; |
| | | color: #666; |
| | | border: 1px solid #d9d9d9; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar .reset-btn:hover { |
| | | color: #333; |
| | | border-color: #bfbfbf; |
| | | } |
| | | |
| | | .cost-detail-container .search-bar .action-buttons { |
| | | margin-left: auto; |
| | | display: flex; |
| | | gap: 12px; |
| | | } |
| | | |
| | | .cost-detail-container .action-buttons button { |
| | | padding: 6px 16px; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | font-size: 14px; |
| | | height: 32px; |
| | | transition: all 0.3s; |
| | | } |
| | | |
| | | .cost-detail-container .action-buttons .add-btn, |
| | | .cost-detail-container .action-buttons .import-btn { |
| | | background: #1677ff; |
| | | color: #fff; |
| | | border: 1px solid #1677ff; |
| | | } |
| | | |
| | | .cost-detail-container .action-buttons .add-btn:hover, |
| | | .cost-detail-container .action-buttons .import-btn:hover { |
| | | background: #4096ff; |
| | | } |
| | | |
| | | .cost-detail-container table { |
| | | width: 100%; |
| | | border-collapse: collapse; |
| | | border: 1px solid #e8e8e8; |
| | | font-size: 12px; |
| | | background: #fff; |
| | | margin-bottom: 0; |
| | | } |
| | | |
| | | .cost-detail-container table th, |
| | | .cost-detail-container table td { |
| | | padding: 12px; |
| | | border: 1px solid #e8e8e8; |
| | | text-align: center; |
| | | } |
| | | |
| | | .cost-detail-container table th { |
| | | background: #f5f5f5; |
| | | font-weight: 600; |
| | | white-space: nowrap; |
| | | color: #333; |
| | | text-align: center; |
| | | } |
| | | |
| | | .cost-detail-container table td { |
| | | color: #333; |
| | | text-align: center; |
| | | } |
| | | |
| | | .cost-detail-container table tbody tr { |
| | | background: #fff; |
| | | } |
| | | |
| | | .cost-detail-container table tbody tr:hover { |
| | | background: #f5f5f5; |
| | | } |
| | | |
| | | .cost-detail-container table td a { |
| | | color: #1677ff; |
| | | text-decoration: none; |
| | | margin-right: 10px; |
| | | cursor: pointer; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .cost-detail-container table td a:hover { |
| | | text-decoration: underline; |
| | | color: #4096ff; |
| | | } |
| | | |
| | | .cost-detail-container table td a:last-child { |
| | | margin-right: 0; |
| | | } |
| | | |
| | | .cost-detail-container .pagination { |
| | | margin-top: 20px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | font-size: 14px; |
| | | color: #333; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .pagination-info { |
| | | color: #666; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .pagination-controls { |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 8px; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-size-select { |
| | | padding: 4px 8px; |
| | | border: 1px solid #d9d9d9; |
| | | border-radius: 4px; |
| | | font-size: 14px; |
| | | height: 32px; |
| | | width: 60px; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-size-label, |
| | | .cost-detail-container .pagination .jump-label, |
| | | .cost-detail-container .pagination .page-label { |
| | | color: #666; |
| | | margin: 0 4px; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-btn { |
| | | padding: 4px 8px; |
| | | border: 1px solid #d9d9d9; |
| | | background: #fff; |
| | | cursor: pointer; |
| | | font-size: 14px; |
| | | min-width: 32px; |
| | | height: 32px; |
| | | border-radius: 4px; |
| | | transition: all 0.3s; |
| | | color: #333; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-btn:hover:not(:disabled) { |
| | | color: #1677ff; |
| | | border-color: #1677ff; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-btn:disabled { |
| | | opacity: 0.5; |
| | | cursor: not-allowed; |
| | | background: #f5f5f5; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-btn.active { |
| | | background: #1677ff; |
| | | color: #fff; |
| | | border-color: #1677ff; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-ellipsis { |
| | | color: #666; |
| | | padding: 0 4px; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .jump-input { |
| | | width: 50px; |
| | | padding: 4px 8px; |
| | | text-align: center; |
| | | border: 1px solid #d9d9d9; |
| | | border-radius: 4px; |
| | | font-size: 14px; |
| | | height: 32px; |
| | | margin: 0 4px; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .jump-input:focus { |
| | | outline: none; |
| | | border-color: #1677ff; |
| | | } |
| | | |
| | | .cost-detail-container .action-buttons .add-btn i { |
| | | margin-right: 4px; |
| | | } |
| | | |
| | | .cost-detail-container .pagination .page-btn[disabled] { |
| | | background-color: #f5f5f5; |
| | | border-color: #d9d9d9; |
| | | color: rgba(0, 0, 0, 0.25); |
| | | } |
| | | |
| | | @media (max-width: 1200px) { |
| | | .cost-detail-container { |
| | | width: 95%; |
| | | overflow-x: auto; |
| | | } |
| | | |
| | | .cost-detail-container table { |
| | | min-width: 1400px; |
| | | } |
| | | } |
| | | |
| | | #costDetailTableHead th { |
| | | background-color: rgb(233, 243, 255); |
| | | } |
| | | |
| | | .form-container { |
| | | margin: 20px; |
| | | font-family: "微软雅黑", Arial, sans-serif; |
| | | } |
| | | |
| | | .form-row { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 18px; |
| | | gap: 15px; |
| | | } |
| | | |
| | | .form-label { |
| | | width: 85px; |
| | | text-align: right; |
| | | padding-top: 8px; |
| | | } |
| | | |
| | | .form-input { |
| | | padding: 6px; |
| | | width: 220px; |
| | | border: 1px solid #ddd; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .form-note { |
| | | color: red; |
| | | font-size: 12px; |
| | | } |
| | | |
| | | .form-container .radio-group { |
| | | display: flex; |
| | | gap: 12px; |
| | | } |
| | | |
| | | .form-container select { |
| | | padding: 6px; |
| | | width: 100px; |
| | | border: 1px solid #ddd; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .multi-select-wrapper { |
| | | position: relative; |
| | | display: inline-block; |
| | | width: 220px; |
| | | vertical-align: middle; |
| | | } |
| | | |
| | | .multi-select-input { |
| | | position: relative; |
| | | top: 12px; |
| | | display: flex; |
| | | align-items: center; |
| | | padding: 6px 30px 6px 6px; |
| | | border: 1px solid #ddd; |
| | | border-radius: 4px; |
| | | background-color: #fff; |
| | | cursor: pointer; |
| | | min-height: 32px; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .multi-select-input:hover { |
| | | border-color: #1ab394; |
| | | } |
| | | |
| | | .multi-select-input.active { |
| | | border-color: #1ab394; |
| | | box-shadow: 0 0 0 2px rgba(26, 179, 148, 0.1); |
| | | } |
| | | |
| | | .multi-select-tags { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | gap: 4px; |
| | | flex: 1; |
| | | align-items: center; |
| | | } |
| | | |
| | | .multi-select-tag { |
| | | display: inline-flex; |
| | | align-items: center; |
| | | padding: 2px 6px; |
| | | background-color: #f0f0f0; |
| | | border: 1px solid #ddd; |
| | | border-radius: 3px; |
| | | font-size: 12px; |
| | | color: #333; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .multi-select-tag-close { |
| | | margin-left: 4px; |
| | | cursor: pointer; |
| | | color: #999; |
| | | font-size: 14px; |
| | | line-height: 1; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .multi-select-tag-close:hover { |
| | | color: #ed5565; |
| | | } |
| | | |
| | | .multi-select-placeholder { |
| | | color: #999; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .multi-select-arrow { |
| | | position: absolute; |
| | | right: 8px; |
| | | top: 50%; |
| | | transform: translateY(-50%); |
| | | color: #666; |
| | | font-size: 12px; |
| | | pointer-events: none; |
| | | transition: transform 0.2s; |
| | | } |
| | | |
| | | .multi-select-input.active .multi-select-arrow { |
| | | transform: translateY(-50%) rotate(180deg); |
| | | } |
| | | |
| | | .multi-select-dropdown { |
| | | position: absolute; |
| | | top: 110%; |
| | | left: 0; |
| | | right: 0; |
| | | margin-top: 4px; |
| | | background-color: #fff; |
| | | border: 1px solid #ddd; |
| | | border-radius: 4px; |
| | | box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); |
| | | z-index: 1000; |
| | | max-height: 300px; |
| | | overflow-y: auto; |
| | | } |
| | | |
| | | .multi-select-option { |
| | | |
| | | display: flex; |
| | | align-items: center; |
| | | padding: 8px 12px; |
| | | cursor: pointer; |
| | | transition: background-color 0.2s; |
| | | } |
| | | |
| | | .multi-select-option:hover { |
| | | background-color: #f5f5f5; |
| | | } |
| | | |
| | | .multi-select-option input[type="checkbox"] { |
| | | margin-right: 8px; |
| | | cursor: pointer; |
| | | width: 16px; |
| | | height: 16px; |
| | | } |
| | | |
| | | .multi-select-option label { |
| | | cursor: pointer; |
| | | flex: 1; |
| | | margin: 0; |
| | | font-size: 14px; |
| | | color: #333; |
| | | } |
| | | |
| | | .form-container .btn-group { |
| | | margin-left: 95px; |
| | | margin-top: 25px; |
| | | } |
| | | |
| | | .form-container .btn-cancel { |
| | | background-color: #0d6efd; |
| | | color: white; |
| | | border: none; |
| | | padding: 8px 18px; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | margin-right: 12px; |
| | | } |
| | | |
| | | .form-container .btn-save { |
| | | background-color: #0d6efd; |
| | | color: white; |
| | | border: none; |
| | | padding: 8px 18px; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .form-container .form-row .form-label { |
| | | padding: 12px 0 15px 0; |
| | | margin: 0px; |
| | | font-size: 14px; |
| | | font-weight: 600; |
| | | color: #333; |
| | | text-align: right; |
| | | vertical-align: middle; |
| | | line-height: 32px; |
| | | } |
| | | |
| | | .form-label-detail { |
| | | padding: 0px 0 15px 0; |
| | | margin: 0px; |
| | | font-size: 14px; |
| | | font-weight: 600; |
| | | color: #333; |
| | | text-align: right; |
| | | vertical-align: middle; |
| | | line-height: 32px; |
| | | } |
| | | |
| | | .form-container .form-row p { |
| | | margin-right: 15px; |
| | | } |
| | | |
| | | #ownerScope { |
| | | position: relative; |
| | | top: 12px; |
| | | width: 180px; |
| | | height: 32px; |
| | | } |
| | | |
| | | #buildingScope { |
| | | position: relative; |
| | | top: 12px; |
| | | width: 180px; |
| | | height: 32px; |
| | | } |
| | | |
| | | #button-container, |
| | | #data-container { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | gap: 10px; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | #button-container .role-a-checkbox, |
| | | #data-container .role-a-checkbox { |
| | | flex: 0 0 calc((100% - 70px) / 8); |
| | | min-width: 0; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | @media (max-width: 1400px) { |
| | | |
| | | #button-container .role-a-checkbox, |
| | | #data-container .role-a-checkbox { |
| | | flex: 0 0 calc((100% - 60px) / 7); |
| | | } |
| | | } |
| | | |
| | | @media (max-width: 1200px) { |
| | | |
| | | #button-container .role-a-checkbox, |
| | | #data-container .role-a-checkbox { |
| | | flex: 0 0 calc((100% - 50px) / 6); |
| | | } |
| | | } |
| | | |
| | | @media (max-width: 992px) { |
| | | |
| | | #button-container .role-a-checkbox, |
| | | #data-container .role-a-checkbox { |
| | | flex: 0 0 calc((100% - 40px) / 5); |
| | | } |
| | | } |
| | | |
| | | @media (max-width: 768px) { |
| | | |
| | | #button-container .role-a-checkbox, |
| | | #data-container .role-a-checkbox { |
| | | flex: 0 0 calc((100% - 20px) / 2); |
| | | } |
| | | } |
| | | |
| | | .role-a-checkbox label { |
| | | padding-top: 5px; |
| | | } |
| | | |
| | | .cost-detail-container .action-buttons .download-btn { |
| | | border: 1px solid #1677ff; |
| | | background: #fff; |
| | | color: #1677ff; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-form-group { |
| | | display: flex; |
| | | align-items: center; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-form-label { |
| | | text-align: right; |
| | | margin-right: 20px; |
| | | min-width: 120px; |
| | | font-weight: normal; |
| | | color: #333; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-input-wrapper { |
| | | display: flex; |
| | | align-items: center; |
| | | flex: 1; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-input { |
| | | flex: 1; |
| | | margin: 0; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-input-unit { |
| | | margin-left: 10px; |
| | | color: #333; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-radio-group { |
| | | display: flex; |
| | | align-items: center; |
| | | flex: 1; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-radio-label { |
| | | margin: 0 20px 0 0; |
| | | padding: 0; |
| | | font-weight: normal; |
| | | cursor: pointer; |
| | | display: inline-flex; |
| | | align-items: center; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-radio-label:last-child { |
| | | margin-right: 0; |
| | | } |
| | | |
| | | .edit-public-income-modal .edit-radio-label input[type="radio"] { |
| | | margin-right: 5px; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | #editPublicIncomeModal { |
| | | display: flex !important; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | |
| | | #editPublicIncomeModal .modal-dialog { |
| | | margin: 0; |
| | | position: relative; |
| | | width: auto; |
| | | } |