diff --git a/bigbluebutton-html5/imports/ui/components/audio/permissions-overlay/styles.scss b/bigbluebutton-html5/imports/ui/components/audio/permissions-overlay/styles.scss index df7f8b2322d2f4130eff89382b7ff614a511ec7a..5b84f1dcb4306aa85621299234af846b8bc0504b 100644 --- a/bigbluebutton-html5/imports/ui/components/audio/permissions-overlay/styles.scss +++ b/bigbluebutton-html5/imports/ui/components/audio/permissions-overlay/styles.scss @@ -11,6 +11,7 @@ --position-left-safari-1280: 53em; --position-left-safari-1440: 58em; --position-left-safari-1680: 65em; + --position-left-safari-1920: 68em; --arrow-top: -65px; --arrow-left: -20px; --arrow-top-edge: -2.5rem; @@ -66,6 +67,9 @@ @include mq($safari1680) { left: var(--position-left-safari-1680); } + @include mq($safari1920) { + left: var(--position-left-safari-1920); + } } } diff --git a/bigbluebutton-html5/imports/ui/stylesheets/variables/breakpoints.scss b/bigbluebutton-html5/imports/ui/stylesheets/variables/breakpoints.scss index f2248826eb4c90392c7a6bea355a9e6b53749ecc..9776f4ca008216a694432bc6ea753ea95add6340 100644 --- a/bigbluebutton-html5/imports/ui/stylesheets/variables/breakpoints.scss +++ b/bigbluebutton-html5/imports/ui/stylesheets/variables/breakpoints.scss @@ -44,9 +44,10 @@ $xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (m $hasPhoneDimentions: "#{$screen} and (max-height: 479px), #{$screen} and (max-width: 479px)"; //Breakpoints used for permissions-overlay as relative units are not scalling properly on safari -$safari1280: "#{$screen} and (max-height: 1280px) and (max-width: 800px)"; -$safari1440: "#{$screen} and (max-height: 1440px) and (max-width: 900px)"; -$safari1680: "#{$screen} and (max-height: 1680px) and (max-width: 1050px)"; +$safari1280: "#{$screen} and (max-height: 1280px), #{$screen} and (max-width: 800px)"; +$safari1440: "#{$screen} and (max-height: 1440px), #{$screen} and (max-width: 900px)"; +$safari1680: "#{$screen} and (max-height: 1680px), #{$screen} and (max-width: 1050px)"; +$safari1920: "#{$screen} and (max-height: 1920px), #{$screen} and (max-width: 1080px)"; $breakpoints: ( 'screen': $screen,