1 .participants_pane { 2 background-color: $participantsPaneBgColor; 3 flex-shrink: 0; 4 overflow: hidden; 5 position: relative; 6 transition: width .16s ease-in-out; 7 width: 315px; 8 z-index: $zindex0; 9 } 10 11 .participants_pane-content { 12 display: flex; 13 flex-direction: column; 14 font-weight: 600; 15 height: 100%; 16 width: 315px; 17 18 & > *:first-child, 19 & > *:last-child { 20 flex-shrink: 0; 21 } 22 } 23 24 @media (max-width: 580px) { 25 .participants_pane { 26 height: 100vh; 27 height: -webkit-fill-available; 28 left: 0; 29 position: fixed; 30 right: 0; 31 top: 0; 32 width: auto; 33 } 34 35 .participants_pane-content { 36 width: 100%; 37 } 38 } 39 40 .jitsi-icon { 41 &-dominant-speaker { 42 background-color: #1EC26A; 43 border-radius: 3px; 44 } 45 } 46 47 .mobile-browser.shift-right { 48 .participants_pane { 49 z-index: -1; 50 } 51 }