subsonics/chopin-frontend
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Version 1.0.0 - Frontend

Browse Source
This commit is contained in:
Raphael
2025-08-29 00:22:08 +02:00
parent b5dc2a9e37
commit 01b089f1f6
83 changed files with 5613 additions and 245 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/assets/Global.scss
View File

@@ -7,37 +7,43 @@
--primary: #111210;
--primary-inverse: #FFFFFF;
--primary-hover: #ececec;
--secondary: #2A2B28;
--tertiary: #404040;
--quaternary: #636363;
--text: #FFFFFF;
--text-inverse: #111210;
--text-secondary: #C5c3c3;
--text-tertiary: #A5A5A5;
--text-error: #ff2b2b;
--text-success: #00ff00;
--text-warning: #FFA500;
}
[data-theme='light'] {
--primary: #FFFFFF;
--primary-inverse: #111210;
--primary-hover: #292b26;
--secondary: #EAEAEA;
--tertiary: #d3d3d3;
--quaternary: #b8b8b8;
--text: #111210;
--text-inverse: #FFFFFF;
--text-secondary: #404040;
--text-tertiary: #C5c3c3;
--text-error: #CD034F;
--text-success: #00a900;
--text-warning: #FFA500;
}
:root {
--main: #CD034F;
--main-hover: #A0023F;
--main-active: #7A002F;
--text-success: #00ff00;
--main-hover: color-mix(in srgb, var(--main) 90%, black);
--main-active: color-mix(in srgb, var(--main) 70%, black);
--admin-color: #209AFE;
--owner-color: #FFAA32;
@@ -87,6 +93,7 @@ a {
::-webkit-scrollbar {
width: 5px;
margin-right: 20px;
margin-left: 20px;
}
::-webkit-scrollbar-track {
border-radius: 12px;
@@ -143,6 +150,7 @@ textarea:focus {
}
}
input[type="checkbox"] {
background-color: #FFFFFF !important;
}
@@ -153,4 +161,24 @@ input[type="checkbox"]:checked {
input[type="checkbox"]:hover {
background-color: var(--main-active) !important;
}
input[type="text"] {
background-color: var(--tertiary);
border: none;
border-radius: 5px;
padding: 7px;
color: var(--text);
font-family: 'Inter', sans-serif;
outline: none;
}
@keyframes scroll {
0% {
transform: translateX(0);
}
100% {
transform: translateX(var(--scroll-distance));
}
}

30
src/assets/Icons/AddList.vue Normal file
View File

@@ -0,0 +1,30 @@
<template>
<svg
width="1.2em"
height="1.2em"
:class="{'iconAction': iconAction}"
viewBox="0 0 512 512"
fill="currentColor"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M40 48C26.7 48 16 58.7 16 72V120C16 133.3 26.7 144 40 144H88C101.3 144 112 133.3 112 120V72C112 58.7 101.3 48 88 48H40ZM192 64C174.3 64 160 78.3 160 96C160 113.7 174.3 128 192 128H480C497.7 128 512 113.7 512 96C512 78.3 497.7 64 480 64H192ZM192 224C174.3 224 160 238.3 160 256C160 273.7 174.3 288 192 288H480C497.7 288 512 273.7 512 256C512 238.3 497.7 224 480 224H192ZM192 384C174.3 384 160 398.3 160 416C160 433.7 174.3 448 192 448H263.5C281.2 448 295.5 433.7 295.5 416C295.5 398.3 281.2 384 263.5 384H192ZM16 232V280C16 293.3 26.7 304 40 304H88C101.3 304 112 293.3 112 280V232C112 218.7 101.3 208 88 208H40C26.7 208 16 218.7 16 232ZM40 368C26.7 368 16 378.7 16 392V440C16 453.3 26.7 464 40 464H88C101.3 464 112 453.3 112 440V392C112 378.7 101.3 368 88 368H40Z" fill="currentColor"/>
<path d="M419.266 488C419.266 431.354 419.266 397.607 419.266 350M350 418H419.266H488" stroke="currentColor" stroke-width="48" stroke-linecap="round"/>
</svg>
</template>
<script setup>
defineProps({
iconAction: Boolean
})
</script>
<style scoped>
svg {
transition: all 0.3s ease-in-out;
cursor: pointer;
}
.iconAction:hover {
opacity: 0.8;
}
</style>

6
src/assets/Icons/Backward.vue Normal file
View File

@@ -0,0 +1,6 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="24" viewBox="0 0 28 24" fill="var(--main)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.4615 19.7691C22.2298 20.2687 23.3333 19.799 23.3333 18.9724L23.3333 5.02764C23.3333 4.20106 22.2298 3.73137 21.4615 4.23095L10.7389 11.2033C10.1235 11.6035 10.1235 12.3965 10.7389 12.7967L21.4615 19.7691ZM25.6667 18.9724C25.6667 21.4521 22.3562 22.8612 20.0513 21.3625L9.32864 14.3901C7.48245 13.1896 7.48245 10.8104 9.32865 9.60994L20.0513 2.63757C22.3562 1.13885 25.6667 2.5479 25.6667 5.02764L25.6667 18.9724Z"/>
<path d="M2.33333 3C2.33333 2.44772 2.85566 2 3.49999 2C4.14433 2 4.66666 2.44772 4.66666 3V21C4.66666 21.5523 4.14433 22 3.49999 22C2.85566 22 2.33333 21.5523 2.33333 21V3Z"/>
</svg>
</template>

5
src/assets/Icons/Disconnect.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M5.47542 12.8632C4.44449 11.2623 3.67643 9.54134 3.17124 7.76144C3.01103 7.19699 2.93093 6.91477 2.9297 6.50182C2.92833 6.0436 3.08969 5.42311 3.31412 5.0236C3.51636 4.66357 3.78117 4.39876 4.3108 3.86913L4.46843 3.7115C4.99987 3.18006 5.2656 2.91433 5.55098 2.76999C6.11854 2.48292 6.7888 2.48292 7.35636 2.76999C7.64174 2.91433 7.90747 3.18006 8.43891 3.7115L8.63378 3.90637C8.98338 4.25597 9.15819 4.43078 9.27247 4.60656C9.70347 5.26945 9.70347 6.12403 9.27247 6.78692C9.15819 6.9627 8.98338 7.1375 8.63378 7.4871C8.51947 7.60142 8.46231 7.65857 8.41447 7.72539C8.24446 7.96281 8.18576 8.30707 8.26748 8.58743C8.29048 8.66632 8.32041 8.72867 8.38028 8.85337C8.50111 9.10503 8.62956 9.35395 8.76563 9.59979M11.1817 12.8181L11.2266 12.8632C12.4282 14.0648 13.7869 15.0136 15.2365 15.7096C15.3612 15.7694 15.4235 15.7994 15.5024 15.8224C15.7828 15.9041 16.127 15.8454 16.3644 15.6754C16.4313 15.6275 16.4884 15.5704 16.6027 15.4561C16.9523 15.1064 17.1271 14.9316 17.3029 14.8174C17.9658 14.3864 18.8204 14.3864 19.4833 14.8174C19.6591 14.9316 19.8339 15.1064 20.1835 15.4561L20.3783 15.6509C20.9098 16.1824 21.1755 16.4481 21.3198 16.7335C21.6069 17.301 21.6069 17.9713 21.3198 18.5389C21.1755 18.8242 20.9098 19.09 20.3783 19.6214L20.2207 19.779C19.6911 20.3087 19.4263 20.5735 19.0662 20.7757C18.6667 21.0001 18.0462 21.1615 17.588 21.1601C17.1751 21.1589 16.8928 21.0788 16.3284 20.9186C13.295 20.0576 10.4326 18.4332 8.04466 16.0452L7.99976 16.0001M20.9996 3.00012L2.99961 21.0001" stroke="var(--text)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</template>

6
src/assets/Icons/Forward.vue Normal file
View File

@@ -0,0 +1,6 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="var(--main)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.60439 4.23093C4.94586 3.73136 4 4.20105 4 5.02762V18.9724C4 19.799 4.94586 20.2686 5.60439 19.7691L14.7952 12.7967C15.3227 12.3965 15.3227 11.6035 14.7952 11.2033L5.60439 4.23093ZM2 5.02762C2 2.54789 4.83758 1.13883 6.81316 2.63755L16.004 9.60993C17.5865 10.8104 17.5865 13.1896 16.004 14.3901L6.81316 21.3625C4.83758 22.8612 2 21.4521 2 18.9724V5.02762Z"/>
<path d="M20 3C20 2.44772 20.4477 2 21 2C21.5523 2 22 2.44772 22 3V21C22 21.5523 21.5523 22 21 22C20.4477 22 20 21.5523 20 21V3Z"/>
</svg>
</template>

5
src/assets/Icons/Hand.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M6.9 11.4444V14.2222M6.9 11.4444V4.77778C6.9 3.8573 7.66112 3.11111 8.6 3.11111C9.53888 3.11111 10.3 3.8573 10.3 4.77778M6.9 11.4444C6.9 10.524 6.13888 9.77778 5.2 9.77778C4.26112 9.77778 3.5 10.524 3.5 11.4444V13.6667C3.5 18.269 7.30558 22 12 22C16.6944 22 20.5 18.269 20.5 13.6667V8.11111C20.5 7.19064 19.7389 6.44444 18.8 6.44444C17.8611 6.44444 17.1 7.19064 17.1 8.11111M10.3 4.77778V10.8889M10.3 4.77778V3.66667C10.3 2.74619 11.0611 2 12 2C12.9389 2 13.7 2.74619 13.7 3.66667V4.77778M17.1 8.11111V4.77778C17.1 3.8573 16.3389 3.11111 15.4 3.11111C14.4611 3.11111 13.7 3.8573 13.7 4.77778M17.1 8.11111V10.8889M13.7 4.77778V10.8889" stroke="var(--text)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</template>

5
src/assets/Icons/Loop.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M12 20.5001C16.6944 20.5001 20.5 16.6945 20.5 12.0001C20.5 9.17456 19.1213 6.67103 17 5.1255M13 22.4001L11 20.4001L13 18.4001M12 3.5001C7.30558 3.5001 3.5 7.30568 3.5 12.0001C3.5 14.8256 4.87867 17.3292 7 18.8747M11 5.6001L13 3.6001L11 1.6001" stroke="var(--text)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</template>

6
src/assets/Icons/Pause.vue Normal file
View File

@@ -0,0 +1,6 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" fill="none">
<rect x="1" y="1" width="7" height="19" rx="2" stroke="var(--text)" stroke-width="2"/>
<rect x="13" y="1" width="7" height="19" rx="2" stroke="var(--text)" stroke-width="2"/>
</svg>
</template>

5
src/assets/Icons/Play.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" fill="none">
<path d="M20.5355 10.2262L4.18315 1.51207C3.57861 1.18992 2.85727 1.17287 2.23818 1.46612C1.48207 1.82428 1 2.58605 1 3.4227V18.5773C1 19.4139 1.48207 20.1757 2.23818 20.5339C2.85727 20.8271 3.57861 20.8101 4.18315 20.4879L20.5355 11.7738C20.8214 11.6215 21 11.3239 21 11C21 10.6761 20.8214 10.3785 20.5355 10.2262Z" stroke="var(--text)" stroke-width="2"/>
</svg>
</template>

7
src/assets/Icons/Shuffle.vue Normal file
View File

@@ -0,0 +1,7 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M17.448 2.03365C17.8385 1.64318 18.4716 1.64305 18.8621 2.03343L21.4146 4.58486C22.1959 5.36587 22.1961 6.63242 21.4149 7.41358L18.8675 9.96097C18.477 10.3515 17.8438 10.3515 17.4533 9.96097C17.0628 9.57045 17.0628 8.93728 17.4533 8.54676L19 7.00003H14.2361C13.8573 7.00003 13.511 7.21403 13.3416 7.55282L11.8954 10.4452L10.7699 8.2242L11.5528 6.65839C12.061 5.64204 13.0998 5.00003 14.2361 5.00003H19L17.4479 3.44794C17.0574 3.05741 17.0575 2.42418 17.448 2.03365Z" fill="var(--text)"/>
<path d="M17.448 14.0337C17.8385 13.6432 18.4716 13.643 18.8621 14.0334L21.4146 16.5849C22.1959 17.3659 22.1961 18.6324 21.4149 19.4136L18.8675 21.961C18.477 22.3515 17.8438 22.3515 17.4533 21.961C17.0628 21.5704 17.0628 20.9373 17.4533 20.5468L19 19H14.2361C13.0998 19 12.061 18.358 11.5528 17.3417L6.65836 7.55282C6.48897 7.21403 6.1427 7.00003 5.76393 7.00003H3C2.44772 7.00003 2 6.55232 2 6.00003C2 5.44775 2.44772 5.00003 3 5.00003H5.76393C6.90025 5.00003 7.93904 5.64204 8.44721 6.65839L13.3416 16.4472C13.511 16.786 13.8573 17 14.2361 17H19L17.4479 15.4479C17.0574 15.0574 17.0575 14.4242 17.448 14.0337Z" fill="var(--text)"/>
<path d="M8.12308 13.5178L9.24864 15.7388L8.44721 17.3417C7.93904 18.358 6.90025 19 5.76393 19H3C2.44772 19 2 18.5523 2 18C2 17.4477 2.44772 17 3 17H5.76393C6.1427 17 6.48897 16.786 6.65836 16.4472L8.12308 13.5178Z" fill="var(--text)"/>
</svg>
</template>

6
src/assets/Icons/YoutubeRefresh.vue Normal file
View File

@@ -0,0 +1,6 @@
<template>
<svg width="1.2em" height="1.2em" viewBox="0 0 620 501" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M548.255 301.439C531.426 285.682 509.587 277.044 486.418 277.065C444.722 277.101 408.725 305.691 398.787 345.349C398.063 348.236 395.491 350.274 392.515 350.274H361.668C357.632 350.274 354.566 346.61 355.313 342.643C366.96 280.792 421.264 234 486.5 234C522.269 234 554.752 248.069 578.72 270.974L597.946 251.748C606.084 243.609 620 249.373 620 260.884V333.048C620 340.184 614.216 345.968 607.081 345.968H534.916C523.406 345.968 517.642 332.052 525.78 323.913L548.255 301.439ZM365.919 389.032H438.084C449.594 389.032 455.358 402.948 447.22 411.087L424.745 433.562C441.574 449.319 463.415 457.957 486.584 457.936C528.259 457.898 564.27 429.328 574.213 389.652C574.937 386.765 577.509 384.727 580.485 384.727H611.332C615.368 384.727 618.435 388.391 617.688 392.358C606.04 454.208 551.736 501 486.5 501C450.731 501 418.248 486.931 394.28 464.026L375.054 483.252C366.916 491.391 353 485.627 353 474.116V401.952C353 394.816 358.784 389.032 365.919 389.032Z" fill="currentColor"/>
<path d="M534.722 60.083C528.441 36.433 509.935 17.807 486.438 11.486C443.848 0 273.067 0 273.067 0C273.067 0 102.287 0 59.696 11.486C36.199 17.808 17.693 36.433 11.412 60.083C0 102.95 0 192.388 0 192.388C0 192.388 0 281.826 11.412 324.693C17.693 348.343 36.199 366.193 59.696 372.514C102.287 384 273.067 384 273.067 384H323C323 384 311.5 298 386.5 239.5C459.5 182.56 542 211.5 542 211.5C542 211.5 546.134 102.95 534.722 60.083ZM217.212 273.591V111.185L359.951 192.39L217.212 273.591Z" fill="currentColor"/>
</svg>
</template>

4
src/assets/LogoDark.vue
View File

@@ -20,9 +20,9 @@
style="stroke-width:1.60707" />
<path
d="m 522.62825,760.3253 v 250.8644 h 6.10687 c 3.21417,0 6.91044,-0.6429 8.03538,-1.2856 1.60709,-1.125 1.9285,-36.48067 1.60709,-173.56414 -0.48213,-139.81555 -0.16071,-172.27846 1.60707,-172.27846 8.35679,0 25.23107,14.46368 31.65938,27.48099 8.5175,16.55287 8.83891,21.21339 8.83891,130.33379 0,83.72861 0.32142,100.9243 2.2499,100.9243 1.12496,0 11.41024,-4.66051 22.82047,-10.44597 66.3722,-33.26645 111.3703,-92.0854 123.58408,-161.51106 3.21415,-17.83853 3.69627,-53.67631 0.96424,-69.26493 -5.14264,-30.37371 -19.4456,-64.283 -37.28415,-88.38913 -36.6413,-49.3372 -90.63903,-78.26456 -154.4399,-82.76435 l -15.74934,-1.12496 z"
fill="#7A258D"
fill="var(--main)"
id="path2"
style="fill:#cd034f;fill-opacity:1;stroke-width:1.60707" />
style="fill:var(--main);fill-opacity:1;stroke-width:1.60707" />
</g>
</svg>
</template>

4
src/assets/LogoLight.vue
View File

@@ -20,9 +20,9 @@
style="stroke-width:1.60707" />
<path
d="m 522.62825,760.3253 v 250.8644 h 6.10687 c 3.21417,0 6.91044,-0.6429 8.03538,-1.2856 1.60709,-1.125 1.9285,-36.48067 1.60709,-173.56414 -0.48213,-139.81555 -0.16071,-172.27846 1.60707,-172.27846 8.35679,0 25.23107,14.46368 31.65938,27.48099 8.5175,16.55287 8.83891,21.21339 8.83891,130.33379 0,83.72861 0.32142,100.9243 2.2499,100.9243 1.12496,0 11.41024,-4.66051 22.82047,-10.44597 66.3722,-33.26645 111.3703,-92.0854 123.58408,-161.51106 3.21415,-17.83853 3.69627,-53.67631 0.96424,-69.26493 -5.14264,-30.37371 -19.4456,-64.283 -37.28415,-88.38913 -36.6413,-49.3372 -90.63903,-78.26456 -154.4399,-82.76435 l -15.74934,-1.12496 z"
fill="#7A258D"
fill="var(--main)"
id="path2"
style="fill:#cd034f;fill-opacity:1;stroke-width:1.60707" />
style="fill:var(--main);fill-opacity:1;stroke-width:1.60707" />
</g>
</svg>
</template>

BIN
src/assets/default_thumbnail.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB