mark/muzak
2
0
Fork 0
Code Issues Pull Requests Activity

dummy knopjes

Browse Source
This commit is contained in:
Mark Hoekveen
2024-03-03 23:37:30 +01:00
parent d2c0354b35
commit 1fc253421b
7 changed files with 381 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
playlist/static/img/back.svg
+68
View File
@@ -0,0 +1,68 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="prev.svg"
inkscape:export-xdpi="25.4"
inkscape:export-ydpi="25.4"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="3.9999988"
transform="matrix(-0.742144,0,0,1.2854311,26.003456,-8.0473449)" />
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1-5"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="3.9999988"
transform="matrix(-0.742144,0,0,1.2854311,50.003456,-8.0473447)" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

playlist/static/img/eject.svg
+58
View File
@@ -0,0 +1,58 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="back.svg"
inkscape:export-xdpi="25.4"
inkscape:export-ydpi="25.4"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="9.8473034"
sodipodi:cy="6.337101"
sodipodi:r1="31.498077"
sodipodi:r2="15.749038"
sodipodi:arg1="0.52359878"
sodipodi:arg2="1.5707963"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 37.125439,22.08614 -54.556271,0 27.2781355,-47.247116 z"
inkscape:transform-center-y="-5.3333328"
transform="matrix(0.87982554,0,0,0.67729001,23.336091,21.041278)" />
<rect
style="fill:#808080;stroke-width:0.295996"
id="rect1"
width="48"
height="16"
x="8"
y="42" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

playlist/static/img/forward.svg
+68
View File
@@ -0,0 +1,68 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="next.svg"
inkscape:export-xdpi="25.4"
inkscape:export-ydpi="25.4"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="-3.9999985"
transform="matrix(0.742144,0,0,1.2854311,37.996544,-8.0473449)" />
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1-5"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="-3.9999988"
transform="matrix(0.742144,0,0,1.2854311,13.996544,-8.0473447)" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

playlist/static/img/next.svg
+76
View File
@@ -0,0 +1,76 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="prev.svg"
inkscape:export-xdpi="25.4"
inkscape:export-ydpi="25.4"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="-3.9999985"
transform="matrix(0.742144,0,0,1.2854311,37.996544,-8.0473449)" />
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1-5"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="-3.9999988"
transform="matrix(0.742144,0,0,1.2854311,13.996544,-8.0473447)" />
<rect
style="fill:#808080;stroke-width:0.223385"
id="rect1"
width="8"
height="48"
x="-59.999992"
y="8"
transform="scale(-1,1)" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

playlist/static/img/prev.svg
+75
View File
@@ -0,0 +1,75 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="back.svg"
inkscape:export-xdpi="25.4"
inkscape:export-ydpi="25.4"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="3.9999988"
transform="matrix(-0.742144,0,0,1.2854311,26.003456,-8.0473449)" />
<path
sodipodi:type="star"
style="fill:#808080;stroke-width:0.264583"
id="path1-5"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="2.6995511"
sodipodi:cy="31.154797"
sodipodi:r1="21.559158"
sodipodi:r2="10.779579"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 24.258709,31.154797 -32.3387371,18.670778 0,-37.341557 z"
inkscape:transform-center-x="3.9999988"
transform="matrix(-0.742144,0,0,1.2854311,50.003456,-8.0473447)" />
<rect
style="fill:#808080;stroke-width:0.223385"
id="rect1"
width="8"
height="48"
x="4"
y="8" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

playlist/static/style.css
+29 -1
View File
@@ -185,6 +185,10 @@ iframe {
height: 22px;
}
#media-control {
display:flex;
}
#media-control button {
min-width: 0;
@@ -196,10 +200,18 @@ iframe {
box-shadow:none;
}
#media-control:not(.waiting) button:hover {
#media-control:not(.waiting) button:not(.dummy):hover {
box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf
}
#media-control .spacer {
display: inline-block;
height: 24px;
width: 1px;
margin: 4px 5px;
background: gray;
}
#media-control button#play {
background-image:url(img/play.svg);
}
@@ -222,6 +234,22 @@ iframe {
background-image:url(img/stop-inactive.svg);
}
#media-control button#prev {
background-image:url(img/prev.svg);
}
#media-control button#back {
background-image:url(img/back.svg);
}
#media-control button#forward {
background-image:url(img/forward.svg);
}
#media-control button#next {
background-image:url(img/next.svg);
}
#media-control button#eject {
background-image:url(img/eject.svg);
}
/* Clippy */
.clippy {
position: fixed;