Put a red button on levelselector title (more clear on current position)
Added compliments and the ability to copy them
This commit is contained in:
43
src/App.vue
43
src/App.vue
@@ -103,7 +103,20 @@
|
||||
</v-btn>
|
||||
</v-list-item-action>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title style="margin-left: 0px;">{{ item.title }}</v-list-item-title>
|
||||
<v-list-item-title v-if="item.index == currentLevel" >
|
||||
<v-btn
|
||||
x-small
|
||||
depressed
|
||||
color="error"
|
||||
>
|
||||
{{ item.title }}
|
||||
</v-btn>
|
||||
</v-list-item-title>
|
||||
<v-list-item-title v-else
|
||||
style="margin-left: 0px;"
|
||||
>
|
||||
{{ item.title }}
|
||||
</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
<v-divider />
|
||||
@@ -194,6 +207,27 @@
|
||||
<v-btn v-else x-small @click="stoptimer">Stop</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
|
||||
<div>
|
||||
<v-col :cols="12">
|
||||
<div
|
||||
class="levelcompliment font-weight-black">
|
||||
{{levels[currentLevel].compliment}}
|
||||
</div>
|
||||
</v-col>
|
||||
</div>
|
||||
|
||||
<v-row>
|
||||
<v-col :cols="12">
|
||||
<v-btn
|
||||
color="primary"
|
||||
x-small
|
||||
dense
|
||||
@click="copycomp">Copy Compliment!
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-content>
|
||||
</v-app>
|
||||
@@ -215,6 +249,9 @@ export default {
|
||||
this.reset();
|
||||
},
|
||||
methods: {
|
||||
copycomp: function() {
|
||||
navigator.clipboard.writeText(this.levels[this.currentLevel].compliment)
|
||||
},
|
||||
reset: function () {
|
||||
this.currentLevel = 0;
|
||||
this.score = 0;
|
||||
@@ -386,6 +423,7 @@ export default {
|
||||
title: "Start - Peace sign",
|
||||
foreground: "assets/bg/peacesign.png",
|
||||
task: "Make a peace sign",
|
||||
compliment: "",
|
||||
points: 5,
|
||||
},
|
||||
{
|
||||
@@ -1095,6 +1133,9 @@ body {
|
||||
color: #fff;
|
||||
text-shadow: 2px 2px #000;
|
||||
}
|
||||
.levelcompliment {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
video {
|
||||
left: 50%;
|
||||
min-height: 100%;
|
||||
|
||||
Reference in New Issue
Block a user