reorderd and removed some existing frames

src/App.css

@@ -182,6 +182,8 @@ button.choosen:after {
     font-size: 0;
     cursor: move;
     overflow: hidden;
+    width: calc(36vh - 1px);
+    height: calc(36vh - 1px);
     background: var(--editor-purple);
 }
 .Editor .background{
@@ -195,7 +197,7 @@ button.choosen:after {
     position: relative;
     width: 36vh;
     height: 36vh;
-    transform: translate(0.1px, 0.1px);
+    /* transform: translate(0.1px, 0.1px); */
 }
 .Editor .hashtag{
     pointer-events: none;
@@ -204,6 +206,6 @@ button.choosen:after {
     left: 0;
     width: 100%;
     height: 100%;
-    transform: translate(0.1px, 0.1px);
+    /* transform: translate(0.1px, 0.1px); */
 }
 

src/FrameChooser.js

@@ -10,27 +10,31 @@ function FrameChooser({ onChange }) {
         async function loadFrames(){
             Promise.all(
                 [
-                    'pride-2022-1',
-                    'pride-2022-2',
-                    '5xSOM-Pride',
-                    'ukraine',
-                    // 'btw_VoteVolt_Balken',
-                    // 'btw_Meine_Stimme_Balken',
-                    // 'btw_VoteVolt_Sterne_bunt',
-                    // 'btw_Meine_Stimme_Sterne_bunt',
-                    'Volt-Stars',
-                    // 'btw_VoteVolt_Sterne_lila',
-                    // 'btw_Meine_Stimme_Sterne_lila',
                     '0xSOM', // SOM = Stripes of Movement
+                    '4xSOM-Blue-Red-Yellow-Green-Overflow',
+                    '4xSOM-Blue-Red-Yellow-Green',
+                    'ukraine',
+                    'Mixed_Bars_Overflow_Pride',
+                    'Mixed_Bars_Overflow_Trans',
+                    'Mixed_Bars_Overflow_Non_Binary',
+                    'Volt-Stars',
+                    'RectanglePurple',
                     '5xSOM-Blue',
                     '5xSOM-Green',
                     '5xSOM-Red',
                     '5xSOM-Yellow',
+                    // 'pride-2022-1',
+                    // 'pride-2022-2',
+                    // '5xSOM-Pride',
                     // '5xSOM-White',
                     // '2xSOM-Blue-Green',
                     // '2xSOM-Red-Yellow',
-                    '4xSOM-Blue-Red-Yellow-Green',
-                    '4xSOM-Blue-Red-Yellow-Green-Overflow',
+                    // 'btw_VoteVolt_Balken',
+                    // 'btw_Meine_Stimme_Balken',
+                    // 'btw_VoteVolt_Sterne_bunt',
+                    // 'btw_Meine_Stimme_Sterne_bunt',
+                    // 'btw_VoteVolt_Sterne_lila',
+                    // 'btw_Meine_Stimme_Sterne_lila',
                 ]
                 .map(async frame_filename => {
                     return {

src/HashtagChooser.js

@@ -1,6 +1,12 @@
 import { useState, useEffect, useCallback } from 'react'
 import { withLocalization } from './Localized.js'
 
+const hashtagNameReplacers = {
+    'IVotedFromAbroad': 'I voted from abroad!',
+    'PeaceInEurope': 'Peace in Europe',
+    'FriedenInEuropa': 'Frieden in Europa',
+}
+
 function HashtagChooser({ onChange, getString }) {
     const [frames, setFrames] = useState([])
     const [choosenFrame, setChoosenFrame] = useState(null)
@@ -25,8 +31,11 @@ function HashtagChooser({ onChange, getString }) {
                         if (frame_filename !== '') {
                             src = (await import(`./hashtags/${frame_filename}.png`)).default
                         }
+
+                        const name = hashtagNameReplacers[frame_filename] || frame_filename
+
                         return {
-                            name: frame_filename,
+                            name,
                             src
                         }
                     })

src/locales/de.ftl

@@ -22,28 +22,30 @@ link_source_code = Quellcode
 link_app_contact = Kontakt
 
 hashtags =
-  #VoltGA
+  Volt
+  #VoteVolt
 
   #ZweitstimmeVolt
   FriedenInEuropa
-  #WirWerdenLaut
 
-  #VoltForLGBTIAQ
-  #GenerationEuropa
-
-  #VoteVolt
   #JoinTheChange
   #VoltEuropa
-  #Volt
   #EuropeCares
   #FutureMadeInEurope
+  #VoltGA
 
+  #EUReform
+  IVotedFromAbroad
+
+old_hashtag =
+  #WirWerdenLaut
   #DeineWahl
   #JetztBistDuDran
-
   #paneuropäisch
   #pragmatisch
   #progressiv
-  #Europa
-  #EUReform
   #ValuesOverPower
+  #VoltForLGBTIAQ
+  #Europa
+  #GenerationEuropa
+  #Volt

src/locales/en.ftl

@@ -22,24 +22,26 @@ link_source_code = Source Code
 link_app_contact = Contact
 
 hashtags =
-  #VoltGA
+  Volt
+  #VoteVolt
+  IVotedFromAbroad
   PeaceInEurope
 
-  #VoltForLGBTIAQ
-  #GenerationEuropa
-
-  #VoteVolt
   #JoinTheChange
   #VoltEuropa
-  #Volt
   #EuropeCares
   #FutureMadeInEurope
+  #VoltGA
 
   #RejoinEU
-
-  #progressiv
-  #democracy
   #Europa
   #EUReform
-  #European
+
+old_hashtag =
+  #progressiv
+  #democracy
   #ValuesOverPower
+  #European
+  #VoltForLGBTIAQ
+  #GenerationEuropa
+  #Volt

src/locales/nl.ftl

@@ -23,23 +23,25 @@ link_app_contact = Contact
 
 
 hashtags =
-  #VoltGA
-  PeaceInEurope
-  
-  #VoltForLGBTIAQ
-  #GeneratieVolt
-  #GeneratieEuropa
-
+  Volt
   #VoteVolt
+  IVotedFromAbroad
+  PeaceInEurope
+
   #JoinTheChange
   #VoltEuropa
-  #Volt
   #EuropeCares
   #FutureMadeInEurope
+  #VoltGA
 
   #IkStemVolt
   stemvolt.nl
 
+old_hashtag =
+  #ValuesOverPower
+  #VoltForLGBTIAQ
+  #GeneratieVolt
+  #GeneratieEuropa
   #Europa
   #EUReform
-  #ValuesOverPower
+  #Volt