Vippspppspsps

2020-01-22 13:13:52 +01:00
parent bd1a626a96
commit 431818c260
7 changed files with 103 additions and 18 deletions
--- a/src/ui/Vipps.vue
+++ b/src/ui/Vipps.vue
@@ -0,0 +1,60 @@
+<template>
+  <div class="vipps-container">
+    <img src="/public/assets/images/vipps-logo.svg" class="vipps-logo" />
+    <span>
+      kr.
+      <span class="big-money">10,-</span> pr. lodd
+    </span>
+    <img src="/public/assets/images/vipps-qr.png" class="qr-logo" />
+    <span class="phone-number">977 40 427</span>
+    <span class="name">Kasper Rynning-Tønnesen</span>
+    <span class="mark-with">Merk med: Vinlodd/🍾</span>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.vipps-container {
+  font-family: sans-serif;
+}
+
+.vipps-container {
+  border-radius: 10px;
+  background-color: #ff5b23;
+  display: flex;
+  flex-direction: column;
+  color: white;
+  text-align: center;
+  padding: 25px 30px 25px 25px;
+  width: 250px;
+  margin: auto 0;
+}
+
+.big-money {
+  font-size: 1.5rem;
+  font-weight: bold;
+}
+
+.vipps-logo {
+  padding-bottom: 10px;
+}
+
+.phone-number {
+  font-size: 1.75rem;
+  font-weight: bold;
+  padding-top: 20px;
+  padding-bottom: 10px;
+}
+
+.qr-logo {
+  margin-top: 15px;
+  border-radius: 10px;
+  width: 220px;
+  margin: 15px auto auto auto;
+}
+
+.name,
+.mark-with {
+  font-weight: 600;
+  font-size: 1rem;
+}
+</style>