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