miklo
/
soapbox
sforkowany z mirror/soapbox
1
0
Forkuj 0
Kod Zgłoszenia Oczekujące zmiany Packages Projekty Wydania Wiki Aktywność

iOS: improve PWA support 

Fixes: https://gitlab.com/soapbox-pub/soapbox-fe/-/issues/747
profile-avatar-switcher
Alex Gleason 2021-09-27 16:39:29 -05:00
rodzic f8065543f2
commit 9a660e8363
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 7211D1F99744FBB7
5 zmienionych plików z 20 dodań i 4 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

2
app/index.ejs
Wyświetl plik

@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, user-scalable=no">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<!--server-generated-meta-->

9
app/styles/components/account-header.scss
Wyświetl plik

@ -12,6 +12,7 @@
position: absolute;
top: 10px;
left: 10px;
left: max(10px, env(safe-area-inset-left));
z-index: 1;
}
@ -19,6 +20,7 @@
position: absolute;
top: 10px;
right: 10px;
right: max(10px, env(safe-area-inset-right));
z-index: 1;
.subscription-button {
@ -149,6 +151,7 @@
@media screen and (max-width: 895px) {
top: -45px;
left: 20px;
left: max(20px + env(safe-area-inset-left));
height: 90px;
width: 90px;
@ -178,7 +181,11 @@
@media screen and (max-width: 895px) {
max-width: 900px;
padding: 10px 10px 0;
padding-top: 10px;
padding-left: 10px;
padding-left: max(10px, env(safe-area-inset-left));
padding-right: 10px;
padding-right: max(10px, env(safe-area-inset-right));
flex-direction: column-reverse;
min-height: 50px;
}

7
app/styles/components/modal.scss
Wyświetl plik

@ -685,6 +685,8 @@
display: flex;
position: relative;
padding: 10px 0;
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
border-bottom: 1px solid hsla(var(--primary-text-color_hsl), 0.2);
align-items: center;
justify-content: center;
@ -704,7 +706,8 @@
&__close {
position: absolute;
right: 10px;
color: #999;
right: max(10px, env(safe-area-inset-right));
color: var(--primary-text-color--faint);
}
&__content {
@ -712,6 +715,8 @@
flex-direction: row;
flex: 1;
padding: 10px;
padding-left: max(10px, env(safe-area-inset-left));
padding-right: max(10px, env(safe-area-inset-right));
overflow-y: hidden;
&--scroll {

5
app/styles/components/tabs-bar.scss
Wyświetl plik

@ -24,7 +24,10 @@
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 0 15px;
padding-left: 15px;
padding-left: max(15px, env(safe-area-inset-left));
padding-right: 15px;
padding-right: max(15px, env(safe-area-inset-right));
// NOTE - might need to adjust this based on column sizing
@media screen and (max-width: $nav-breakpoint-4) { padding: 0 10px; }

1
app/styles/emoji_picker.scss
Wyświetl plik

@ -261,6 +261,7 @@
background: var(--foreground-color);
position: absolute;
margin-top: 5px;
transform: translateX(calc(-1 * env(safe-area-inset-right))); /* iOS PWA */
z-index: 20000;
.emoji-mart-scroll {