This commit is contained in:
CHEVALLIER Abel
2025-11-13 16:23:22 +01:00
parent de9c515a47
commit cb235644dc
34924 changed files with 3811102 additions and 0 deletions

198
node_modules/ng-zorro-antd/tabs/style/card-style.less generated vendored Normal file
View File

@@ -0,0 +1,198 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
// card style
.@{tab-prefix-cls} {
&&-card &-card-bar &-ink-bar {
visibility: hidden;
}
&&-card &-card-bar &-tab {
margin: 0;
margin-right: @tabs-card-gutter;
padding: @tabs-card-horizontal-padding;
line-height: 22px;
background: @tabs-card-head-background;
border: @border-width-base @border-style-base @border-color-split;
border-radius: @border-radius-base @border-radius-base 0 0;
transition: all 0.3s @ease-in-out;
}
&&-card &-card-bar &-tab-active {
color: @tabs-card-active-color;
background: @component-background;
border-color: @border-color-split;
border-bottom: @border-width-base solid @component-background;
&::before {
border-top: @tabs-card-tab-active-border-top;
}
}
&&-small &-card-bar &-tab {
padding: @tabs-card-horizontal-padding-sm;
}
&&-card &-card-bar &-tab-disabled {
color: @disabled-color;
}
&&-card &-card-bar &-tab-inactive {
padding: 0;
}
&&-card &-card-bar &-nav-wrap {
margin-bottom: 0;
}
&&-card &-card-bar &-tab &-close-x {
width: 16px;
height: @font-size-base;
margin-right: -5px;
margin-left: 3px;
overflow: hidden;
color: @text-color-secondary;
font-size: @font-size-sm;
vertical-align: middle;
transition: all 0.3s;
&:hover {
color: @heading-color;
}
}
&&-card &-card-content > &-tabpane,
&&-editable-card &-card-content > &-tabpane {
transition: none !important;
&-inactive {
overflow: hidden;
}
}
&&-card &-card-bar &-tab:hover .@{iconfont-css-prefix}-close {
opacity: 1;
}
&-extra-content {
// stylelint-disable-next-line
line-height: @tabs-title-font-size * @line-height-base + extract(@tabs-horizontal-padding, 1) * 2;
.@{tab-prefix-cls}-new-tab {
position: relative;
width: 20px;
height: 20px;
color: @text-color;
font-size: 12px;
line-height: 20px;
text-align: center;
border: @border-width-base @border-style-base @border-color-split;
border-radius: @border-radius-base;
cursor: pointer;
transition: all 0.3s;
&:hover {
color: @tabs-card-active-color;
border-color: @tabs-card-active-color;
}
svg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
}
}
// https://github.com/ant-design/ant-design/issues/17865
&&-large &-extra-content {
// stylelint-disable-next-line
line-height: @tabs-title-font-size-lg * @line-height-base + extract(@tabs-horizontal-padding-lg, 1) * 2;
}
// https://github.com/ant-design/ant-design/issues/17865
&&-small &-extra-content {
// stylelint-disable-next-line
line-height: @tabs-title-font-size-sm * @line-height-base + extract(@tabs-horizontal-padding-sm, 1) * 2;
}
// https://github.com/ant-design/ant-design/issues/17865
&&-card &-extra-content {
line-height: @tabs-card-height;
}
// https://github.com/ant-design/ant-design/issues/4669
&-vertical&-card &-card-bar&-left-bar,
&-vertical&-card &-card-bar&-right-bar {
.@{tab-prefix-cls}-nav-container {
height: 100%;
}
.@{tab-prefix-cls}-tab {
margin-bottom: @margin-sm;
border-bottom: @border-width-base @border-style-base @border-color-split;
&-active {
padding-bottom: 4px;
}
&:last-child {
margin-bottom: @margin-sm;
}
}
.@{tab-prefix-cls}-new-tab {
width: 90%;
}
}
&-vertical&-card&-left &-card-bar&-left-bar {
.@{tab-prefix-cls}-nav-wrap {
margin-right: 0;
}
.@{tab-prefix-cls}-tab {
margin-right: 1px;
border-right: 0;
border-radius: @border-radius-base 0 0 @border-radius-base;
&-active {
margin-right: -1px;
padding-right: @padding-md + 2px;
}
}
}
&-vertical&-card&-right &-card-bar&-right-bar {
.@{tab-prefix-cls}-nav-wrap {
margin-left: 0;
}
.@{tab-prefix-cls}-tab {
margin-left: 1px;
border-left: 0;
border-radius: 0 @border-radius-base @border-radius-base 0;
&-active {
margin-left: -1px;
padding-left: @padding-md + 2px;
}
}
}
// https://github.com/ant-design/ant-design/issues/9104
& &-card-bar&-bottom-bar &-tab {
height: auto;
border-top-color: @border-color-split;
border-bottom: @border-width-base @border-style-base @border-color-split;
border-radius: 0 0 @border-radius-base @border-radius-base;
}
& &-card-bar&-bottom-bar &-tab-active {
color: @primary-color;
border-top-color: @component-background;
}
}
@import './card-style.rtl.less';

