Renamed css ballot to raffle.
This commit is contained in:
@@ -18,7 +18,7 @@
|
||||
<h2 v-if="winners.length > 0">Vinnere</h2>
|
||||
<div class="winners" v-if="winners.length > 0">
|
||||
<div class="winner" v-for="(winner, index) in winners" :key="index">
|
||||
<div :class="winner.color + '-ballot'" class="ballot-element">
|
||||
<div :class="winner.color + '-raffle'" class="raffle-element">
|
||||
<span>{{ winner.name }}</span>
|
||||
<span>{{ winner.phoneNumber }}</span>
|
||||
<span>Rød: {{ winner.red }}</span>
|
||||
@@ -47,11 +47,11 @@
|
||||
<span class="name">{{ attendee.name }}</span>
|
||||
<span class="phoneNumber">{{ attendee.phoneNumber }}</span>
|
||||
</div>
|
||||
<div class="ballots-container">
|
||||
<div class="red-ballot ballot-element small">{{ attendee.red }}</div>
|
||||
<div class="blue-ballot ballot-element small">{{ attendee.blue }}</div>
|
||||
<div class="green-ballot ballot-element small">{{ attendee.green }}</div>
|
||||
<div class="yellow-ballot ballot-element small">{{ attendee.yellow }}</div>
|
||||
<div class="raffles-container">
|
||||
<div class="red-raffle raffle-element small">{{ attendee.red }}</div>
|
||||
<div class="blue-raffle raffle-element small">{{ attendee.blue }}</div>
|
||||
<div class="green-raffle raffle-element small">{{ attendee.green }}</div>
|
||||
<div class="yellow-raffle raffle-element small">{{ attendee.yellow }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -140,7 +140,7 @@ export default {
|
||||
blue: 0,
|
||||
green: 0,
|
||||
yellow: 0,
|
||||
ballots: 0,
|
||||
raffles: 0,
|
||||
randomColors: false,
|
||||
attendees: [],
|
||||
winners: [],
|
||||
@@ -197,7 +197,7 @@ export default {
|
||||
blue: this.blue,
|
||||
green: this.green,
|
||||
yellow: this.yellow,
|
||||
ballots: this.ballots
|
||||
raffles: this.raffles
|
||||
});
|
||||
|
||||
if (response == true) {
|
||||
@@ -354,7 +354,7 @@ hr {
|
||||
}
|
||||
}
|
||||
|
||||
.ballot-element {
|
||||
.raffle-element {
|
||||
width: 140px;
|
||||
height: 150px;
|
||||
margin: 20px 0;
|
||||
@@ -378,19 +378,19 @@ hr {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
&.green-ballot {
|
||||
&.green-raffle {
|
||||
background-color: $light-green;
|
||||
}
|
||||
|
||||
&.blue-ballot {
|
||||
&.blue-raffle {
|
||||
background-color: $light-blue;
|
||||
}
|
||||
|
||||
&.yellow-ballot {
|
||||
&.yellow-raffle {
|
||||
background-color: $light-yellow;
|
||||
}
|
||||
|
||||
&.red-ballot {
|
||||
&.red-raffle {
|
||||
background-color: $light-red;
|
||||
}
|
||||
}
|
||||
@@ -422,7 +422,7 @@ button {
|
||||
margin: 0 auto;
|
||||
|
||||
& .name-and-phone,
|
||||
& .ballots-container {
|
||||
& .raffles-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
@@ -431,7 +431,7 @@ button {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
& .ballots-container {
|
||||
& .raffles-container {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -199,7 +199,7 @@ textarea {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.ballot-element {
|
||||
.raffle-element {
|
||||
margin: 20px 0;
|
||||
-webkit-mask-image: url(/../../public/assets/images/lodd.svg);
|
||||
background-repeat: no-repeat;
|
||||
@@ -208,19 +208,19 @@ textarea {
|
||||
mask-repeat: no-repeat;
|
||||
color: #333333;
|
||||
|
||||
&.green-ballot {
|
||||
&.green-raffle {
|
||||
background-color: $light-green;
|
||||
}
|
||||
|
||||
&.blue-ballot {
|
||||
&.blue-raffle {
|
||||
background-color: $light-blue;
|
||||
}
|
||||
|
||||
&.yellow-ballot {
|
||||
&.yellow-raffle {
|
||||
background-color: $light-yellow;
|
||||
}
|
||||
|
||||
&.red-ballot {
|
||||
&.red-raffle {
|
||||
background-color: $light-red;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,10 +4,10 @@
|
||||
<div class="attendees-container" ref="attendees">
|
||||
<div class="attendee" v-for="(attendee, index) in flipList(attendees)" :key="index">
|
||||
<span class="attendee-name">{{ attendee.name }}</span>
|
||||
<div class="red-ballot ballot-element small">{{ attendee.red }}</div>
|
||||
<div class="blue-ballot ballot-element small">{{ attendee.blue }}</div>
|
||||
<div class="green-ballot ballot-element small">{{ attendee.green }}</div>
|
||||
<div class="yellow-ballot ballot-element small">{{ attendee.yellow }}</div>
|
||||
<div class="red-raffle ballot-element small">{{ attendee.red }}</div>
|
||||
<div class="blue-raffle ballot-element small">{{ attendee.blue }}</div>
|
||||
<div class="green-raffle ballot-element small">{{ attendee.green }}</div>
|
||||
<div class="yellow-raffle ballot-element small">{{ attendee.yellow }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -46,7 +46,7 @@ export default {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.ballot-element {
|
||||
.raffle-element {
|
||||
font-size: 0.75rem;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
color.name +
|
||||
'-container ' +
|
||||
color.name +
|
||||
'-ballot inner-bought-container ballot-element'
|
||||
'-raffle inner-bought-container ballot-element'
|
||||
"
|
||||
:key="color.name"
|
||||
>
|
||||
@@ -24,7 +24,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="inner-bought-container total-ballots">
|
||||
<div class="inner-bought-container total-raffles">
|
||||
<div class="total-container">
|
||||
Totalt
|
||||
<div>
|
||||
@@ -136,7 +136,7 @@ export default {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ballot-element {
|
||||
.raffle-element {
|
||||
width: 140px;
|
||||
height: 150px;
|
||||
margin: 20px 0;
|
||||
@@ -166,7 +166,7 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.total-ballots {
|
||||
.total-raffles {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
margin: 20px 0;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div class="current-draw" v-if="drawing">
|
||||
<h2>TREKKER</h2>
|
||||
<div
|
||||
:class="currentColor + '-ballot'"
|
||||
:class="currentColor + '-raffle'"
|
||||
class="ballot-element center-new-winner"
|
||||
:style="{ transform: 'rotate(' + getRotation() + 'deg)' }"
|
||||
>
|
||||
@@ -19,7 +19,7 @@
|
||||
<div class="current-draw" v-if="drawingDone">
|
||||
<h2>VINNER</h2>
|
||||
<div
|
||||
:class="currentColor + '-ballot'"
|
||||
:class="currentColor + '-raffle'"
|
||||
class="ballot-element center-new-winner"
|
||||
:style="{ transform: 'rotate(' + getRotation() + 'deg)' }"
|
||||
>
|
||||
@@ -204,7 +204,7 @@ h2 {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ballot-element {
|
||||
.raffle-element {
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
font-size: 1.2rem;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<h2 v-if="winners.length > 0"> {{ title ? title : 'Vinnere' }}</h2>
|
||||
<div class="winners" v-if="winners.length > 0">
|
||||
<div class="winner" v-for="(winner, index) in winners" :key="index">
|
||||
<div :class="winner.color + '-ballot'" class="ballot-element">{{ winner.name }}</div>
|
||||
<div :class="winner.color + '-raffle'" class="ballot-element">{{ winner.name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -40,7 +40,7 @@ h2 {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.ballot-element {
|
||||
.raffle-element {
|
||||
font-size: 1rem;
|
||||
width: 145px;
|
||||
height: 145px;
|
||||
|
||||
Reference in New Issue
Block a user