mirror of
https://github.com/Bubka/2FAuth.git
synced 2025-01-23 06:38:34 +01:00
Hide content around iPhone X+ notch
This commit is contained in:
parent
a98e05766b
commit
f80636ee6e
74
resources/sass/app.scss
vendored
74
resources/sass/app.scss
vendored
@ -6,6 +6,18 @@ a:hover {
|
||||
color: hsl(204, 86%, 53%);
|
||||
}
|
||||
|
||||
@supports (padding-top: env(safe-area-inset-top)) {
|
||||
#app {
|
||||
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-left);
|
||||
}
|
||||
}
|
||||
|
||||
@supports (padding-top: constant(safe-area-inset-top)) {
|
||||
#app {
|
||||
padding: constant(safe-area-inset-top) constant(safe-area-inset-right) constant(safe-area-inset-left);
|
||||
}
|
||||
}
|
||||
|
||||
.main-section {
|
||||
padding: 1.5rem 1rem 9rem 1rem;
|
||||
}
|
||||
@ -25,6 +37,20 @@ a:hover {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@supports (padding-top: env(safe-area-inset-top)) {
|
||||
.header {
|
||||
--safe-area-inset-top: env(safe-area-inset-top);
|
||||
padding-top: calc(1rem + var(--safe-area-inset-top));
|
||||
}
|
||||
}
|
||||
|
||||
@supports (padding-top: constant(safe-area-inset-top)) {
|
||||
.header {
|
||||
--safe-area-inset-top: constant(safe-area-inset-top);
|
||||
padding-top: calc(1rem + var(--safe-area-inset-top));
|
||||
}
|
||||
}
|
||||
|
||||
.accounts {
|
||||
margin-top: 40px;
|
||||
}
|
||||
@ -184,15 +210,31 @@ a:hover {
|
||||
|
||||
.fullscreen-streamer {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
top: 10%;
|
||||
left: 0;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
height: 65%;
|
||||
}
|
||||
|
||||
/* Corner borders */
|
||||
.overlay {
|
||||
background:
|
||||
linear-gradient(to right, white 1px, transparent 1px) 0 0,
|
||||
linear-gradient(to right, white 1px, transparent 1px) 0 100%,
|
||||
linear-gradient(to left, white 1px, transparent 1px) 100% 0,
|
||||
linear-gradient(to left, white 1px, transparent 1px) 100% 100%,
|
||||
linear-gradient(to bottom, white 1px, transparent 1px) 0 0,
|
||||
linear-gradient(to bottom, white 1px, transparent 1px) 100% 0,
|
||||
linear-gradient(to top, white 1px, transparent 1px) 0 100%,
|
||||
linear-gradient(to top, white 1px, transparent 1px) 100% 100%;
|
||||
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20px 20px;
|
||||
}
|
||||
|
||||
.fullscreen-alert {
|
||||
position: fixed;
|
||||
top: 25vh;
|
||||
top: 37.5vh;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 0.75rem;
|
||||
@ -338,6 +380,20 @@ footer .field.is-grouped {
|
||||
padding: 0.75rem 1.5rem;
|
||||
}
|
||||
|
||||
@supports (padding-top: env(safe-area-inset-top)) {
|
||||
.notification {
|
||||
--safe-area-inset-top: env(safe-area-inset-top);
|
||||
padding-top: calc(0.75rem + var(--safe-area-inset-top));
|
||||
}
|
||||
}
|
||||
|
||||
@supports (padding-top: constant(safe-area-inset-top)) {
|
||||
.notification {
|
||||
--safe-area-inset-top: constant(safe-area-inset-top);
|
||||
padding-top: calc(0.75rem + var(--safe-area-inset-top));
|
||||
}
|
||||
}
|
||||
|
||||
.notification .notification-title {
|
||||
// Style for title line
|
||||
}
|
||||
@ -355,6 +411,18 @@ footer .field.is-grouped {
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
@supports (padding-top: env(safe-area-inset-top)) {
|
||||
.options-header {
|
||||
padding-top: env(safe-area-inset-top);
|
||||
}
|
||||
}
|
||||
|
||||
@supports (padding-top: constant(safe-area-inset-top)) {
|
||||
.options-header {
|
||||
padding-top: constant(safe-area-inset-top);
|
||||
}
|
||||
}
|
||||
|
||||
.options-tabs {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, shrink-to-fit=no">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, shrink-to-fit=no, viewport-fit=cover">
|
||||
<meta name="csrf-token" content="{{csrf_token()}}">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
|
Loading…
Reference in New Issue
Block a user