View File

@@ -0,0 +1,20 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
// card style
.@{tab-prefix-cls} {
&&-card &-card-bar &-tab &-close-x {
.@{tab-prefix-cls}-rtl& {
margin-right: 3px;
margin-left: -5px;
}
}
&-extra-content {
.@{tab-prefix-cls}-rtl & {
float: left !important;
}
}
}

98
node_modules/ng-zorro-antd/tabs/style/card.less generated vendored Normal file
View File

@@ -0,0 +1,98 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
.@{tab-prefix-cls}-card {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
margin: 0;
padding: @tabs-card-horizontal-padding;
background: @tabs-card-head-background;
border: @border-width-base @border-style-base @border-color-split;
transition: all @animation-duration-slow @ease-in-out;
&-active {
color: @tabs-card-active-color;
background: @component-background;
}
}
.@{tab-prefix-cls}-ink-bar {
visibility: hidden;
}
}
// ========================== Top & Bottom ==========================
&.@{tab-prefix-cls}-top,
&.@{tab-prefix-cls}-bottom {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab + .@{tab-prefix-cls}-tab {
margin-left: @tabs-card-gutter;
}
}
}
&.@{tab-prefix-cls}-top {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
border-radius: @border-radius-base @border-radius-base 0 0;
&-active {
border-bottom-color: @component-background;
}
}
}
}
&.@{tab-prefix-cls}-bottom {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
border-radius: 0 0 @border-radius-base @border-radius-base;
&-active {
border-top-color: @component-background;
}
}
}
}
// ========================== Left & Right ==========================
&.@{tab-prefix-cls}-left,
&.@{tab-prefix-cls}-right {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab + .@{tab-prefix-cls}-tab {
margin-top: @tabs-card-gutter;
}
}
}
&.@{tab-prefix-cls}-left {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
border-radius: @border-radius-base 0 0 @border-radius-base;
&-active {
border-right-color: @component-background;
}
}
}
}
&.@{tab-prefix-cls}-right {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
border-radius: 0 @border-radius-base @border-radius-base 0;
&-active {
border-left-color: @component-background;
}
}
}
}
}

82
node_modules/ng-zorro-antd/tabs/style/dropdown.less generated vendored Normal file
View File

@@ -0,0 +1,82 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
.@{tab-prefix-cls}-dropdown {
.reset-component();
position: absolute;
top: -9999px;
left: -9999px;
z-index: @zindex-dropdown;
display: block;
&-hidden {
display: none;
}
&-menu {
max-height: 200px;
margin: 0;
padding: @dropdown-edge-child-vertical-padding 0;
overflow-x: hidden;
overflow-y: auto;
text-align: left;
list-style-type: none;
background-color: @dropdown-menu-bg;
background-clip: padding-box;
border-radius: @border-radius-base;
outline: none;
box-shadow: @box-shadow-base;
&-item {
display: flex;
align-items: center;
min-width: 120px;
margin: 0;
padding: @dropdown-vertical-padding @control-padding-horizontal;
overflow: hidden;
color: @text-color;
font-weight: normal;
font-size: @dropdown-font-size;
line-height: @dropdown-line-height;
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
transition: all 0.3s;
> span {
flex: 1;
white-space: nowrap;
}
&-remove {
flex: none;
margin-left: @margin-sm;
color: @text-color-secondary;
font-size: @font-size-sm;
background: transparent;
border: 0;
cursor: pointer;
&:hover {
color: @tabs-hover-color;
}
}
&:hover {
background: @item-hover-bg;
}
&-disabled {
&,
&:hover {
color: @disabled-color;
background: transparent;
cursor: not-allowed;
}
}
}
}
}

2
node_modules/ng-zorro-antd/tabs/style/entry.less generated vendored Normal file
View File

@@ -0,0 +1,2 @@
@import './index.less';
@import './patch.less';

702
node_modules/ng-zorro-antd/tabs/style/index.css generated vendored Normal file
View File

