From 8cb65d3bb21b51f4ddac91d19423f251091e51f4 Mon Sep 17 00:00:00 2001
From: Sebastian Stein <sebastian@codepassion.de>
Date: Sun, 20 Apr 2025 18:35:38 +0200
Subject: [PATCH] - added orange and blue slots - extended styles for slot
 types (test data)

---
 webapp/components/Badges.vue             | 20 +++++++-
 webapp/pages/profile/_id/_slug.vue       |  6 ++-
 webapp/static/img/badges/slot-blue.svg   | 62 ++++++++++++++++++++++++
 webapp/static/img/badges/slot-orange.svg | 62 ++++++++++++++++++++++++
 4 files changed, 147 insertions(+), 3 deletions(-)
 create mode 100644 webapp/static/img/badges/slot-blue.svg
 create mode 100644 webapp/static/img/badges/slot-orange.svg

diff --git a/webapp/components/Badges.vue b/webapp/components/Badges.vue
index c36536222..4913dd1bc 100644
--- a/webapp/components/Badges.vue
+++ b/webapp/components/Badges.vue
@@ -53,7 +53,7 @@ export default {
     align-items: center;
     font-weight: bold;
     font-size: 10px;
-    color: #333;
+    color: #ffffff;
   }
 
   .hc-badge {
@@ -119,6 +119,24 @@ export default {
     content: "NW";
   }
 
+  //test code
+  .test-express,
+  .liberation-express,
+  .nachweis-express,
+  .maskenfrei-express {
+    // todo: rename file according to purpose
+    background-image: url('/img/badges/slot-orange.svg');
+  }
+  .beitragsblocker,
+  .beitragsstopper,
+  .masern-impfbloker,
+  .rundfunk-alarm,
+  .freunde-der-demokratie,
+  .restart-democracy {
+    // todo: rename file according to purpose
+    background-image: url('/img/badges/slot-blue.svg');
+  }
+
   .test-express::after {
     content: "TE";
   }
diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index 20dae8ab3..54f544a6e 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -272,9 +272,11 @@ export default {
         { key: 'BB', title: 'Beitragsblocker', type: 'beitragsblocker', icon: null },
         { key: 'BS', title: 'Beitragsstopper', type: 'beitragsstopper', icon: null },
         { key: 'MI', title: 'Masern-Impfbloker', type: 'masern-impfbloker', icon: null },
-        { key: 'RA', title: 'Rundfunk-Alarm', type: 'rundfunk-alarm', icon: null },
-        { key: 'FD', title: 'Freunde der Demokratie', type: 'freunde-der-demokratie', icon: null },
+        // { key: 'RA', title: 'Rundfunk-Alarm', type: 'rundfunk-alarm', icon: null },
+        // { key: 'FD', title: 'Freunde der Demokratie', type: 'freunde-der-demokratie', icon: null },
         // { key: 'RD', title: 'Restart Democracy', type: 'restart-democracy', icon: null }
+        { title: '', type: 'empty', icon: null },
+        { title: '', type: 'empty', icon: null },
       ]
 
       user.badges = badgeList
diff --git a/webapp/static/img/badges/slot-blue.svg b/webapp/static/img/badges/slot-blue.svg
new file mode 100644
index 000000000..1d9caa53d
--- /dev/null
+++ b/webapp/static/img/badges/slot-blue.svg
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="400"
+   height="346.66666"
+   viewBox="0 0 400 346.66666"
+   sodipodi:docname="slot-blue.svg"
+   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
+   xml:space="preserve"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs1"><linearGradient
+       id="linearGradient3"
+       inkscape:collect="always"><stop
+         style="stop-color:#068790;stop-opacity:1;"
+         offset="0"
+         id="stop3" /><stop
+         style="stop-color:#1ecfdc;stop-opacity:1;"
+         offset="1"
+         id="stop4" /></linearGradient><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient3"
+       id="linearGradient4"
+       x1="708.75574"
+       y1="280.91028"
+       x2="493.17172"
+       y2="65.326271"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-404.0619,0.21500175)" /></defs><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="1.1269849"
+     inkscape:cx="62.112633"
+     inkscape:cy="253.77447"
+     inkscape:window-width="1920"
+     inkscape:window-height="1008"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g1" /><g
+     inkscape:groupmode="layer"
+     inkscape:label="Image"
+     id="g1"><path
+       style="fill:#037d86;fill-opacity:1;stroke:none;stroke-width:1.51181"
+       d="M -0.21505,173.97849 100.43011,0.21505325 H 299.13978 L 400.21505,173.97849 300.4301,346.02149 99.13979,346.4516 Z"
+       id="path1" /><path
+       style="fill:url(#linearGradient4);stroke:none;stroke-width:1.34043"
+       d="M 22.48162,173.90536 111.7175,19.839995 h 176.18365 l 89.61723,154.065365 -88.47318,152.53995 -178.47175,0.38135 z"
+       id="path2" /></g></svg>
diff --git a/webapp/static/img/badges/slot-orange.svg b/webapp/static/img/badges/slot-orange.svg
new file mode 100644
index 000000000..2c8d54af7
--- /dev/null
+++ b/webapp/static/img/badges/slot-orange.svg
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="400"
+   height="346.66666"
+   viewBox="0 0 400 346.66666"
+   sodipodi:docname="slot-orange.svg"
+   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
+   xml:space="preserve"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs1"><linearGradient
+       id="linearGradient3"
+       inkscape:collect="always"><stop
+         style="stop-color:#cc7e10;stop-opacity:1;"
+         offset="0"
+         id="stop3" /><stop
+         style="stop-color:#f9b452;stop-opacity:1;"
+         offset="1"
+         id="stop4" /></linearGradient><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient3"
+       id="linearGradient4"
+       x1="708.75574"
+       y1="280.91028"
+       x2="493.17172"
+       y2="65.326271"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-404.0619,0.21500175)" /></defs><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="1.1269849"
+     inkscape:cx="62.112631"
+     inkscape:cy="253.77446"
+     inkscape:window-width="1920"
+     inkscape:window-height="1008"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g1" /><g
+     inkscape:groupmode="layer"
+     inkscape:label="Image"
+     id="g1"><path
+       style="fill:#c57505;fill-opacity:1;stroke:none;stroke-width:1.51181"
+       d="M -0.21505,173.97849 100.43011,0.21505325 H 299.13978 L 400.21505,173.97849 300.4301,346.02149 99.13979,346.4516 Z"
+       id="path1" /><path
+       style="fill:url(#linearGradient4);stroke:none;stroke-width:1.34043"
+       d="M 22.48162,173.90536 111.7175,19.839995 h 176.18365 l 89.61723,154.065365 -88.47318,152.53995 -178.47175,0.38135 z"
+       id="path2" /></g></svg>