janishutz/MusicPlayer
1
0
Fork 0
mirror of https://github.com/janishutz/MusicPlayerV2.git synced 2025-11-25 13:04:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add bar utility

Browse Source
This commit is contained in:
Admin
2025-09-04 16:34:54 +02:00
parent 057ea67a95
commit 025c7ed111
1 changed files with 45 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
MusicPlayerV2-GUI/src/views/BarView.vue
View File

@@ -51,7 +51,7 @@
totalPrice += o * offering.value[ keys[ i ] ].price; totalPrice += o * offering.value[ keys[ i ] ].price;
} }
return totalPrice; return totalPrice / 100;
} ); } );
const changeValue = ( id: string, amount: number ) => { const changeValue = ( id: string, amount: number ) => {
@@ -77,6 +77,7 @@
<p>{{ offer.name }} (CHF {{ offer.price / 100 }})</p> <p>{{ offer.name }} (CHF {{ offer.price / 100 }})</p>
</td> </td>
<td> <td>
<div>
<button class="inc-dec" @click="changeValue( offer.id, 1 )"> <button class="inc-dec" @click="changeValue( offer.id, 1 )">
+ +
</button> </button>
@@ -84,6 +85,7 @@
<button class="inc-dec" @click="changeValue( offer.id, -1 )"> <button class="inc-dec" @click="changeValue( offer.id, -1 )">
- -
</button> </button>
</div>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@@ -93,32 +95,45 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.bar-utility { .bar-utility {
>.offering-wrapper {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center;
flex-direction: column; flex-direction: column;
align-items: center;
>.offering {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 5px;
>.offering-wrapper {
.offering {
>td {
p { p {
margin: 0; margin: 0;
margin-right: 15px;
text-align: start;
}
>div {
display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
p {
margin-left: 5px;
margin-right: 5px;
} }
>.inc-dec { >.inc-dec {
user-select: none;
cursor: pointer;
background: none; background: none;
border: solid var( --primary-color ) 1px; border: solid var( --primary-color ) 1px;
border-radius: 20px; border-radius: 20px;
width: 1.5rem; width: 2rem;
height: 1.5rem; height: 2rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
font-size: 1rem; font-size: 1.5rem;
}
}
} }
} }
} }