Skip to content

Commit 8ad8070

Browse files
committed
introduce shorter button text
1 parent 80dc992 commit 8ad8070

File tree

6 files changed

+34
-22
lines changed

6 files changed

+34
-22
lines changed

src/ui/language/translations.js

+6-4
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,13 @@ const translations = {
22
en: {
33
home: {
44
global: {
5-
actionButton: "Discover benefits"
5+
actionButton: "Discover benefits",
6+
actionButtonShort: "Discover"
67
},
78
menu: {
89
howWorks: "How it works",
910
principles: "Principles",
10-
aboutUs: "About us",
11+
aboutUs: "Team",
1112
improve: "Help us improve",
1213
collaborate: "Collaborate",
1314
activityLog: "Activity log"
@@ -254,12 +255,13 @@ const translations = {
254255
de: {
255256
home: {
256257
global: {
257-
actionButton: "Anspruch prüfen"
258+
actionButton: "Anspruch prüfen",
259+
actionButtonShort: "Prüfen"
258260
},
259261
menu: {
260262
howWorks: "So geht's",
261263
principles: "Prinzipien",
262-
aboutUs: "Über uns",
264+
aboutUs: "Team",
263265
improve: "Feedback",
264266
collaborate: "Zusammenarbeit",
265267
activityLog: "Aktivitäten"

src/ui/screens/landing-page/sections/top-section/components/LandingPageTopSectionShared.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import React, { useState, useEffect } from "react";
22
import { Typography } from "@mui/material";
33
import { motion } from "framer-motion";
4-
import { HBox, VBox } from "../../../../../shared-components/LayoutBoxes";
5-
import useTranslation from "../../../../../language/useTranslation";
4+
import { HBox, VBox } from "@/ui/shared-components/LayoutBoxes";
5+
import useTranslation from "@/ui/language/useTranslation";
66

77
const LandingPageTopSectionShared = () => {
88
const { t } = useTranslation();

src/ui/shared-components/Layout.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import {VBox} from "./LayoutBoxes";
3-
import HeaderBar from "../screens/landing-page/sections/header/HeaderBar";
3+
import HeaderBar from "./header/HeaderBar";
44
import {useStore} from "./ViewportUpdater";
55

66
const Layout = ({children, isApp = false, logo = true, back = null, gap = 2}) => {

src/ui/screens/landing-page/sections/header/HeaderBar.js renamed to src/ui/shared-components/header/HeaderBar.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import React from "react";
22
import HeaderBarMobile from "./views/HeaderBarMobile";
33
import HeaderBarDesktop from "./views/HeaderBarDesktop";
4-
import { VBox } from "../../../../shared-components/LayoutBoxes";
5-
import theme from "../../../../../theme";
4+
import { VBox } from "@/ui/shared-components/LayoutBoxes";
65

76
const HeaderBar = ({ isApp, isDesktop }) => {
8-
const backgroundColor = isApp ? `${theme.palette.blue.dark}` : `${theme.palette.white.main}`;
7+
const backgroundColor = isApp ? 'blue.dark' : 'white.main';
98
const sticky = isApp ? "relative" : "sticky";
109

1110
return (

src/ui/screens/landing-page/sections/header/views/HeaderBarDesktop.js renamed to src/ui/shared-components/header/views/HeaderBarDesktop.js

+14-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import React, { useContext } from 'react';
1+
import React, { useContext, useEffect, useState } from 'react';
22
import { LanguageContext } from "@/ui/language/LanguageContext";
33
import useTranslation from "@/ui/language/useTranslation";
44
import { Link } from "react-router-dom";
55
import { HBox } from '@/ui/shared-components/LayoutBoxes';
66
import LogoBar from '@/ui/shared-components/LogoBar';
77
import AntSwitch from '@/ui/shared-components/AntSwitch';
8-
import LandingPageHollowButtonDesktop from '../../../components/LandingPageButtonDesktop';
8+
import LandingPageHollowButtonDesktop from '@/ui/screens/landing-page/components/LandingPageButtonDesktop';
99
import theme from '@/theme';
1010
import RegularButton from '@/ui/shared-components/RegularButton';
1111

@@ -14,6 +14,17 @@ const HeaderBarDesktop = ({ isApp }) => {
1414
const { t } = useTranslation();
1515
const isEnglish = language === "en";
1616

17+
const [isSmallScreen, setIsSmallScreen] = useState(window.innerWidth < 1200);
18+
19+
useEffect(() => {
20+
const handleResize = () => {
21+
setIsSmallScreen(window.innerWidth < 1200);
22+
};
23+
24+
window.addEventListener('resize', handleResize);
25+
return () => window.removeEventListener('resize', handleResize);
26+
}, []);
27+
1728
const handleLanguageToggle = (event) => {
1829
setLanguage(event.target.checked ? "en" : "de");
1930
};
@@ -33,6 +44,7 @@ const HeaderBarDesktop = ({ isApp }) => {
3344
<HBox gap={5}>
3445
{!isApp ?
3546
<RegularButton
47+
text={isSmallScreen ? 'home.global.actionButtonShort' : 'home.global.actionButton'}
3648
variant={'blackOutlined'}
3749
link='/user-routing'
3850
/> : null}

src/ui/screens/landing-page/sections/header/views/HeaderBarMobile.js renamed to src/ui/shared-components/header/views/HeaderBarMobile.js

+9-10
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
import React, { useState, useContext } from 'react';
2-
import { LanguageContext } from "../../../../../language/LanguageContext";
2+
import { LanguageContext } from "@/ui/language/LanguageContext";
33
import MenuIcon from '@mui/icons-material/Menu';
44
import { IconButton } from '@mui/material';
55
import { Link } from 'react-router-dom';
6-
import LogoBar from "../../../../../shared-components/LogoBar";
7-
import useTranslation from "../../../../../language/useTranslation";
8-
import { HBox, VBox } from "../../../../../shared-components/LayoutBoxes";
9-
import theme from "../../../../../../theme";
10-
import LandingPageHollowButtonMobile from '../../../components/LandingPageButtonMobile';
11-
import AntSwitch from '../../../../../shared-components/AntSwitch';
12-
import LandingPageButton from '../../top-section/components/LandingPageButton';
6+
import LogoBar from "@/ui/shared-components/LogoBar";
7+
import useTranslation from "@/ui/language/useTranslation";
8+
import { HBox, VBox } from "@/ui/shared-components/LayoutBoxes";
9+
import LandingPageHollowButtonMobile from '@/ui/screens/landing-page/components/LandingPageButtonMobile';
10+
import AntSwitch from '@/ui/shared-components/AntSwitch';
11+
import LandingPageButton from '@/ui/screens/landing-page/sections/top-section/components/LandingPageButton';
1312

1413
const HeaderBarMobile = ({ isApp }) => {
1514
const [showDropdown, setShowDropdown] = useState(false);
@@ -47,8 +46,8 @@ const HeaderBarMobile = ({ isApp }) => {
4746
</HBox>
4847
{
4948
showDropdown && (
50-
<VBox sx={{ gap: theme.spacing(10), alignItems: 'center', justifyContent: 'center', height: '85vh' }}>
51-
<VBox sx={{ gap: theme.spacing(2), alignItems: 'center' }}>
49+
<VBox sx={{ gap: 10, alignItems: 'center', justifyContent: 'center', height: '85vh' }}>
50+
<VBox sx={{ gap: 2, alignItems: 'center' }}>
5251
<LandingPageHollowButtonMobile isApp={isApp} setShowDropdown={setShowDropdown} text={t('home.menu.improve')} to='/#feedback' />
5352
<LandingPageHollowButtonMobile isApp={isApp} setShowDropdown={setShowDropdown} text={t('home.menu.aboutUs')} to={"/#about-us"} />
5453
<LandingPageHollowButtonMobile isApp={isApp} setShowDropdown={setShowDropdown} text={t('home.menu.activityLog')} to={'/activity-log'} />

0 commit comments

Comments
 (0)