diff --git a/src/pages/settings/panes/Audio.tsx b/src/pages/settings/panes/Audio.tsx index a6e90bf7..843eb4cf 100644 --- a/src/pages/settings/panes/Audio.tsx +++ b/src/pages/settings/panes/Audio.tsx @@ -1,3 +1,4 @@ +import styles from "./Panes.module.scss"; import { Text } from "preact-i18n"; import { useEffect, useState } from "preact/hooks"; @@ -7,6 +8,7 @@ import { voiceState } from "../../../lib/vortex/VoiceState"; import { connectState } from "../../../redux/connector"; +import Button from "../../../components/ui/Button"; import ComboBox from "../../../components/ui/ComboBox"; import Overline from "../../../components/ui/Overline"; import Tip from "../../../components/ui/Tip"; @@ -51,10 +53,6 @@ export function Component() { } }; - useEffect(() => { - askOrGetPermission(); - }, []); - useEffect(() => { if (!mediaStream) { return; @@ -71,7 +69,7 @@ export function Component() { }, [mediaStream]); const handleAskForPermission = ( - ev: JSX.TargetedMouseEvent, + ev: JSX.TargetedMouseEvent, ) => { stopPropagation(ev); setError(undefined); @@ -80,10 +78,25 @@ export function Component() { return ( <> -
+

+ + {!permission && ( +
+ + + + +
+ )} + diff --git a/src/pages/settings/panes/Panes.module.scss b/src/pages/settings/panes/Panes.module.scss index 67d068eb..35cecdb3 100644 --- a/src/pages/settings/panes/Panes.module.scss +++ b/src/pages/settings/panes/Panes.module.scss @@ -134,6 +134,21 @@ } } +.audio { + .grant_permission { + margin-bottom: 18px; + .description { + font-weight: 400; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 3; + overflow: hidden; + font-size: 12px; + margin-bottom: 8px; + } + } +} + .appearance { .theme { min-width: 0;