fix(ui): fix assist ui stuff
This commit is contained in:
parent
c7fc3124db
commit
da4b2480c9
5 changed files with 60 additions and 42 deletions
|
|
@ -1,12 +1,12 @@
|
|||
import React from 'react'
|
||||
import { INDEXES } from 'App/constants/zindex'
|
||||
import React from 'react';
|
||||
import { INDEXES } from 'App/constants/zindex';
|
||||
import { connect } from 'react-redux';
|
||||
import { Button, Loader, Icon } from 'UI'
|
||||
import { Button, Loader, Icon } from 'UI';
|
||||
import { initiateCallEnd, releaseRemoteControl } from 'Player';
|
||||
|
||||
interface Props {
|
||||
userDisplayName: string
|
||||
type: WindowType
|
||||
userDisplayName: string;
|
||||
type: WindowType;
|
||||
}
|
||||
|
||||
export enum WindowType {
|
||||
|
|
@ -18,27 +18,36 @@ const WIN_VARIANTS = {
|
|||
[WindowType.Call]: {
|
||||
text: 'to accept the call',
|
||||
icon: 'call' as const,
|
||||
action: initiateCallEnd
|
||||
action: initiateCallEnd,
|
||||
},
|
||||
[WindowType.Control]: {
|
||||
text: 'to accept remote control request',
|
||||
icon: 'remote-control' as const,
|
||||
action: releaseRemoteControl
|
||||
}
|
||||
}
|
||||
action: releaseRemoteControl,
|
||||
},
|
||||
};
|
||||
|
||||
function RequestingWindow({ userDisplayName, type }: Props) {
|
||||
return (
|
||||
<div className="w-full h-full absolute top-0 left-0 flex items-center justify-center" style={{ background: "rgba(0,0,0, 0.30)", zIndex: INDEXES.PLAYER_REQUEST_WINDOW}}>
|
||||
<div className="rounded bg-white py-4 px-8 flex flex-col text-lg items-center max-w-lg text-center">
|
||||
<Icon size={40} color="teal" name={WIN_VARIANTS[type].icon} className='mb-4'/>
|
||||
<div>Waiting for <span className="font-semibold">{userDisplayName}</span></div>
|
||||
<span>{WIN_VARIANTS[type].text}</span>
|
||||
<Loader size={30} style={{ minHeight: 60 }} />
|
||||
<Button variant="text-primary" onClick={WIN_VARIANTS[type].action}>Cancel</Button>
|
||||
<div
|
||||
className="w-full h-full absolute top-0 left-0 flex items-center justify-center"
|
||||
style={{ background: 'rgba(0,0,0, 0.30)', zIndex: INDEXES.PLAYER_REQUEST_WINDOW }}
|
||||
>
|
||||
<div className="rounded bg-white pt-4 pb-2 px-8 flex flex-col text-lg items-center max-w-lg text-center">
|
||||
<Icon size={40} color="teal" name={WIN_VARIANTS[type].icon} className="mb-4" />
|
||||
<div>
|
||||
Waiting for <span className="font-semibold">{userDisplayName}</span>
|
||||
</div>
|
||||
<span>{WIN_VARIANTS[type].text}</span>
|
||||
<Loader size={30} style={{ minHeight: 60 }} />
|
||||
<Button variant="text-primary" onClick={WIN_VARIANTS[type].action}>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
export default connect((state) => ({ userDisplayName: state.getIn(['sessions', 'current', 'userDisplayName']) }))(RequestingWindow)
|
||||
export default connect((state) => ({
|
||||
userDisplayName: state.getIn(['sessions', 'current', 'userDisplayName']),
|
||||
}))(RequestingWindow);
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ import {
|
|||
} from 'Player/MessageDistributor/managers/AssistManager';
|
||||
import RequestLocalStream from 'Player/MessageDistributor/managers/LocalStream';
|
||||
import type { LocalStream } from 'Player/MessageDistributor/managers/LocalStream';
|
||||
|
||||
import { Tooltip } from 'react-tippy';
|
||||
import { toast } from 'react-toastify';
|
||||
import { confirm } from 'UI';
|
||||
import stl from './AassistActions.module.css';
|
||||
|
|
@ -69,6 +69,8 @@ function AssistActions({
|
|||
const callRequesting = calling === CallingState.Connecting;
|
||||
const cannotCall =
|
||||
peerConnectionStatus !== ConnectionStatus.Connected || (isEnterprise && !hasPermission);
|
||||
|
||||
const remoteRequesting = remoteControlStatus === RemoteControlStatus.Requesting;
|
||||
const remoteActive = remoteControlStatus === RemoteControlStatus.Enabled;
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -130,7 +132,7 @@ function AssistActions({
|
|||
}
|
||||
|
||||
const confirmCall = async () => {
|
||||
if (callRequesting) return;
|
||||
if (callRequesting || remoteRequesting) return;
|
||||
|
||||
if (
|
||||
await confirm({
|
||||
|
|
@ -144,7 +146,7 @@ function AssistActions({
|
|||
};
|
||||
|
||||
const requestControl = () => {
|
||||
if (callRequesting) return;
|
||||
if (callRequesting || remoteRequesting) return;
|
||||
requestReleaseRemoteControl();
|
||||
};
|
||||
|
||||
|
|
@ -171,22 +173,25 @@ function AssistActions({
|
|||
<div className={stl.divider} />
|
||||
</>
|
||||
)}
|
||||
<div
|
||||
className={cn('cursor-pointer p-2 flex items-center', {
|
||||
[stl.disabled]: cannotCall || !livePlay || callRequesting,
|
||||
})}
|
||||
onClick={requestControl}
|
||||
role="button"
|
||||
>
|
||||
<Button
|
||||
icon={remoteActive ? 'window-x' : 'remote-control'}
|
||||
variant={remoteActive ? 'text-red' : 'text-primary'}
|
||||
style={{ height: '28px' }}
|
||||
|
||||
{/* @ts-ignore */}
|
||||
<Tooltip title="Go live to initiate remote control" disabled={livePlay}>
|
||||
<div
|
||||
className={cn('cursor-pointer p-2 flex items-center', {
|
||||
[stl.disabled]: cannotCall || !livePlay || callRequesting || remoteRequesting,
|
||||
})}
|
||||
onClick={requestControl}
|
||||
role="button"
|
||||
>
|
||||
Remote Control
|
||||
</Button>
|
||||
{/* <IconButton label={`Remote Control`} icon={remoteActive ? 'window-x' : 'remote-control'} primaryText redText={remoteActive} /> */}
|
||||
</div>
|
||||
<Button
|
||||
icon={remoteActive ? 'window-x' : 'remote-control'}
|
||||
variant={remoteActive ? 'text-red' : 'text-primary'}
|
||||
style={{ height: '28px' }}
|
||||
>
|
||||
Remote Control
|
||||
</Button>
|
||||
</div>
|
||||
</Tooltip>
|
||||
<div className={stl.divider} />
|
||||
|
||||
<Popup
|
||||
|
|
@ -198,7 +203,7 @@ function AssistActions({
|
|||
>
|
||||
<div
|
||||
className={cn('cursor-pointer p-2 flex items-center', {
|
||||
[stl.disabled]: cannotCall || callRequesting,
|
||||
[stl.disabled]: cannotCall || callRequesting || remoteRequesting,
|
||||
})}
|
||||
onClick={onCall ? callObject?.end : confirmCall}
|
||||
role="button"
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ const SVG = (props: Props) => {
|
|||
case 'calendar-check': return <svg viewBox="0 0 448 512" width={ `${ width }px` } height={ `${ height }px` } ><path d="M400 64h-48V12c0-6.627-5.373-12-12-12h-8c-6.627 0-12 5.373-12 12v52H128V12c0-6.627-5.373-12-12-12h-8c-6.627 0-12 5.373-12 12v52H48C21.49 64 0 85.49 0 112v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zM48 96h352c8.822 0 16 7.178 16 16v48H32v-48c0-8.822 7.178-16 16-16zm352 384H48c-8.822 0-16-7.178-16-16V192h384v272c0 8.822-7.178 16-16 16zm-66.467-194.937-134.791 133.71c-4.7 4.663-12.288 4.642-16.963-.046l-67.358-67.552c-4.683-4.697-4.672-12.301.024-16.985l8.505-8.48c4.697-4.683 12.301-4.672 16.984.024l50.442 50.587 117.782-116.837c4.709-4.671 12.313-4.641 16.985.068l8.458 8.527c4.672 4.709 4.641 12.313-.068 16.984z"/></svg>;
|
||||
case 'calendar-day': return <svg viewBox="0 0 448 512" width={ `${ width }px` } height={ `${ height }px` } ><path d="M400 64h-48V8c0-4.4-3.6-8-8-8h-16c-4.4 0-8 3.6-8 8v56H128V8c0-4.4-3.6-8-8-8h-16c-4.4 0-8 3.6-8 8v56H48C21.5 64 0 85.5 0 112v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48zm16 400c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16V192h384v272zm0-304H32v-48c0-8.8 7.2-16 16-16h352c8.8 0 16 7.2 16 16v48zM112 384h96c8.8 0 16-7.2 16-16v-96c0-8.8-7.2-16-16-16h-96c-8.8 0-16 7.2-16 16v96c0 8.8 7.2 16 16 16zm16-96h64v64h-64v-64z"/></svg>;
|
||||
case 'calendar': return <svg viewBox="0 0 448 512" width={ `${ width }px` } height={ `${ height }px` } ><path d="M400 64h-48V12c0-6.627-5.373-12-12-12h-8c-6.627 0-12 5.373-12 12v52H128V12c0-6.627-5.373-12-12-12h-8c-6.627 0-12 5.373-12 12v52H48C21.49 64 0 85.49 0 112v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zM48 96h352c8.822 0 16 7.178 16 16v48H32v-48c0-8.822 7.178-16 16-16zm352 384H48c-8.822 0-16-7.178-16-16V192h384v272c0 8.822-7.178 16-16 16z"/></svg>;
|
||||
case 'call': return <svg viewBox="0 0 62 77" width={ `${ width }px` } height={ `${ height }px` } ><g opacity=".5" clipPath="url(#clip0_1024_2639)"><path d="M31 5.125A25.625 25.625 0 0 0 5.375 30.75v5.125H10.5A5.125 5.125 0 0 1 15.625 41v15.375A5.125 5.125 0 0 1 10.5 61.5H5.375A5.125 5.125 0 0 1 .25 56.375V30.75a30.75 30.75 0 1 1 61.5 0V61.5a12.812 12.812 0 0 1-12.813 12.813H38.002a5.125 5.125 0 0 1-4.438 2.562h-5.126a5.125 5.125 0 0 1 0-10.25h5.125a5.124 5.124 0 0 1 4.439 2.563h10.937a7.687 7.687 0 0 0 7.687-7.688H51.5a5.125 5.125 0 0 1-5.125-5.125V41a5.125 5.125 0 0 1 5.125-5.125h5.125V30.75A25.625 25.625 0 0 0 31 5.125Z" fill="#3EAAAF"/></g></svg>;
|
||||
case 'call': return <svg viewBox="0 0 62 77" width={ `${ width }px` } height={ `${ height }px` } ><g clipPath="url(#clip0_1024_2639)"><path d="M31 5.125A25.625 25.625 0 0 0 5.375 30.75v5.125H10.5A5.125 5.125 0 0 1 15.625 41v15.375A5.125 5.125 0 0 1 10.5 61.5H5.375A5.125 5.125 0 0 1 .25 56.375V30.75a30.75 30.75 0 1 1 61.5 0V61.5a12.812 12.812 0 0 1-12.813 12.813H38.002a5.125 5.125 0 0 1-4.438 2.562h-5.126a5.125 5.125 0 0 1 0-10.25h5.125a5.124 5.124 0 0 1 4.439 2.563h10.937a7.687 7.687 0 0 0 7.687-7.688H51.5a5.125 5.125 0 0 1-5.125-5.125V41a5.125 5.125 0 0 1 5.125-5.125h5.125V30.75A25.625 25.625 0 0 0 31 5.125Z"/></g></svg>;
|
||||
case 'camera-alt': return <svg viewBox="0 0 512 512" width={ `${ width }px` } height={ `${ height }px` } ><path d="M256 408c-66.2 0-120-53.8-120-120s53.8-120 120-120 120 53.8 120 120-53.8 120-120 120zm0-208c-48.5 0-88 39.5-88 88s39.5 88 88 88 88-39.5 88-88-39.5-88-88-88zm-32 88c0-17.6 14.4-32 32-32 8.8 0 16-7.2 16-16s-7.2-16-16-16c-35.3 0-64 28.7-64 64 0 8.8 7.2 16 16 16s16-7.2 16-16zM324.3 64c3.3 0 6.3 2.1 7.5 5.2l22.1 58.8H464c8.8 0 16 7.2 16 16v288c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16V144c0-8.8 7.2-16 16-16h110.2l20.1-53.6c2.3-6.2 8.3-10.4 15-10.4h131m0-32h-131c-20 0-37.9 12.4-44.9 31.1L136 96H48c-26.5 0-48 21.5-48 48v288c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V144c0-26.5-21.5-48-48-48h-88l-14.3-38c-5.8-15.7-20.7-26-37.4-26z"/></svg>;
|
||||
case 'camera-video-off': return <svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M10.961 12.365a1.99 1.99 0 0 0 .522-1.103l3.11 1.382A1 1 0 0 0 16 11.731V4.269a1 1 0 0 0-1.406-.913l-3.111 1.382A2 2 0 0 0 9.5 3H4.272l.714 1H9.5a1 1 0 0 1 1 1v6a1 1 0 0 1-.144.518l.605.847zM1.428 4.18A.999.999 0 0 0 1 5v6a1 1 0 0 0 1 1h5.014l.714 1H2a2 2 0 0 1-2-2V5c0-.675.334-1.272.847-1.634l.58.814zM15 11.73l-3.5-1.555v-4.35L15 4.269v7.462zm-4.407 3.56-10-14 .814-.58 10 14-.814.58z"/></svg>;
|
||||
case 'camera-video': return <svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M0 5a2 2 0 0 1 2-2h7.5a2 2 0 0 1 1.983 1.738l3.11-1.382A1 1 0 0 1 16 4.269v7.462a1 1 0 0 1-1.406.913l-3.111-1.382A2 2 0 0 1 9.5 13H2a2 2 0 0 1-2-2V5zm11.5 5.175 3.5 1.556V4.269l-3.5 1.556v4.35zM2 4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h7.5a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1H2z"/></svg>;
|
||||
|
|
@ -332,7 +332,7 @@ const SVG = (props: Props) => {
|
|||
case 'quote-right': return <svg viewBox="0 0 512 512" width={ `${ width }px` } height={ `${ height }px` } ><path d="M464 32H336c-26.5 0-48 21.5-48 48v128c0 26.5 21.5 48 48 48h80v64c0 35.3-28.7 64-64 64h-8c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24h8c88.4 0 160-71.6 160-160V80c0-26.5-21.5-48-48-48zm-288 0H48C21.5 32 0 53.5 0 80v128c0 26.5 21.5 48 48 48h80v64c0 35.3-28.7 64-64 64h-8c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24h8c88.4 0 160-71.6 160-160V80c0-26.5-21.5-48-48-48z"/></svg>;
|
||||
case 'redo-back': return <svg viewBox="0 0 496 496" width={ `${ width }px` } height={ `${ height }px` } ><path d="M12 0h10c6.627 0 12 5.373 12 12v110.625C77.196 49.047 157.239-.285 248.793.001 385.18.428 496.213 112.009 496 248.396 495.786 385.181 384.834 496 248 496c-63.926 0-122.202-24.187-166.178-63.908-5.113-4.618-5.354-12.561-.482-17.433l7.069-7.069c4.503-4.503 11.749-4.714 16.482-.454C142.782 441.238 192.935 462 248 462c117.744 0 214-95.331 214-214 0-117.744-95.331-214-214-214-82.862 0-154.737 47.077-190.289 116H172c6.627 0 12 5.373 12 12v10c0 6.627-5.373 12-12 12H12c-6.627 0-12-5.373-12-12V12C0 5.373 5.373 0 12 0Z"/></svg>;
|
||||
case 'redo': return <svg viewBox="0 0 512 512" width={ `${ width }px` } height={ `${ height }px` } ><path d="M492 8h-10c-6.627 0-12 5.373-12 12v110.625C426.804 57.047 346.761 7.715 255.207 8.001 118.82 8.428 7.787 120.009 8 256.396 8.214 393.181 119.166 504 256 504c63.926 0 122.202-24.187 166.178-63.908 5.113-4.618 5.354-12.561.482-17.433l-7.069-7.069c-4.503-4.503-11.749-4.714-16.482-.454C361.218 449.238 311.065 470 256 470c-117.744 0-214-95.331-214-214 0-117.744 95.331-214 214-214 82.862 0 154.737 47.077 190.289 116H332c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h160c6.627 0 12-5.373 12-12V20c0-6.627-5.373-12-12-12z"/></svg>;
|
||||
case 'remote-control': return <svg viewBox="0 0 16 14" width={ `${ width }px` } height={ `${ height }px` } ><path d="M.59 2.59A2 2 0 0 0 0 4v8a2 2 0 0 0 .59 1.41A2 2 0 0 0 2 14h5.5a.5.5 0 0 0 0-1H2a1 1 0 0 1-.71-.29A1 1 0 0 1 1 12V7h13v1a.5.5 0 0 0 1 0V4a2 2 0 0 0-2-2H2a2 2 0 0 0-1.41.59ZM14 6H1V4a1 1 0 0 1 .29-.71A1 1 0 0 1 2 3h11a1 1 0 0 1 1 1ZM2.85 4.85a.48.48 0 0 1-.7 0 .48.48 0 0 1 0-.7.48.48 0 0 1 .7 0 .48.48 0 0 1 0 .7Zm1.5 0a.5.5 0 1 1-.7-.7.5.5 0 1 1 .7.7Zm1.5 0a.5.5 0 1 0-.7-.7.5.5 0 1 0 .7.7ZM15 15a3.48 3.48 0 1 0-2.47 1A3.46 3.46 0 0 0 15 15Zm-4.2-4.46a.31.31 0 0 1 .19 0l3.33 1.34a.33.33 0 0 1 .15.11.34.34 0 0 1 0 .37.3.3 0 0 1-.13.12l-.92.46 1 1a.35.35 0 0 1 .1.24.34.34 0 0 1-.1.23.33.33 0 0 1-.23.1.35.35 0 0 1-.24-.1l-1-1-.46.92a.3.3 0 0 1-.12.13.34.34 0 0 1-.37 0 .33.33 0 0 1-.11-.15L10.52 11a.31.31 0 0 1 0-.19.33.33 0 0 1 .26-.26Z" transform="translate(0 -2)"/></svg>;
|
||||
case 'remote-control': return <svg viewBox="0 0 16 14" width={ `${ width }px` } height={ `${ height }px` } ><path d="M.59.59A2 2 0 0 0 0 2v8a2 2 0 0 0 .59 1.41A2 2 0 0 0 2 12h5.5a.5.5 0 0 0 0-1H2a1 1 0 0 1-.71-.29A1 1 0 0 1 1 10V5h13v1a.5.5 0 0 0 1 0V2a2 2 0 0 0-2-2H2A2 2 0 0 0 .59.59ZM14 4H1V2a1 1 0 0 1 .29-.71A1 1 0 0 1 2 1h11a1 1 0 0 1 1 1ZM2.85 2.85a.48.48 0 0 1-.7 0 .48.48 0 0 1 0-.7.48.48 0 0 1 .7 0 .48.48 0 0 1 0 .7Zm1.5 0a.5.5 0 1 1-.7-.7.5.5 0 1 1 .7.7Zm1.5 0a.5.5 0 1 0-.7-.7.5.5 0 1 0 .7.7ZM15 13a3.48 3.48 0 1 0-2.47 1A3.46 3.46 0 0 0 15 13Zm-4.2-4.46a.31.31 0 0 1 .19 0l3.33 1.34a.33.33 0 0 1 .15.11.34.34 0 0 1 0 .37.3.3 0 0 1-.13.12l-.92.46 1 1a.35.35 0 0 1 .1.24.34.34 0 0 1-.1.23.33.33 0 0 1-.23.1.35.35 0 0 1-.24-.1l-1-1-.46.92a.3.3 0 0 1-.12.13.34.34 0 0 1-.37 0 .33.33 0 0 1-.11-.15L10.52 9a.31.31 0 0 1 0-.19.33.33 0 0 1 .26-.26Z"/></svg>;
|
||||
case 'replay-10': return <svg viewBox="0 0 496 496" width={ `${ width }px` } height={ `${ height }px` } ><path d="M12 0h10c6.627 0 12 5.373 12 12v110.625C77.196 49.047 157.24-.285 248.793.001 385.18.428 496.213 112.009 496 248.396 495.786 385.181 384.834 496 248 496c-63.926 0-122.202-24.187-166.178-63.908-5.113-4.618-5.354-12.561-.482-17.433l7.07-7.069c4.502-4.503 11.748-4.714 16.481-.454C142.782 441.238 192.935 462 248.001 462c117.743 0 214-95.331 214-214 0-117.744-95.332-214-214-214-82.863 0-154.738 47.077-190.29 116h114.29c6.626 0 12 5.373 12 12v10c0 6.627-5.374 12-12 12H12c-6.628 0-12-5.373-12-12V12C0 5.373 5.372 0 12 0Zm217.454 351.492h-18.886V230.315L182 230.7v-13.613l47.454-5.177v139.583Zm127.264-53.207c0 17.832-3.947 31.493-11.84 40.983-7.893 9.491-18.71 14.237-32.45 14.237-13.742 0-24.607-4.762-32.596-14.284-7.989-9.523-11.983-23.168-11.983-40.936v-33.074c0-17.768 3.978-31.429 11.935-40.983 7.957-9.555 18.774-14.332 32.451-14.332 13.741 0 24.59 4.777 32.547 14.332 7.957 9.554 11.936 23.215 11.936 40.983v33.074Zm-18.886-37.1c0-12.08-2.189-21.171-6.567-27.275-4.378-6.103-10.721-9.155-19.03-9.155-8.308 0-14.635 3.052-18.981 9.155-4.346 6.104-6.52 15.195-6.52 27.275v40.935c0 12.08 2.206 21.203 6.615 27.37 4.41 6.167 10.77 9.251 19.078 9.251 8.309 0 14.62-3.068 18.934-9.203 4.314-6.136 6.47-15.275 6.47-27.418v-40.935Z"/></svg>;
|
||||
case 'resources-icon': return <svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M13 0H6a2 2 0 0 0-2 2 2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2 2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zm0 13V4a2 2 0 0 0-2-2H5a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1zM3 4a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4z"/></svg>;
|
||||
case 'safe-fill': return <svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M9.778 9.414A2 2 0 1 1 6.95 6.586a2 2 0 0 1 2.828 2.828z"/><path d="M2.5 0A1.5 1.5 0 0 0 1 1.5V3H.5a.5.5 0 0 0 0 1H1v3.5H.5a.5.5 0 0 0 0 1H1V12H.5a.5.5 0 0 0 0 1H1v1.5A1.5 1.5 0 0 0 2.5 16h12a1.5 1.5 0 0 0 1.5-1.5v-13A1.5 1.5 0 0 0 14.5 0h-12zm3.036 4.464 1.09 1.09a3.003 3.003 0 0 1 3.476 0l1.09-1.09a.5.5 0 1 1 .707.708l-1.09 1.09c.74 1.037.74 2.44 0 3.476l1.09 1.09a.5.5 0 1 1-.707.708l-1.09-1.09a3.002 3.002 0 0 1-3.476 0l-1.09 1.09a.5.5 0 1 1-.708-.708l1.09-1.09a3.003 3.003 0 0 1 0-3.476l-1.09-1.09a.5.5 0 1 1 .708-.708zM14 6.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 1 1 0z"/></svg>;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<svg viewBox="0 0 62 77" xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.5" clip-path="url(#clip0_1024_2639)">
|
||||
<path d="M31 5.125C24.2038 5.125 17.686 7.82477 12.8804 12.6304C8.07477 17.436 5.375 23.9538 5.375 30.75V35.875H10.5C11.8592 35.875 13.1628 36.415 14.1239 37.3761C15.085 38.3372 15.625 39.6408 15.625 41V56.375C15.625 57.7342 15.085 59.0378 14.1239 59.9989C13.1628 60.96 11.8592 61.5 10.5 61.5H5.375C4.01577 61.5 2.7122 60.96 1.75108 59.9989C0.789954 59.0378 0.25 57.7342 0.25 56.375V30.75C0.25 26.7119 1.04537 22.7132 2.5907 18.9825C4.13604 15.2517 6.40106 11.8619 9.25647 9.00647C12.1119 6.15107 15.5017 3.88604 19.2325 2.3407C22.9632 0.795372 26.9619 0 31 0C35.0381 0 39.0368 0.795372 42.7675 2.3407C46.4983 3.88604 49.8881 6.15107 52.7435 9.00647C55.5989 11.8619 57.864 15.2517 59.4093 18.9825C60.9546 22.7132 61.75 26.7119 61.75 30.75V61.5C61.75 64.8981 60.4001 68.157 57.9973 70.5598C55.5945 72.9626 52.3356 74.3125 48.9375 74.3125H38.0008C37.5509 75.0916 36.904 75.7385 36.1249 76.1883C35.3459 76.6382 34.4621 76.875 33.5625 76.875H28.4375C27.0783 76.875 25.7747 76.335 24.8136 75.3739C23.8525 74.4128 23.3125 73.1092 23.3125 71.75C23.3125 70.3908 23.8525 69.0872 24.8136 68.1261C25.7747 67.165 27.0783 66.625 28.4375 66.625H33.5625C34.4621 66.625 35.3459 66.8618 36.1249 67.3117C36.904 67.7615 37.5509 68.4084 38.0008 69.1875H48.9375C50.9764 69.1875 52.9317 68.3776 54.3734 66.9359C55.8151 65.4942 56.625 63.5389 56.625 61.5H51.5C50.1408 61.5 48.8372 60.96 47.8761 59.9989C46.915 59.0378 46.375 57.7342 46.375 56.375V41C46.375 39.6408 46.915 38.3372 47.8761 37.3761C48.8372 36.415 50.1408 35.875 51.5 35.875H56.625V30.75C56.625 27.3849 55.9622 24.0527 54.6744 20.9437C53.3866 17.8348 51.4991 15.0099 49.1196 12.6304C46.7401 10.2509 43.9152 8.36336 40.8063 7.07559C37.6973 5.78781 34.3651 5.125 31 5.125V5.125Z" fill="#3EAAAF"/>
|
||||
<g clip-path="url(#clip0_1024_2639)">
|
||||
<path d="M31 5.125C24.2038 5.125 17.686 7.82477 12.8804 12.6304C8.07477 17.436 5.375 23.9538 5.375 30.75V35.875H10.5C11.8592 35.875 13.1628 36.415 14.1239 37.3761C15.085 38.3372 15.625 39.6408 15.625 41V56.375C15.625 57.7342 15.085 59.0378 14.1239 59.9989C13.1628 60.96 11.8592 61.5 10.5 61.5H5.375C4.01577 61.5 2.7122 60.96 1.75108 59.9989C0.789954 59.0378 0.25 57.7342 0.25 56.375V30.75C0.25 26.7119 1.04537 22.7132 2.5907 18.9825C4.13604 15.2517 6.40106 11.8619 9.25647 9.00647C12.1119 6.15107 15.5017 3.88604 19.2325 2.3407C22.9632 0.795372 26.9619 0 31 0C35.0381 0 39.0368 0.795372 42.7675 2.3407C46.4983 3.88604 49.8881 6.15107 52.7435 9.00647C55.5989 11.8619 57.864 15.2517 59.4093 18.9825C60.9546 22.7132 61.75 26.7119 61.75 30.75V61.5C61.75 64.8981 60.4001 68.157 57.9973 70.5598C55.5945 72.9626 52.3356 74.3125 48.9375 74.3125H38.0008C37.5509 75.0916 36.904 75.7385 36.1249 76.1883C35.3459 76.6382 34.4621 76.875 33.5625 76.875H28.4375C27.0783 76.875 25.7747 76.335 24.8136 75.3739C23.8525 74.4128 23.3125 73.1092 23.3125 71.75C23.3125 70.3908 23.8525 69.0872 24.8136 68.1261C25.7747 67.165 27.0783 66.625 28.4375 66.625H33.5625C34.4621 66.625 35.3459 66.8618 36.1249 67.3117C36.904 67.7615 37.5509 68.4084 38.0008 69.1875H48.9375C50.9764 69.1875 52.9317 68.3776 54.3734 66.9359C55.8151 65.4942 56.625 63.5389 56.625 61.5H51.5C50.1408 61.5 48.8372 60.96 47.8761 59.9989C46.915 59.0378 46.375 57.7342 46.375 56.375V41C46.375 39.6408 46.915 38.3372 47.8761 37.3761C48.8372 36.415 50.1408 35.875 51.5 35.875H56.625V30.75C56.625 27.3849 55.9622 24.0527 54.6744 20.9437C53.3866 17.8348 51.4991 15.0099 49.1196 12.6304C46.7401 10.2509 43.9152 8.36336 40.8063 7.07559C37.6973 5.78781 34.3651 5.125 31 5.125V5.125Z" />
|
||||
</g>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
|
@ -1 +1,5 @@
|
|||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 14"><path d="M.59,2.59A2,2,0,0,0,0,4v8a2,2,0,0,0,.59,1.41A2,2,0,0,0,2,14H7.5a.5.5,0,0,0,0-1H2a1,1,0,0,1-.71-.29A1,1,0,0,1,1,12V7H14V8a.5.5,0,0,0,1,0V4a2,2,0,0,0-2-2H2A2,2,0,0,0,.59,2.59ZM14,6H1V4a1,1,0,0,1,.29-.71A1,1,0,0,1,2,3H13a1,1,0,0,1,1,1ZM2.85,4.85a.48.48,0,0,1-.7,0,.48.48,0,0,1,0-.7.48.48,0,0,1,.7,0,.48.48,0,0,1,0,.7Zm1.5,0a.5.5,0,1,1-.7-.7.5.5,0,1,1,.7.7Zm1.5,0a.5.5,0,1,0-.7-.7.5.5,0,1,0,.7.7ZM15,15a3.48,3.48,0,1,0-2.47,1A3.46,3.46,0,0,0,15,15Zm-4.2-4.46a.31.31,0,0,1,.19,0l3.33,1.34a.33.33,0,0,1,.15.11.34.34,0,0,1,0,.37.3.3,0,0,1-.13.12l-.92.46,1,1a.35.35,0,0,1,.1.24.34.34,0,0,1-.1.23.33.33,0,0,1-.23.1.35.35,0,0,1-.24-.1l-1-1-.46.92a.3.3,0,0,1-.12.13.34.34,0,0,1-.37,0,.33.33,0,0,1-.11-.15L10.52,11a.31.31,0,0,1,0-.19.33.33,0,0,1,.26-.26Z" transform="translate(0 -2)" style="fill-rule:evenodd"/></svg>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 14">
|
||||
<path
|
||||
d="M.59,2.59A2,2,0,0,0,0,4v8a2,2,0,0,0,.59,1.41A2,2,0,0,0,2,14H7.5a.5.5,0,0,0,0-1H2a1,1,0,0,1-.71-.29A1,1,0,0,1,1,12V7H14V8a.5.5,0,0,0,1,0V4a2,2,0,0,0-2-2H2A2,2,0,0,0,.59,2.59ZM14,6H1V4a1,1,0,0,1,.29-.71A1,1,0,0,1,2,3H13a1,1,0,0,1,1,1ZM2.85,4.85a.48.48,0,0,1-.7,0,.48.48,0,0,1,0-.7.48.48,0,0,1,.7,0,.48.48,0,0,1,0,.7Zm1.5,0a.5.5,0,1,1-.7-.7.5.5,0,1,1,.7.7Zm1.5,0a.5.5,0,1,0-.7-.7.5.5,0,1,0,.7.7ZM15,15a3.48,3.48,0,1,0-2.47,1A3.46,3.46,0,0,0,15,15Zm-4.2-4.46a.31.31,0,0,1,.19,0l3.33,1.34a.33.33,0,0,1,.15.11.34.34,0,0,1,0,.37.3.3,0,0,1-.13.12l-.92.46,1,1a.35.35,0,0,1,.1.24.34.34,0,0,1-.1.23.33.33,0,0,1-.23.1.35.35,0,0,1-.24-.1l-1-1-.46.92a.3.3,0,0,1-.12.13.34.34,0,0,1-.37,0,.33.33,0,0,1-.11-.15L10.52,11a.31.31,0,0,1,0-.19.33.33,0,0,1,.26-.26Z"
|
||||
transform="translate(0 -2)" />
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 907 B After Width: | Height: | Size: 895 B |
Loading…
Add table
Reference in a new issue