Refactor/redesign video tiles

This commit is contained in:
Robin
2023-12-01 17:43:09 -05:00
parent 0ab3e0e090
commit b2bc8edcc1
28 changed files with 1086 additions and 709 deletions

View File

@@ -30,9 +30,6 @@ import SettingsSolidIcon from "@vector-im/compound-design-tokens/icons/settings-
import ChevronDownIcon from "@vector-im/compound-design-tokens/icons/chevron-down.svg?react";
import styles from "./Button.module.css";
import Fullscreen from "../icons/Fullscreen.svg?react";
import FullscreenExit from "../icons/FullscreenExit.svg?react";
import { VolumeIcon } from "./VolumeIcon";
export type ButtonVariant =
| "default"
@@ -230,45 +227,3 @@ export const SettingsButton: FC<{
</Tooltip>
);
};
interface AudioButtonProps extends Omit<Props, "variant"> {
/**
* A number between 0 and 1
*/
volume: number;
}
export const AudioButton: FC<AudioButtonProps> = ({ volume, ...rest }) => {
const { t } = useTranslation();
return (
<Tooltip label={t("local_volume_label")}>
<Button variant="icon" {...rest}>
<VolumeIcon volume={volume} aria-label={t("local_volume_label")} />
</Button>
</Tooltip>
);
};
interface FullscreenButtonProps extends Omit<Props, "variant"> {
fullscreen?: boolean;
}
export const FullscreenButton: FC<FullscreenButtonProps> = ({
fullscreen,
...rest
}) => {
const { t } = useTranslation();
const Icon = fullscreen ? FullscreenExit : Fullscreen;
const label = fullscreen
? t("exit_fullscreen_button_label")
: t("fullscreen_button_label");
return (
<Tooltip label={label}>
<Button variant="icon" {...rest}>
<Icon aria-label={label} />
</Button>
</Tooltip>
);
};