diff --git a/web-vue/packages/biz/views/biz/myDocker/index.vue b/web-vue/packages/biz/views/biz/myDocker/index.vue index 12bfd7b..120de1d 100644 --- a/web-vue/packages/biz/views/biz/myDocker/index.vue +++ b/web-vue/packages/biz/views/biz/myDocker/index.vue @@ -342,7 +342,7 @@ systemInfo.value = res; } } catch (error) { - console.log(error); + console.log(error); } finally { if (accountId === selectedAccountId.value) { metricLoading.value = false; @@ -417,9 +417,6 @@ height: 100%; min-height: 0; padding: 0 !important; - width: calc(100% + 10px); - margin-left: -5px !important; - margin-right: -5px !important; margin-bottom: 0 !important; overflow: hidden !important; background: transparent !important; diff --git a/web-vue/packages/core/layouts/default/tabs/index3.less b/web-vue/packages/core/layouts/default/tabs/index3.less index 58e9dfb..5a93422 100644 --- a/web-vue/packages/core/layouts/default/tabs/index3.less +++ b/web-vue/packages/core/layouts/default/tabs/index3.less @@ -4,39 +4,49 @@ * @author Vben、ThinkGem */ @prefix-cls-3: ~'jeesite-multiple-tabs-3'; // Tabs style -@multiple-height-large: 40px; // TABS_HEIGHT_LARGE +@multiple-height-large: 36px; // TABS_HEIGHT_LARGE .@{prefix-cls-3} { z-index: 10; - height: @multiple-height-large + 2; - line-height: @multiple-height-large + 2; + height: @multiple-height-large + 8; + line-height: @multiple-height-large + 8; + background: rgb(240, 242, 245); + border-top: 1px solid rgb(226 232 240); + overflow: hidden; .ant-tabs.ant-tabs-card { .ant-tabs-nav { height: @multiple-height-large; - background-color: @content-bg; - margin: 0; + background-color: rgb(255, 255, 255); + margin: 4px 12px 0; border: 0; box-shadow: none; + border-radius: 12px; + padding: 0 8px; &::before { border-bottom: 0; } .ant-tabs-tab { - height: calc(@multiple-height-large - 15px); - line-height: calc(@multiple-height-large - 13px); + height: calc(@multiple-height-large - 13px); + line-height: normal; color: @text-color-base; background-color: @component-background; transition: none; border-radius: 7px !important; - margin: 12px 0 0; - padding-left: 10px; - padding-right: 11px; + margin: 4px 0 0; + padding-left: 7px; + padding-right: 8px; border: 0 !important; + display: inline-flex; + align-items: center; .ant-tabs-tab-btn { transition: none; + display: inline-flex; + align-items: center; + line-height: 1; } &:hover, @@ -46,9 +56,9 @@ .anticon { opacity: 0.8; - font-size: 13px; + font-size: 12px; text-align: center; - margin-right: 5px; + margin-right: 3px; svg { fill: @text-color-base; @@ -57,13 +67,13 @@ .ant-tabs-tab-remove { width: 12px; - height: 23px; + height: 18px; color: inherit; transition: none; padding: 0; .anticon { - font-size: 16px; + font-size: 14px; svg { width: 0.6em; @@ -105,10 +115,10 @@ } .ant-tabs-nav > div:nth-child(1) { - margin-left: 13px; + margin-left: 8px; .ant-tabs-tab { - margin-right: 6px !important; + margin-right: 8px !important; &:nth-last-child(2) { margin-right: 20px !important; @@ -206,9 +216,18 @@ html[data-theme='dark'] { .@{prefix-cls-3} { + background: rgb(20, 20, 20); + border-top: 1px solid rgb(51 65 85); + overflow: hidden; + .ant-tabs.ant-tabs-card { .ant-tabs-nav { - background: #000; + background: rgb(20, 20, 20); + border-radius: 12px; + padding: 0 8px; + margin: 4px 12px 0; + height: @multiple-height-large; + box-shadow: inset 0 0 0 1px rgb(51 65 85); &::before { border-bottom: 0;