style(Tab): disable ellipsis when scrollable

This commit is contained in:
chenjiahan
2020-07-31 20:48:10 +08:00
parent 729cca61a9
commit bc0e45687a
4 changed files with 23 additions and 25 deletions
+1 -1
View File
@@ -182,7 +182,7 @@ export default {
}
.van-tab__pane {
padding: 25px 20px;
padding: 24px 20px;
background-color: @white;
}
+18 -18
View File
@@ -53,15 +53,15 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-tabs__wrap--scrollable">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 3</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 4</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 5</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 6</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 7</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 8</span></div>
<div role="tablist" class="van-tabs__nav van-tabs__nav--line van-tabs__nav--complete">
<div role="tab" aria-selected="true" class="van-tab van-tab--active van-tab--complete"><span class="van-tab__text">标签 1</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 2</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 3</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 4</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 5</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 6</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 7</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 8</span></div>
<div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div>
</div>
</div>
@@ -276,15 +276,15 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-sticky">
<div class="van-tabs__wrap van-tabs__wrap--scrollable">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 3</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 4</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 5</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 6</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 7</span></div>
<div role="tab" class="van-tab" style="flex-basis: 17.6%;"><span class="van-tab__text van-tab__text--ellipsis">标签 8</span></div>
<div role="tablist" class="van-tabs__nav van-tabs__nav--line van-tabs__nav--complete">
<div role="tab" aria-selected="true" class="van-tab van-tab--active van-tab--complete"><span class="van-tab__text">标签 1</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 2</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 3</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 4</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 5</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 6</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 7</span></div>
<div role="tab" class="van-tab van-tab--complete"><span class="van-tab__text">标签 8</span></div>
<div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div>
</div>
</div>