feat(Tabbar): enable safe-area-inset-bottom by default when fixed (#5968)

This commit is contained in:
neverland
2020-03-31 22:16:13 +08:00
committed by GitHub
parent e929f96e04
commit afc3164364
13 changed files with 52 additions and 42 deletions
+1 -5
View File
@@ -383,11 +383,7 @@ export default createComponent({
genFooter() {
return (
<div
class={bem('footer', {
'safe-area-inset-bottom': this.safeAreaInsetBottom,
})}
>
<div class={bem('footer', { unfit: !this.safeAreaInsetBottom })}>
{this.genFooterContent()}
</div>
);
+4 -3
View File
@@ -173,10 +173,11 @@
&__footer {
flex-shrink: 0;
padding: 0 @padding-md;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
&--safe-area-inset-bottom {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
&--unfit {
padding-bottom: 0;
}
}
@@ -171,7 +171,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom"></div>
<div class="van-calendar__footer"></div>
</div>
</div>
<!---->
@@ -47,7 +47,7 @@ exports[`color prop when type is range 1`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm" style="color: rgb(255, 255, 255); background: blue; border-color: blue;"><span class="van-button__text">确定</span></button></div>
<div class="van-calendar__footer"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm" style="color: rgb(255, 255, 255); background: blue; border-color: blue;"><span class="van-button__text">确定</span></button></div>
</div>
`;
@@ -98,7 +98,7 @@ exports[`color prop when type is single 1`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm" style="color: rgb(255, 255, 255); background: blue; border-color: blue;"><span class="van-button__text">确定</span></button></div>
<div class="van-calendar__footer"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm" style="color: rgb(255, 255, 255); background: blue; border-color: blue;"><span class="van-button__text">确定</span></button></div>
</div>
`;
@@ -152,7 +152,7 @@ exports[`formatter prop 1`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm"><span class="van-button__text">确定</span></button></div>
<div class="van-calendar__footer"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm"><span class="van-button__text">确定</span></button></div>
</div>
`;
@@ -206,7 +206,7 @@ exports[`popup wrapper 2`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm"><span class="van-button__text">确定</span></button></div>
<div class="van-calendar__footer"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm"><span class="van-button__text">确定</span></button></div>
</div><i role="button" tabindex="0" class="van-icon van-icon-cross van-popup__close-icon van-popup__close-icon--top-right">
<!----></i>
</div>
@@ -259,7 +259,7 @@ exports[`row-height prop 1`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm"><span class="van-button__text">确定</span></button></div>
<div class="van-calendar__footer"><button type="button" class="van-button van-button--danger van-button--normal van-button--block van-button--round van-calendar__confirm"><span class="van-button__text">确定</span></button></div>
</div>
`;
@@ -310,6 +310,6 @@ exports[`title & footer slot 1`] = `
</div>
</div>
</div>
<div class="van-calendar__footer van-calendar__footer--safe-area-inset-bottom">Custom Footer</div>
<div class="van-calendar__footer">Custom Footer</div>
</div>
`;