@@ -0,0 +1,702 @@
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
/* stylelint-disable no-duplicate-selectors */
.ant-tabs-small > .ant-tabs-nav .ant-tabs-tab {
padding: 8px 0;
font-size: 14px;
}
.ant-tabs-large > .ant-tabs-nav .ant-tabs-tab {
padding: 16px 0;
font-size: 16px;
}
.ant-tabs-card.ant-tabs-small > .ant-tabs-nav .ant-tabs-tab {
padding: 6px 16px;
}
.ant-tabs-card.ant-tabs-large > .ant-tabs-nav .ant-tabs-tab {
padding: 7px 16px 6px;
}
.ant-tabs-rtl {
direction: rtl;
}
.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab {
margin: 0 0 0 32px;
}
.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab:last-of-type {
margin-left: 0;
}
.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab .anticon {
margin-right: 0;
margin-left: 12px;
}
.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab .ant-tabs-tab-remove {
margin-right: 8px;
margin-left: -4px;
}
.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab .ant-tabs-tab-remove .anticon {
margin: 0;
}
.ant-tabs-rtl.ant-tabs-left > .ant-tabs-nav {
order: 1;
}
.ant-tabs-rtl.ant-tabs-left > .ant-tabs-content-holder {
order: 0;
}
.ant-tabs-rtl.ant-tabs-right > .ant-tabs-nav {
order: 0;
}
.ant-tabs-rtl.ant-tabs-right > .ant-tabs-content-holder {
order: 1;
}
.ant-tabs-rtl.ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-rtl.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab {
margin-right: 2px;
margin-left: 0;
}
.ant-tabs-rtl.ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-add,
.ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-add,
.ant-tabs-rtl.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-add,
.ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-add {
margin-right: 2px;
margin-left: 0;
}
.ant-tabs-dropdown-rtl {
direction: rtl;
}
.ant-tabs-dropdown-rtl .ant-tabs-dropdown-menu-item {
text-align: right;
}
.ant-tabs-top,
.ant-tabs-bottom {
flex-direction: column;
}
.ant-tabs-top > .ant-tabs-nav,
.ant-tabs-bottom > .ant-tabs-nav,
.ant-tabs-top > div > .ant-tabs-nav,
.ant-tabs-bottom > div > .ant-tabs-nav {
margin: 0 0 16px 0;
}
.ant-tabs-top > .ant-tabs-nav::before,
.ant-tabs-bottom > .ant-tabs-nav::before,
.ant-tabs-top > div > .ant-tabs-nav::before,
.ant-tabs-bottom > div > .ant-tabs-nav::before {
position: absolute;
right: 0;
left: 0;
border-bottom: 1px solid #f0f0f0;
content: '';
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-ink-bar {
height: 2px;
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-ink-bar-animated,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-ink-bar-animated,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-ink-bar-animated,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-ink-bar-animated {
transition: width 0.3s, left 0.3s, right 0.3s;
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-wrap::after {
top: 0;
bottom: 0;
width: 30px;
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-wrap::before {
left: 0;
box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-wrap::after {
right: 0;
box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-left::before,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-left::before,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-left::before,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-left::before {
opacity: 1;
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-right::after,
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-right::after,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-right::after,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-right::after {
opacity: 1;
}
.ant-tabs-top > .ant-tabs-nav::before,
.ant-tabs-top > div > .ant-tabs-nav::before {
bottom: 0;
}
.ant-tabs-top > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-ink-bar {
bottom: 0;
}
.ant-tabs-bottom > .ant-tabs-nav,
.ant-tabs-bottom > div > .ant-tabs-nav {
order: 1;
margin-top: 16px;
margin-bottom: 0;
}
.ant-tabs-bottom > .ant-tabs-nav::before,
.ant-tabs-bottom > div > .ant-tabs-nav::before {
top: 0;
}
.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-ink-bar {
top: 0;
}
.ant-tabs-bottom > .ant-tabs-content-holder,
.ant-tabs-bottom > div > .ant-tabs-content-holder {
order: 0;
}
.ant-tabs-left > .ant-tabs-nav,
.ant-tabs-right > .ant-tabs-nav,
.ant-tabs-left > div > .ant-tabs-nav,
.ant-tabs-right > div > .ant-tabs-nav {
flex-direction: column;
min-width: 50px;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-tab {
padding: 8px 24px;
text-align: center;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab {
margin: 16px 0 0 0;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap {
flex-direction: column;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap::after {
right: 0;
left: 0;
height: 30px;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap::before {
top: 0;
box-shadow: inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap::after {
bottom: 0;
box-shadow: inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-top::before,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-top::before,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-top::before,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-top::before {
opacity: 1;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-bottom::after,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-bottom::after,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-bottom::after,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-wrap.ant-tabs-nav-wrap-ping-bottom::after {
opacity: 1;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-ink-bar {
width: 2px;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-ink-bar-animated,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-ink-bar-animated,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-ink-bar-animated,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-ink-bar-animated {
transition: height 0.3s, top 0.3s;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-list,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-list,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-list,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-list,
.ant-tabs-left > .ant-tabs-nav .ant-tabs-nav-operations,
.ant-tabs-right > .ant-tabs-nav .ant-tabs-nav-operations,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-nav-operations,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-nav-operations {
flex: 1 0 auto;
flex-direction: column;
}
.ant-tabs-left > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-ink-bar {
right: 0;
}
.ant-tabs-left > .ant-tabs-content-holder,
.ant-tabs-left > div > .ant-tabs-content-holder {
margin-left: -1px;
border-left: 1px solid #f0f0f0;
}
.ant-tabs-left > .ant-tabs-content-holder > .ant-tabs-content > .ant-tabs-tabpane,
.ant-tabs-left > div > .ant-tabs-content-holder > .ant-tabs-content > .ant-tabs-tabpane {
padding-left: 24px;
}
.ant-tabs-right > .ant-tabs-nav,
.ant-tabs-right > div > .ant-tabs-nav {
order: 1;
}
.ant-tabs-right > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-ink-bar {
left: 0;
}
.ant-tabs-right > .ant-tabs-content-holder,
.ant-tabs-right > div > .ant-tabs-content-holder {
order: 0;
margin-right: -1px;
border-right: 1px solid #f0f0f0;
}
.ant-tabs-right > .ant-tabs-content-holder > .ant-tabs-content > .ant-tabs-tabpane,
.ant-tabs-right > div > .ant-tabs-content-holder > .ant-tabs-content > .ant-tabs-tabpane {
padding-right: 24px;
}
.ant-tabs-dropdown {
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgba(0, 0, 0, 0.85);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5715;
list-style: none;
font-feature-settings: 'tnum';
position: absolute;
top: -9999px;
left: -9999px;
z-index: 1050;
display: block;
}
.ant-tabs-dropdown-hidden {
display: none;
}
.ant-tabs-dropdown-menu {
max-height: 200px;
margin: 0;
padding: 4px 0;
overflow-x: hidden;
overflow-y: auto;
text-align: left;
list-style-type: none;
background-color: #fff;
background-clip: padding-box;
border-radius: 2px;
outline: none;
box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
}
.ant-tabs-dropdown-menu-item {
display: flex;
align-items: center;
min-width: 120px;
margin: 0;
padding: 5px 12px;
overflow: hidden;
color: rgba(0, 0, 0, 0.85);
font-weight: normal;
font-size: 14px;
line-height: 22px;
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
transition: all 0.3s;
}
.ant-tabs-dropdown-menu-item > span {
flex: 1;
white-space: nowrap;
}
.ant-tabs-dropdown-menu-item-remove {
flex: none;
margin-left: 12px;
color: rgba(0, 0, 0, 0.45);
font-size: 12px;
background: transparent;
border: 0;
cursor: pointer;
}
.ant-tabs-dropdown-menu-item-remove:hover {
color: #40a9ff;
}
.ant-tabs-dropdown-menu-item:hover {
background: #f5f5f5;
}
.ant-tabs-dropdown-menu-item-disabled,
.ant-tabs-dropdown-menu-item-disabled:hover {
color: rgba(0, 0, 0, 0.25);
background: transparent;
cursor: not-allowed;
}
.ant-tabs-card > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-card > div > .ant-tabs-nav .ant-tabs-tab {
margin: 0;
padding: 8px 16px;
background: #fafafa;
border: 1px solid #f0f0f0;
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.ant-tabs-card > .ant-tabs-nav .ant-tabs-tab-active,
.ant-tabs-card > div > .ant-tabs-nav .ant-tabs-tab-active {
color: #1890ff;
background: #fff;
}
.ant-tabs-card > .ant-tabs-nav .ant-tabs-ink-bar,
.ant-tabs-card > div > .ant-tabs-nav .ant-tabs-ink-bar {
visibility: hidden;
}
.ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab {
margin-left: 2px;
}
.ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-tab {
border-radius: 2px 2px 0 0;
}
.ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab-active,
.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-tab-active {
border-bottom-color: #fff;
}
.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-tab {
border-radius: 0 0 2px 2px;
}
.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-tab-active,
.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-tab-active {
border-top-color: #fff;
}
.ant-tabs-card.ant-tabs-left > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-card.ant-tabs-right > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-card.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
.ant-tabs-card.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab {
margin-top: 2px;
}
.ant-tabs-card.ant-tabs-left > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-card.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-tab {
border-radius: 2px 0 0 2px;
}
.ant-tabs-card.ant-tabs-left > .ant-tabs-nav .ant-tabs-tab-active,
.ant-tabs-card.ant-tabs-left > div > .ant-tabs-nav .ant-tabs-tab-active {
border-right-color: #fff;
}
.ant-tabs-card.ant-tabs-right > .ant-tabs-nav .ant-tabs-tab,
.ant-tabs-card.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-tab {
border-radius: 0 2px 2px 0;
}
.ant-tabs-card.ant-tabs-right > .ant-tabs-nav .ant-tabs-tab-active,
.ant-tabs-card.ant-tabs-right > div > .ant-tabs-nav .ant-tabs-tab-active {
border-left-color: #fff;
}
.ant-tabs {
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgba(0, 0, 0, 0.85);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5715;
list-style: none;
font-feature-settings: 'tnum';
display: flex;
}
.ant-tabs > .ant-tabs-nav,
.ant-tabs > div > .ant-tabs-nav {
position: relative;
display: flex;
flex: none;
align-items: center;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-wrap {
position: relative;
display: inline-block;
display: flex;
flex: auto;
align-self: stretch;
overflow: hidden;
white-space: nowrap;
transform: translate(0);
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-wrap::before,
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap::after,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-wrap::after {
position: absolute;
z-index: 1;
opacity: 0;
transition: opacity 0.3s;
content: '';
pointer-events: none;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-list,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-list {
position: relative;
display: flex;
transition: transform 0.3s;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-operations,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-operations {
display: flex;
align-self: stretch;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-operations-hidden,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-operations-hidden {
position: absolute;
visibility: hidden;
pointer-events: none;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-more,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-more {
position: relative;
padding: 8px 16px;
background: transparent;
border: 0;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-more::after,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-more::after {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 5px;
transform: translateY(100%);
content: '';
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-add,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-add {
min-width: 40px;
margin-left: 2px;
padding: 0 8px;
background: #fafafa;
border: 1px solid #f0f0f0;
border-radius: 2px 2px 0 0;
outline: none;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-add:hover,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-add:hover {
color: #40a9ff;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-add:active,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-add:active,
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-add:focus,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-add:focus {
color: #096dd9;
}
.ant-tabs-extra-content {
flex: none;
}
.ant-tabs-centered > .ant-tabs-nav .ant-tabs-nav-wrap:not([class*='ant-tabs-nav-wrap-ping']),
.ant-tabs-centered > div > .ant-tabs-nav .ant-tabs-nav-wrap:not([class*='ant-tabs-nav-wrap-ping']) {
justify-content: center;
}
.ant-tabs-ink-bar {
position: absolute;
background: #1890ff;
pointer-events: none;
}
.ant-tabs-tab {
position: relative;
display: inline-flex;
align-items: center;
padding: 12px 0;
font-size: 14px;
background: transparent;
border: 0;
outline: none;
cursor: pointer;
}
.ant-tabs-tab-btn:focus,
.ant-tabs-tab-remove:focus,
.ant-tabs-tab-btn:active,
.ant-tabs-tab-remove:active {
color: #096dd9;
}
.ant-tabs-tab-btn {
outline: none;
transition: all 0.3s;
}
.ant-tabs-tab-remove {
flex: none;
margin-right: -4px;
margin-left: 8px;
color: rgba(0, 0, 0, 0.45);
font-size: 12px;
background: transparent;
border: none;
outline: none;
cursor: pointer;
transition: all 0.3s;
}
.ant-tabs-tab-remove:hover {
color: rgba(0, 0, 0, 0.85);
}
.ant-tabs-tab:hover {
color: #40a9ff;
}
.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
color: #1890ff;
text-shadow: 0 0 0.25px currentcolor;
}
.ant-tabs-tab.ant-tabs-tab-disabled {
color: rgba(0, 0, 0, 0.25);
cursor: not-allowed;
}
.ant-tabs-tab.ant-tabs-tab-disabled .ant-tabs-tab-btn:focus,
.ant-tabs-tab.ant-tabs-tab-disabled .ant-tabs-tab-remove:focus,
.ant-tabs-tab.ant-tabs-tab-disabled .ant-tabs-tab-btn:active,
.ant-tabs-tab.ant-tabs-tab-disabled .ant-tabs-tab-remove:active {
color: rgba(0, 0, 0, 0.25);
}
.ant-tabs-tab .ant-tabs-tab-remove .anticon {
margin: 0;
}
.ant-tabs-tab .anticon {
margin-right: 12px;
}
.ant-tabs-tab + .ant-tabs-tab {
margin: 0 0 0 32px;
}
.ant-tabs-content {
position: relative;
width: 100%;
}
.ant-tabs-content-holder {
flex: auto;
min-width: 0;
min-height: 0;
}
.ant-tabs-tabpane {
outline: none;
}
.ant-tabs-tabpane-hidden {
display: none;
}
.ant-tabs-switch-appear,
.ant-tabs-switch-enter {
transition: none;
}
.ant-tabs-switch-appear-start,
.ant-tabs-switch-enter-start {
opacity: 0;
}
.ant-tabs-switch-appear-active,
.ant-tabs-switch-enter-active {
opacity: 1;
transition: opacity 0.3s;
}
.ant-tabs-switch-leave {
position: absolute;
transition: none;
inset: 0;
}
.ant-tabs-switch-leave-start {
opacity: 1;
}
.ant-tabs-switch-leave-active {
opacity: 0;
transition: opacity 0.3s;
}
.ant-tabs-dropdown-menu-item a[nz-tab-link] {
position: relative;
}
.ant-tabs-tab-btn {
background-color: unset;
border: none;
cursor: pointer;
}
.ant-tabs-tab a[nz-tab-link]::before {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: transparent;
content: '';
}
.ant-tabs-tab a[nz-tab-link] ~ * {
position: relative;
}
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu {
max-height: 200px;
margin: 0;
padding: 4px 0;
overflow-x: hidden;
overflow-y: auto;
text-align: left;
list-style-type: none;
background-color: #fff;
background-clip: padding-box;
border-radius: 2px;
outline: none;
box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
}
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu-item {
min-width: 120px;
margin: 0;
padding: 5px 12px;
overflow: hidden;
color: rgba(0, 0, 0, 0.85);
font-weight: normal;
font-size: 14px;
line-height: 22px;
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
transition: all 0.3s;
}
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu-item:hover {
background: #f5f5f5;
}
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu-item-disabled,
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu-item-disabled:hover {
color: rgba(0, 0, 0, 0.25);
background: transparent;
cursor: not-allowed;
}
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu-item-disabled a,
.nz-tabs-dropdown.ant-dropdown .ant-dropdown-menu-item-disabled:hover a {
color: rgba(0, 0, 0, 0.25);
pointer-events: none;
}
.ant-tabs-rtl .ant-tabs-rtl-tab-next {
right: auto;
left: 2px;
}
.ant-tabs-tab-disabled a {
color: rgba(0, 0, 0, 0.25);
pointer-events: none;
}
.ant-tabs > .ant-tabs-nav .ant-tabs-nav-add,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-add {
min-height: 40px;
}

253
node_modules/ng-zorro-antd/tabs/style/index.less generated vendored Normal file
View File

@@ -0,0 +1,253 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@import './size';
@import './rtl';
@import './position';
@import './dropdown';
@import './card';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
.@{tab-prefix-cls} {
.reset-component();
display: flex;
// ========================== Navigation ==========================
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
position: relative;
display: flex;
flex: none;
align-items: center;
.@{tab-prefix-cls}-nav-wrap {
position: relative;
display: inline-block;
display: flex;
flex: auto;
align-self: stretch;
overflow: hidden;
white-space: nowrap;
transform: translate(0); // Fix chrome render bug
// >>>>> Ping shadow
&::before,
&::after {
position: absolute;
z-index: 1;
opacity: 0;
transition: opacity @animation-duration-slow;
content: '';
pointer-events: none;
}
}
.@{tab-prefix-cls}-nav-list {
position: relative;
display: flex;
transition: transform @animation-duration-slow;
}
// >>>>>>>> Operations
.@{tab-prefix-cls}-nav-operations {
display: flex;
align-self: stretch;
&-hidden {
position: absolute;
visibility: hidden;
pointer-events: none;
}
}
.@{tab-prefix-cls}-nav-more {
position: relative;
padding: @tabs-card-horizontal-padding;
background: transparent;
border: 0;
&::after {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 5px;
transform: translateY(100%);
content: '';
}
}
.@{tab-prefix-cls}-nav-add {
min-width: @tabs-card-height;
margin-left: @tabs-card-gutter;
padding: 0 @padding-xs;
background: @tabs-card-head-background;
border: @border-width-base @border-style-base @border-color-split;
border-radius: @border-radius-base @border-radius-base 0 0;
outline: none;
cursor: pointer;
transition: all @animation-duration-slow @ease-in-out;
&:hover {
color: @tabs-hover-color;
}
&:active,
&:focus {
color: @tabs-active-color;
}
}
}
&-extra-content {
flex: none;
}
&-centered {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-nav-wrap {
&:not([class*='@{tab-prefix-cls}-nav-wrap-ping']) {
justify-content: center;
}
}
}
}
// ============================ InkBar ============================
&-ink-bar {
position: absolute;
background: @tabs-ink-bar-color;
pointer-events: none;
}
// ============================= Tabs =============================
&-tab {
position: relative;
display: inline-flex;
align-items: center;
padding: @tabs-horizontal-padding;
font-size: @tabs-title-font-size;
background: transparent;
border: 0;
outline: none;
cursor: pointer;
&-btn,
&-remove {
&:focus,
&:active {
color: @tabs-active-color;
}
}
&-btn {
outline: none;
transition: all 0.3s;
}
&-remove {
flex: none;
margin-right: -@margin-xss;
margin-left: @margin-xs;
color: @text-color-secondary;
font-size: @font-size-sm;
background: transparent;
border: none;
outline: none;
cursor: pointer;
transition: all @animation-duration-slow;
&:hover {
color: @heading-color;
}
}
&:hover {
color: @tabs-hover-color;
}
&&-active &-btn {
color: @tabs-highlight-color;
text-shadow: 0 0 0.25px currentcolor;
}
&&-disabled {
color: @disabled-color;
cursor: not-allowed;
}
&&-disabled &-btn,
&&-disabled &-remove {
&:focus,
&:active {
color: @disabled-color;
}
}
& &-remove .@{iconfont-css-prefix} {
margin: 0;
}
.@{iconfont-css-prefix} {
margin-right: @margin-sm;
}
}
&-tab + &-tab {
margin: @tabs-horizontal-margin;
}
// =========================== TabPanes ===========================
&-content {
&-holder {
flex: auto;
min-width: 0;
min-height: 0;
}
position: relative;
width: 100%;
}
&-tabpane {
outline: none;
&-hidden {
display: none;
}
}
// Motion
&-switch {
&-appear,
&-enter {
transition: none;
&-start {
opacity: 0;
}
&-active {
opacity: 1;
transition: opacity @animation-duration-slow;
}
}
&-leave {
position: absolute;
transition: none;
inset: 0;
&-start {
opacity: 1;
}
&-active {
opacity: 0;
transition: opacity @animation-duration-slow;
}
}
}
}

1
node_modules/ng-zorro-antd/tabs/style/index.min.css generated vendored Normal file

File diff suppressed because one or more lines are too long

100
node_modules/ng-zorro-antd/tabs/style/patch.less generated vendored Normal file
View File

@@ -0,0 +1,100 @@
@import './index';
.ant-tabs-dropdown-menu-item a[nz-tab-link] {
position: relative;
}
.ant-tabs-tab-btn {
background-color: unset;
border: none;
cursor: pointer;
}
.ant-tabs-tab a[nz-tab-link] {
&::before {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: transparent;
content: '';
}
~ * {
position: relative;
}
}
.nz-tabs-dropdown.ant-dropdown {
.ant-dropdown-menu {
max-height: 200px;
margin: 0;
padding: @dropdown-edge-child-vertical-padding 0;
overflow-x: hidden;
overflow-y: auto;
text-align: left;
list-style-type: none;
background-color: @dropdown-menu-bg;
background-clip: padding-box;
border-radius: @border-radius-base;
outline: none;
box-shadow: @box-shadow-base;
&-item {
min-width: 120px;
margin: 0;
padding: @dropdown-vertical-padding @control-padding-horizontal;
overflow: hidden;
color: @text-color;
font-weight: normal;
font-size: @dropdown-font-size;
line-height: @dropdown-line-height;
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
transition: all 0.3s;
&:hover {
background: @item-hover-bg;
}
&-disabled {
&,
&:hover {
color: @disabled-color;
background: transparent;
cursor: not-allowed;
a {
color: @disabled-color;
pointer-events: none;
}
}
}
}
}
}
.@{tab-prefix-cls} {
&-rtl {
&-tab-next {
.@{tab-prefix-cls}-rtl & {
right: auto;
left: 2px;
}
}
}
&-tab-disabled a {
color: @disabled-color;
pointer-events: none;
}
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-nav-add {
min-height: @tabs-card-height;
}
}
}

198
node_modules/ng-zorro-antd/tabs/style/position.less generated vendored Normal file
View File

@@ -0,0 +1,198 @@
@import '../../style/themes/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
.@{tab-prefix-cls} {
// ========================== Top & Bottom ==========================
&-top,
&-bottom {
flex-direction: column;
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
margin: @tabs-bar-margin;
&::before {
position: absolute;
right: 0;
left: 0;
border-bottom: @border-width-base @border-style-base @border-color-split;
content: '';
}
.@{tab-prefix-cls}-ink-bar {
height: 2px;
&-animated {
transition: width @animation-duration-slow, left @animation-duration-slow,
right @animation-duration-slow;
}
}
.@{tab-prefix-cls}-nav-wrap {
&::before,
&::after {
top: 0;
bottom: 0;
width: 30px;
}
&::before {
left: 0;
box-shadow: inset 10px 0 8px -8px fade(@shadow-color, 8%);
}
&::after {
right: 0;
box-shadow: inset -10px 0 8px -8px fade(@shadow-color, 8%);
}
&.@{tab-prefix-cls}-nav-wrap-ping-left::before {
opacity: 1;
}
&.@{tab-prefix-cls}-nav-wrap-ping-right::after {
opacity: 1;
}
}
}
}
&-top {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
&::before {
bottom: 0;
}
.@{tab-prefix-cls}-ink-bar {
bottom: 0;
}
}
}
&-bottom {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
order: 1;
margin-top: @margin-md;
margin-bottom: 0;
&::before {
top: 0;
}
.@{tab-prefix-cls}-ink-bar {
top: 0;
}
}
> .@{tab-prefix-cls}-content-holder,
> div > .@{tab-prefix-cls}-content-holder {
order: 0;
}
}
// ========================== Left & Right ==========================
&-left,
&-right {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
flex-direction: column;
min-width: 50px;
// >>>>>>>>>>> Tab
.@{tab-prefix-cls}-tab {
padding: @tabs-vertical-padding;
text-align: center;
}
.@{tab-prefix-cls}-tab + .@{tab-prefix-cls}-tab {
margin: @tabs-vertical-margin;
}
// >>>>>>>>>>> Nav
.@{tab-prefix-cls}-nav-wrap {
flex-direction: column;
&::before,
&::after {
right: 0;
left: 0;
height: 30px;
}
&::before {
top: 0;
box-shadow: inset 0 10px 8px -8px fade(@shadow-color, 8%);
}
&::after {
bottom: 0;
box-shadow: inset 0 -10px 8px -8px fade(@shadow-color, 8%);
}
&.@{tab-prefix-cls}-nav-wrap-ping-top::before {
opacity: 1;
}
&.@{tab-prefix-cls}-nav-wrap-ping-bottom::after {
opacity: 1;
}
}
// >>>>>>>>>>> Ink Bar
.@{tab-prefix-cls}-ink-bar {
width: 2px;
&-animated {
transition: height @animation-duration-slow, top @animation-duration-slow;
}
}
.@{tab-prefix-cls}-nav-list,
.@{tab-prefix-cls}-nav-operations {
flex: 1 0 auto; // fix safari scroll problem
flex-direction: column;
}
}
}
&-left {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-ink-bar {
right: 0;
}
}
> .@{tab-prefix-cls}-content-holder,
> div > .@{tab-prefix-cls}-content-holder {
margin-left: -@border-width-base;
border-left: @border-width-base @border-style-base @border-color-split;
> .@{tab-prefix-cls}-content > .@{tab-prefix-cls}-tabpane {
padding-left: @padding-lg;
}
}
}
&-right {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
order: 1;
.@{tab-prefix-cls}-ink-bar {
left: 0;
}
}
> .@{tab-prefix-cls}-content-holder,
> div > .@{tab-prefix-cls}-content-holder {
order: 0;
margin-right: -@border-width-base;
border-right: @border-width-base @border-style-base @border-color-split;
> .@{tab-prefix-cls}-content > .@{tab-prefix-cls}-tabpane {
padding-right: @padding-lg;
}
}
}
}

86
node_modules/ng-zorro-antd/tabs/style/rtl.less generated vendored Normal file
View File

@@ -0,0 +1,86 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
.@{tab-prefix-cls} {
&-rtl {
direction: rtl;
.@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
margin: @tabs-horizontal-margin-rtl;
&:last-of-type {
margin-left: 0;
}
.@{iconfont-css-prefix} {
margin-right: 0;
margin-left: @margin-sm;
}
.@{tab-prefix-cls}-tab-remove {
margin-right: @margin-xs;
margin-left: -@margin-xss;
.@{iconfont-css-prefix} {
margin: 0;
}
}
}
}
&.@{tab-prefix-cls}-left {
> .@{tab-prefix-cls}-nav {
order: 1;
}
> .@{tab-prefix-cls}-content-holder {
order: 0;
}
}
&.@{tab-prefix-cls}-right {
> .@{tab-prefix-cls}-nav {
order: 0;
}
> .@{tab-prefix-cls}-content-holder {
order: 1;
}
}
}
// ====================== Card ======================
&-card {
&.@{tab-prefix-cls}-top,
&.@{tab-prefix-cls}-bottom {
> .@{tab-prefix-cls}-nav,
> div > .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab + .@{tab-prefix-cls}-tab {
.@{tab-prefix-cls}-rtl& {
margin-right: @tabs-card-gutter;
margin-left: 0;
}
}
.@{tab-prefix-cls}-nav-add {
.@{tab-prefix-cls}-rtl& {
margin-right: @tabs-card-gutter;
margin-left: 0;
}
}
}
}
}
}
.@{tab-prefix-cls}-dropdown {
&-rtl {
direction: rtl;
}
&-menu-item {
.@{tab-prefix-cls}-dropdown-rtl & {
text-align: right;
}
}
}

42
node_modules/ng-zorro-antd/tabs/style/size.less generated vendored Normal file
View File

@@ -0,0 +1,42 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@tab-prefix-cls: ~'@{ant-prefix}-tabs';
.@{tab-prefix-cls} {
&-small {
> .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
padding: @tabs-horizontal-padding-sm;
font-size: @tabs-title-font-size-sm;
}
}
}
&-large {
> .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
padding: @tabs-horizontal-padding-lg;
font-size: @tabs-title-font-size-lg;
}
}
}
&-card {
&.@{tab-prefix-cls}-small {
> .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
padding: @tabs-card-horizontal-padding-sm;
}
}
}
&.@{tab-prefix-cls}-large {
> .@{tab-prefix-cls}-nav {
.@{tab-prefix-cls}-tab {
padding: @tabs-card-horizontal-padding-lg;
}
}
}
}
}