首页切换标签重构

This commit is contained in:
2026-04-24 17:57:59 +08:00
parent 3c337f13ef
commit 564acbc91e
2 changed files with 37 additions and 21 deletions

View File

@@ -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;

View File

@@ -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;