Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

main <- dev #25

Merged
merged 9 commits into from
Sep 26, 2024
Merged

main <- dev #25

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
3d66ddc
Moved newsletter to dialog
atrincas Sep 25, 2024
53c1c24
Added changes to case-studies data
atrincas Sep 25, 2024
70d891b
Content changes
atrincas Sep 25, 2024
cd40404
Added sortByDate
atrincas Sep 25, 2024
1b1c02a
Bugfixes responsiveness
atrincas Sep 25, 2024
dcd6da8
Refactor sort by date function
atrincas Sep 25, 2024
842bc1c
Added more changes
atrincas Sep 25, 2024
13b6159
Fixed dialog title visibility
atrincas Sep 26, 2024
7a6020f
Merge pull request #24 from Vizzuality/feature/changes-bugfixes
mluena Sep 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 0 additions & 2 deletions src/app/(static)/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,11 @@
import { PropsWithChildren } from 'react';

import Footer from '@/containers/footer';
import Newsletter from '@/containers/newsletter';

export default function StaticPageLayout({ children }: Readonly<PropsWithChildren>) {
return (
<main>
{children}
<Newsletter />
<Footer />
</main>
);
Expand Down
54 changes: 49 additions & 5 deletions src/components/app-menu/content.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,62 @@ import { cn } from '@/lib/utils';
import { menuOpenAtom } from '@/app/store';

import { SECTIONS } from '@/containers/header';
import Newsletter from '@/containers/newsletter';

const NavItem = (props: PropsWithChildren<LinkProps>) => {
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogTrigger,
} from '@/components/ui/dialog';

const navItemContainerClass =
'hover:text-navy-500 relative inline-flex items-center space-x-6 text-xl text-grey-800 2xl:text-4xl' as const;
const NavItem = (props: PropsWithChildren<LinkProps & { isDialogButton?: boolean }>) => {
const setOpen = useSetAtom(menuOpenAtom);
const Text = (
<>
<span className="peer block">{props.children}</span>
<span className="absolute bottom-0 right-0 h-[2px] w-0 bg-grey-800 transition-all duration-300 peer-hover:w-full" />
</>
);

if (props.isDialogButton) {
return (
<Dialog>
<DialogTrigger asChild>
<button
type="button"
className={navItemContainerClass}
onClick={() => {
setOpen(false);
}}
>
{Text}
</button>
</DialogTrigger>
<DialogContent className="bg-white pt-8 text-grey-800" aria-describedby={undefined}>
<DialogHeader>
<DialogTitle className="pr-2 text-xl font-bold text-grey-800 md:text-2xl">
Interested in our work?
</DialogTitle>
</DialogHeader>
<Newsletter />
</DialogContent>
</Dialog>
);
}

return (
<Link
href={props.href}
className="hover:text-navy-500 relative inline-flex items-center space-x-6 text-xl text-grey-800 2xl:text-4xl"
className={navItemContainerClass}
onClick={() => {
setOpen(false);
}}
>
<span className="peer block">{props.children}</span>
<span className="absolute bottom-0 right-0 h-[2px] w-0 bg-grey-800 transition-all duration-300 peer-hover:w-full" />
{Text}
</Link>
);
};
Expand Down Expand Up @@ -89,7 +131,9 @@ export const Nav = () => {
<ul className="flex flex-col gap-5 lg:gap-8">
{SECTIONS.map((item) => (
<li key={item.href} className="text-right">
<NavItem href={item.href}>{item.name}</NavItem>
<NavItem href={item.href} isDialogButton={item.href === '#contact-us'}>
{item.name}
</NavItem>
</li>
))}
</ul>
Expand Down
25 changes: 12 additions & 13 deletions src/containers/about/description/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,13 +34,12 @@ export default function AboutDescription() {
</div>
<div className="space-y-4 leading-8 lg:col-span-6 lg:col-start-8">
<p>
more4nature is a Horizon Europe project funded under Food, Bioeconomy Natural Resources,
Agriculture and Environment that started in January 2024, ending in December 2027,
formed by a consortium of 21 partners and led by IHE Delft.
more4nature is a Horizon Europe project that started in January 2024, ending in December
2027, formed by a consortium of 21 partners and led by IHE Delft.
</p>
<Separator className="my-4 bg-grey-800/20" />
<p>
more4nature (10.3030/101133983) is structured into work packages that reflect the&nbsp;
more4nature is structured into work packages that reflect the&nbsp;
<span className="font-bold">socio-technical approach</span> of the project.
</p>
<Dialog>
Expand All @@ -52,15 +51,15 @@ export default function AboutDescription() {
<DialogTitle>Project structure</DialogTitle>
<DialogDescription>
<p>
P1 is dedicated to the social aspects of empowering citizens and citizen science
initiatives in collaborative environmental compliance assurance, while WP2 deals
with the technical dimensions of these changes. Both WPs support WP3 which
implements 40 cases (in Europe, Latin America, Asia and Africa) on collaborative
environmental compliance assurance for zero pollution, biodiversity protection
and deforestation prevention in Europe and abroad. In addition, we selected
LivingLabs and Fab Labs across Europe. WP4 supports the creation of impact via
the broad communication, dissemination and exploitation of more4nature results
to specific target audiences.
WP1 is dedicated to the social aspects of empowering citizens and citizen
science initiatives in collaborative environmental compliance assurance, while
WP2 deals with the technical dimensions of these changes. Both WPs support WP3
which implements 40 cases (in Europe, Latin America, Asia and Africa) on
collaborative environmental compliance assurance for zero pollution,
biodiversity protection and deforestation prevention in Europe and abroad. In
addition, we selected LivingLabs and Fab Labs across Europe. WP4 supports the
creation of impact via the broad communication, dissemination and exploitation
of more4nature results to specific target audiences.
</p>
<p>
To discover more about EU research results,{' '}
Expand Down
4 changes: 0 additions & 4 deletions src/containers/about/partners/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,6 @@ export default function Partners() {
return (
<Wrapper className="space-y-10">
<h3 className="text-xl font-semibold">Partners</h3>
<p className="text-lg leading-9">
The more4nature activities are focused on three key thematic areas in environmental
protection:
</p>
<p className="leading-8">
The multidisciplinary more4nature consortium brings together a unique combination of
collaborations, with scientific experts from the social sciences, data science and
Expand Down
170 changes: 57 additions & 113 deletions src/containers/case-detail/sidebar/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,35 @@ export default function CaseDetailSidebar() {

if (!isSuccess) return null;

const accordionItems = [
{
value: 'citizenScienceData',
title: 'Citizen Science Data',
data: data?.citizenScienceData || [],
},
{
value: 'complianceNeed',
title: 'Compliance Need',
data: data?.complianceNeed || [],
},
// Add these when needed:
// {
// value: 'citizenScienceInitiatives',
// title: 'Citizen Science Initiatives',
// data: data?.citizenScienceInitiatives,
// },
// {
// value: 'stakeholders',
// title: 'Stakeholders',
// data: data?.stakeholders,
// },
// {
// value: 'authorities',
// title: 'Authorities',
// data: data?.authorities,
// },
];

return (
<ScrollArea className="h-full flex-1">
<div
Expand Down Expand Up @@ -124,120 +153,35 @@ export default function CaseDetailSidebar() {
type="single"
collapsible
className="flex w-full flex-col divide-y divide-white/20"
defaultValue={'citizenScienceInitiatives'}
defaultValue={accordionItems[0].value}
>
<AccordionItem
value="citizenScienceInitiatives"
className="peer w-full py-5 first:pt-0"
>
<AccordionTrigger>
<div className="flex items-center space-x-5">
<span className="text-lg font-semibold">Citizen Science Initiatives</span>
</div>
</AccordionTrigger>
<AccordionContent className="leading-9">
<ul>
{data?.citizenScienceInitiatives.map((item, index) => (
<li key={index}>{renderItem(item)}</li>
))}
</ul>
</AccordionContent>
</AccordionItem>
<AccordionItem value="citizenScienceData" className="peer w-full py-5 first:pt-0">
<AccordionTrigger>
<div className="flex items-center space-x-5">
<span className="text-lg font-semibold">Citizen Science Data</span>
</div>
</AccordionTrigger>
<AccordionContent className="leading-9">
<ul>
{data?.citizenScienceData.map((item, index) => (
<li key={index}>{renderItem(item)}</li>
))}
</ul>
</AccordionContent>
</AccordionItem>
<AccordionItem value="complianceNeed" className="peer w-full py-5 first:pt-0">
<AccordionTrigger>
<div className="flex items-center space-x-5">
<span className="text-lg font-semibold">Compliance Need</span>
</div>
</AccordionTrigger>
<AccordionContent className="leading-9">
<ul className="space-y-4">
{data?.complianceNeed.map((item, index) => (
<li key={index}>
{typeof item === 'object' && 'impact' in item ? (
<>
<h4 className="font-semibold">{item.impact.name}</h4>
<ul className="space-y-2">
{item.impact.list.map((subItem, index) => (
<li key={index}>{renderItem(subItem)}</li>
))}
</ul>
</>
) : (
renderItem(item)
)}
</li>
))}
</ul>
</AccordionContent>
</AccordionItem>
<AccordionItem value="stakeholders" className="peer w-full py-5 first:pt-0">
<AccordionTrigger>
<div className="flex items-center space-x-5">
<span className="text-lg font-semibold">Stakeholders</span>
</div>
</AccordionTrigger>
<AccordionContent className="leading-9">
<ul className="space-y-4">
{data?.stakeholders.map((item, index) => (
<li key={index}>
{typeof item === 'object' && 'impact' in item ? (
<>
<h4 className="font-semibold">{item.impact.name}</h4>
<ul className="space-y-2">
{item.impact.list.map((subItem, index) => (
<li key={index}>{renderItem(subItem)}</li>
))}
</ul>
</>
) : (
renderItem(item)
)}
</li>
))}
</ul>
</AccordionContent>
</AccordionItem>
<AccordionItem value="authorities" className="peer w-full py-5 first:pt-0">
<AccordionTrigger>
<div className="flex items-center space-x-5">
<span className="text-lg font-semibold">Authorities</span>
</div>
</AccordionTrigger>
<AccordionContent className="leading-9">
<ul className="space-y-4">
{data?.authorities.map((item, index) => (
<li key={index}>
{typeof item === 'object' && 'impact' in item ? (
<>
<h4 className="font-semibold">{item.impact.name}</h4>
<ul className="space-y-2">
{item.impact.list.map((subItem, index) => (
<li key={index}>{renderItem(subItem)}</li>
))}
</ul>
</>
) : (
renderItem(item)
)}
</li>
))}
</ul>
</AccordionContent>
</AccordionItem>
{accordionItems.map((item) => (
<AccordionItem key={item.value} value={item.value} className="py-5 first:pt-0">
<AccordionTrigger>
<span className="text-lg font-semibold">{item.title}</span>
</AccordionTrigger>
<AccordionContent className="leading-9">
<ul className="space-y-4">
{item.data.map((dataItem, index) => (
<li key={index}>
{typeof dataItem === 'object' && 'impact' in dataItem ? (
<>
<h4 className="font-semibold">{dataItem.impact.name}</h4>
<ul className="space-y-2">
{dataItem.impact.list.map((subItem, subIndex) => (
<li key={subIndex}>{renderItem(subItem)}</li>
))}
</ul>
</>
) : (
renderItem(dataItem)
)}
</li>
))}
</ul>
</AccordionContent>
</AccordionItem>
))}
</Accordion>
<div>
<div className="flex flex-col items-start space-y-5 border-t border-t-white py-9">
Expand Down
6 changes: 4 additions & 2 deletions src/containers/footer/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,10 @@ export default function Footer() {
<div className="flex flex-col gap-4 md:flex-row">
<div className="h-10 min-w-[72px] bg-[url('/images/flag-of-europe.svg')] bg-contain bg-no-repeat" />
<p className="text-2xs">
This project has received funding from the European Union’s Horizon Europe research
and innovation programme under grant agreement No. 101133983.
Co-Funded by the European Union. Views and opinions expressed are however those of
the author(s) only and do not necessarily reflect those of the European Union.
Neither the European Union nor the granting authority can be held responsible for
them.
</p>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/containers/header/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export const SECTIONS = [
{ name: 'Cases', href: '/cases' },
{ name: 'Events & News', href: '/events-news' },
{ name: 'Contact us', href: '#contact-us' },
];
] as const;

export default function Header({
className,
Expand Down
7 changes: 4 additions & 3 deletions src/containers/home/goals/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,10 @@ export default function Goals() {
<div className="col-span-12 space-y-9 text-white md:col-span-8">
<h2>more4nature aim</h2>
<p className="text-lg md:text-xl">
more4nature aims to bring about transformative change in environmental protection by
including citizens and communities as key actors in collaborative environmental
compliance assurance.
more4nature aims to bring about{' '}
<strong className="font-bold">transformative change</strong> in environmental
protection by including citizens and communities as key actors in collaborative
environmental compliance assurance.
</p>
<Dialog>
<DialogTrigger asChild>
Expand Down
2 changes: 1 addition & 1 deletion src/containers/home/intro/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ export default function Intro() {
<p className="text-lg">
Reversing the trend in environmental degradation through{' '}
<span className="font-bold">collaboration</span> of{' '}
<span className="text-nowrap font-bold">
<span className="font-bold md:text-nowrap">
citizen science initiatives with authorities.
</span>
</p>
Expand Down
2 changes: 1 addition & 1 deletion src/containers/home/thematic-areas/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ export default function ThematicAreas() {
<AccordionTrigger>
<div className="flex flex-1 items-center space-x-5">
{icon}
<span className="text-4xl">{name}</span>
<span className="text-left text-4xl">{name}</span>
</div>
</AccordionTrigger>
<AccordionContent className="leading-9">{description}</AccordionContent>
Expand Down
Loading