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

Drop Waterfox Classic support (#4237)

Browse Source
This commit is contained in:
Alexander Zinchuk 2024-02-06 16:49:28 +01:00
parent 13f436861d
commit 0ba12d4dd5
19 changed files with 31 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
public/compatTest.js
View File

@ -3,8 +3,13 @@ function compatTest() {
var hasWebSockets = typeof WebSocket !== 'undefined'; var hasWebSockets = typeof WebSocket !== 'undefined';
var hasWebCrypto = window.crypto && typeof window.crypto.subtle !== 'undefined'; var hasWebCrypto = window.crypto && typeof window.crypto.subtle !== 'undefined';
var hasObjectFromEntries = typeof Object.fromEntries !== 'undefined'; var hasObjectFromEntries = typeof Object.fromEntries !== 'undefined';
var hasResizeObserver = typeof window.ResizeObserver !== 'undefined';
var hasCssSupports = window.CSS && typeof window.CSS.supports === 'function';
var hasIntl = typeof window.Intl !== 'undefined';
var hasDisplayNames = hasIntl && typeof Intl.DisplayNames !== 'undefined';
var isCompatible = hasPromise && hasWebSockets && hasWebCrypto && hasObjectFromEntries; var isCompatible = hasPromise && hasWebSockets && hasWebCrypto && hasObjectFromEntries && hasResizeObserver
&& hasCssSupports && hasDisplayNames;
if (isCompatible || (window.localStorage && window.localStorage.getItem('tt-ignore-compat'))) { if (isCompatible || (window.localStorage && window.localStorage.getItem('tt-ignore-compat'))) {
window.isCompatTestPassed = true; window.isCompatTestPassed = true;
@ -17,6 +22,9 @@ function compatTest() {
console.warn('WebSocket', hasWebSockets); console.warn('WebSocket', hasWebSockets);
console.warn('WebCrypto', hasWebCrypto); console.warn('WebCrypto', hasWebCrypto);
console.warn('Object.fromEntries', hasObjectFromEntries); console.warn('Object.fromEntries', hasObjectFromEntries);
console.warn('ResizeObserver', hasResizeObserver);
console.warn('CSS.supports', hasCssSupports);
console.warn('Intl.DisplayNames', hasDisplayNames);
} }
document.body.innerHTML = '<iframe src="./unsupported.html" width="100%" height="100%">'; document.body.innerHTML = '<iframe src="./unsupported.html" width="100%" height="100%">';

5
src/components/common/Composer.scss
View File

@ -10,10 +10,7 @@
@media (max-width: 600px) { @media (max-width: 600px) {
padding-right: 1rem; padding-right: 1rem;
bottom: env(safe-area-inset-bottom);
@supports (bottom: env(safe-area-inset-bottom)) {
bottom: env(safe-area-inset-bottom);
}
} }
&::before { &::before {

6
src/components/main/Main.scss
View File

@ -118,12 +118,6 @@
left: env(safe-area-inset-left) !important; left: env(safe-area-inset-left) !important;
width: calc(100vw - env(safe-area-inset-left)) !important; width: calc(100vw - env(safe-area-inset-left)) !important;
// Target: Old Firefox (Waterfox Classic)
@supports not (left: env(safe-area-inset-left)) {
left: 0 !important;
width: 100vw !important;
}
// Fix: when opening the SymbolMenu, the chat list flashes in the background // Fix: when opening the SymbolMenu, the chat list flashes in the background
body.is-symbol-menu-open &::before { body.is-symbol-menu-open &::before {
content: ''; content: '';

29
src/components/mediaViewer/MediaViewer.scss
View File

@ -89,15 +89,6 @@
} }
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (padding: 0.5rem max(1.25rem, env(safe-area-inset-left))) {
padding: 0.5rem 1.25rem;
@media (max-width: 600px) {
padding: 0.5rem;
}
}
body.is-electron.is-macos & { body.is-electron.is-macos & {
-webkit-app-region: drag; -webkit-app-region: drag;
} }
@ -161,16 +152,6 @@
right: env(safe-area-inset-right); right: env(safe-area-inset-right);
transform: scaleX(-1); transform: scaleX(-1);
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (left: env(safe-area-inset-left)) {
left: 0;
&[dir="rtl"] {
left: auto;
right: 0;
}
}
} }
&.next { &.next {
@ -183,16 +164,6 @@
left: env(safe-area-inset-left); left: env(safe-area-inset-left);
transform: scaleX(-1); transform: scaleX(-1);
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (right: env(safe-area-inset-right)) {
right: 0;
&[dir="rtl"] {
right: auto;
left: 0;
}
}
} }
&.inline { &.inline {

12
src/components/middle/FloatingActionButtons.module.scss
View File

@ -42,18 +42,6 @@
} }
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (right: max(1rem, env(safe-area-inset-right))) {
right: 1rem;
@media (max-width: 600px) {
right: 0.5rem;
:global(body:not(.keyboard-visible)) & {
bottom: 4.5rem;
}
}
}
&.revealed { &.revealed {
transform: translateY(0); transform: translateY(0);
opacity: 1; opacity: 1;

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

@ -32,9 +32,7 @@
bottom: 0; bottom: 0;
@media (max-width: 600px) { @media (max-width: 600px) {
@supports (bottom: calc(0px - env(safe-area-inset-bottom))) { bottom: calc(0px - env(safe-area-inset-bottom));
bottom: calc(0px - env(safe-area-inset-bottom));
}
} }
body.keyboard-visible.no-page-transitions & { body.keyboard-visible.no-page-transitions & {
@ -101,10 +99,8 @@
.last-in-list { .last-in-list {
margin-bottom: 4.25rem; margin-bottom: 4.25rem;
@supports (margin-bottom: calc(4.25rem + env(safe-area-inset-bottom))) { body:not(.keyboard-visible) & {
body:not(.keyboard-visible) & { margin-bottom: calc(4.25rem + env(safe-area-inset-bottom));
margin-bottom: calc(4.25rem + env(safe-area-inset-bottom));
}
} }
} }
} }

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

@ -9,9 +9,7 @@
margin: 0; margin: 0;
@media (max-width: 600px) { @media (max-width: 600px) {
@supports (bottom: calc(0.5rem + env(safe-area-inset-bottom))) { bottom: calc(0.5rem + env(safe-area-inset-bottom));
bottom: calc(0.5rem + env(safe-area-inset-bottom));
}
} }
.mask-image-disabled &::before { .mask-image-disabled &::before {

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

@ -192,12 +192,10 @@
top: 0; top: 0;
@media (max-width: 600px) { @media (max-width: 600px) {
@supports (padding-bottom: env(safe-area-inset-bottom)) { padding-bottom: env(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
body.keyboard-visible & { body.keyboard-visible & {
top: env(safe-area-inset-bottom); top: env(safe-area-inset-bottom);
}
} }
} }
} }
@ -325,12 +323,8 @@
} }
@media (max-width: 600px) { @media (max-width: 600px) {
padding-bottom: 0.75rem;
margin-left: -0.5rem; margin-left: -0.5rem;
padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
@supports (padding-bottom: calc(0.75rem + env(safe-area-inset-bottom))) {
padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
}
} }
.mask-image-disabled &::before { .mask-image-disabled &::before {

11
src/components/middle/MiddleHeader.scss
View File

@ -45,17 +45,6 @@
padding-right: max(0.5rem, env(safe-area-inset-right)); padding-right: max(0.5rem, env(safe-area-inset-right));
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-left: max(1.5rem, env(safe-area-inset-left))) {
padding-left: 1.5rem;
padding-right: 0.8125rem;
@media (max-width: 600px) {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
}
.Transition { .Transition {
width: 100%; width: 100%;
// https://dfmcphee.com/flex-items-and-min-width-0/ // https://dfmcphee.com/flex-items-and-min-width-0/

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

@ -15,12 +15,6 @@
margin-left: 0.25rem; margin-left: 0.25rem;
flex: 1; flex: 1;
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-left: max(0.25rem, env(safe-area-inset-left))) {
padding-left: 0.25rem;
padding-right: 0.5rem;
}
} }
#MobileSearch > .footer { #MobileSearch > .footer {
@ -42,22 +36,9 @@
} }
@media (max-width: 600px) { @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)
@supports not (padding-left: max(1rem, env(safe-area-inset-left))) {
padding-left: 1rem;
padding-right: 0.5rem;
body:not(.keyboard-visible) & { body:not(.keyboard-visible) & {
padding-bottom: 0; padding-bottom: env(safe-area-inset-bottom);
height: 3.5rem; height: calc(3.5rem + env(safe-area-inset-bottom));
} }
} }

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

@ -27,9 +27,7 @@
overflow-x: auto; overflow-x: auto;
@media (max-width: 600px) { @media (max-width: 600px) {
@supports (padding-bottom: env(safe-area-inset-bottom)) { padding-bottom: env(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
} }
} }
@ -81,9 +79,7 @@
transform: translate3d(0, calc((var(--symbol-menu-height)) * -1), 0); transform: translate3d(0, calc((var(--symbol-menu-height)) * -1), 0);
@media (max-width: 600px) { @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);
transform: translate3d(0, calc((var(--symbol-menu-height) - env(safe-area-inset-bottom)) * -1), 0);
}
} }
} }

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

