From b7aa3f2f73dbd4e455379309409071656115d24b Mon Sep 17 00:00:00 2001
From: Settel <achim.settelmeier@diva-e.com>
Date: Sun, 7 Nov 2021 23:51:37 +0100
Subject: [PATCH] collect quotes styling (WIP)

---
 client/src/components/CollectQuote.vue        | 34 ++++++++++++-------
 .../7f3a2876-b8b1-4b29-88be-70d86e1809e8.json |  2 +-
 2 files changed, 22 insertions(+), 14 deletions(-)

diff --git a/client/src/components/CollectQuote.vue b/client/src/components/CollectQuote.vue
index ac92c79..b784ca2 100644
--- a/client/src/components/CollectQuote.vue
+++ b/client/src/components/CollectQuote.vue
@@ -1,8 +1,9 @@
 <template>
   <div class="collect-quote">
+    <div class="collect-quote__backdrop" />
     <div class="collect-quote__container">
       <div class="collect-quote__quote-container">
-        <h2>Preview:</h2>
+        <div class="collect-quote__title">Preview:</div>
         <div class="collect-quote__quote">
           <Quote :text="quote.quote" />
         </div>
@@ -31,26 +32,27 @@ export default {
 
 <style lang="scss">
 .collect-quote {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.5);
   color: #ffffff;
 
+  &__backdrop {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+  }
+
   &__container {
     position: absolute;
     display: flex;
-    left: 0;
-    top: 0;
+    left: 10%;
+    top: 15%;
     width: 80%;
-    height: 50%;
-    margin: 0 10%;
+    height: 400px;
     background-color: #402080;
     border: 1px solid #ffffff;
     border-radius: 20px;
-    padding: 48px 0;
   }
 
   &__quote-container {
@@ -62,7 +64,13 @@ export default {
     width: 50%;
     height: 100%;
     border-right: 1px solid #ffffff;
-    padding: 0 48px;
+    padding: 48px;
+  }
+
+  &__title {
+    font-size: 32px;
+    font-family: "Wendy One";
+    margin-bottom: 16px;
   }
 
   &__quote {
diff --git a/server/data/games/067fb1b8-8303-4faa-95d2-1832770a791c/quotes/7f3a2876-b8b1-4b29-88be-70d86e1809e8.json b/server/data/games/067fb1b8-8303-4faa-95d2-1832770a791c/quotes/7f3a2876-b8b1-4b29-88be-70d86e1809e8.json
index 141c352..bb4bf89 100644
--- a/server/data/games/067fb1b8-8303-4faa-95d2-1832770a791c/quotes/7f3a2876-b8b1-4b29-88be-70d86e1809e8.json
+++ b/server/data/games/067fb1b8-8303-4faa-95d2-1832770a791c/quotes/7f3a2876-b8b1-4b29-88be-70d86e1809e8.json
@@ -1,4 +1,4 @@
 {
-	"quote": "Ein Diktumanuist ist eine Person, die Wörter erfindet und sie als Selbstzitat getarnt im Internet veröffentlicht.",
+	"quote": "Ein Diktumanuist ist eine Person, die Wörter erfindet und sie als Selbstzitat getarnt im Internet veröffentlicht. Und das sollte man sich nicht entgehen lassen. \n\n\nMit der Zeit wird das Zitat von anderen Autoren aufgegriffen. So kommt es zur Verbreitung und — in seltenen Fällen — zur Abwandlung des Zitats.",
 	"source": "7de2fcfa-6ac0-4ff6-8337-a224effc826d"
 }
\ No newline at end of file