Renamed css ballot to raffle.

This commit is contained in:
2020-10-09 01:01:24 +02:00
committed by KevinMidboe
parent 59792f9aae
commit c01692bf1e
6 changed files with 34 additions and 34 deletions

View File

@@ -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;
}
}

View File

@@ -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;
}
}

View File

@@ -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;

View File

@@ -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&nbsp;
<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;

View File

@@ -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;

View File

@@ -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;