ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Composer: Remove safe area padding on iPad (#3308)

Browse Source
This commit is contained in:
Alexander Zinchuk 2023-06-15 20:39:46 +02:00
parent c876b11943
commit c9db7c08a8
7 changed files with 61 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/middle/MessageList.scss
View File

@ -29,11 +29,12 @@
body.keyboard-visible & {
position: relative;
bottom: calc(0px - env(safe-area-inset-bottom));
bottom: 0;
// Target: Old Firefox (Waterfox Classic)
@supports not (bottom: calc(0px - env(safe-area-inset-bottom))) {
bottom: 0;
@media (max-width: 600px) {
@supports (bottom: calc(0px - env(safe-area-inset-bottom))) {
bottom: calc(0px - env(safe-area-inset-bottom));
}
}
body.keyboard-visible.no-page-transitions & {
@ -99,8 +100,10 @@
.last-in-list {
margin-bottom: 4.25rem;
body:not(.keyboard-visible) & {
margin-bottom: calc(4.25rem + env(safe-area-inset-bottom));
@supports (margin-bottom: calc(4.25rem + env(safe-area-inset-bottom))) {
body:not(.keyboard-visible) & {
margin-bottom: calc(4.25rem + env(safe-area-inset-bottom));
}
}
}
}

9
src/components/middle/MessageSelectToolbar.scss
View File

@ -1,6 +1,6 @@
.MessageSelectToolbar {
position: absolute;
bottom: calc(0.5rem + env(safe-area-inset-bottom));
bottom: 0.5rem;
left: 0.5rem;
right: 0.5rem;
width: auto;
@ -8,9 +8,10 @@
justify-content: center;
margin: 0;
// Target: Old Firefox (Waterfox Classic)
@supports not (bottom: calc(0.5rem + env(safe-area-inset-bottom))) {
bottom: 0.5rem;
@media (max-width: 600px) {
@supports (bottom: calc(0.5rem + env(safe-area-inset-bottom))) {
bottom: calc(0.5rem + env(safe-area-inset-bottom));
}
}
.mask-image-disabled &::before {

16
src/components/middle/MiddleColumn.scss
View File

@ -188,16 +188,17 @@
}
&:not(.no-composer) {
padding-bottom: env(safe-area-inset-bottom);
padding-bottom: 0;
top: 0;
body.keyboard-visible & {
top: env(safe-area-inset-bottom);
}
@media (max-width: 600px) {
@supports (padding-bottom: env(safe-area-inset-bottom)) {
padding-bottom: env(safe-area-inset-bottom);
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-bottom: env(safe-area-inset-bottom)) {
padding-bottom: 0;
body.keyboard-visible & {
top: env(safe-area-inset-bottom);
}
}
}
}
@ -329,7 +330,6 @@
padding-bottom: 0.75rem;
margin-left: -0.5rem;
// Target: Old Firefox (Waterfox Classic)
@supports (padding-bottom: calc(0.75rem + env(safe-area-inset-bottom))) {
padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
}

13
src/components/middle/MobileSearch.scss
View File

@ -37,8 +37,17 @@
padding-right: max(0.5rem, env(safe-area-inset-right));
body:not(.keyboard-visible) & {
padding-bottom: env(safe-area-inset-bottom);
height: calc(3.5rem + env(safe-area-inset-bottom));
padding-bottom: 0;
height: 3.5rem;
}
@media (max-width: 600px) {
@supports (padding-bottom: env(safe-area-inset-bottom)) {
body:not(.keyboard-visible) & {
padding-bottom: env(safe-area-inset-bottom);
height: calc(3.5rem + env(safe-area-inset-bottom));
}
}
}
// Target: Old Firefox (Waterfox Classic)

17
src/components/middle/composer/AttachmentModal.module.scss
View File

@ -26,10 +26,10 @@
overflow-x: auto;
padding-bottom: env(safe-area-inset-bottom);
@supports not (padding-bottom: env(safe-area-inset-bottom)) {
padding-bottom: 0;
@media (max-width: 600px) {
@supports (padding-bottom: env(safe-area-inset-bottom)) {
padding-bottom: env(safe-area-inset-bottom);
}
}
}
@ -78,11 +78,12 @@
&.mobile.symbolMenuOpen :global(.modal-dialog) {
transition: var(--layer-transition);
transform: translate3d(0, calc((var(--symbol-menu-height)) * -1), 0);
transform: translate3d(0, calc((var(--symbol-menu-height) - env(safe-area-inset-bottom)) * -1), 0);
@supports not (bottom: env(safe-area-inset-bottom)) {
transform: translate3d(0, calc((var(--symbol-menu-height)) * -1), 0);
@media (max-width: 600px) {
@supports (bottom: env(safe-area-inset-bottom)) {
transform: translate3d(0, calc((var(--symbol-menu-height) - env(safe-area-inset-bottom)) * -1), 0);
}
}
}

11
src/components/middle/composer/Composer.scss
View File

@ -4,15 +4,14 @@
.select-mode-active + .middle-column-footer & {
position: absolute;
padding-right: 2rem;
bottom: env(safe-area-inset-bottom);
// Target: Old Firefox (Waterfox Classic)
@supports not (bottom: env(safe-area-inset-bottom)) {
bottom: 0;
}
bottom: 0;
@media (max-width: 600px) {
padding-right: 1rem;
@supports (bottom: env(safe-area-inset-bottom)) {
bottom: env(safe-area-inset-bottom);
}
}
&::before {

21
src/components/middle/composer/SymbolMenu.scss
View File

@ -16,9 +16,9 @@
transition: transform var(--layer-transition);
padding-right: env(safe-area-inset-right);
padding-bottom: env(safe-area-inset-bottom);
padding-bottom: 0;
padding-left: env(safe-area-inset-left);
transform: translate3d(0, calc(var(--symbol-menu-height) + env(safe-area-inset-bottom)), 0);
transform: translate3d(0, calc(var(--symbol-menu-height)), 0);
&.open:not(.in-attachment-modal) {
transform: translate3d(0, 0, 0);
@ -36,11 +36,17 @@
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-right: env(safe-area-inset-right)) {
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
transform: translate3d(0, calc(var(--symbol-menu-height)), 0);
}
@media (max-width: 600px) {
@supports not (padding-right: env(safe-area-inset-right)) {
padding-bottom: env(safe-area-inset-bottom);
transform: translate3d(0, calc(var(--symbol-menu-height) + env(safe-area-inset-bottom)), 0);
}
}
body.no-page-transitions & {
transition: none;
}
@ -52,11 +58,12 @@
&-main {
height: calc(var(--symbol-menu-height) - var(--symbol-menu-footer-height));
max-height: calc(100vh - var(--symbol-menu-footer-height) - env(safe-area-inset-bottom));
max-height: calc(100vh - var(--symbol-menu-footer-height));
// Target: Old Firefox (Waterfox Classic)
@supports not (max-height: calc(100vh - var(--symbol-menu-footer-height) - env(safe-area-inset-bottom))) {
max-height: calc(100vh - var(--symbol-menu-footer-height));
@media (max-width: 600px) {
@supports (max-height: calc(100vh - var(--symbol-menu-footer-height) - env(safe-area-inset-bottom))) {
max-height: calc(100vh - var(--symbol-menu-footer-height) - env(safe-area-inset-bottom));
}
}
}