MinPluto/Zorn
MinPluto/Zorn
1
Fork 0
Code Issues Pull requests Activity

Use HTML code for icons now

Browse source
This commit is contained in:
Korbs 2024-11-09 12:08:11 -05:00
parent 93cfc7c2ce
commit d68ebbea4f
2 changed files with 12 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/Controls.astro
View file

@ -6,16 +6,8 @@ const {
SeekColor = '#ff274d'
} = Astro.props
// Icons
import {
RewindSolid,
Enlarge,
ForwardSolid,
PlaySolid,
Refresh,
SoundHighSolid,
MultiWindow
} from "@iconoir/vue"
// Icons and Styles
import './Iconoir.css'
---
<div class="video-controls">
@ -23,17 +15,17 @@ import {
<p>{Title}</p>
</div>
<div class="vc-bottom">
<button style="display: none" id="vc-playagain"><Refresh /></button>
<button style="display: none" id="vc-playagain"><i class="iconoir-refresh"></i></button>
<div class="vc-start">
<button id="vc-playpause"><PlaySolid /></button>
<button id="vc-playpause"><i class="iconoir-play-solid"></i></button>
{Live ?
null
:
<button id="vc-backwards"><RewindSolid /></button>
<button id="vc-forwards"><ForwardSolid /></button>
<button id="vc-backwards"><i class="iconoir-rewind-solid"></i></button>
<button id="vc-forwards"><i class="iconoir-forward-solid"></i></button>
}
<div class="vc-volume-controller">
<button><SoundHighSolid/></button>
<button><i class="iconoir-sound-high-solid"></i></button>
<div class="vc-volume-controller-input">
<span style={`background: lightblue`} class="vc-volume-bar"></span>
<input type="range" min="0" max="1.0" step="0.01"/>
@ -63,8 +55,8 @@ import {
}
<slot/>
<!-- The requestPictureInPicture() function is not supported in Firefox -->
<button id="vc-pip" onclick="Player.requestPictureInPicture()"><MultiWindow/></button>
<button id="vc-fullscreen"><Enlarge /></button>
<button id="vc-pip" onclick="Player.requestPictureInPicture()"><i class="iconoir-multiwindow"></i>/button>
<button id="vc-fullscreen"><i class="iconoir-enlarge"></i></button>
</div>
</div>
</div>

6
src/Player.astro
View file

@ -19,9 +19,9 @@ import Controller from './Controls/Controller.astro'
import Seek from './Controls/Seek.astro'
import Sync from './Controls/Sync.astro'
// Styles
// Icons and Styles
import './Index.scss'
import { Settings } from '@iconoir/vue'
import './Iconoir.css'
---
<div class="video-container" id={"zorn-player-" + PlayerName}>
@ -31,7 +31,7 @@ import { Settings } from '@iconoir/vue'
{Milieu ? <MilieuEffect/> : null }
{SettingsMenu ?
<Controls PlayerName={PlayerName} Live={Live}>
<button id="open-zorn-settings-button" onclick="OpenZornMenu()"><Settings/></button>
<button id="open-zorn-settings-button" onclick="OpenZornMenu()"><i class="iconoir-settings"></i></button>
<slot/>
</Controls>
: