Updated a play button.
This commit is contained in:
parent
5bc653f50a
commit
9b959eb7ab
@ -36,8 +36,7 @@ button {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none; }
|
||||
|
||||
a:hover,
|
||||
button:hover {
|
||||
a:hover {
|
||||
color: var(--secondary-color);
|
||||
cursor: pointer;
|
||||
text-decoration: underline dotted;
|
||||
@ -45,9 +44,7 @@ button:hover {
|
||||
|
||||
button {
|
||||
background: none;
|
||||
border: none;
|
||||
font: inherit;
|
||||
padding: 0; }
|
||||
border: none; }
|
||||
|
||||
p {
|
||||
text-align: justify;
|
||||
@ -122,15 +119,11 @@ section { margin-top: 1rem; }
|
||||
padding: 0 .7rem; }
|
||||
|
||||
button#radio-play {
|
||||
-webkit-mask-image: url(/assets/img/play.svg);
|
||||
background-color: var(--primary-color);
|
||||
background-image: url(/assets/img/play.svg);
|
||||
height: 3rem;
|
||||
mask-image: url(/assets/img/play.svg);
|
||||
min-width: 3rem;
|
||||
width: 3rem; }
|
||||
|
||||
button#radio-play:hover { text-decoration: none; }
|
||||
|
||||
input#radio-volume {
|
||||
accent-color: var(--primary-color);
|
||||
direction: rtl;
|
||||
|
@ -1 +1 @@
|
||||
<svg version="1.1" viewBox="0 0 100 100" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path transform="matrix(.75195 -.012986 .014978 .65194 38.971 49.316)" d="m-25.978 46.549 1.6542-92 78.847 47.433-40.251 22.284z" stroke-width=".26458"/><circle cx="50" cy="50" r="47.585" fill="none" stroke="#000" stroke-width="4.8301"/></svg>
|
||||
<svg version="1.1" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg"><path d="m1.1317 1.8418v6.6254l-.0005522 6.6248 6.6353-3.3119 6.6348-3.3113-6.6348-3.3135z" fill="#9f2b68" stroke="#000" stroke-width="2"/></svg>
|
||||
|
Before Width: | Height: | Size: 341 B After Width: | Height: | Size: 220 B |
@ -1 +1 @@
|
||||
<svg version="1.1" viewBox="0 0 100 100" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path transform="matrix(.75195 -.012986 .014978 .65194 38.971 49.316)" d="m-25.978 46.549 1.6542-92 78.847 47.433-40.251 22.284z" stroke-width=".26458"/><circle cx="50" cy="50" r="47.585" fill="none" stroke="#000" stroke-width="4.8301"/><rect x="20.886" y="20.886" width="58.228" height="58.228" rx="57.392" ry="0" stroke="#000" stroke-width="1.7724"/></svg>
|
||||
<svg version="1.1" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" width="14" height="14" fill="#9f2b68" stroke="#000" stroke-width="3"/></svg>
|
||||
|
Before Width: | Height: | Size: 456 B After Width: | Height: | Size: 169 B |
@ -88,5 +88,5 @@ $("player").style.display = $("player").firstChild.style.display = "flex";
|
||||
|
||||
$("radio-play").addEventListener("click", e => {
|
||||
audio.paused ? (audio.src = audio_src) && audio.play() : audio.src = "";
|
||||
e.target.style.maskImage = e.target.style.webkitMaskImage = audio.paused ?
|
||||
e.target.style.backgroundImage = audio.paused ?
|
||||
"url(/assets/img/play.svg)" : "url(/assets/img/stop.svg)"; });
|
||||
|
Loading…
Reference in New Issue
Block a user