UI: Adjust footer nav bar size in iOS app
This commit is contained in:
parent
1bff81419e
commit
f1b0782624
|
@ -2,7 +2,7 @@
|
||||||
// Footer nav bar (displayed in DiscourseHub app and PWAs)
|
// Footer nav bar (displayed in DiscourseHub app and PWAs)
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|
||||||
$footer-nav-height: 55px;
|
$footer-nav-height: 49px;
|
||||||
|
|
||||||
body.footer-nav-visible {
|
body.footer-nav-visible {
|
||||||
#main-outlet {
|
#main-outlet {
|
||||||
|
@ -37,8 +37,6 @@ body.footer-nav-visible {
|
||||||
|
|
||||||
&.visible {
|
&.visible {
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
|
|
||||||
padding-bottom: env(safe-area-inset-bottom);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer-nav-widget {
|
.footer-nav-widget {
|
||||||
|
@ -47,7 +45,9 @@ body.footer-nav-visible {
|
||||||
@include unselectable;
|
@include unselectable;
|
||||||
button {
|
button {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
margin: 12px;
|
margin: 4px;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 14px 18px;
|
||||||
&:disabled {
|
&:disabled {
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
}
|
}
|
||||||
|
@ -55,6 +55,12 @@ body.footer-nav-visible {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@supports (padding: max(0px)) {
|
||||||
|
.footer-nav.visible {
|
||||||
|
padding-bottom: unquote("max(5px, env(safe-area-inset-bottom))");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@supports (-webkit-backdrop-filter: blur(10px)) {
|
@supports (-webkit-backdrop-filter: blur(10px)) {
|
||||||
body:not(.footer-nav-ipad) .footer-nav {
|
body:not(.footer-nav-ipad) .footer-nav {
|
||||||
background-color: rgba($header_background, 0.7);
|
background-color: rgba($header_background, 0.7);
|
||||||
|
|
Loading…
Reference in New Issue