From f2ebd550bab5c9e932c0969f2488d0743fe60b5c Mon Sep 17 00:00:00 2001 From: Jan Lorenz Date: Fri, 12 Apr 2024 13:36:37 +0200 Subject: [PATCH 1/6] Only the header text changed Signed-off-by: Jan Lorenz --- d | 26 +++++++++++++++++++ .../src/components/HeaderComponent.tsx | 7 +++-- 2 files changed, 29 insertions(+), 4 deletions(-) create mode 100644 d diff --git a/d b/d new file mode 100644 index 0000000..23be6a2 --- /dev/null +++ b/d @@ -0,0 +1,26 @@ +diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx +index 84a5412..83b940d 100644 +--- a/pmp-frontend-app/src/components/HeaderComponent.tsx ++++ b/pmp-frontend-app/src/components/HeaderComponent.tsx +@@ -6,10 +6,10 @@ import sciLifeLogo from '../assets/SciLifeLab logo/NEG/Digital/SciLifeLab_Logoty + export default function HeaderComponent() { +  + let links: { [id: string] : ILink; } = { +- 'l1': { text: 'Data', classes: LINK_CLASSES, link: 'data' }, +- 'l2': { text: 'Events & News', classes: LINK_CLASSES, link: 'eventsandnews' }, ++ 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: 'data' }, ++ 'l2': { text: 'Events & Training', classes: LINK_CLASSES, link: 'eventsandnews' }, + 'l3': { text: 'Contact', classes: LINK_CLASSES, link: 'contact' }, +- 'l4': { text: 'About', classes: LINK_CLASSES, link: 'about' }, ++ 'l4': { text: 'About Us', classes: LINK_CLASSES, link: 'about' }, + }; +  + let buttons: { [id: string] : ILink; } = { +@@ -26,7 +26,6 @@ export default function HeaderComponent() { +  +
 +
     +-

  • Random text for now

    •  + {Object.keys(links).map( key => ( +
  • {{links[key].text}}
    •  + ))} diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx index 84a5412..83b940d 100644 --- a/pmp-frontend-app/src/components/HeaderComponent.tsx +++ b/pmp-frontend-app/src/components/HeaderComponent.tsx @@ -6,10 +6,10 @@ import sciLifeLogo from '../assets/SciLifeLab logo/NEG/Digital/SciLifeLab_Logoty export default function HeaderComponent() { let links: { [id: string] : ILink; } = { - 'l1': { text: 'Data', classes: LINK_CLASSES, link: 'data' }, - 'l2': { text: 'Events & News', classes: LINK_CLASSES, link: 'eventsandnews' }, + 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: 'data' }, + 'l2': { text: 'Events & Training', classes: LINK_CLASSES, link: 'eventsandnews' }, 'l3': { text: 'Contact', classes: LINK_CLASSES, link: 'contact' }, - 'l4': { text: 'About', classes: LINK_CLASSES, link: 'about' }, + 'l4': { text: 'About Us', classes: LINK_CLASSES, link: 'about' }, }; let buttons: { [id: string] : ILink; } = { @@ -26,7 +26,6 @@ export default function HeaderComponent() {
    -

  • Random text for now

    • {Object.keys(links).map( key => (
  • {{links[key].text}}
    • ))} From d51ccf671fed6a7e9a5efe1c92b444cb36d0dfac Mon Sep 17 00:00:00 2001 From: Jan Lorenz Date: Fri, 12 Apr 2024 14:23:24 +0200 Subject: [PATCH 2/6] Fixed routes for header sections Signed-off-by: Jan Lorenz --- d | 26 ------------------- .../src/components/HeaderComponent.tsx | 11 +++++--- pmp-frontend-app/src/components/Routes.tsx | 6 ++--- ...ewsPage.tsx => EventsAndTrainingsPage.tsx} | 4 +-- 4 files changed, 13 insertions(+), 34 deletions(-) delete mode 100644 d rename pmp-frontend-app/src/pages/{EventsAndNewsPage.tsx => EventsAndTrainingsPage.tsx} (54%) diff --git a/d b/d deleted file mode 100644 index 23be6a2..0000000 --- a/d +++ /dev/null @@ -1,26 +0,0 @@ -diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx -index 84a5412..83b940d 100644 ---- a/pmp-frontend-app/src/components/HeaderComponent.tsx -+++ b/pmp-frontend-app/src/components/HeaderComponent.tsx -@@ -6,10 +6,10 @@ import sciLifeLogo from '../assets/SciLifeLab logo/NEG/Digital/SciLifeLab_Logoty - export default function HeaderComponent() { -  - let links: { [id: string] : ILink; } = { -- 'l1': { text: 'Data', classes: LINK_CLASSES, link: 'data' }, -- 'l2': { text: 'Events & News', classes: LINK_CLASSES, link: 'eventsandnews' }, -+ 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: 'data' }, -+ 'l2': { text: 'Events & Training', classes: LINK_CLASSES, link: 'eventsandnews' }, - 'l3': { text: 'Contact', classes: LINK_CLASSES, link: 'contact' }, -- 'l4': { text: 'About', classes: LINK_CLASSES, link: 'about' }, -+ 'l4': { text: 'About Us', classes: LINK_CLASSES, link: 'about' }, - }; -  - let buttons: { [id: string] : ILink; } = { -@@ -26,7 +26,6 @@ export default function HeaderComponent() { -
 -
 -
     --

  • Random text for now

    •  - {Object.keys(links).map( key => ( -
  • {{links[key].text}}
    •  - ))} diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx index 83b940d..36c77f5 100644 --- a/pmp-frontend-app/src/components/HeaderComponent.tsx +++ b/pmp-frontend-app/src/components/HeaderComponent.tsx @@ -7,14 +7,17 @@ export default function HeaderComponent() { let links: { [id: string] : ILink; } = { 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: 'data' }, - 'l2': { text: 'Events & Training', classes: LINK_CLASSES, link: 'eventsandnews' }, + 'l2': { text: 'Events & Trainings', classes: LINK_CLASSES, link: 'eventsandtrainings' }, 'l3': { text: 'Contact', classes: LINK_CLASSES, link: 'contact' }, 'l4': { text: 'About Us', classes: LINK_CLASSES, link: 'about' }, }; - + + {/* + // This is the signin button. We can add this again once we have a user page, login, registration and features for users. let buttons: { [id: string] : ILink; } = { 'b1': { text: 'Sign In', classes: BUTTON_TYPE_ONE, link: 'signin' }, }; + */} return ( // use bg-zinc-200 instead? similar to daisyUI light-theme footer @@ -31,11 +34,13 @@ export default function HeaderComponent() { ))}
+ {/* + // This is the signin button. We can add this again once we have a user page, login, registration and features for users. {Object.keys(buttons).map( key => (
{{buttons[key].text}}
- ))} + ))} */} ) } diff --git a/pmp-frontend-app/src/components/Routes.tsx b/pmp-frontend-app/src/components/Routes.tsx index 52730e3..3021826 100644 --- a/pmp-frontend-app/src/components/Routes.tsx +++ b/pmp-frontend-app/src/components/Routes.tsx @@ -5,7 +5,7 @@ import HomePage from '../pages/HomePage'; import AboutPage from '../pages/AboutPage'; import ContactPage from '../pages/ContactPage'; import DataPage from '../pages/DataPage'; -import EventsAndNewsPage from '../pages/EventsAndNewsPage'; +import EventsAndTrainingsPage from '../pages/EventsAndTrainingsPage'; import SignInPage from '../pages/SignInPage'; import PrivacyPage from '../pages/PrivacyPage'; import AboutProductPage from '../pages/AboutProductPage'; @@ -52,8 +52,8 @@ const router = createBrowserRouter([ element: , }, { - path: 'eventsandnews', - element: , + path: 'eventsandtrainings', + element: , }, { path: 'signin', diff --git a/pmp-frontend-app/src/pages/EventsAndNewsPage.tsx b/pmp-frontend-app/src/pages/EventsAndTrainingsPage.tsx similarity index 54% rename from pmp-frontend-app/src/pages/EventsAndNewsPage.tsx rename to pmp-frontend-app/src/pages/EventsAndTrainingsPage.tsx index 1bb33e5..83853f6 100644 --- a/pmp-frontend-app/src/pages/EventsAndNewsPage.tsx +++ b/pmp-frontend-app/src/pages/EventsAndTrainingsPage.tsx @@ -1,12 +1,12 @@ import { ReactElement } from 'react'; import { TrackPageViewIfEnabled } from '../util/cookiesHandling'; -export default function EventsAndNewsPage(): ReactElement { +export default function EventsAndTrainingsPage(): ReactElement { TrackPageViewIfEnabled(); return (
-

Events & News page under construction

+

Events & Trainings page under construction

); } \ No newline at end of file From 42e91e3852bc9806b055664fbf07158b666ec0d1 Mon Sep 17 00:00:00 2001 From: Jan Lorenz Date: Fri, 12 Apr 2024 14:29:05 +0200 Subject: [PATCH 3/6] Fixed the layout of the header, added navbar-end to have the menu properly centered Signed-off-by: Jan Lorenz --- pmp-frontend-app/src/components/HeaderComponent.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx index 36c77f5..97d2f43 100644 --- a/pmp-frontend-app/src/components/HeaderComponent.tsx +++ b/pmp-frontend-app/src/components/HeaderComponent.tsx @@ -34,6 +34,8 @@ export default function HeaderComponent() { ))} +
+
{/* // This is the signin button. We can add this again once we have a user page, login, registration and features for users. {Object.keys(buttons).map( key => ( From da137415a2bfa59bef57317850a1970e95af3539 Mon Sep 17 00:00:00 2001 From: Jan Lorenz Date: Fri, 12 Apr 2024 14:37:23 +0200 Subject: [PATCH 4/6] Fixed the router and file names Signed-off-by: Jan Lorenz --- pmp-frontend-app/src/components/FooterComponent.tsx | 4 ++-- pmp-frontend-app/src/components/HeaderComponent.tsx | 2 +- pmp-frontend-app/src/components/Routes.tsx | 6 +++--- .../src/pages/{DataPage.tsx => DataSourcesPage.tsx} | 0 4 files changed, 6 insertions(+), 6 deletions(-) rename pmp-frontend-app/src/pages/{DataPage.tsx => DataSourcesPage.tsx} (100%) diff --git a/pmp-frontend-app/src/components/FooterComponent.tsx b/pmp-frontend-app/src/components/FooterComponent.tsx index 67ec2cc..220622e 100644 --- a/pmp-frontend-app/src/components/FooterComponent.tsx +++ b/pmp-frontend-app/src/components/FooterComponent.tsx @@ -6,9 +6,9 @@ import { LINK_CLASSES } from '../constants'; export default function FooterComponent(): ReactElement { let linksCol1: { [id: string] : ILink; } = { - 'l2': { text: 'Data Search', classes: LINK_CLASSES, link: '/' }, + 'l2': { text: 'Data Sources', classes: LINK_CLASSES, link: '/datasources' }, 'l3': { text: 'Data Types', classes: LINK_CLASSES, link: '/' }, - 'l4': { text: 'Events & News', classes: LINK_CLASSES, link: '/' }, + 'l4': { text: 'Events & Trainings', classes: LINK_CLASSES, link: '/eventsandtrainings' }, }; let linksCol2: { [id: string] : ILink; } = { diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx index 97d2f43..be0ff48 100644 --- a/pmp-frontend-app/src/components/HeaderComponent.tsx +++ b/pmp-frontend-app/src/components/HeaderComponent.tsx @@ -6,7 +6,7 @@ import sciLifeLogo from '../assets/SciLifeLab logo/NEG/Digital/SciLifeLab_Logoty export default function HeaderComponent() { let links: { [id: string] : ILink; } = { - 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: 'data' }, + 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: 'datasources' }, 'l2': { text: 'Events & Trainings', classes: LINK_CLASSES, link: 'eventsandtrainings' }, 'l3': { text: 'Contact', classes: LINK_CLASSES, link: 'contact' }, 'l4': { text: 'About Us', classes: LINK_CLASSES, link: 'about' }, diff --git a/pmp-frontend-app/src/components/Routes.tsx b/pmp-frontend-app/src/components/Routes.tsx index 3021826..93058cc 100644 --- a/pmp-frontend-app/src/components/Routes.tsx +++ b/pmp-frontend-app/src/components/Routes.tsx @@ -4,7 +4,7 @@ import App from '../App'; import HomePage from '../pages/HomePage'; import AboutPage from '../pages/AboutPage'; import ContactPage from '../pages/ContactPage'; -import DataPage from '../pages/DataPage'; +import DataSourcesPage from '../pages/DataSourcesPage'; import EventsAndTrainingsPage from '../pages/EventsAndTrainingsPage'; import SignInPage from '../pages/SignInPage'; import PrivacyPage from '../pages/PrivacyPage'; @@ -48,8 +48,8 @@ const router = createBrowserRouter([ element: , }, { - path: 'data', - element: , + path: 'datasources', + element: , }, { path: 'eventsandtrainings', diff --git a/pmp-frontend-app/src/pages/DataPage.tsx b/pmp-frontend-app/src/pages/DataSourcesPage.tsx similarity index 100% rename from pmp-frontend-app/src/pages/DataPage.tsx rename to pmp-frontend-app/src/pages/DataSourcesPage.tsx From d67a025e6da3c831e4b84586a619eddee8b42cae Mon Sep 17 00:00:00 2001 From: Jan Lorenz Date: Fri, 12 Apr 2024 14:42:47 +0200 Subject: [PATCH 5/6] Changed the footer links Signed-off-by: Jan Lorenz --- pmp-frontend-app/src/components/FooterComponent.tsx | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/pmp-frontend-app/src/components/FooterComponent.tsx b/pmp-frontend-app/src/components/FooterComponent.tsx index 220622e..d3e9121 100644 --- a/pmp-frontend-app/src/components/FooterComponent.tsx +++ b/pmp-frontend-app/src/components/FooterComponent.tsx @@ -6,15 +6,14 @@ import { LINK_CLASSES } from '../constants'; export default function FooterComponent(): ReactElement { let linksCol1: { [id: string] : ILink; } = { - 'l2': { text: 'Data Sources', classes: LINK_CLASSES, link: '/datasources' }, - 'l3': { text: 'Data Types', classes: LINK_CLASSES, link: '/' }, - 'l4': { text: 'Events & Trainings', classes: LINK_CLASSES, link: '/eventsandtrainings' }, + 'l1': { text: 'Data Sources', classes: LINK_CLASSES, link: '/datasources' }, + 'l2': { text: 'Events & Trainings', classes: LINK_CLASSES, link: '/eventsandtrainings' }, }; let linksCol2: { [id: string] : ILink; } = { - 'l1': { text: 'About us', classes: LINK_CLASSES, link: '/about' }, - 'l2': { text: 'Contact', classes: LINK_CLASSES, link: '/contact' }, - 'l4': { text: 'Privacy Policy', classes: LINK_CLASSES, link: '/privacy' }, + 'l3': { text: 'About us', classes: LINK_CLASSES, link: '/about' }, + 'l4': { text: 'Contact', classes: LINK_CLASSES, link: '/contact' }, + 'l5': { text: 'Privacy Policy', classes: LINK_CLASSES, link: '/privacy' }, }; let svgs: { [id: string] : ISVG; } = { From 25e030a132b2271c738a7847f49c95c5ce4c8bae Mon Sep 17 00:00:00 2001 From: Jan Lorenz Date: Fri, 12 Apr 2024 17:01:25 +0200 Subject: [PATCH 6/6] added Gradient color Signed-off-by: Jan Lorenz --- pmp-frontend-app/src/components/HeaderComponent.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx index be0ff48..24cd232 100644 --- a/pmp-frontend-app/src/components/HeaderComponent.tsx +++ b/pmp-frontend-app/src/components/HeaderComponent.tsx @@ -21,7 +21,7 @@ export default function HeaderComponent() { return ( // use bg-zinc-200 instead? similar to daisyUI light-theme footer -
+
SciLifeLab Logo