Add (almost) monochrome logo + loading QR on checkout

.idea/workspace.xml

@@ -3,10 +3,6 @@
   <component name="ChangeListManager">
     <list default="true" id="ddb8afd5-d3ba-47b1-b6d0-227403f1abf7" name="Changes" comment="Awesome QR at checkout">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/components/ZonePricing.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/ZonePricing.vue" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/result.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/result.ts" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/views/Checkout.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/views/Checkout.vue" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
@@ -75,7 +71,7 @@
       <workItem from="1670927344373" duration="29000" />
       <workItem from="1670927391338" duration="2277000" />
       <workItem from="1671024025708" duration="19806000" />
-      <workItem from="1671204365793" duration="19127000" />
+      <workItem from="1671204365793" duration="19693000" />
     </task>
     <task id="LOCAL-00001" summary="Wrote the landing">
       <created>1670844191163</created>
@@ -154,7 +150,14 @@
       <option name="project" value="LOCAL" />
       <updated>1671240411281</updated>
     </task>
-    <option name="localTasksCounter" value="12" />
+    <task id="LOCAL-00012" summary="Awesome QR at checkout">
+      <created>1671302241009</created>
+      <option name="number" value="00012" />
+      <option name="presentableId" value="LOCAL-00012" />
+      <option name="project" value="LOCAL" />
+      <updated>1671302241009</updated>
+    </task>
+    <option name="localTasksCounter" value="13" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">

src/views/Checkout.vue

@@ -5,9 +5,12 @@
     <div class="text">To buy</div>
     <DomainBar :zone="'.' + zone" :value="domain" :has_button="false" :editable="false"/>
     <div class="text">Scan this:</div>
-    <div class="qr">
+    <div class="qr" v-if="loaded">
       <div ref="qrCode"></div>
     </div>
+    <div v-else class="center">
+      <RotateSquare2 style="width: 5rem; height: 5rem; margin-top: 5rem"/>
+    </div>
   </DarkLayout>
 </template>
 
@@ -16,10 +19,11 @@ import DarkLayout from "../components/DarkLayout.vue";
 import DomainBar from "../components/DomainBar.vue";
 import {get_domain_result, get_ton_link} from "../result";
 import QRCodeStyling from 'qr-code-styling';
+import RotateSquare2 from "../components/RotateSquare2.vue";
 
 export default {
   name: "Checkout",
-  components: {DomainBar, DarkLayout},
+  components: {RotateSquare2, DomainBar, DarkLayout},
   props: {
     domain: {
       type: String,
@@ -50,10 +54,10 @@ export default {
     )
   },
   computed: {
-    loaded () {
+    loaded() {
       return this.result !== null && this.ton_link !== null;
     },
-    options () {
+    options() {
       if (!this.loaded) {
         return null;
       }
@@ -62,7 +66,7 @@ export default {
         height: 300,
         type: 'svg',
         data: this.ton_link.getLink(),
-      image: '/favicon.png',
+        image: '/logo_mono.png',
         margin: 10,
         qrOptions: {
           typeNumber: 0,