Skip to content

Commit 9bbc1a1

Browse files
authored
Merge pull request #257 from CivicDataLab/255-update-ui-as-per-the-designs
Add about-us page and update dataset listing page layout
2 parents 1dd920d + 5b196b1 commit 9bbc1a1

File tree

19 files changed

+315
-141
lines changed

19 files changed

+315
-141
lines changed
Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import React from 'react';
2+
import Image from 'next/image';
3+
import { Divider, Text } from 'opub-ui';
4+
5+
const Initiatives = () => {
6+
const IntiativesList = [
7+
{
8+
name: 'Climate Action',
9+
image: '/About/ca.png',
10+
description:
11+
'Asia is the world’s most disaster-prone region, with 80% of extreme weather events caused by floods and storms. To help better prepare Asia for climate change, we are actively working with frontline workers, government agencies and other stakeholders to strengthen climate action and disaster risk reduction. These efforts are spread across all our initiatives, including projects like Green budgeting, Disaster Modelling and Citizen-led Disaster Reporting.',
12+
},
13+
{
14+
name: 'Digital Public Goods',
15+
image: '/About/dpg.png',
16+
description:
17+
'We are co-creating people-centric Digital Public Goods (DPGs), especially Open Data Platforms, Data Exchanges, Data Science Models and Citizen-led Apps for improving participatory data-driven governance and attain the Sustainable Development Goals (SDGs) and do no harm by adhering to privacy practices and applicable laws. DPGs and Digital Public Infrastructure (DPI) are critical enablers of digital transformation and are helping to improve public service delivery at scale.',
18+
},
19+
{
20+
name: 'Law and Justice',
21+
image: '/About/l&j.png',
22+
description:
23+
'To better understand implementation of laws, judicial reforms and attainment of human rights, its essential to track timely data of our courts, police, correctional homes, legal aid and other institutions. We have co-created Justice Hub - a crowdsourcing open data platform to help various stakeholders publish, consume and analyse legal data in India. We are also working to publish and analyse data to improve child protection in the country.',
24+
},
25+
{
26+
name: 'Open Contracting India',
27+
image: '/About/oci.png',
28+
description:
29+
'Demystifying public finance helps in understanding government’s fiscal and development priorities, supports equitable public policymaking and enables citizen trust. We are working at the national, sub-national and local level to help publish, standardise and analyse public finance data at Open Budgets India and other platforms, for data-driven decision-making and citizen participation. We also collaborate with various stakeholders to set best practices for green and inclusive budgeting for our sustainable future.',
30+
},
31+
{
32+
name: 'Public Finance',
33+
image: '/About/pf.png',
34+
description:
35+
'Demystifying public finance helps in understanding government’s fiscal and development priorities, supports equitable public policymaking and enables citizen trust. We are working at the national, sub-national and local level to help publish, standardise and analyse public finance data at Open Budgets India and other platforms, for data-driven decision-making and citizen participation. We also collaborate with various stakeholders to set best practices for green and inclusive budgeting for our sustainable future.',
36+
},
37+
{
38+
name: 'Urban Development',
39+
image: '/About/ud.png',
40+
description:
41+
'With rapid urbanisation, cities are becoming constantly evolving complex clusters, presenting new challenges and opportunities of economic development, infrastructure growth, migration and sustainability. To better understand and shape the development of our cities, we are opening-up crucial urban data and building the capacity of urban governments and local stakeholders. We are co-creating solutions like - city data platforms, citizen-led disaster reporting platforms, data science models for effective urban service delivery and more.',
42+
},
43+
];
44+
return (
45+
<div className="container py-5 lg:py-10">
46+
<div className="flex flex-col gap-5 lg:gap-10">
47+
<div>
48+
<Text variant="heading2xl">Our Initiatives</Text>
49+
</div>
50+
<div className=" grid w-fit gap-10 md:grid-cols-2 lg:grid-cols-3">
51+
{IntiativesList.map((item, index) => (
52+
<div key={index} className=" rounded-4 p-7 shadow-card ">
53+
<div className="flex flex-col items-center gap-5">
54+
<Image
55+
src={item.image}
56+
alt={'initiative logo'}
57+
width={328}
58+
height={200}
59+
className=" h-full w-full"
60+
priority
61+
/>
62+
<Text variant="headingLg">{item.name}</Text>
63+
<div className="flex flex-col gap-2 border-t-2 border-solid border-greyExtralight">
64+
<Text className="pt-3 text-[#545456]">
65+
{item.description}
66+
</Text>
67+
</div>
68+
</div>
69+
</div>
70+
))}
71+
</div>
72+
</div>
73+
</div>
74+
);
75+
};
76+
77+
export default Initiatives;

app/[locale]/(user)/about-us/page.tsx

Lines changed: 63 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
import React from 'react';
2+
import Image from 'next/image';
23
import { Text } from 'opub-ui';
34

45
import BreadCrumbs from '@/components/BreadCrumbs';
6+
import Initiatives from './components/Initiatives';
57

