diff --git a/src/components/Nickname.js b/src/components/Nickname.js index 5600ab4..72fee68 100644 --- a/src/components/Nickname.js +++ b/src/components/Nickname.js @@ -49,7 +49,6 @@ function Nickname({ nickname, stream }) { sx={{ position: "relative", cursor: stream ? "pointer" : "default", - fontSize: "12px", }} onClick={() => { if (stream) { diff --git a/src/components/StartStreamButton.js b/src/components/StartStreamButton.js index 4710cbc..2597f1a 100644 --- a/src/components/StartStreamButton.js +++ b/src/components/StartStreamButton.js @@ -1,5 +1,5 @@ import React, { useState } from "react"; -import { IconButton, Box, Text, Button, Label, Flex } from "theme-ui"; +import { IconButton, Box, Text, Button, Label, Flex, Link } from "theme-ui"; import adapter from "webrtc-adapter"; import Modal from "./Modal"; @@ -16,24 +16,24 @@ function StartStreamButton({ onStreamStart, onStreamEnd, stream }) { const unavailableMessage = ( - - Browser not supported. + + Browser not supported for audio sharing.

- See FAQ for more information. + See FAQ for more information.
); const noAudioMessage = ( - + No audio found in screen share.
Ensure "Share audio" is selected when sharing.

- See FAQ for more information. + See FAQ for more information.
); diff --git a/src/images/AudioSharingFAQ.png b/src/images/AudioSharingFAQ.png new file mode 100644 index 0000000..460d52c Binary files /dev/null and b/src/images/AudioSharingFAQ.png differ diff --git a/src/routes/FAQ.js b/src/routes/FAQ.js index e0ed503..6435050 100644 --- a/src/routes/FAQ.js +++ b/src/routes/FAQ.js @@ -1,8 +1,10 @@ import React from "react"; -import { Flex, Text } from "theme-ui"; +import { Flex, Text, Link, Image } from "theme-ui"; import Footer from "../components/Footer"; +import audioSharingImage from "../images/AudioSharingFAQ.png"; + function FAQ() { return ( - - FAQ + + Frequently Asked Questions + + + Using Radio (experimental) + + + No audio found in screen share. + + + When using audio sharing you must select the{" "} + Share audio option when choosing the browser tab or + screen to share. Support for sharing audio depends on browser and + operating system. Currently Google Chrome on Windows allows you to + share the audio of any tab or an entire screen while on MacOS you can + only share the audio of a tab. For an example of selecting the{" "} + Share audio option for a tab on MacOS see Figure 1. + + + + Figure 1 Using Audio Sharing. First select what type + of content you would like to share. Second select the content. Third + select Share audio. Fourth select Share. + + + + Browser not supported for audio sharing. + + + Using audio sharing relies on the browser supporting the audio capture + feature of the Screen Capture API. Currently the two browsers that + support this are Google Chrome and Microsoft Edge. To see if your + browser is supported see the{" "} + + Browser Compatability chart + {" "} + on the Mozilla Developer Network.