feat: Enhance MainPageLayout with improved star decoration animations and initial fill colors; add new teal star layers and update localization strings across multiple languages for better user experience

2026-03-26 15:24:00 +01:00
parent c6ea6e70fe
commit e8517372f2
43 changed files with 228 additions and 103 deletions
--- a/src/components/MainPageLayout.js
+++ b/src/components/MainPageLayout.js
@@ -14,24 +14,149 @@ import { STAR_POLYGON_POINTS } from "../utils/starPolygon.js";
 import { useTranslation } from 'react-i18next';

 const HOME_STAR_LAYERS = [
-  { className: "star-rotate-slow-cw", size: 168, staticDeg: 20, fill: "#B8860B" },
-  { className: "star-rotate-slow-ccw", size: 159, staticDeg: -25, fill: "#DAA520" },
-  { className: "star-rotate-medium-cw", size: 150, staticDeg: null, fill: "#FFD700" },
+  { className: "star-rotate-slow-cw", size: 168 },
+  { className: "star-rotate-slow-ccw", size: 159 },
+  { className: "star-rotate-medium-cw", size: 150 },
 ];

-const FILIALE_STAR_LAYERS = [
-  { className: "star-rotate-slow-ccw", size: 168, staticDeg: 20, fill: "#5F9EA0" },
-  { className: "star-rotate-medium-cw", size: 159, staticDeg: -25, fill: "#7FCDCD" },
-  { className: "star-rotate-slow-cw", size: 150, staticDeg: null, fill: "#AFEEEE" },
+/** Teal/cyan stack for the right (Konfigurator) star — same motion, blue color scheme */
+const TEAL_STAR_LAYERS = [
+  { className: "star-rotate-slow-ccw", size: 168 },
+  { className: "star-rotate-medium-cw", size: 159 },
+  { className: "star-rotate-slow-cw", size: 150 },
 ];

-const StarDecorationLayers = ({ layers }) => (
+/** Initial fill per variant (matches keyframe 0%) — avoids black flash before CSS animates */
+const STAR_INITIAL_FILLS = {
+  home: ["#B8860B", "#DAA520", "#FFD700"],
+  filiale: ["#5F9EA0", "#7FCDCD", "#AFEEEE"],
+};
+
+/** Injected in render (not useEffect) so first paint already has keyframes — avoids angle/color snap on load */
+const STAR_DECORATION_CSS = `
+  @keyframes rotateClockwise {
+    from { transform: rotate(0deg); }
+    to { transform: rotate(360deg); }
+  }
+  @keyframes rotateCounterClockwise {
+    from { transform: rotate(0deg); }
+    to { transform: rotate(-360deg); }
+  }
+  .star-rotate-slow-cw,
+  .star-rotate-slow-ccw,
+  .star-rotate-medium-cw {
+    transform-box: fill-box;
+    transform-origin: center;
+  }
+  .star-rotate-slow-cw {
+    animation: rotateClockwise 60s linear infinite;
+  }
+  .star-rotate-slow-ccw {
+    animation: rotateCounterClockwise 45s linear infinite;
+  }
+  .star-rotate-medium-cw {
+    animation: rotateClockwise 30s linear infinite;
+  }
+
+  .star-layer-svg-home { mix-blend-mode: screen; opacity: 0.92; }
+  .star-layer-svg-filiale { mix-blend-mode: soft-light; opacity: 0.94; }
+
+  @keyframes starFillHome0 {
+    0%, 100% { fill: #B8860B; }
+    33% { fill: #FFD700; }
+    66% { fill: #DAA520; }
+  }
+  @keyframes starFillHome1 {
+    0%, 100% { fill: #DAA520; }
+    33% { fill: #B8860B; }
+    66% { fill: #FFD700; }
+  }
+  @keyframes starFillHome2 {
+    0%, 100% { fill: #FFD700; }
+    33% { fill: #DAA520; }
+    66% { fill: #B8860B; }
+  }
+  @keyframes starDriftHome0 {
+    0%, 100% { transform: rotate(20deg) translate(0px, 0px); }
+    50% { transform: rotate(20deg) translate(5px, -5px); }
+  }
+  @keyframes starDriftHome1 {
+    0%, 100% { transform: rotate(-25deg) translate(0px, 0px); }
+    50% { transform: rotate(-25deg) translate(-4px, 6px); }
+  }
+  @keyframes starDriftHome2 {
+    0%, 100% { transform: translate(0px, 0px); }
+    50% { transform: translate(3px, 4px); }
+  }
+  .star-layer-wrap.star-layer-home-0 {
+    animation: starDriftHome0 6.5s ease-in-out infinite;
+    animation-fill-mode: both;
+  }
+  .star-layer-wrap.star-layer-home-1 {
+    animation: starDriftHome1 7s ease-in-out 0.4s infinite;
+    animation-fill-mode: both;
+  }
+  .star-layer-wrap.star-layer-home-2 {
+    animation: starDriftHome2 5.5s ease-in-out 0.8s infinite;
+    animation-fill-mode: both;
+  }
+  .star-poly-home-0 { animation: starFillHome0 10s ease-in-out 0s infinite both; }
+  .star-poly-home-1 { animation: starFillHome1 10s ease-in-out 1.1s infinite both; }
+  .star-poly-home-2 { animation: starFillHome2 10s ease-in-out 2.2s infinite both; }
+
+  @keyframes starFillFil0 {
+    0%, 100% { fill: #5F9EA0; }
+    33% { fill: #AFEEEE; }
+    66% { fill: #7FCDCD; }
+  }
+  @keyframes starFillFil1 {
+    0%, 100% { fill: #7FCDCD; }
+    33% { fill: #5F9EA0; }
+    66% { fill: #AFEEEE; }
+  }
+  @keyframes starFillFil2 {
+    0%, 100% { fill: #AFEEEE; }
+    33% { fill: #7FCDCD; }
+    66% { fill: #5F9EA0; }
+  }
+  @keyframes starDriftFil0 {
+    0%, 100% { transform: rotate(20deg) translate(0px, 0px); }
+    50% { transform: rotate(20deg) translate(4px, -4px); }
+  }
+  @keyframes starDriftFil1 {
+    0%, 100% { transform: rotate(-25deg) translate(0px, 0px); }
+    50% { transform: rotate(-25deg) translate(-5px, 5px); }
+  }
+  @keyframes starDriftFil2 {
+    0%, 100% { transform: translate(0px, 0px); }
+    50% { transform: translate(3px, 3px); }
+  }
+  .star-layer-wrap.star-layer-filiale-0 {
+    animation: starDriftFil0 6.5s ease-in-out infinite;
+    animation-fill-mode: both;
+  }
+  .star-layer-wrap.star-layer-filiale-1 {
+    animation: starDriftFil1 7s ease-in-out 0.4s infinite;
+    animation-fill-mode: both;
+  }
+  .star-layer-wrap.star-layer-filiale-2 {
+    animation: starDriftFil2 5.5s ease-in-out 0.8s infinite;
+    animation-fill-mode: both;
+  }
+  .star-poly-filiale-0 { animation: starFillFil0 10s ease-in-out 0s infinite both; }
+  .star-poly-filiale-1 { animation: starFillFil1 10s ease-in-out 1.1s infinite both; }
+  .star-poly-filiale-2 { animation: starFillFil2 10s ease-in-out 2.2s infinite both; }
+`;
+
+const StarDecorationLayers = ({ layers, variant }) => (
  <>
-    {layers.map(({ className, size, staticDeg, fill }, i) => {
+    {layers.map(({ className, size }, i) => {
      const half = size / 2;
+      const initialFill = STAR_INITIAL_FILLS[variant][i];
      return (
        <div
          key={i}
+          className={`star-layer-wrap star-layer-${variant}-${i}`}
          style={{
            position: "absolute",
            left: "50%",
@@ -40,11 +165,21 @@ const StarDecorationLayers = ({ layers }) => (
            height: size,
            marginLeft: -half,
            marginTop: -half,
-            ...(staticDeg != null ? { transform: `rotate(${staticDeg}deg)` } : {}),
+            zIndex: 3 - i,
          }}
        >
-          <svg viewBox="0 0 60 60" width="100%" height="100%" className={className} style={{ display: "block" }}>
-            <polygon points={STAR_POLYGON_POINTS} fill={fill} />
+          <svg
+            viewBox="0 0 60 60"
+            width="100%"
+            height="100%"
+            className={`${className} star-layer-svg star-layer-svg-${variant}`}
+            style={{ display: "block" }}
+          >
+            <polygon
+              points={STAR_POLYGON_POINTS}
+              fill={initialFill}
+              className={`star-poly-fill star-poly-${variant}-${i}`}
+            />
          </svg>
        </div>
      );
@@ -69,7 +204,7 @@ const ContentBox = ({ box, index, pageType, starHovered, setStarHovered, opacity
          display: { xs: 'none', sm: 'block' }
        }}
      >
-        <StarDecorationLayers layers={HOME_STAR_LAYERS} />
+        <StarDecorationLayers layers={HOME_STAR_LAYERS} variant="home" />
        <div style={{ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%) rotate(-10deg)', color: 'white', fontWeight: '900', fontSize: '20px', textShadow: '0px 3px 6px rgba(0,0,0,0.5)', zIndex: 1000, textAlign: 'center', lineHeight: '1.1', width: '135px', transition: 'opacity 0.3s ease', opacity: starHovered ? 0 : 1 }}>
          {translatedContent.outdoorSeason}
        </div>
@@ -78,7 +213,7 @@ const ContentBox = ({ box, index, pageType, starHovered, setStarHovered, opacity
        </div>
      </Box>
    )}
-    {index === 1 && pageType === "filiale" && (
+    {index === 1 && pageType === "home" && (
      <Box
        sx={{
          position: 'absolute',
@@ -93,9 +228,9 @@ const ContentBox = ({ box, index, pageType, starHovered, setStarHovered, opacity
          display: { xs: 'none', sm: 'block' }
        }}
      >
-        <StarDecorationLayers layers={FILIALE_STAR_LAYERS} />
+        <StarDecorationLayers layers={TEAL_STAR_LAYERS} variant="filiale" />
        <div style={{ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%) rotate(10deg)', color: 'white', fontWeight: '900', fontSize: '20px', textShadow: '0px 3px 6px rgba(0,0,0,0.5)', zIndex: 1000, textAlign: 'center', lineHeight: '1.1', width: '135px' }}>
-          {translatedContent.showUsPhoto}
+          {translatedContent.buildYourSet}
        </div>
      </Box>
    )}
@@ -117,12 +252,12 @@ const ContentBox = ({ box, index, pageType, starHovered, setStarHovered, opacity
          "&:hover": { transform: "translateY(-5px)", boxShadow: 20 },
        }}
        onMouseEnter={
-          (pageType === "home" && index === 0) || (pageType === "filiale" && index === 1)
+          pageType === "home" && index === 0
            ? () => setStarHovered(true)
            : undefined
        }
        onMouseLeave={
-          (pageType === "home" && index === 0) || (pageType === "filiale" && index === 1)
+          pageType === "home" && index === 0
            ? () => setStarHovered(false)
            : undefined
        }
@@ -146,7 +281,7 @@ const MainPageLayout = () => {
  const { t } = useTranslation();
  const [starHovered, setStarHovered] = React.useState(false);
  const translatedContent = {
-    showUsPhoto: t('sections.showUsPhoto'),
+    buildYourSet: t('sections.buildYourSet'),
    selectSeedRate: t('sections.selectSeedRate'),
    outdoorSeason: t('sections.outdoorSeason')
  };
@@ -155,37 +290,6 @@ const MainPageLayout = () => {
  const isAktionen = currentPath === "/aktionen";
  const isFiliale = currentPath === "/filiale";

-  React.useEffect(() => {
-    const style = document.createElement('style');
-    style.textContent = `
-      @keyframes rotateClockwise {
-        from { transform: rotate(0deg); }
-        to { transform: rotate(360deg); }
-      }
-      @keyframes rotateCounterClockwise {
-        from { transform: rotate(0deg); }
-        to { transform: rotate(-360deg); }
-      }
-      .star-rotate-slow-cw,
-      .star-rotate-slow-ccw,
-      .star-rotate-medium-cw {
-        transform-box: fill-box;
-        transform-origin: center;
-      }
-      .star-rotate-slow-cw {
-        animation: rotateClockwise 60s linear infinite;
-      }
-      .star-rotate-slow-ccw {
-        animation: rotateCounterClockwise 45s linear infinite;
-      }
-      .star-rotate-medium-cw {
-        animation: rotateClockwise 30s linear infinite;
-      }
-    `;
-    document.head.appendChild(style);
-    return () => document.head.removeChild(style);
-  }, []);
-
  const getNavigationConfig = () => {
    if (isHome) return { leftNav: { text: t('navigation.aktionen'), link: "/aktionen" }, rightNav: { text: t('navigation.filiale'), link: "/filiale" } };
    if (isAktionen) return { leftNav: { text: t('navigation.filiale'), link: "/filiale" }, rightNav: { text: t('navigation.home'), link: "/" } };
@@ -231,6 +335,7 @@ const MainPageLayout = () => {
  return (
    <Container maxWidth="lg" sx={{ py: 2 }}>
      <style>{getCombinedAnimatedBorderStyles(['seeds', 'cutlings'])}</style>
+      <style>{STAR_DECORATION_CSS}</style>
      <Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between", mb: 4, mt: 2, px: 0, transition: "all 0.3s ease-in-out", flexDirection: { xs: "column", sm: "row" } }}>
        <Box sx={{ display: { xs: "block", sm: "none" }, mb: { xs: 2, sm: 0 }, width: "100%", textAlign: "center", position: "relative" }}>
          {Object.entries(allTitles).map(([pageType, title]) => (
--- a/src/i18n/locales/ar/navigation.js
+++ b/src/i18n/locales/ar/navigation.js
@@ -1,5 +1,6 @@
 export default {
  "home": "الرئيسية",
+  "konfiguratorAria": "اذهب إلى المُكوِّن",
  "new": "وصل حديثًا",
  "soon": "قريبًا",
  "aktionen": "العروض الترويجية",
--- a/src/i18n/locales/ar/sections.js
+++ b/src/i18n/locales/ar/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "اختبار THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "ورّينا أجمل صورة عندك",
+  "buildYourSet": "جهّز مجموعتك",
  "selectSeedRate": "اختار البذرة، واضغط قيّم",
  "outdoorSeason": "موسم الزراعة الخارجية بيبدأ"
 };
--- a/src/i18n/locales/bg/navigation.js
+++ b/src/i18n/locales/bg/navigation.js
@@ -1,11 +1,12 @@
 export default {
  "home": "Начало",
-  "new": "Нови артикули",
+  "konfiguratorAria": "Отидете на Конфигуратора",
+  "new": "Нови попълнения",
  "soon": "Очаквайте скоро",
  "aktionen": "Промоции",
  "filiale": "Магазин",
  "categories": "Категории",
-  "categoriesOpen": "Отвори категориите",
-  "categoriesClose": "Затвори категориите",
+  "categoriesOpen": "Отвори категории",
+  "categoriesClose": "Затвори категории",
  "otherCategories": "Други категории"
 };
--- a/src/i18n/locales/bg/sections.js
+++ b/src/i18n/locales/bg/sections.js
@@ -2,11 +2,11 @@ export default {
  "seeds": "Семена",
  "stecklinge": "Резници",
  "konfigurator": "Конфигуратор",
-  "oilPress": "Вземете назаем преса за масло",
+  "oilPress": "Вземете на заем маслоизстисквачка",
  "thcTest": "THC тест",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Покажете ни най-красивата си снимка",
-  "selectSeedRate": "Изберете семе, кликнете за оценка",
-  "outdoorSeason": "Започва сезонът на открито"
+  "buildYourSet": "Сглобете своя комплект",
+  "selectSeedRate": "Изберете семе, кликнете върху оценка",
+  "outdoorSeason": "Открива се сезонът на открито"
 };
--- a/src/i18n/locales/cs/navigation.js
+++ b/src/i18n/locales/cs/navigation.js
@@ -1,5 +1,6 @@
 export default {
  "home": "Domů",
+  "konfiguratorAria": "Přejít do konfigurátoru",
  "new": "Novinky",
  "soon": "Již brzy",
  "aktionen": "Akce",
@@ -7,5 +8,5 @@ export default {
  "categories": "Kategorie",
  "categoriesOpen": "Otevřít kategorie",
  "categoriesClose": "Zavřít kategorie",
-  "otherCategories": "Další kategorie"
+  "otherCategories": "Ostatní kategorie"
 };
--- a/src/i18n/locales/cs/sections.js
+++ b/src/i18n/locales/cs/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC test",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Ukažte nám svou nejkrásnější fotografii",
+  "buildYourSet": "Sestavte si svou sadu",
  "selectSeedRate": "Vyberte semeno, klikněte na hodnocení",
  "outdoorSeason": "Začíná venkovní sezóna"
 };
--- a/src/i18n/locales/de/sections.js
+++ b/src/i18n/locales/de/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC Test",
  "address1": "Trachenberger Straße 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Zeig uns dein schönstes Foto",
+  "buildYourSet": "Stelle dein Set zusammen",
  "selectSeedRate": "Wähle Seed aus, klicke Bewerten",
  "outdoorSeason": "Die Outdoorsaison beginnt"
 }; 
--- a/src/i18n/locales/el/navigation.js
+++ b/src/i18n/locales/el/navigation.js
@@ -1,7 +1,8 @@
 export default {
  "home": "Αρχική",
-  "new": "Νέες Αφίξεις",
-  "soon": "Έρχεται Σύντομα",
+  "konfiguratorAria": "Μετάβαση στον Configurator",
+  "new": "Νέα Άφιξη",
+  "soon": "Σύντομα",
  "aktionen": "Προσφορές",
  "filiale": "Κατάστημα",
  "categories": "Κατηγορίες",
--- a/src/i18n/locales/el/sections.js
+++ b/src/i18n/locales/el/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Τεστ THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Δείξε μας τη πιο όμορφη φωτογραφία σου",
+  "buildYourSet": "Φτιάξε το δικό σου σετ",
  "selectSeedRate": "Επίλεξε σπόρο, κάνε κλικ στη βαθμολογία",
  "outdoorSeason": "Ξεκινά η υπαίθρια σεζόν"
 };
--- a/src/i18n/locales/en/sections.js
+++ b/src/i18n/locales/en/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC Test", // THC Test
  "address1": "Trachenberger Street 14", // Trachenberger Straße 14
  "address2": "01129 Dresden", // 01129 Dresden
-  "showUsPhoto": "Show us your most beautiful photo", // Zeig uns dein schönstes Foto
+  "buildYourSet": "Put your set together", // Stelle dein Set zusammen
  "selectSeedRate": "Choose seed, click rate", // Wähle Seed aus, klicke Bewerten
  "outdoorSeason": "The outdoor season begins" // Die Outdoorsaison beginnt
 };
--- a/src/i18n/locales/es/navigation.js
+++ b/src/i18n/locales/es/navigation.js
@@ -1,5 +1,6 @@
 export default {
  "home": "Inicio",
+  "konfiguratorAria": "Ir al Configurator",
  "new": "Novedades",
  "soon": "Próximamente",
  "aktionen": "Promociones",
--- a/src/i18n/locales/es/sections.js
+++ b/src/i18n/locales/es/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Prueba de THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Muéstranos tu foto más bonita",
+  "buildYourSet": "Monta tu equipo",
  "selectSeedRate": "Elige la semilla, haz clic en valorar",
  "outdoorSeason": "Comienza la temporada al aire libre"
 };
--- a/src/i18n/locales/fr/navigation.js
+++ b/src/i18n/locales/fr/navigation.js
@@ -1,5 +1,6 @@
 export default {
  "home": "Accueil",
+  "konfiguratorAria": "Aller au Configurateur",
  "new": "Nouveautés",
  "soon": "Bientôt disponible",
  "aktionen": "Promotions",
--- a/src/i18n/locales/fr/sections.js
+++ b/src/i18n/locales/fr/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Test THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresde",
-  "showUsPhoto": "Montrez-nous votre plus belle photo",
+  "buildYourSet": "Composez votre ensemble",
  "selectSeedRate": "Choisissez une graine, cliquez sur évaluer",
  "outdoorSeason": "La saison en extérieur commence"
 };
--- a/src/i18n/locales/hr/navigation.js
+++ b/src/i18n/locales/hr/navigation.js
@@ -1,7 +1,8 @@
 export default {
  "home": "Početna",
+  "konfiguratorAria": "Idi na Konfigurator",
  "new": "Novi proizvodi",
-  "soon": "Uskoro",
+  "soon": "Uskoro dostupno",
  "aktionen": "Promocije",
  "filiale": "Trgovina",
  "categories": "Kategorije",
--- a/src/i18n/locales/hr/sections.js
+++ b/src/i18n/locales/hr/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC test",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Pokažite nam svoju najljepšu fotografiju",
+  "buildYourSet": "Sastavite svoj set",
  "selectSeedRate": "Odaberite sjeme, kliknite ocjenu",
  "outdoorSeason": "Počinje sezona za vanjsku uzgoj"
 };
--- a/src/i18n/locales/hu/navigation.js
+++ b/src/i18n/locales/hu/navigation.js
@@ -1,9 +1,10 @@
 export default {
-  "home": "Főoldal",
+  "home": "Kezdőlap",
+  "konfiguratorAria": "Ugrás a konfigurátorhoz",
  "new": "Újdonságok",
  "soon": "Hamarosan",
-  "aktionen": "Promóciók",
-  "filiale": "Üzlet",
+  "aktionen": "Akciók",
+  "filiale": "Bolt",
  "categories": "Kategóriák",
  "categoriesOpen": "Kategóriák megnyitása",
  "categoriesClose": "Kategóriák bezárása",
--- a/src/i18n/locales/hu/sections.js
+++ b/src/i18n/locales/hu/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC teszt",
  "address1": "Trachenberger utca 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Mutasd meg nekünk a legszebb fotódat",
+  "buildYourSet": "Állítsd össze a szettet",
  "selectSeedRate": "Válassz magot, kattints az értékelésre",
  "outdoorSeason": "Kezdődik a szabadtéri szezon"
 };
--- a/src/i18n/locales/it/navigation.js
+++ b/src/i18n/locales/it/navigation.js
@@ -1,11 +1,12 @@
 export default {
  "home": "Home",
-  "new": "Novità",
+  "konfiguratorAria": "Vai al Configuratore",
+  "new": "Nuovi Arrivi",
  "soon": "Prossimamente",
  "aktionen": "Promozioni",
  "filiale": "Negozio",
  "categories": "Categorie",
-  "categoriesOpen": "Apri categorie",
-  "categoriesClose": "Chiudi categorie",
-  "otherCategories": "Altre categorie"
+  "categoriesOpen": "Apri Categorie",
+  "categoriesClose": "Chiudi Categorie",
+  "otherCategories": "Altre Categorie"
 };
--- a/src/i18n/locales/it/sections.js
+++ b/src/i18n/locales/it/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Test THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresda",
-  "showUsPhoto": "Mostraci la tua foto più bella",
+  "buildYourSet": "Componi il tuo set",
  "selectSeedRate": "Scegli il seme, clicca valuta",
  "outdoorSeason": "La stagione outdoor inizia"
 };
--- a/src/i18n/locales/pl/navigation.js
+++ b/src/i18n/locales/pl/navigation.js
@@ -1,7 +1,8 @@
 export default {
  "home": "Strona główna",
+  "konfiguratorAria": "Przejdź do Konfiguratora",
  "new": "Nowości",
-  "soon": "Wkrótce",
+  "soon": "Wkrótce dostępne",
  "aktionen": "Promocje",
  "filiale": "Sklep",
  "categories": "Kategorie",
--- a/src/i18n/locales/pl/sections.js
+++ b/src/i18n/locales/pl/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Test THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Pokaż nam swoje najpiękniejsze zdjęcie",
+  "buildYourSet": "Złóż swój zestaw",
  "selectSeedRate": "Wybierz nasiono, kliknij ocenę",
  "outdoorSeason": "Sezon outdoorowy się zaczyna"
 };
--- a/src/i18n/locales/ro/navigation.js
+++ b/src/i18n/locales/ro/navigation.js
@@ -1,11 +1,12 @@
 export default {
  "home": "Acasă",
+  "konfiguratorAria": "Mergi la Configurator",
  "new": "Noutăți",
  "soon": "În curând",
  "aktionen": "Promoții",
  "filiale": "Magazin",
  "categories": "Categorii",
-  "categoriesOpen": "Deschide categorii",
-  "categoriesClose": "Închide categorii",
+  "categoriesOpen": "Deschide categoriile",
+  "categoriesClose": "Închide categoriile",
  "otherCategories": "Alte categorii"
 };
--- a/src/i18n/locales/ro/sections.js
+++ b/src/i18n/locales/ro/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Test THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Arată-ne cea mai frumoasă fotografie a ta",
+  "buildYourSet": "Construiește-ți setul",
  "selectSeedRate": "Alege sămânța, apasă pe evaluare",
  "outdoorSeason": "Sezonul outdoor începe"
 };
--- a/src/i18n/locales/ru/navigation.js
+++ b/src/i18n/locales/ru/navigation.js
@@ -1,7 +1,8 @@
 export default {
  "home": "Главная",
+  "konfiguratorAria": "Перейти к конфигуратору",
  "new": "Новинки",
-  "soon": "Скоро",
+  "soon": "Скоро в продаже",
  "aktionen": "Акции",
  "filiale": "Магазин",
  "categories": "Категории",
--- a/src/i18n/locales/ru/sections.js
+++ b/src/i18n/locales/ru/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Тест THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Покажите нам ваше самое красивое фото",
+  "buildYourSet": "Соберите свой комплект",
  "selectSeedRate": "Выберите семя, нажмите оценить",
  "outdoorSeason": "Начинается сезон на открытом воздухе"
 };
--- a/src/i18n/locales/sk/navigation.js
+++ b/src/i18n/locales/sk/navigation.js
@@ -1,11 +1,12 @@
 export default {
  "home": "Domov",
+  "konfiguratorAria": "Prejsť do konfigurátora",
  "new": "Novinky",
  "soon": "Čoskoro",
  "aktionen": "Akcie",
  "filiale": "Predajňa",
  "categories": "Kategórie",
  "categoriesOpen": "Otvoriť kategórie",
-  "categoriesClose": "Zavrieť kategórie",
-  "otherCategories": "Ďalšie kategórie"
+  "categoriesClose": "Zatvoriť kategórie",
+  "otherCategories": "Ostatné kategórie"
 };
--- a/src/i18n/locales/sk/sections.js
+++ b/src/i18n/locales/sk/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC test",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Ukážte nám svoju najkrajšiu fotku",
+  "buildYourSet": "Zostavte si svoj set",
  "selectSeedRate": "Vyberte semeno, kliknite na hodnotenie",
  "outdoorSeason": "Začína vonkajšia sezóna"
 };
--- a/src/i18n/locales/sl/navigation.js
+++ b/src/i18n/locales/sl/navigation.js
@@ -1,7 +1,8 @@
 export default {
  "home": "Domov",
-  "new": "Nove prihajajoče",
-  "soon": "Kmalu prihaja",
+  "konfiguratorAria": "Pojdi v konfigurator",
+  "new": "Nove izdelke",
+  "soon": "Kmalu na voljo",
  "aktionen": "Promocije",
  "filiale": "Trgovina",
  "categories": "Kategorije",
--- a/src/i18n/locales/sl/sections.js
+++ b/src/i18n/locales/sl/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC test",
  "address1": "Trachenberger Straße 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Pokaži nam svojo najlepšo fotografijo",
+  "buildYourSet": "Sestavi svoj set",
  "selectSeedRate": "Izberi seme, klikni oceno",
  "outdoorSeason": "Zunanja sezona se začenja"
 };
--- a/src/i18n/locales/sq/navigation.js
+++ b/src/i18n/locales/sq/navigation.js
@@ -1,5 +1,6 @@
 export default {
-  "home": "Shtëpia",
+  "home": "Kreu",
+  "konfiguratorAria": "Shko te Konfiguratori",
  "new": "Arritjet e reja",
  "soon": "Së shpejti",
  "aktionen": "Promocione",
@@ -7,5 +8,5 @@ export default {
  "categories": "Kategoritë",
  "categoriesOpen": "Hap kategoritë",
  "categoriesClose": "Mbyll kategoritë",
-  "otherCategories": "Kategori të tjera"
+  "otherCategories": "Kategoritë e tjera"
 };
--- a/src/i18n/locales/sq/sections.js
+++ b/src/i18n/locales/sq/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Test THC",
  "address1": "Rruga Trachenberger 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Na tregoni foton tuaj më të bukur",
+  "buildYourSet": "Ndërto setin tënd",
  "selectSeedRate": "Zgjidhni farën, klikoni vlerësimin",
  "outdoorSeason": "Fillon sezoni i jashtëm"
 };
--- a/src/i18n/locales/sr/navigation.js
+++ b/src/i18n/locales/sr/navigation.js
@@ -1,6 +1,7 @@
 export default {
  "home": "Početna",
-  "new": "Nove kolekcije",
+  "konfiguratorAria": "Idi na Konfigurator",
+  "new": "Novi artikli",
  "soon": "Uskoro",
  "aktionen": "Promocije",
  "filiale": "Prodavnica",
--- a/src/i18n/locales/sr/sections.js
+++ b/src/i18n/locales/sr/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC test",
  "address1": "Trachenberger ulica 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Pokažite nam svoju najlepšu fotografiju",
+  "buildYourSet": "Sastavite svoj set",
  "selectSeedRate": "Izaberite seme, kliknite ocenu",
  "outdoorSeason": "Počinje sezona na otvorenom"
 };
--- a/src/i18n/locales/sv/navigation.js
+++ b/src/i18n/locales/sv/navigation.js
@@ -1,6 +1,7 @@
 export default {
  "home": "Hem",
-  "new": "Nya produkter",
+  "konfiguratorAria": "Gå till konfiguratorn",
+  "new": "Nyheter",
  "soon": "Kommer snart",
  "aktionen": "Kampanjer",
  "filiale": "Butik",
--- a/src/i18n/locales/sv/sections.js
+++ b/src/i18n/locales/sv/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC-test",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Visa oss ditt vackraste foto",
+  "buildYourSet": "Sätt ihop ditt set",
  "selectSeedRate": "Välj frö, klicka på betygsätt",
  "outdoorSeason": "Utomhussäsongen börjar"
 };
--- a/src/i18n/locales/tr/navigation.js
+++ b/src/i18n/locales/tr/navigation.js
@@ -1,7 +1,8 @@
 export default {
  "home": "Ana Sayfa",
+  "konfiguratorAria": "Yapılandırıcıya Git",
  "new": "Yeni Gelenler",
-  "soon": "Çok Yakında",
+  "soon": "Yakında",
  "aktionen": "Kampanyalar",
  "filiale": "Mağaza",
  "categories": "Kategoriler",
--- a/src/i18n/locales/tr/sections.js
+++ b/src/i18n/locales/tr/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC Testi",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Bize en güzel fotoğrafınızı gösterin",
+  "buildYourSet": "Setini bir araya getir",
  "selectSeedRate": "Tohum seçin, puan verin",
  "outdoorSeason": "Dış mekân sezonu başlıyor"
 };
--- a/src/i18n/locales/uk/navigation.js
+++ b/src/i18n/locales/uk/navigation.js
@@ -1,5 +1,6 @@
 export default {
  "home": "Головна",
+  "konfiguratorAria": "Перейти до конфігуратора",
  "new": "Новинки",
  "soon": "Незабаром",
  "aktionen": "Акції",
--- a/src/i18n/locales/uk/sections.js
+++ b/src/i18n/locales/uk/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "Тест THC",
  "address1": "Trachenberger Street 14",
  "address2": "01129 Dresden",
-  "showUsPhoto": "Покажіть нам ваше найкрасивіше фото",
+  "buildYourSet": "Зберіть свій комплект",
  "selectSeedRate": "Оберіть насіння, натисніть оцінити",
  "outdoorSeason": "Починається сезон вирощування на відкритому повітрі"
 };
--- a/src/i18n/locales/zh/navigation.js
+++ b/src/i18n/locales/zh/navigation.js
@@ -1,6 +1,7 @@
 export default {
  "home": "首页",
-  "new": "新品",
+  "konfiguratorAria": "前往配置器",
+  "new": "新品上架",
  "soon": "即将推出",
  "aktionen": "促销活动",
  "filiale": "门店",
--- a/src/i18n/locales/zh/sections.js
+++ b/src/i18n/locales/zh/sections.js
@@ -6,7 +6,7 @@ export default {
  "thcTest": "THC 测试",
  "address1": "Trachenberger 街 14",
  "address2": "01129 德累斯顿",
-  "showUsPhoto": "展示你最美的照片",
+  "buildYourSet": "组合你的套装",
  "selectSeedRate": "选择种子，点击评分",
  "outdoorSeason": "户外季节开始了"
 };