68
const About = () => {
79
return (
@@ -12,26 +14,69 @@ const About = () => {
1214
{ href: '#', label: 'About' },
1315
]}
1416
/>
15-
<div >
16-
<div className="container flex flex-col gap-6 py-10">
17-
<Text variant="heading2xl" >
18-
About us
19-
</Text>
20-
21-
<Text variant="headingLg" fontWeight="regular">
22-
We, at CivicDataLab, work at the intersection of data, technology,
23-
design and social science to strengthen access to public
24-
information, evidence-based decision-making and citizen
25-
participation in governance. CivicDataLab (CDL) harnesses the
26-
potential of open knowledge movements to strengthen the
27-
data-for-public-good ecosystem and enable citizens to engage in
28-
matters of public reform. We work closely with governments,
29-
non-profits, think tanks, media houses and universities to enhance
30-
their data and technology capacity to better data-driven
31-
decision-making at scale.
32-
</Text>
17+
<div className="container py-5 lg:py-10 mb-5">
18+
<div className=" flex flex-wrap justify-center gap-14 lg:flex-nowrap ">
19+
<div className="flex flex-col gap-6">
20+
<Text variant="heading2xl">About us</Text>
21+
<Text
22+
variant="headingLg"
23+
fontWeight="regular"
24+
className=" leading-5"
25+
>
26+
CivicDataLab (CDL) works at the intersection of data, technology,
27+
design and social science to strengthen access to public
28+
information, evidence-based decision-making and citizen
29+
participation in governance. CDL harnesses the potential of open
30+
knowledge movements to strengthen the data-for-public-good
31+
ecosystem and enable citizens to engage in matters of public
32+
reform. We work closely with governments, non-profits,
33+
think-tanks, media houses and universities to enhance their data
34+
and technology capacity to better data-driven decision-making at
35+
scale.
36+
</Text>
37+
</div>
38+
<Image
39+
src={'/about-us-illustration.svg'}
40+
alt={'about-us-illustration'}
41+
width={536}
42+
height={350}
43+
className=" w-full"
44+
priority
45+
/>
46+
</div>
47+
</div>
48+
<div className="bg-primaryBlue">
49+
<div className=" container flex flex-col gap-6 py-5 lg:py-10">
50+
<div>
51+
<Text variant="headingLg" fontWeight="regular" color="onBgDefault">
52+
Our current areas of expertise include digital public goods &
53+
infrastructure (DPGs & DPI), climate change, public finance, urban
54+
development, open contracting and law & justice. We have
55+
co-created digital public goods like open data platforms, data
56+
exchanges, data science models and citizen-led apps for improving
57+
participatory data-driven governance in India and other countries.
58+
</Text>
59+
</div>
60+
<div>
61+
<Text variant="headingLg" fontWeight="regular" color="onBgDefault">
62+
In the last five years, we have collected, cleaned and published
63+
nearly 30,000+ public interest datasets and are catering to an
64+
active user base of more than a million citizens. Some of our
65+
publicly available open data initiatives include Open Budgets
66+
India, Justice Hub, Open Contracting India, Open City, CogniCity
67+
among others. We have co-created digital public goods with
68+
National Informatics Center (NIC), Ministry of Electronic &
69+
Information Technology (MeitY) and the Government of Assam.
70+
Additionally, we actively build capacity for a diverse group of
71+
partners working to enhance social impact, situated in India,
72+
Indonesia, Philippines, Thailand, Panama and Scotland.
73+
</Text>
74+
</div>
3375
</div>
3476
</div>
77+
<div>
78+
<Initiatives />
79+
</div>
3580
</main>
3681
);
3782
};

app/[locale]/(user)/components/Datasets.tsx

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,8 @@ const Datasets = () => {
5252
const router = useRouter();
5353

5454
return (
55-
<div className=" container pt-10 lg:pt-20 md:px-8">
56-
<div className="flex flex-col gap-2 p-3 lg:p-0 md:p-0 ">
55+
<div className=" container pt-10 md:px-8 lg:pt-20">
56+
<div className="flex flex-col gap-2 p-3 md:p-0 lg:p-0 ">
5757
<Text variant="heading3xl">Recent Datasets</Text>
5858
<div className="flex flex-wrap justify-between gap-2 ">
5959
<Text variant="headingLg" fontWeight="medium">
@@ -117,7 +117,16 @@ const Datasets = () => {
117117
icon: `/Sectors/${item.sectors[0]}.svg`,
118118
label: 'Sectors',
119119
},
120-
{ icon: '/fallback.svg', label: 'Published by' },
120+
{
121+
icon: item.is_individual_dataset
122+
? item?.user?.profile_picture
123+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.user.profile_picture}`
124+
: '/profile.png'
125+
: item?.organization?.logo
126+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.organization.logo}`
127+
: '/org.png',
128+
label: 'Published by',
129+
},
121130
]}
122131
variation={'collapsed'}
123132
iconColor="warning"

0 commit comments

Comments
 (0)