diff --git a/src/assets/images/home.png b/src/assets/images/home.png
new file mode 100644
index 0000000..0c42b84
Binary files /dev/null and b/src/assets/images/home.png differ
diff --git a/src/components/ant_override.less b/src/components/ant_override.less
index 6e9aa5d..a15c56e 100644
--- a/src/components/ant_override.less
+++ b/src/components/ant_override.less
@@ -1,86 +1,271 @@
-.ant-table-thead>tr>th {
- border-bottom: none !important;
- padding: 6px 6px;
- background: #ECF2F9 !important;
- color: #333 !important;
- font-weight: 600 !important;
+/* Global Ant Design Overrides for Dashboard/Big Screen */
- &::before {
- width: 0 !important;
- }
+// ==============================================================================
+// 1. Table Component
+// ==============================================================================
+.ant-table-wrapper {
+ .ant-table {
+ background: transparent !important;
+ color: #fff;
- /*&:first-child {
- border-top-left-radius: 16px !important;
- }
+ // Header Styles
+ .ant-table-thead > tr > th {
+ background: rgba(21, 60, 102, 0.9) !important; // Dark Blue Header
+ color: #fff !important;
+ font-weight: bold;
+ border-bottom: 1px solid rgba(0, 160, 233, 0.3);
+ padding: 12px 16px;
+ }
- &:last-child {
- border-top-right-radius: 16px !important;
- }*/
-}
+ // Body Styles
+ .ant-table-tbody > tr > td {
+ background: rgba(0, 20, 50, 0.3) !important; // Semi-transparent dark
+ color: #fff !important;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+
+ // Hover effect
+ &.ant-table-cell-row-hover {
+ background: rgba(0, 160, 233, 0.2) !important;
+ }
+ }
-.ant-table {
- background: transparent !important;
-}
+ // Hover row global
+ .ant-table-tbody > tr:hover > td {
+ background: rgba(0, 160, 233, 0.2) !important;
+ }
-.ant-table-tbody>tr>td {
- //border-bottom: none !important;
- background: #fff;
- //box-shadow: 3px 2px 3px 2px #E8ECF1;
- padding: 6px 6px;
-
- /* &:first-child {
- border-top-left-radius: 8px;
- border-bottom-left-radius: 8px;
- }
-
- &:last-child {
- border-top-right-radius: 8px;
- border-bottom-right-radius: 8px;
- }*/
-}
-
-.ant-table table,.ant-table.ant-table-bordered > .ant-table-container,
-.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > tbody > tr > td{
- //border-spacing: 0 8px !important;
- //border:0;
-}
-
-
-.ant-radio-group {
- .ant-radio-button-wrapper:first-child {
- // border-radius: 8px 0 0 8px !important
- }
-
- .ant-radio-button-wrapper:last-child {
- // border-radius: 0 8px 8px 0 !important
- }
-
- .ant-radio-button-wrapper {
- border: 1px solid @primary-color !important;
-
- &:hover {
- background-color: #D9EBFF;
+ // Empty Data
+ .ant-empty-description {
+ color: rgba(255, 255, 255, 0.5);
}
}
- .ant-radio-button-wrapper {
- color: #3B7CFF;
+ // Pagination
+ .ant-pagination {
+ .ant-pagination-item {
+ background: transparent;
+ border-color: rgba(255, 255, 255, 0.3);
+ a { color: #fff; }
+ &-active {
+ border-color: #3b7cff;
+ background: rgba(59, 124, 255, 0.2);
+ a { color: #3b7cff; }
+ }
+ }
+ .ant-pagination-prev, .ant-pagination-next {
+ .ant-pagination-item-link {
+ background: transparent;
+ border-color: rgba(255, 255, 255, 0.3);
+ color: #fff;
+ }
+ }
}
}
-.ant-checkbox-checked {
- .ant-checkbox-inner {
- background-color: #3b7cff !important;
+// ==============================================================================
+// 2. Input / InputNumber / TextArea Component
+// ==============================================================================
+.ant-input, .ant-input-number, .ant-input-affix-wrapper {
+ background-color: transparent !important;
+ border: 1px solid rgba(59, 124, 255, 0.6) !important; // Blueish border
+ color: #fff !important;
+ border-radius: 4px;
+
+ &:hover, &:focus, &-focused {
+ border-color: #3b7cff !important;
+ box-shadow: 0 0 5px rgba(59, 124, 255, 0.5);
+ }
+
+ // Placeholder color
+ &::placeholder {
+ color: rgba(255, 255, 255, 0.4);
+ }
+
+ // Input Number specific
+ &.ant-input-number {
+ .ant-input-number-handler-wrap {
+ background: rgba(255, 255, 255, 0.1);
+ .ant-input-number-handler {
+ border-left: 1px solid rgba(255, 255, 255, 0.2);
+ .anticon { color: #fff; }
+ }
+ }
+ .ant-input-number-input {
+ color: #fff;
+ }
+ }
+
+ // Affix wrapper (e.g. search icon)
+ .ant-input-prefix, .ant-input-suffix {
+ color: rgba(255, 255, 255, 0.6);
+ }
+}
+
+// ==============================================================================
+// 3. Select / DatePicker / RangePicker / TimePicker
+// ==============================================================================
+// Common Input Styles
+.ant-select-selector, .ant-picker {
+ background-color: transparent !important;
+ border: 1px solid rgba(59, 124, 255, 0.6) !important;
+ color: #fff !important;
+ border-radius: 4px;
+
+ &:hover {
border-color: #3b7cff !important;
}
+}
- &::after {
- border: none !important;
+// Select Specific
+.ant-select {
+ color: #fff;
+
+ .ant-select-arrow {
+ color: #fff;
+ }
+
+ .ant-select-clear {
+ background: transparent;
+ color: #fff;
+ }
+
+ &:not(.ant-select-disabled):hover .ant-select-selector {
+ border-color: #3b7cff !important;
}
}
-.ant-checkbox-inner {
- border-radius: 4px !important;
- border-width: 1.4px !important;
- border-color: #C7CBD3 !important;
-}
\ No newline at end of file
+// Dropdowns (Select, DatePicker, etc.)
+.ant-select-dropdown, .ant-picker-dropdown {
+ background-color: rgba(0, 20, 50, 0.95) !important;
+ border: 1px solid rgba(0, 160, 233, 0.3);
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
+
+ // Select Options
+ .ant-select-item {
+ color: #fff;
+ &-option-active, &-option-selected {
+ background-color: rgba(0, 160, 233, 0.3) !important;
+ }
+ }
+
+ // Picker Panels
+ .ant-picker-panel-container {
+ background: transparent;
+ }
+
+ .ant-picker-header {
+ color: #fff;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+ button { color: #fff; }
+ }
+
+ .ant-picker-content {
+ th { color: #fff; }
+ td { color: rgba(255, 255, 255, 0.8); }
+ }
+
+ .ant-picker-cell {
+ &:hover .ant-picker-cell-inner {
+ background: rgba(0, 160, 233, 0.3);
+ }
+ &-in-view {
+ color: #fff;
+ }
+ &-selected .ant-picker-cell-inner {
+ background: #3b7cff !important;
+ }
+ }
+
+ // Footer/Ranges
+ .ant-picker-footer {
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
+ }
+ .ant-picker-ranges .ant-picker-preset > .ant-tag-blue {
+ color: #3b7cff;
+ background: rgba(59, 124, 255, 0.2);
+ border-color: #3b7cff;
+ }
+}
+
+// Picker Text Color fix
+.ant-picker-input > input {
+ color: #fff !important;
+ &::placeholder {
+ color: rgba(255, 255, 255, 0.4);
+ }
+}
+.ant-picker-suffix {
+ color: #fff;
+}
+.ant-picker-range-separator .ant-picker-separator {
+ color: #fff;
+}
+
+// ==============================================================================
+// 4. Button Component
+// ==============================================================================
+.ant-btn {
+ border-radius: 4px;
+
+ // Primary Button (Blue)
+ &.ant-btn-primary {
+ background: #3b7cff; // Solid blue
+ border-color: #3b7cff;
+ color: #fff;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+
+ &:hover, &:focus {
+ background: #5d91ff;
+ border-color: #5d91ff;
+ }
+ }
+
+ // Default Button (Transparent/Ghost)
+ &:not(.ant-btn-primary):not(.ant-btn-link):not(.ant-btn-text) {
+ background: transparent;
+ border: 1px solid #3b7cff;
+ color: #3b7cff;
+
+ &:hover {
+ color: #5d91ff;
+ border-color: #5d91ff;
+ }
+ }
+}
+
+// ==============================================================================
+// 5. Radio Component
+// ==============================================================================
+.ant-radio-wrapper {
+ color: #fff; // Label text color
+ margin-right: 16px;
+
+ &:hover .ant-radio-inner {
+ border-color: #3b7cff;
+ }
+
+ .ant-radio-inner {
+ background-color: transparent;
+ border-color: rgba(255, 255, 255, 0.6);
+
+ &::after {
+ background-color: #3b7cff; // Dot color
+ }
+ }
+
+ .ant-radio-checked {
+ .ant-radio-inner {
+ border-color: #3b7cff;
+ &::after {
+ background-color: #3b7cff;
+ }
+ }
+ }
+}
+
+// Radio Group (Button Style)
+.ant-radio-group-solid .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
+ background: #3b7cff;
+ border-color: #3b7cff;
+ color: #fff;
+}
diff --git a/src/views/Home/components/Business/SiGuan/index.js b/src/views/Home/components/Business/SiGuan/index.js
index 5910581..4d845b6 100644
--- a/src/views/Home/components/Business/SiGuan/index.js
+++ b/src/views/Home/components/Business/SiGuan/index.js
@@ -18,7 +18,7 @@ const SiGuan = () => {