Removed v-container left margin for small window

Changed Reset button color to red
Increased space between Reset & Previous Level buttons (Accidental Resets)
Removed Reset/Previous/Next button centering
Added colored buttons to level selector to track current level
This commit is contained in:
2021-02-18 22:33:47 -07:00
parent 3fd540373b
commit 4b01286f35

View File

@@ -1,7 +1,7 @@
<template>
<v-app>
<v-content>
<v-container width="100%" >
<v-container style="margin-left: 0px;" width="100%" >
<div id="gamediv" class="apply-font">
<div
style="width: 640px; height: 480px; position: absolute; overflow: hidden;">
@@ -86,6 +86,22 @@
one-line
dense
>
<v-list-item-action style="margin-right: 5px;">
<v-btn v-if="item.index == currentLevel"
x-small
depressed
color="error"
>
{{ item.index }}
</v-btn>
<v-btn v-else
x-small
depressed
color="teal"
>
{{ item.index }}
</v-btn>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>{{ item.index }} {{ item.title }}</v-list-item-title>
</v-list-item-content>
@@ -96,9 +112,10 @@
</div>
<v-row>
<v-col cols="6" align="center">
<v-btn medium dense @click="reset">Reset</v-btn>
<v-col cols="9">
<v-btn medium dense color="error" @click="reset">Reset</v-btn>
<v-btn
style="margin-left: 50px;"
:disabled="currentLevel < 1"
medium
@click="previouslevel"
@@ -128,7 +145,7 @@
</v-row>
<v-row dense>
<v-col :cols="3">
<v-col :cols="6">
<v-text-field
dense
v-model="name"