diff --git a/src/layouts/components/Header.vue b/src/layouts/components/Header.vue
index 07917f9..2d69a17 100644
--- a/src/layouts/components/Header.vue
+++ b/src/layouts/components/Header.vue
@@ -33,7 +33,7 @@
-
+
@@ -165,6 +165,10 @@ const navToHelper = () => {
top: 0;
z-index: 1001;
+ :deep(.t-head-menu__inner) {
+ padding-right: var(--td-comp-margin-xl);
+ }
+
&-side {
left: 232px;
right: 0;
@@ -188,14 +192,12 @@ const navToHelper = () => {
:deep(.t-menu__item) {
min-width: unset;
- padding: 0px 16px;
}
}
.operations-container {
display: flex;
align-items: center;
- margin-right: 12px;
.t-popup__reference {
display: flex;
@@ -204,29 +206,15 @@ const navToHelper = () => {
}
.t-button {
- margin: 0 8px;
- &.header-user-btn {
- margin: 0;
- }
- }
-
- .t-icon {
- font-size: 20px;
- &.general {
- margin-right: 16px;
- }
+ margin-left: var(--td-comp-margin-l);
}
}
.header-operate-left {
display: flex;
- margin-left: 20px;
align-items: normal;
line-height: 0;
-
- .collapsed-icon {
- font-size: 20px;
- }
+ padding-left: var(--td-comp-margin-xl);
}
.header-logo-container {
@@ -253,14 +241,10 @@ const navToHelper = () => {
display: inline-flex;
align-items: center;
color: var(--td-text-color-primary);
- .t-icon {
- margin-left: 4px;
- font-size: 16px;
- }
}
:deep(.t-head-menu__inner) {
- border-bottom: 1px solid var(--td-border-level-1-color);
+ border-bottom: 1px solid var(--td-component-stroke);
}
.t-menu--light {
@@ -275,12 +259,6 @@ const navToHelper = () => {
.header-user-account {
color: rgba(255, 255, 255, 0.55);
}
- .t-button {
- --ripple-color: var(--td-gray-color-10) !important;
- &:hover {
- background: var(--td-gray-color-12) !important;
- }
- }
}
.operations-dropdown-container-item {
@@ -288,20 +266,14 @@ const navToHelper = () => {
display: flex;
align-items: center;
- .t-icon {
- margin-right: 8px;
+ :deep(.t-dropdown__item-text) {
+ display: flex;
+ align-items: center;
}
- :deep(.t-dropdown__item) {
- .t-dropdown__item__content {
- display: flex;
- justify-content: center;
- }
- .t-dropdown__item__content__text {
- display: flex;
- align-items: center;
- font-size: 14px;
- }
+ .t-icon {
+ font-size: var(--td-comp-size-xxxs);
+ margin-right: var(--td-comp-margin-s);
}
:deep(.t-dropdown__item) {
@@ -315,3 +287,13 @@ const navToHelper = () => {
}
}
+
+
+
diff --git a/src/layouts/components/Notice.vue b/src/layouts/components/Notice.vue
index 1a9b832..877e7c3 100644
--- a/src/layouts/components/Notice.vue
+++ b/src/layouts/components/Notice.vue
@@ -37,7 +37,7 @@
-
+
@@ -190,15 +190,4 @@ const goDetail = () => {
}
}
}
-
-.t-button {
- margin: 0 8px;
-
- .t-icon {
- font-size: 20px;
- &.general {
- margin-right: 16px;
- }
- }
-}
diff --git a/src/layouts/components/Search.vue b/src/layouts/components/Search.vue
index f593893..6e174dd 100644
--- a/src/layouts/components/Search.vue
+++ b/src/layouts/components/Search.vue
@@ -57,16 +57,10 @@ const changeSearchFocus = (value: boolean) => {
display: flex;
margin-left: 16px;
.hover-active {
- .t-input__inner {
- background: var(--td-bg-color-secondarycontainer);
- }
- .t-icon {
- color: var(--td-brand-color) !important;
- }
+ background: var(--td-bg-color-secondarycontainer);
}
.t-icon {
- font-size: 20px !important;
color: var(--td-text-color-primary) !important;
}
.header-search {
diff --git a/src/layouts/setting.vue b/src/layouts/setting.vue
index a0f07ea..d79a93c 100644
--- a/src/layouts/setting.vue
+++ b/src/layouts/setting.vue
@@ -319,7 +319,7 @@ watchEffect(() => {
max-height: 78px;
padding: 8px;
border-radius: var(--td-radius-default);
- border: 2px solid #e3e6eb;
+ border: 2px solid var(--td-component-border);
> .t-radio-button__label {
display: inline-flex;
}
diff --git a/src/pages/dashboard/base/components/MiddleChart.vue b/src/pages/dashboard/base/components/MiddleChart.vue
index b229d81..48f2f53 100644
--- a/src/pages/dashboard/base/components/MiddleChart.vue
+++ b/src/pages/dashboard/base/components/MiddleChart.vue
@@ -176,15 +176,20 @@ const onCurrencyChange = (checkedValues: string[]) => {
diff --git a/src/pages/dashboard/base/components/OutputOverview.vue b/src/pages/dashboard/base/components/OutputOverview.vue
index e381bb0..a7fcf76 100644
--- a/src/pages/dashboard/base/components/OutputOverview.vue
+++ b/src/pages/dashboard/base/components/OutputOverview.vue
@@ -155,14 +155,23 @@ const onStokeDataChange = (checkedValues: string[]) => {
diff --git a/src/pages/dashboard/detail/index.vue b/src/pages/dashboard/detail/index.vue
index ea470a6..27b3606 100644
--- a/src/pages/dashboard/detail/index.vue
+++ b/src/pages/dashboard/detail/index.vue
@@ -169,11 +169,20 @@ const onMaterialChange = (value: string[]) => {
// 统一增加8px;
.dashboard-detail-card {
- padding: 8px;
+ padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl);
+
+ :deep(.t-card__header) {
+ padding: 0;
+ }
:deep(.t-card__title) {
- font-size: 20px;
- font-weight: 500;
+ font: var(--td-font-title-large);
+ font-weight: 400;
+ }
+
+ :deep(.t-card__body) {
+ padding: 0;
+ margin-top: var(--td-comp-margin-xxl);
}
:deep(.t-card__actions) {
@@ -186,11 +195,10 @@ const onMaterialChange = (value: string[]) => {
display: flex;
flex-direction: column;
flex: 1;
- height: 170px;
- padding: 8px;
+ padding: var(--td-comp-paddingTB-xl) var(--td-comp-paddingLR-xl);
- :deep(.t-card__header) {
- padding-bottom: 8px;
+ :deep(.t-card__description) {
+ margin: 0;
}
:deep(.t-card__body) {
@@ -198,7 +206,7 @@ const onMaterialChange = (value: string[]) => {
display: flex;
flex-direction: column;
justify-content: space-between;
- padding-top: 0;
+ margin-top: var(--td-comp-margin-s);
}
&.dark {
@@ -216,9 +224,10 @@ const onMaterialChange = (value: string[]) => {
}
&__number {
- font-size: 36px;
- line-height: 44px;
+ font: var(--td-font-headline-large);
+ font-weight: 400;
color: var(--td-text-color-primary);
+ margin-bottom: var(--td-comp-margin-xxl);
}
&__text {
@@ -226,16 +235,18 @@ const onMaterialChange = (value: string[]) => {
flex-direction: row;
align-items: center;
justify-content: space-between;
- font-size: 14px;
+ font: var(--td-font-body-medium);
color: var(--td-text-color-placeholder);
text-align: left;
- line-height: 18px;
+ .t-icon {
+ font-size: var(--td-comp-size-xxxs);
+ }
&-left {
display: flex;
.icon {
- margin: 0 8px;
+ margin: 0 var(--td-comp-margin-s);
}
}
}
diff --git a/src/style/layout.less b/src/style/layout.less
index 87db7a9..d4fc7e4 100644
--- a/src/style/layout.less
+++ b/src/style/layout.less
@@ -83,7 +83,7 @@
}
&-content-layout {
- padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl);
+ padding: var(--td-comp-paddingTB-xl) var(--td-comp-paddingLR-xl);
}
&-layout {