OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Tweak call lobby buttons to more closely match designs (#9943)

pull/28788/head^2
Robin 2023-01-20 08:45:27 -05:00 committed by GitHub
parent 97831d528a
commit da30b3069c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
res/css/views/voip/_CallView.pcss
View File

@ -160,7 +160,7 @@ limitations under the License.
content: ""; content: "";
display: inline-block; display: inline-block;
mask-image: url("$(res)/img/feather-customised/chevron-down.svg"); mask-image: url("$(res)/img/feather-customised/chevron-down.svg");
mask-size: $size; mask-size: 20px;
mask-position: center; mask-position: center;
background-color: $call-primary-content; background-color: $call-primary-content;
height: 100%; height: 100%;
@ -181,7 +181,7 @@ limitations under the License.
.mx_CallView_deviceButton { .mx_CallView_deviceButton {
&.mx_CallView_deviceButton_audio::before { &.mx_CallView_deviceButton_audio::before {
mask-image: url("$(res)/img/element-icons/Mic-off.svg"); mask-image: url("$(res)/img/element-icons/Mic-off.svg");
mask-size: 14px; mask-size: 18px;
} }
&.mx_CallView_deviceButton_video::before { &.mx_CallView_deviceButton_video::before {

6
src/components/views/voip/CallView.tsx
View File

@ -38,7 +38,7 @@ import IconizedContextMenu, {
IconizedContextMenuOption, IconizedContextMenuOption,
IconizedContextMenuOptionList, IconizedContextMenuOptionList,
} from "../context_menus/IconizedContextMenu"; } from "../context_menus/IconizedContextMenu";
import { aboveLeftOf, ContextMenuButton, useContextMenu } from "../../structures/ContextMenu"; import { aboveRightOf, ContextMenuButton, useContextMenu } from "../../structures/ContextMenu";
import { Alignment } from "../elements/Tooltip"; import { Alignment } from "../elements/Tooltip";
import { ButtonEvent } from "../elements/AccessibleButton"; import { ButtonEvent } from "../elements/AccessibleButton";
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton"; import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
@ -81,7 +81,7 @@ const DeviceButton: FC<DeviceButtonProps> = ({
if (showMenu) { if (showMenu) {
const buttonRect = buttonRef.current!.getBoundingClientRect(); const buttonRect = buttonRef.current!.getBoundingClientRect();
contextMenu = ( contextMenu = (
<IconizedContextMenu {...aboveLeftOf(buttonRect)} onFinished={closeMenu}> <IconizedContextMenu {...aboveRightOf(buttonRect, undefined, 10)} onFinished={closeMenu}>
<IconizedContextMenuOptionList> <IconizedContextMenuOptionList>
{devices.map((d) => ( {devices.map((d) => (
<IconizedContextMenuOption key={d.deviceId} label={d.label} onClick={() => selectDevice(d)} /> <IconizedContextMenuOption key={d.deviceId} label={d.label} onClick={() => selectDevice(d)} />
@ -101,6 +101,7 @@ const DeviceButton: FC<DeviceButtonProps> = ({
> >
<AccessibleTooltipButton <AccessibleTooltipButton
className={`mx_CallView_deviceButton mx_CallView_deviceButton_${kind}`} className={`mx_CallView_deviceButton mx_CallView_deviceButton_${kind}`}
inputRef={buttonRef}
title={muted ? mutedTitle : unmutedTitle} title={muted ? mutedTitle : unmutedTitle}
alignment={Alignment.Top} alignment={Alignment.Top}
onClick={toggle} onClick={toggle}
@ -109,7 +110,6 @@ const DeviceButton: FC<DeviceButtonProps> = ({
{devices.length > 1 ? ( {devices.length > 1 ? (
<ContextMenuButton <ContextMenuButton
className="mx_CallView_deviceListButton" className="mx_CallView_deviceListButton"
inputRef={buttonRef}
onClick={openMenu} onClick={openMenu}
isExpanded={showMenu} isExpanded={showMenu}
label={deviceListLabel} label={deviceListLabel}