julien/binome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🏗️ (music) bold selected mood

Browse Source
This commit is contained in:
Julien Calixte
2020-07-12 23:53:24 +02:00
parent d9385bc457
commit fa6eb764ae
1 changed files with 9 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/ZoneMusic.vue
View File

@@ -2,7 +2,9 @@
<div class="zone-music"> <div class="zone-music">
<div class="pm-field"> <div class="pm-field">
<label for="use-music" data-pm-holder> <label for="use-music" data-pm-holder>
<span :class="{ disabled: withMusic }">focus</span> <span :class="{ selected: !withMusic, disabled: withMusic }"
>focus</span
>
<input <input
type="checkbox" type="checkbox"
name="use-music" name="use-music"
@@ -11,7 +13,9 @@
@change="setWithMusic(!withMusic)" @change="setWithMusic(!withMusic)"
data-pm-checkbox-toggle data-pm-checkbox-toggle
/> />
<span :class="{ disabled: !withMusic }">chill</span> <span :class="{ selected: withMusic, disabled: !withMusic }"
>chill</span
>
</label> </label>
</div> </div>
<ChilledMusic v-if="withMusic" :play="play" @play="play" @pause="pause" /> <ChilledMusic v-if="withMusic" :play="play" @play="play" @pause="pause" />
@@ -60,6 +64,9 @@ label[data-pm-holder] {
span { span {
flex: 1; flex: 1;
&.selected {
font-weight: bold;
}
} }
} }
.disabled { .disabled {