feat: Add new virtual categories 'bald' and 'neu', update category handling in renderApp, and enhance translations across multiple locales

src/components/header/CategoryList.js

@@ -7,6 +7,7 @@ import Collapse from "@mui/material/Collapse";
 import { Link } from "react-router-dom";
 import HomeIcon from "@mui/icons-material/Home";
 import FiberNewIcon from '@mui/icons-material/FiberNew';
+import LocalShippingIcon from "@mui/icons-material/LocalShipping";
 import SettingsIcon from "@mui/icons-material/Settings";
 import MenuIcon from "@mui/icons-material/Menu";
 import CloseIcon from "@mui/icons-material/Close";
@@ -309,6 +310,62 @@ class CategoryList extends Component {
           )}
         </Button>
 
+        <Button
+          component={Link}
+          to="/Kategorie/bald"
+          color="inherit"
+          size="small"
+          aria-label={this.props.t ? this.props.t('navigation.soon') : 'Demnächst'}
+          onClick={isMobile ? this.handleMobileCategoryClick : undefined}
+          sx={{
+            fontSize: "0.75rem",
+            textTransform: "none",
+            whiteSpace: "nowrap",
+            opacity: 0.9,
+            mx: isMobile ? 0 : 0.5,
+            my: 0.25,
+            minWidth: isMobile ? "100%" : "auto",
+            borderRadius: 1,
+            justifyContent: isMobile ? "flex-start" : "center",
+            transition: "all 0.2s ease",
+            textShadow: "0 1px 2px rgba(0,0,0,0.3)",
+            position: "relative"
+          }}
+        >
+          <LocalShippingIcon sx={{
+            fontSize: "1rem",
+            mr: isMobile ? 1 : 0
+          }} />
+          {isMobile && (
+            <Box sx={{ position: "relative", display: "inline-block" }}>
+              <Box
+                className="bold-text"
+                sx={{
+                  fontWeight: "bold",
+                  color: "transparent",
+                  position: "relative",
+                  zIndex: 2,
+                }}
+              >
+                {this.props.t ? this.props.t('navigation.soon') : 'Demnächst'}
+              </Box>
+              <Box
+                className="thin-text"
+                sx={{
+                  fontWeight: "400",
+                  color: "inherit",
+                  position: "absolute",
+                  top: 0,
+                  left: 0,
+                  zIndex: 1,
+                }}
+              >
+                {this.props.t ? this.props.t('navigation.soon') : 'Demnächst'}
+              </Box>
+            </Box>
+          )}
+        </Button>
+
 
         {categories.length > 0 ? (
           <>