[WARNING] detect mobile with maxTouchPoints

This commit is contained in:
Eduard Kuzmenko 2021-06-25 19:44:15 +03:00
parent 551fcf0060
commit 0eaa0ba689
5 changed files with 19 additions and 7 deletions

View File

@ -21,4 +21,4 @@ export const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') >
export const isMobileSafari = isSafari && isAppleMobile; export const isMobileSafari = isSafari && isAppleMobile;
export const isMobile = /* screen.width && screen.width < 480 || */navigator.userAgent.search(/iOS|iPhone OS|Android|BlackBerry|BB10|Series ?[64]0|J2ME|MIDP|opera mini|opera mobi|mobi.+Gecko|Windows Phone/i) != -1; export const isMobile = /* screen.width && screen.width < 480 || */navigator.maxTouchPoints > 0 && navigator.userAgent.search(/iOS|iPhone OS|Android|BlackBerry|BB10|Series ?[64]0|J2ME|MIDP|opera mini|opera mobi|mobi.+Gecko|Windows Phone/i) != -1;

View File

@ -39,4 +39,8 @@
@else if $media == esg-bottom { @else if $media == esg-bottom {
@media only screen and (max-height: 569px) { @content; } @media only screen and (max-height: 569px) { @content; }
} }
@else if $media == esg-bottom-new {
@media only screen and (max-height: 569px), only screen and (max-width: $small-screen) { @content; }
}
} }

View File

@ -15,6 +15,10 @@
left: 0; left: 0;
width: auto !important; width: auto !important;
@include respond-to(esg-bottom-new) {
bottom: calc(100% + .5rem);
}
&:not(.is-visible) { &:not(.is-visible) {
display: none; display: none;
} }

View File

@ -110,7 +110,7 @@ $chat-helper-size: 39px;
.menu-send { .menu-send {
top: auto; top: auto;
bottom: calc(100% + 10px); bottom: calc(100% + .5rem);
//right: var(--chat-input-padding); //right: var(--chat-input-padding);
} }
@ -817,7 +817,11 @@ $chat-helper-size: 39px;
.btn-menu { .btn-menu {
right: calc(var(--padding-horizontal) * -1 - .125rem); right: calc(var(--padding-horizontal) * -1 - .125rem);
bottom: calc(100% + 1.25rem); bottom: calc(100% + 1.125rem);
@include respond-to(esg-bottom-new) {
bottom: calc(100% + .875rem);
}
> div { > div {
padding: 0 38px 0 16px; padding: 0 38px 0 16px;

View File

@ -18,10 +18,10 @@
@include respond-to(esg-top) { @include respond-to(esg-top) {
position: absolute !important; position: absolute !important;
left: $chat-padding; left: $chat-padding;
bottom: 84px; bottom: 5.125rem;
width: 420px !important; width: 26.25rem !important;
height: 420px; height: 26.25rem;
max-height: 420px; max-height: 26.25rem;
box-shadow: 0px 5px 10px 5px rgba(16, 35, 47, .14); box-shadow: 0px 5px 10px 5px rgba(16, 35, 47, .14);
z-index: 3; z-index: 3;
border-radius: $border-radius-medium; border-radius: $border-radius-medium;