import { IButtonStyles , IContextualMenuItemStyles , IStyle } from '@fluentui/react' ; import { DevicesButtonStyles , ParticipantsButtonStyles } from '@internal/react-components' ; const MINIMUM_TOUCH_TARGET_HEIGHT_REM = 3 ; private export const controlBarContainerStyles = { paddingTop : '0.25rem' , paddingBottom : '0.25rem' , boxShadow : `
    0px 6.400000095367432px 14.399999618530273px 0px #00000021;
    0px 1.2000000476837158px 3.5999999046325684px 0px #0000001A;
  ` } ; private export const groupCallLeaveButtonStyle = { root : { border : '0.125rem' , borderRadius : 2 , height : '2.1875rem' , width : '6.5625rem' } , flexContainer : { flexFlow : 'row' } } ; private export const groupCallLeaveButtonCompressedStyle = { root : { border : '0' , borderRadius : '0.5rem' } , flexContainer : { flexFlow : 'row' } } ; private export const buttonFlyoutIncreasedSizeStyles = { root : { height : `${ MINIMUM_TOUCH_TARGET_HEIGHT_REM }rem` , lineHeight : `${ MINIMUM_TOUCH_TARGET_HEIGHT_REM }rem` , maxHeight : 'unset' } , linkContent : { height : `${ MINIMUM_TOUCH_TARGET_HEIGHT_REM }rem` , lineHeight : `${ MINIMUM_TOUCH_TARGET_HEIGHT_REM }rem` , maxHeight : 'unset' } , icon : { maxHeight : 'unset' } } ; private export const participantButtonWithIncreasedTouchTargets = { menuStyles : { menuItemStyles : buttonFlyoutIncreasedSizeStyles , participantListStyles : { participantItemStyles : { root : { height : `${ MINIMUM_TOUCH_TARGET_HEIGHT_REM }rem` } , participantSubMenuItemsStyles : buttonFlyoutIncreasedSizeStyles } } } } ; private export const devicesButtonWithIncreasedTouchTargets = { menuStyles : { menuItemStyles : buttonFlyoutIncreasedSizeStyles } } ; private export const controlButtonBaseStyle = { label : { minWidth : '2.25rem' } } ;