@ -33,20 +33,6 @@
transform: translate3d(0, calc(var(--symbol-menu-height)), 0); transform: translate3d(0, calc(var(--symbol-menu-height)), 0);
} }
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-right: env(safe-area-inset-right)) {
padding-right: 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 & { body.no-page-transitions & {
transition: none; transition: none;
} }
@ -61,9 +47,7 @@
max-height: calc(100vh - var(--symbol-menu-footer-height)); max-height: calc(100vh - var(--symbol-menu-footer-height));
@media (max-width: 600px) { @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));
max-height: calc(100vh - var(--symbol-menu-footer-height) - env(safe-area-inset-bottom));
}
} }
} }
@ -181,12 +165,6 @@
position: absolute; position: absolute;
right: max(0.25rem, env(safe-area-inset-right)); right: max(0.25rem, env(safe-area-inset-right));
top: max(0.25rem, env(safe-area-inset-top)); top: max(0.25rem, env(safe-area-inset-top));
// Target: Old Firefox (Waterfox Classic)
@supports not (right: max(0.25rem, env(safe-area-inset-right))) {
right: 0.25rem;
top: 0.25rem;
}
} }
@media (orientation: landscape) { @media (orientation: landscape) {

5
src/components/right/RightColumn.scss
View File

@ -12,11 +12,6 @@
transition: transform var(--layer-transition); transition: transform var(--layer-transition);
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-right: env(safe-area-inset-right)) {
padding-right: 0;
}
body.no-page-transitions &, body.no-page-transitions &,
body.no-right-column-animations & { body.no-right-column-animations & {
transition: none !important; transition: none !important;

4
src/components/story/StoryFooter.module.scss
View File

@ -12,9 +12,7 @@
padding: 0 0.5rem 0.5rem; padding: 0 0.5rem 0.5rem;
} }
@supports (margin-bottom: env(safe-area-inset-bottom)) { margin-bottom: env(safe-area-inset-bottom);
margin-bottom: env(safe-area-inset-bottom);
}
} }
.viewInfo { .viewInfo {

6
src/components/story/StorySettings.module.scss
View File

@ -8,11 +8,7 @@
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
color: var(--color-text); color: var(--color-text);
height: 38rem; height: min(38rem, 90vh);
@supports (height: min(38rem, 90vh)) {
height: min(38rem, 90vh);
}
} }
.header { .header {

5
src/components/story/StoryViewModal.module.scss
View File

@ -3,10 +3,7 @@
flex-direction: column; flex-direction: column;
padding-bottom: 0 !important; padding-bottom: 0 !important;
height: 35rem; height: min(35rem, 80vh);
@supports (height: min(80vh, 35rem)) {
height: min(80vh, 35rem);
}
} }
.views-list-loading { .views-list-loading {

22
src/components/story/StoryViewer.module.scss
View File

@ -237,10 +237,7 @@
width: calc(100% - 1rem) !important; width: calc(100% - 1rem) !important;
height: auto !important; height: auto !important;
margin: 0.5rem; margin: 0.5rem;
bottom: 3.5rem; bottom: calc(3.5rem + env(safe-area-inset-bottom));
@supports (bottom: calc(3.5rem + env(safe-area-inset-bottom))) {
bottom: calc(3.5rem + env(safe-area-inset-bottom));
}
} }
:global(body.ghost-animating) & { :global(body.ghost-animating) & {
@ -522,20 +519,16 @@
.caption { .caption {
position: absolute; position: absolute;
bottom: 5rem;
left: 0; left: 0;
width: 100%; width: 100%;
top: 4rem; top: 4rem;
bottom: calc(4.25rem + env(safe-area-inset-bottom));
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-end; justify-content: flex-end;
border-radius: 0 0 var(--border-radius-default-small) var(--border-radius-default-small); border-radius: 0 0 var(--border-radius-default-small) var(--border-radius-default-small);
overflow: hidden; overflow: hidden;
pointer-events: none; pointer-events: none;
@supports (bottom: env(safe-area-inset-bottom)) {
bottom: calc(4.25rem + env(safe-area-inset-bottom));
}
} }
.captionInner { .captionInner {
@ -628,10 +621,7 @@
@media (max-width: 600px) { @media (max-width: 600px) {
padding: 0 0.5rem 0.5rem; padding: 0 0.5rem 0.5rem;
margin-bottom: env(safe-area-inset-bottom);
@supports (margin-bottom: env(safe-area-inset-bottom)) {
margin-bottom: env(safe-area-inset-bottom);
}
} }
} }
@ -694,11 +684,7 @@
.modal :global(.modal-content) { .modal :global(.modal-content) {
padding: 0.5rem !important; padding: 0.5rem !important;
max-height: 35rem; max-height: min(35rem, 80vh);
@supports (max-height: min(80vh, 35rem)) {
max-height: min(80vh, 35rem);
}
} }
.thumbnail { .thumbnail {

2
src/index.html
View File

@ -50,7 +50,6 @@
<link rel="alternate icon" href="./favicon.ico" type="image/x-icon"> <link rel="alternate icon" href="./favicon.ico" type="image/x-icon">
<link rel="manifest" id="the-manifest-placeholder" href="./<%= htmlWebpackPlugin.options.manifest %>"> <link rel="manifest" id="the-manifest-placeholder" href="./<%= htmlWebpackPlugin.options.manifest %>">
<script src="./compatTest.js"></script>
<script src="./redirect.js"></script> <script src="./redirect.js"></script>
</head> </head>
@ -61,6 +60,7 @@
<p>Please, enable JavaScript to open the app.</p> <p>Please, enable JavaScript to open the app.</p>
</noscript> </noscript>
<div id="portals"></div> <div id="portals"></div>
<script src="./compatTest.js"></script>
</body> </body>
</html> </html>

6
src/styles/_mixins.scss
View File

@ -109,12 +109,6 @@
padding-right: max(0.5rem, env(safe-area-inset-right)); padding-right: max(0.5rem, env(safe-area-inset-right));
background: var(--color-background); background: var(--color-background);
// Target: Old Firefox (Waterfox Classic)
@supports not (padding-left: max(0.75rem, env(safe-area-inset-left))) {
padding-left: 0.75rem;
padding-right: 0.5rem;
}
&::before { &::before {
content: ""; content: "";
display: block; display: block;