kopia lustrzana https://github.com/nolanlawson/pinafore
fix: Fix ios design issues (#1199)
* Take into account the layout weirdness on iPhones This makes the menu bar full screen in landscape mode and allow the snackbar to have enough bottom padding * Improve the icon for PWA fixes #1198issue-1202
rodzic
4432d49467
commit
db0f5bf237
|
@ -2,7 +2,7 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset='utf-8' >
|
||||
<meta name="viewport" content="width=device-width" >
|
||||
<meta name="viewport" content="width=device-width, viewport-fit=cover">
|
||||
<meta id='theThemeColor' name='theme-color' content='#4169e1' >
|
||||
<meta name="description" content="An alternative web client for Mastodon, focused on speed and simplicity." >
|
||||
|
||||
|
|
|
@ -32,13 +32,27 @@
|
|||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
/* For iOS < 11.2 */
|
||||
@supports (padding-bottom: constant(safe-area-inset-bottom)) {
|
||||
.snackbar-container {
|
||||
--safe-area-inset-bottom: constant(safe-area-inset-bottom);
|
||||
}
|
||||
}
|
||||
|
||||
/* For iOS >= 11.2 */
|
||||
@supports (padding-bottom: env(safe-area-inset-bottom)) {
|
||||
.snackbar-container {
|
||||
--safe-area-inset-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
}
|
||||
|
||||
.snackbar-container {
|
||||
width: 562px; /* same as .main, minus 20px padding */
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: var(--toast-bg);
|
||||
padding: 10px 20px;
|
||||
padding: 10px 20px calc(10px + var(--safe-area-inset-bottom)) 20px;
|
||||
font-size: 1.3em;
|
||||
color: var(--toast-text);
|
||||
border-radius: 4px 4px 0 0;
|
||||
|
|
Plik binarny nie jest wyświetlany.
Przed Szerokość: | Wysokość: | Rozmiar: 1.3 KiB Po Szerokość: | Wysokość: | Rozmiar: 2.5 KiB |
Plik binarny nie jest wyświetlany.
Przed Szerokość: | Wysokość: | Rozmiar: 1.7 KiB Po Szerokość: | Wysokość: | Rozmiar: 3.4 KiB |
Ładowanie…
Reference in New Issue