ash/WebStudio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Prettier than ever!

Browse source
This commit is contained in:
Matthew Stratford 2020-04-20 15:22:14 +01:00
parent 19efe36667
commit 3b4d8bc0e9
1 changed files with 33 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/navbar/index.tsx
View file

@ -2,7 +2,12 @@ import React, { useRef, useEffect } from "react";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import Clock from "react-live-clock"; import Clock from "react-live-clock";
import { FaCircle, FaRegClock, FaRegUser, FaBroadcastTower } from "react-icons/fa"; import {
FaCircle,
FaRegClock,
FaRegUser,
FaBroadcastTower,
} from "react-icons/fa";
import { RootState } from "../rootReducer"; import { RootState } from "../rootReducer";
@ -77,7 +82,12 @@ export function NavBar() {
</div> </div>
</li> </li>
<li <li
className={"btn rounded-0 pt-2 pb-1 nav-item nav-link " + (broadcastState.stage !== "NOT_REGISTERED" ? "btn-danger active" : "btn-outline-light")} className={
"btn rounded-0 pt-2 pb-1 nav-item nav-link " +
(broadcastState.stage !== "NOT_REGISTERED"
? "btn-danger active"
: "btn-outline-light")
}
onClick={() => { onClick={() => {
switch (broadcastState.stage) { switch (broadcastState.stage) {
case "NOT_REGISTERED": case "NOT_REGISTERED":
@ -95,7 +105,13 @@ export function NavBar() {
{broadcastState.stage === "REGISTERED" && "Cancel registration"} {broadcastState.stage === "REGISTERED" && "Cancel registration"}
</li> </li>
{settings.enableRecording && ( {settings.enableRecording && (
<li className={"btn rounded-0 pt-2 pb-1 nav-item nav-link " + (broadcastState.recordingState === "CONNECTED" ? "btn-outline-danger active" : "btn-outline-warning") } <li
className={
"btn rounded-0 pt-2 pb-1 nav-item nav-link " +
(broadcastState.recordingState === "CONNECTED"
? "btn-outline-danger active"
: "btn-outline-warning")
}
onClick={() => onClick={() =>
dispatch( dispatch(
broadcastState.recordingState === "NOT_CONNECTED" broadcastState.recordingState === "NOT_CONNECTED"
@ -105,8 +121,10 @@ export function NavBar() {
} }
> >
<FaCircle size={17} /> <FaCircle size={17} />
&nbsp; &nbsp; Rec:{" "}
Rec: {broadcastState.recordingState === "CONNECTED" ? "Recording" : "Not Recording"} {broadcastState.recordingState === "CONNECTED"
? "Recording"
: "Not Recording"}
</li> </li>
)} )}
<span className="navbar-brand divider ml-3 mr-2 mt-2 mb-0"></span> <span className="navbar-brand divider ml-3 mr-2 mt-2 mb-0"></span>