Transitions UI to react.js #1

Merged
kfj001 merged 7 commits from kryz-go-react-js into main 2026-04-28 12:57:09 -07:00
3 changed files with 12 additions and 5 deletions
Showing only changes of commit 4bbcc7d537 - Show all commits
+1 -1
View File
@@ -32,7 +32,7 @@ export type CapacitorWindow = Window & {
export type PlaybackState = 'stopped' | 'playing' | 'error';
export const STREAM_URL = 'https://kryz.out.airtime.pro/kryz_b';
export const STREAM_URL = 'https://kryz.out.airtime.pro/kryz_a';
export class AudioPlayer {
private url: string;
+7
View File
@@ -87,6 +87,13 @@ button {
transition: transform 120ms ease, background 120ms ease;
}
button.playpause {
width: 100%;
aspect-ratio: 1;
font-size: clamp(2rem, 25vw, 6em);
padding: 0;
}
button:hover:not(:disabled) {
background: var(--primary-press);
}
+4 -4
View File
@@ -48,11 +48,11 @@ export default function HomePage() {
</p>
<div className="controls">
<button type="button" onClick={() => void player.play(backgroundMode)} disabled={isPlaying}>
Play
<button type="button" className='playpause' onClick={() => void player.play(backgroundMode)} disabled={isPlaying}>
</button>
<button type="button" onClick={() => player.stop()} disabled={!isPlaying}>
Stop
<button type="button" className='playpause' onClick={() => player.stop()} disabled={!isPlaying}>
</button>
</div>