TDvorak/swingmusic-extended
1
0
Fork 0
mirror of https://github.com/Dvorinka/swingmusic-extended.git synced 2026-06-04 20:43:04 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

convert $small padding -> $smaller padding

Browse Source
This commit is contained in:
geoffrey45
2022-02-12 10:13:33 +03:00
parent 25e6c5ce0c
commit 88e1d42ab5
12 changed files with 58 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/RightSideBar/Tabs.vue
+18 -9
View File
@@ -1,11 +1,11 @@
<template>
<div class="r-tabs">
<button v-for="tab in props.tabs"
<div v-for="tab in props.tabs"
@click="changeTab(tab)"
:key="tab"
class="image t-item rounded"
class="image t-item"
:class="{ active_tab: props.current_tab == tab }, `${tab}`"
></button>
></div>
<div>
</div>
</div>
@@ -33,31 +33,40 @@ function changeTab(tab) {
display: flex;
flex-direction: column;
gap: $small;
margin-top: $small;
margin-left: $small;
.t-item {
width: 2rem;
height: 2rem;
float: right;
width: 100%;
height: 2.45rem;
background-size: 1.5rem;
border-radius: 0;
border-radius: $small 0 0 $small;
&:hover {
background-color: rgba(128, 128, 128, 0.281);
}
}
.active_tab {
border-right: solid;
border-radius: $small 0 0 $small;
background-color: rgba(17, 123, 223, 0.192);
}
.search {
background-image: url("../../assets/icons/search.svg");
background-color: rgba(35, 35, 66, 0.247);
// background-color: rgba(35, 35, 66, 0.247);
}
.queue {
background-image: url("../../assets/icons/queue.svg");
background-color: rgba(46, 25, 33, 0.445);
// background-color: rgba(46, 25, 33, 0.445);
}
.home {
background-image: url("../../assets/icons/dashboard.svg");
background-color: rgba(148, 102, 50, 0.445);
// background-color: rgba(148, 102, 50, 0.445);
}
}
</style>