diff --git a/tailwind.common.js b/tailwind.common.js
index 552e1bf5d4..f5a48d98eb 100644
--- a/tailwind.common.js
+++ b/tailwind.common.js
@@ -88,6 +88,10 @@ module.exports = {
'linear-gradient(179deg,#515D89 19.77%,#7DC9BF 114.05%,#FAEBD1 200.67%)',
'blue-green-gradient':
'linear-gradient(197deg, #7D9AA2 8.02%, #9AD3BE 43.42%, #D1E2C7 78.83%)',
+ 'prefinance-tag':
+ 'linear-gradient(179deg, rgba(var(--sc-tag-prefinance-600) / 1) 19.77%, rgba(var(--sc-tag-prefinance-500) / 1) 114.05%, rgba(var(--sc-tag-prefinance-400) / 1) 200.67%)',
+ 'credit-category':
+ 'linear-gradient(202deg, rgba(var(--sc-tag-credit-category-300) / 1) 14.67%, rgba(var(--sc-tag-credit-category-500) / 1) 97.14%)',
},
boxShadow: {
sm: '0px 4px 10px 0px rgba(0, 0, 0, 0.05)',
diff --git a/web-components/src/components/PrefinanceTag/PrefinanceTag.tsx b/web-components/src/components/PrefinanceTag/PrefinanceTag.tsx
index d35b3fe960..c033110a63 100644
--- a/web-components/src/components/PrefinanceTag/PrefinanceTag.tsx
+++ b/web-components/src/components/PrefinanceTag/PrefinanceTag.tsx
@@ -24,7 +24,7 @@ export const PrefinanceTag = ({
}) => (
diff --git a/web-components/src/components/buttons/OutlinedButton.tsx b/web-components/src/components/buttons/OutlinedButton.tsx
index 08a81b2850..fed0b0f379 100644
--- a/web-components/src/components/buttons/OutlinedButton.tsx
+++ b/web-components/src/components/buttons/OutlinedButton.tsx
@@ -1,22 +1,26 @@
import { styled } from '@mui/material';
-import Button from '@mui/material/Button';
+import Button, { ButtonProps } from '@mui/material/Button';
-const OutlinedButton = styled(Button)(({ theme }) => ({
- color: theme.palette.secondary.main,
- backgroundColor: theme.palette.primary.main,
+const OutlinedButton = styled(Button)
(() => ({
+ color: 'rgba(var(--sc-button-text-icon-dark) / 1)',
+ backgroundColor:
+ 'rgba(var(--sc-button-surface-standard-secondary-default) / 1)',
borderImageSlice: 1,
- borderImageSource: 'linear-gradient(201.8deg, #4FB573, #B9E1C7)',
+ borderImageSource:
+ 'linear-gradient(201.8deg, rgba(var(--sc-gradient-lighter-gradient-500) / 1), rgba(var(--sc-gradient-lighter-gradient-300) / 1))',
'&:hover': {
- backgroundColor: theme.palette.secondary.light,
- borderColor: theme.palette.secondary.light,
+ backgroundColor:
+ 'rgba(var(--sc-button-surface-standard-secondary-hover) / 1)',
+ color: 'rgba(var(--sc-button-text-icon-dark) / 1)',
+ borderColor: 'rgba(var(--sc-button-surface-standard-secondary-hover) / 1)',
borderImageSource: 'none',
},
'&:disabled': {
- color: theme.palette.grey[100],
- background: theme.palette.grey[50],
+ color: 'rgba(var(--sc-button-surface-standard-primary-disabled) / 1)',
+ background:
+ 'rgba(var(--sc-button-surface-standard-secondary-disabled) / 1)',
borderImageSource: 'none',
- borderColor: theme.palette.grey[100],
+ borderColor: 'rgba(var(--sc-button-outline-secondary-disabled) / 1)',
},
}));
-
export default OutlinedButton as typeof Button;
diff --git a/web-components/src/components/cards/ProjectCard/ProjectCard.CreditPrice.tsx b/web-components/src/components/cards/ProjectCard/ProjectCard.CreditPrice.tsx
index 16383b0122..0551f935a8 100644
--- a/web-components/src/components/cards/ProjectCard/ProjectCard.CreditPrice.tsx
+++ b/web-components/src/components/cards/ProjectCard/ProjectCard.CreditPrice.tsx
@@ -120,14 +120,22 @@ export const CreditPrice = ({
}}
>
{isSoldOut && !isPrefinanceProject ? (
-
+
) : (
<>
{purchaseInfo?.sellInfo?.creditsAvailable ??
projectPrefinancing?.estimatedIssuance ??
'0'}
{isSoldOut && (
-
+
)}
>
)}
diff --git a/web-components/src/components/cards/ProjectCard/ProjectCard.tsx b/web-components/src/components/cards/ProjectCard/ProjectCard.tsx
index 50079aa88e..7b6354f6dd 100644
--- a/web-components/src/components/cards/ProjectCard/ProjectCard.tsx
+++ b/web-components/src/components/cards/ProjectCard/ProjectCard.tsx
@@ -66,6 +66,7 @@ export interface ProjectCardProps extends MediaCardProps {
bodyTexts: ProjectCardBodyTextsMapping;
purchaseDetailsTitles: ProjectCardTitlesMapping;
buttons: ProjectCardButtonsMapping;
+ useProjectCardButton?: boolean;
}
export function ProjectCard({
@@ -103,6 +104,7 @@ export function ProjectCard({
bodyTexts,
purchaseDetailsTitles,
buttons,
+ useProjectCardButton = true,
...mediaCardProps
}: ProjectCardProps): JSX.Element {
const theme = useTheme();
@@ -325,7 +327,8 @@ export function ProjectCard({
{containedButton.text}
))}
- {(onButtonClick || isPrefinanceProject || offChain) &&
+ {(hasButton || isPrefinanceProject || offChain) &&
+ useProjectCardButton &&
(isButtonDisabled && createPostTooltipText ? (
(
purchaseDetailsTitles={projectCardPurchaseDetailsTitleMapping}
buttons={projectCardButtonMapping}
/>
+
+
);
diff --git a/web-components/src/components/gradient-badge/GradientBadge.stories.tsx b/web-components/src/components/gradient-badge/GradientBadge.stories.tsx
index a18a0ae6dd..97d859a3ac 100644
--- a/web-components/src/components/gradient-badge/GradientBadge.stories.tsx
+++ b/web-components/src/components/gradient-badge/GradientBadge.stories.tsx
@@ -17,10 +17,4 @@ Default.args = {
label: 'SOLD OUT',
};
-Default.argTypes = {
- variant: {
- control: 'radio',
- options: ['green'],
- defaultValue: 'green',
- },
-};
+Default.argTypes = {};
diff --git a/web-components/src/components/gradient-badge/GradientBadge.tsx b/web-components/src/components/gradient-badge/GradientBadge.tsx
index 131a05db6d..0ec6d1d72e 100644
--- a/web-components/src/components/gradient-badge/GradientBadge.tsx
+++ b/web-components/src/components/gradient-badge/GradientBadge.tsx
@@ -33,7 +33,7 @@ const GradientBadge = ({
textTransform: 'uppercase',
fontWeight: 800,
fontFamily: headerFontFamily,
- color: 'primary.main',
+ color: 'rgba(var(--sc-tag-prefinance-text-icon) / 1)',
},
...(Array.isArray(sx) ? sx : [sx]),
]}
diff --git a/web-components/src/components/gradient-badge/GradientBadge.utils.ts b/web-components/src/components/gradient-badge/GradientBadge.utils.ts
index c2328e6fee..aa5848d493 100644
--- a/web-components/src/components/gradient-badge/GradientBadge.utils.ts
+++ b/web-components/src/components/gradient-badge/GradientBadge.utils.ts
@@ -4,5 +4,6 @@ import { GradientBadgeVariant } from './GradientBadge.types';
export const GradientBadgeVariantMapping: {
[key in GradientBadgeVariant]: string;
} = {
- green: 'linear-gradient(201.8deg, #4FB573 14.67%, #B9E1C7 97.14%)',
+ green:
+ 'linear-gradient(202deg, rgba(var(--sc-tag-credit-category-300) / 1) 14.67%, rgba(var(--sc-tag-credit-category-500) / 1) 97.14%)',
};
diff --git a/web-components/src/components/icons/ArrowLeft.tsx b/web-components/src/components/icons/ArrowLeft.tsx
index 8a8f533402..ffa6d40165 100644
--- a/web-components/src/components/icons/ArrowLeft.tsx
+++ b/web-components/src/components/icons/ArrowLeft.tsx
@@ -1,9 +1,12 @@
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
-interface IconProps extends SvgIconProps {}
+interface IconProps extends SvgIconProps {
+ isDisabled: boolean;
+}
export default function ArrowLeftIcon({
sx = [],
+ isDisabled,
...props
}: IconProps): JSX.Element {
return (
@@ -17,13 +20,36 @@ export default function ArrowLeftIcon({
]}
{...props}
>
-
+
+
+
+
+
+
);
}
diff --git a/web-components/src/components/icons/ArrowRight.tsx b/web-components/src/components/icons/ArrowRight.tsx
index 178ec1d743..37bb372e46 100644
--- a/web-components/src/components/icons/ArrowRight.tsx
+++ b/web-components/src/components/icons/ArrowRight.tsx
@@ -1,9 +1,12 @@
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
-interface IconProps extends SvgIconProps {}
+interface IconProps extends SvgIconProps {
+ isDisabled: boolean;
+}
export default function ArrowRightIcon({
sx = [],
+ isDisabled,
...props
}: IconProps): JSX.Element {
return (
@@ -13,13 +16,36 @@ export default function ArrowRightIcon({
sx={[{ fill: 'none' }, ...(Array.isArray(sx) ? sx : [sx])]}
{...props}
>
-
+
+
+
+
+
+
);
}
diff --git a/web-components/src/components/icons/ArrowSkipLeft.tsx b/web-components/src/components/icons/ArrowSkipLeft.tsx
index f409c4d3a8..19ea7c1513 100644
--- a/web-components/src/components/icons/ArrowSkipLeft.tsx
+++ b/web-components/src/components/icons/ArrowSkipLeft.tsx
@@ -2,10 +2,12 @@ import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
interface IconProps extends SvgIconProps {
disabled?: boolean;
+ useGradient?: boolean;
}
export default function ArrowSkipLeftIcon({
disabled,
+ useGradient = true,
sx = [],
...props
}: IconProps): JSX.Element {
@@ -24,7 +26,7 @@ export default function ArrowSkipLeftIcon({
r={24}
transform="matrix(-1 0 0 1 25.5 25)"
fill="#fff"
- stroke="url(#skipLeft)"
+ stroke={'url(#skipLeft)'}
strokeWidth={2}
/>
-
+
+
-
diff --git a/web-components/src/components/icons/ArrowSkipRight.tsx b/web-components/src/components/icons/ArrowSkipRight.tsx
index 4933102d3e..3529721735 100644
--- a/web-components/src/components/icons/ArrowSkipRight.tsx
+++ b/web-components/src/components/icons/ArrowSkipRight.tsx
@@ -2,10 +2,12 @@ import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
interface IconProps extends SvgIconProps {
disabled?: boolean;
+ useGradient?: boolean;
}
export default function ArrowSkipRightIcon({
disabled,
+ useGradient = true,
sx = [],
...props
}: IconProps): JSX.Element {
@@ -20,7 +22,7 @@ export default function ArrowSkipRightIcon({
r={24}
transform="matrix(-1 0 0 1 25.5 25)"
fill="#fff"
- stroke="url(#skipRight)"
+ stroke={'url(#skipRight)'}
strokeWidth={2}
/>
-
+
+
-
diff --git a/web-components/src/components/icons/social/InstagramIcon.tsx b/web-components/src/components/icons/social/InstagramIcon.tsx
index 1eff018b3d..67e9d45460 100644
--- a/web-components/src/components/icons/social/InstagramIcon.tsx
+++ b/web-components/src/components/icons/social/InstagramIcon.tsx
@@ -1,28 +1,17 @@
-import React from 'react';
-import { Theme } from '@mui/material/styles';
import SvgIcon from '@mui/material/SvgIcon';
-import { makeStyles } from 'tss-react/mui';
+import { cn } from '../../../utils/styles/cn';
import withHoverColor, { Props } from '../withHoverColor';
-const useStyles = makeStyles()((theme: Theme) => ({
- root: {
- width: theme.spacing(9.25),
- height: theme.spacing(9.25),
- },
-}));
-
function InstagramIcon({
className,
color,
onMouseEnter,
onMouseLeave,
}: Props): JSX.Element {
- const { classes, cx } = useStyles();
-
return (
({
- root: {
- width: theme.spacing(9.25),
- height: theme.spacing(9.25),
- },
-}));
-
function LinkedInIcon({
className,
color,
onMouseEnter,
onMouseLeave,
}: Props): JSX.Element {
- const { classes, cx } = useStyles();
-
return (
({
root: {
@@ -15,8 +17,16 @@ export const usePaginationStyles = makeStyles()(theme => ({
},
}));
+const PaginationItemWrapper = ({
+ ...props
+}: PaginationItemProps & {
+ disableRipple: boolean;
+}) => {
+ return ;
+};
+
export const StyledPaginationItem = withStyles(
- PaginationItem,
+ PaginationItemWrapper,
(theme: Theme, { disabled }) => ({
icon: {
fontSize: pxToRem(40),
@@ -44,7 +54,7 @@ export const StyledPaginationItem = withStyles(
bottom: 0,
width: '11px',
height: '4px',
- backgroundColor: theme.palette.secondary.main,
+ backgroundColor: 'rgba(var(--sc-tabs-tab-underline) / 1)',
},
},
}),
@@ -58,8 +68,11 @@ type GetArrowSkipStyleType = {
export const getArrowSkipStyle = ({
theme,
disabled,
-}: GetArrowSkipStyleType): SxProps =>
- ({
+}: GetArrowSkipStyleType): SxProps => {
+ return {
fontSize: pxToRem(50),
- color: disabled ? theme.palette.grey[100] : theme.palette.secondary.main,
- } as SxProps);
+ color: disabled
+ ? theme.palette.grey[100]
+ : 'rgba(var(--sc-button-text-icon-dark) / 1)',
+ } as SxProps;
+};
diff --git a/web-components/src/components/pagination/Pagination.tsx b/web-components/src/components/pagination/Pagination.tsx
index 8b67265778..60a7345555 100644
--- a/web-components/src/components/pagination/Pagination.tsx
+++ b/web-components/src/components/pagination/Pagination.tsx
@@ -6,6 +6,8 @@ import {
} from '@mui/material';
import { Theme } from '../../theme/muiTheme';
+import { ColorScheme } from '../../theme/theme.types';
+import { cn } from '../../utils/styles/cn';
import ArrowLeftIcon from '../icons/ArrowLeft';
import ArrowRightIcon from '../icons/ArrowRight';
import ArrowSkipLeftIcon from '../icons/ArrowSkipLeft';
@@ -18,9 +20,15 @@ import {
export interface Props extends PaginationProps {
sx?: SxProps;
+ colorScheme: ColorScheme;
}
-const Pagination = ({ size, sx = [], ...props }: Props): JSX.Element => {
+const Pagination = ({
+ size,
+ sx = [],
+ colorScheme,
+ ...props
+}: Props): JSX.Element => {
const theme = useTheme();
const isSmall = size === 'small';
const { classes } = usePaginationStyles();
@@ -36,8 +44,12 @@ const Pagination = ({ size, sx = [], ...props }: Props): JSX.Element => {
slots={{
first: () => (
),
last: () => (
@@ -47,10 +59,33 @@ const Pagination = ({ size, sx = [], ...props }: Props): JSX.Element => {
theme,
})}
disabled={item.disabled}
+ useGradient={colorScheme === 'regen'}
+ />
+ ),
+ previous: props => (
+
+ ),
+ next: props => (
+
),
- previous: ArrowLeftIcon,
- next: ArrowRightIcon,
}}
disableRipple
{...item}
diff --git a/web-components/src/components/tabs/IconTabs.tsx b/web-components/src/components/tabs/IconTabs.tsx
index e63b73835e..c7fc21461a 100644
--- a/web-components/src/components/tabs/IconTabs.tsx
+++ b/web-components/src/components/tabs/IconTabs.tsx
@@ -38,29 +38,32 @@ interface IconTabsProps {
const StyledTabs = styled(Tabs, {
shouldForwardProp: prop =>
prop !== 'hideIndicator' && prop !== 'mobileFullWidth',
-})(
- ({ mobileFullWidth, theme, hideIndicator }) => ({
- '& .MuiTabs-flexContainer': {
- display: 'block',
+})<
+ TabsProps & {
+ mobileFullWidth: boolean;
+ hideIndicator: boolean;
+ }
+>(({ mobileFullWidth, theme, hideIndicator }) => ({
+ '& .MuiTabs-flexContainer': {
+ display: 'block',
+ },
+ '& .MuiTabs-scroller': {
+ [theme.breakpoints.up('md')]: {
+ marginLeft: mobileFullWidth ? theme.spacing(-3) : 0,
},
- '& .MuiTabs-scroller': {
- [theme.breakpoints.up('md')]: {
- marginLeft: mobileFullWidth ? theme.spacing(-3) : 0,
- },
- [theme.breakpoints.down('md')]: {
- paddingLeft: mobileFullWidth ? theme.spacing(7) : 0,
- },
- [theme.breakpoints.down('sm')]: {
- paddingLeft: mobileFullWidth ? theme.spacing(1) : 0,
- },
+ [theme.breakpoints.down('md')]: {
+ paddingLeft: mobileFullWidth ? theme.spacing(7) : 0,
},
- '& .MuiTabs-indicator': {
- display: hideIndicator && 'none',
- backgroundColor: theme.palette.secondary.main,
- height: '3px',
+ [theme.breakpoints.down('sm')]: {
+ paddingLeft: mobileFullWidth ? theme.spacing(1) : 0,
},
- }),
-);
+ },
+ '& .MuiTabs-indicator': {
+ display: hideIndicator && 'none',
+ backgroundColor: 'rgba(var(--sc-tabs-tab-underline) / 1)',
+ height: '3px',
+ },
+}));
const IconTabs: React.FC> = ({
activeTab = 0,
diff --git a/web-components/src/theme/theme.types.ts b/web-components/src/theme/theme.types.ts
new file mode 100644
index 0000000000..5526c1f3f5
--- /dev/null
+++ b/web-components/src/theme/theme.types.ts
@@ -0,0 +1 @@
+export type ColorScheme = 'regen' | 'terrasos';
diff --git a/web-marketplace/public/jpg/default-project2.jpg b/web-marketplace/public/jpg/default-project2.jpg
new file mode 100644
index 0000000000..21a2bc107c
Binary files /dev/null and b/web-marketplace/public/jpg/default-project2.jpg differ
diff --git a/web-marketplace/src/clients/terrasos/Terrasos.tailwind.css b/web-marketplace/src/clients/terrasos/Terrasos.tailwind.css
index 765dd5cc2b..eb8979699e 100644
--- a/web-marketplace/src/clients/terrasos/Terrasos.tailwind.css
+++ b/web-marketplace/src/clients/terrasos/Terrasos.tailwind.css
@@ -77,8 +77,8 @@
--bc-neutral-200: 239 239 239;
--bc-neutral-100: 250 250 250;
--bc-neutral-0: 255 255 255;
-
- /* alias.terrasos */
+
+ /* alias.terrasos */
--ac-error-500: var(--bc-red-500);
--ac-error-400: var(--bc-red-400);
--ac-success-500: var(--bc-green-500);
@@ -141,7 +141,7 @@
--sc-button-surface-standard-secondary-disabled: var(--ac-neutral-100);
--sc-button-surface-standard-secondary-default: var(--ac-neutral-0);
--sc-button-surface-standard-primary-disabled: var(--ac-neutral-300);
- --sc-button-surface-standard-secondary-hover: var(--ac-neutral-500);
+ --sc-button-surface-standard-secondary-hover: var(--ac-neutral-300);
--sc-button-text-icon-prefinance: var(--ac-neutral-700);
--sc-button-text-icon-disabled: var(--ac-neutral-300);
--sc-button-text-icon-dark: var(--ac-neutral-700);
@@ -231,93 +231,92 @@
--purple-200: 128 142 171;
--purple-100: 86 104 143;
-
/* mapped terrasos dark */
--sc-tag-filter-inner-shadow: 255 255 255;
- --sc-tag-filter-outer-shadow: 255 255 255;
- --sc-checkbox-or-radio-selector-background-selected: var(--ac-neutral-600);
- --sc-checkbox-or-radio-selector-stroke: var(--ac-neutral-500);
- --sc-checkbox-or-radio-selector-background-default: var(--ac-neutral-700);
- --sc-table-stroke: var(--ac-neutral-500);
- --sc-table-surface-light: var(--ac-neutral-700);
- --sc-table-surface-dark: var(--ac-neutral-600);
- --sc-input-triangle-icon-disabled: var(--ac-neutral-300);
- --sc-input-triangle-icon-default: var(--ac-primary-500);
- --sc-input-background-disabled: var(--ac-neutral-500);
- --sc-input-background-default: var(--ac-neutral-700);
- --sc-tooltip-fill: var(--ac-neutral-700);
- --sc-tooltip-outline: var(--ac-neutral-100);
- --sc-tag-credit-category-text-icon: var(--ac-neutral-700);
- --sc-tag-credit-category-500: var(--ac-primary-500);
- --sc-tag-credit-category-300: var(--ac-primary-500);
- --sc-tag-filter-stroke-selected: var(--ac-neutral-0);
- --sc-tag-filter-stroke-unselected: var(--ac-neutral-400);
- --sc-tag-filter-background-selected: var(--ac-neutral-500);
- --sc-tag-filter-background-unselected: var(--ac-neutral-600);
- --sc-tag-prefinance-text-icon: var(--ac-neutral-700);
- --sc-tag-prefinance-600: var(--ac-primary-500);
- --sc-tag-prefinance-500: var(--ac-primary-500);
- --sc-tag-prefinance-400: var(--ac-primary-500);
- --sc-tag-impact-text-icon: var(--ac-neutral-700);
- --sc-tag-impact-background: var(--ac-primary-500);
- --sc-tabs-tab-underline: var(--ac-primary-500);
- --sc-button-outline-secondary-disabled: var(--ac-neutral-300);
- --sc-button-surface-prefinance-600: var(--ac-neutral-700);
- --sc-button-surface-prefinance-500: var(--ac-neutral-700);
- --sc-button-surface-prefinance-400: var(--ac-neutral-700);
- --sc-button-surface-standard-secondary-disabled: var(--ac-neutral-600);
- --sc-button-surface-standard-secondary-default: var(--ac-neutral-700);
- --sc-button-surface-standard-primary-disabled: var(--ac-neutral-500);
- --sc-button-surface-standard-secondary-hover: var(--ac-neutral-200);
- --sc-button-text-icon-prefinance: var(--ac-neutral-700);
- --sc-button-text-icon-disabled: var(--ac-neutral-500);
- --sc-button-text-icon-dark: var(--ac-neutral-0);
- --sc-button-text-icon-light: var(--ac-neutral-700);
- --sc-gradient-heavy-gradient-600: var(--ac-neutral-0);
- --sc-gradient-heavy-gradient-500: var(--ac-neutral-0);
- --sc-gradient-heavy-gradient-400: var(--ac-neutral-0);
- --sc-gradient-lighter-gradient-500: var(--ac-neutral-0);
- --sc-gradient-lighter-gradient-300: var(--ac-neutral-0);
- --sc-icon-credibility-background: var(--ac-neutral-700);
- --sc-icon-credibility-10-blue-green-gradient-600: var(--ac-primary-500);
- --sc-icon-credibility-10-blue-green-gradient-500: var(--ac-primary-500);
- --sc-icon-credibility-10-blue-green-gradient-400: var(--ac-primary-500);
- --sc-icon-credibility-25-blue-green-gradient-600: var(--ac-primary-500);
- --sc-icon-credibility-25-blue-green-gradient-500: var(--ac-primary-500);
- --sc-icon-credibility-25-blue-green-gradient-400: var(--ac-primary-500);
- --sc-icon-credibility-100-blue-green-gradient-600: var(--ac-neutral-0);
- --sc-icon-credibility-100-blue-green-gradient-500: var(--ac-neutral-0);
- --sc-icon-credibility-100-blue-green-gradient-400: var(--ac-neutral-0);
- --sc-icon-sdg-background: var(--ac-neutral-700);
- --sc-icon-sdg-stroke-shadow: var(--ac-neutral-500);
- --sc-icon-sdg-header: var(--ac-neutral-100);
- --sc-icon-sdg-number: var(--ac-neutral-0);
- --sc-icon-sdg-600: var(--ac-neutral-500);
- --sc-icon-sdg-500: var(--ac-neutral-500);
- --sc-icon-sdg-400: var(--ac-neutral-500);
- --sc-icon-ecosystem-600: var(--ac-primary-400);
- --sc-icon-ecosystem-500: var(--ac-primary-400);
- --sc-icon-ecosystem-400: var(--ac-primary-400);
- --sc-icon-standard-shade: var(--ac-primary-500);
- --sc-icon-standard-disabled: var(--ac-neutral-200);
- --sc-icon-standard-background: var(--ac-neutral-500);
- --sc-icon-standard-success: var(--ac-success-400);
- --sc-icon-standard-error: var(--ac-error-400);
- --sc-icon-standard-light: var(--ac-primary-300);
- --sc-icon-standard-dark: var(--ac-primary-300);
- --sc-card-credibility-diagonal-background: var(--ac-neutral-600);
- --sc-card-standard-header-background: var(--ac-neutral-600);
- --sc-card-standard-stroke: var(--ac-neutral-500);
- --sc-card-standard-background: var(--ac-neutral-700);
- --sc-surface-page-background-light: var(--ac-neutral-600);
- --sc-surface-stroke: var(--ac-neutral-500);
- --sc-surface-page-background-default: var(--ac-neutral-700);
- --sc-text-over-image: var(--ac-neutral-0);
- --sc-text-error: var(--ac-error-400);
- --sc-text-disabled: var(--ac-neutral-300);
- --sc-text-sub-header: var(--ac-neutral-300);
- --sc-text-link: var(--ac-primary-500);
- --sc-text-header: var(--ac-neutral-0);
- --sc-text-paragraph: var(--ac-neutral-200);
+ --sc-tag-filter-outer-shadow: 255 255 255;
+ --sc-checkbox-or-radio-selector-background-selected: var(--ac-neutral-600);
+ --sc-checkbox-or-radio-selector-stroke: var(--ac-neutral-500);
+ --sc-checkbox-or-radio-selector-background-default: var(--ac-neutral-700);
+ --sc-table-stroke: var(--ac-neutral-500);
+ --sc-table-surface-light: var(--ac-neutral-700);
+ --sc-table-surface-dark: var(--ac-neutral-600);
+ --sc-input-triangle-icon-disabled: var(--ac-neutral-300);
+ --sc-input-triangle-icon-default: var(--ac-primary-500);
+ --sc-input-background-disabled: var(--ac-neutral-500);
+ --sc-input-background-default: var(--ac-neutral-700);
+ --sc-tooltip-fill: var(--ac-neutral-700);
+ --sc-tooltip-outline: var(--ac-neutral-100);
+ --sc-tag-credit-category-text-icon: var(--ac-neutral-700);
+ --sc-tag-credit-category-500: var(--ac-primary-500);
+ --sc-tag-credit-category-300: var(--ac-primary-500);
+ --sc-tag-filter-stroke-selected: var(--ac-neutral-0);
+ --sc-tag-filter-stroke-unselected: var(--ac-neutral-400);
+ --sc-tag-filter-background-selected: var(--ac-neutral-500);
+ --sc-tag-filter-background-unselected: var(--ac-neutral-600);
+ --sc-tag-prefinance-text-icon: var(--ac-neutral-700);
+ --sc-tag-prefinance-600: var(--ac-primary-500);
+ --sc-tag-prefinance-500: var(--ac-primary-500);
+ --sc-tag-prefinance-400: var(--ac-primary-500);
+ --sc-tag-impact-text-icon: var(--ac-neutral-700);
+ --sc-tag-impact-background: var(--ac-primary-500);
+ --sc-tabs-tab-underline: var(--ac-primary-500);
+ --sc-button-outline-secondary-disabled: var(--ac-neutral-300);
+ --sc-button-surface-prefinance-600: var(--ac-neutral-700);
+ --sc-button-surface-prefinance-500: var(--ac-neutral-700);
+ --sc-button-surface-prefinance-400: var(--ac-neutral-700);
+ --sc-button-surface-standard-secondary-disabled: var(--ac-neutral-600);
+ --sc-button-surface-standard-secondary-default: var(--ac-neutral-700);
+ --sc-button-surface-standard-primary-disabled: var(--ac-neutral-500);
+ --sc-button-surface-standard-secondary-hover: var(--ac-neutral-200);
+ --sc-button-text-icon-prefinance: var(--ac-neutral-700);
+ --sc-button-text-icon-disabled: var(--ac-neutral-500);
+ --sc-button-text-icon-dark: var(--ac-neutral-0);
+ --sc-button-text-icon-light: var(--ac-neutral-700);
+ --sc-gradient-heavy-gradient-600: var(--ac-neutral-0);
+ --sc-gradient-heavy-gradient-500: var(--ac-neutral-0);
+ --sc-gradient-heavy-gradient-400: var(--ac-neutral-0);
+ --sc-gradient-lighter-gradient-500: var(--ac-neutral-0);
+ --sc-gradient-lighter-gradient-300: var(--ac-neutral-0);
+ --sc-icon-credibility-background: var(--ac-neutral-700);
+ --sc-icon-credibility-10-blue-green-gradient-600: var(--ac-primary-500);
+ --sc-icon-credibility-10-blue-green-gradient-500: var(--ac-primary-500);
+ --sc-icon-credibility-10-blue-green-gradient-400: var(--ac-primary-500);
+ --sc-icon-credibility-25-blue-green-gradient-600: var(--ac-primary-500);
+ --sc-icon-credibility-25-blue-green-gradient-500: var(--ac-primary-500);
+ --sc-icon-credibility-25-blue-green-gradient-400: var(--ac-primary-500);
+ --sc-icon-credibility-100-blue-green-gradient-600: var(--ac-neutral-0);
+ --sc-icon-credibility-100-blue-green-gradient-500: var(--ac-neutral-0);
+ --sc-icon-credibility-100-blue-green-gradient-400: var(--ac-neutral-0);
+ --sc-icon-sdg-background: var(--ac-neutral-700);
+ --sc-icon-sdg-stroke-shadow: var(--ac-neutral-500);
+ --sc-icon-sdg-header: var(--ac-neutral-100);
+ --sc-icon-sdg-number: var(--ac-neutral-0);
+ --sc-icon-sdg-600: var(--ac-neutral-500);
+ --sc-icon-sdg-500: var(--ac-neutral-500);
+ --sc-icon-sdg-400: var(--ac-neutral-500);
+ --sc-icon-ecosystem-600: var(--ac-primary-400);
+ --sc-icon-ecosystem-500: var(--ac-primary-400);
+ --sc-icon-ecosystem-400: var(--ac-primary-400);
+ --sc-icon-standard-shade: var(--ac-primary-500);
+ --sc-icon-standard-disabled: var(--ac-neutral-200);
+ --sc-icon-standard-background: var(--ac-neutral-500);
+ --sc-icon-standard-success: var(--ac-success-400);
+ --sc-icon-standard-error: var(--ac-error-400);
+ --sc-icon-standard-light: var(--ac-primary-300);
+ --sc-icon-standard-dark: var(--ac-primary-300);
+ --sc-card-credibility-diagonal-background: var(--ac-neutral-600);
+ --sc-card-standard-header-background: var(--ac-neutral-600);
+ --sc-card-standard-stroke: var(--ac-neutral-500);
+ --sc-card-standard-background: var(--ac-neutral-700);
+ --sc-surface-page-background-light: var(--ac-neutral-600);
+ --sc-surface-stroke: var(--ac-neutral-500);
+ --sc-surface-page-background-default: var(--ac-neutral-700);
+ --sc-text-over-image: var(--ac-neutral-0);
+ --sc-text-error: var(--ac-error-400);
+ --sc-text-disabled: var(--ac-neutral-300);
+ --sc-text-sub-header: var(--ac-neutral-300);
+ --sc-text-link: var(--ac-primary-500);
+ --sc-text-header: var(--ac-neutral-0);
+ --sc-text-paragraph: var(--ac-neutral-200);
}
}
diff --git a/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.TerrasosFooter.tsx b/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.TerrasosFooter.tsx
new file mode 100644
index 0000000000..a61dd161a7
--- /dev/null
+++ b/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.TerrasosFooter.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import { useLingui } from '@lingui/react';
+
+import TerrasosFooter from '../TerrasosFooter';
+import { terrasosFooterSocialItems } from '../TerrasosFooter/TerrasosFooter.constants';
+import {
+ TERRAOS_COPYRIGHT,
+ TERRAOS_POWERED_BY,
+} from './RegistryLayout.constants';
+
+const RegistryLayoutTerrasosFooter: React.FC> =
+ () => {
+ const { _ } = useLingui();
+
+ return (
+
+ );
+ };
+
+export { RegistryLayoutTerrasosFooter };
diff --git a/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.constants.ts b/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.constants.ts
index b52a5c68ee..9792cf453d 100644
--- a/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.constants.ts
+++ b/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.constants.ts
@@ -23,3 +23,5 @@ export const KEPLR_WALLET_CONNECT_SUBTITLE = msg`Blockchain-based actions such a
export const KEPLR_WALLET_CONNECT_LEARN_HOW_TEXT = msg`Learn how to `;
export const SWITCH_WALLET_WARNING_MODAL_TITLE = msg`Please select the following wallet address in Keplr in order to proceed`;
export const SWITCH_WALLET_WARNING_MODAL_MESSAGE = msg`The email address you are using to log in is associated with the above wallet address, so it must be the currently selected account in Keplr in order to continue.`;
+export const TERRAOS_POWERED_BY = msg`Powered by`;
+export const TERRAOS_COPYRIGHT = msg`Copyright © 2024 Terrasos | All rights reserved`;
diff --git a/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.tsx b/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.tsx
index 44bfb8a21f..600da9df64 100644
--- a/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.tsx
+++ b/web-marketplace/src/components/organisms/RegistryLayout/RegistryLayout.tsx
@@ -1,6 +1,8 @@
import React from 'react';
import { Outlet } from 'react-router-dom';
+import { IS_TERRASOS } from 'lib/env';
+
import { PageViewTracking } from 'components/molecules/PageViewTracking';
import { ScrollToTop } from '../../atoms';
@@ -15,6 +17,7 @@ import { RegistryLayoutHeader } from './RegistryLayout.Header';
import { RegistryLayoutProcessingModal } from './RegistryLayout.ProcessingModal';
import { RetryFailedFunctions } from './RegistryLayout.RetryFailedFunctions';
import { RegistryLayoutSwitchWalletModal } from './RegistryLayout.SwitchWalletModal';
+import { RegistryLayoutTerrasosFooter } from './RegistryLayout.TerrasosFooter';
import { RegistryLayoutTxErrorModal } from './RegistryLayout.TxErrorModal';
import { RegistryLayoutTxSuccessfulModal } from './RegistryLayout.TxSuccessfulModal';
@@ -23,7 +26,11 @@ const RegistryLayout: React.FC = () => {
<>
-
+ {IS_TERRASOS ? (
+
+ ) : (
+
+ )}
diff --git a/web-marketplace/src/components/organisms/TerrasosFooter/Terrasos.types.ts b/web-marketplace/src/components/organisms/TerrasosFooter/Terrasos.types.ts
new file mode 100644
index 0000000000..4457022013
--- /dev/null
+++ b/web-marketplace/src/components/organisms/TerrasosFooter/Terrasos.types.ts
@@ -0,0 +1,5 @@
+import { SocialItem } from 'web-components/src/components/share-section/ShareSection.types';
+
+export type TerrasosSocialItem = SocialItem & {
+ className?: string;
+};
diff --git a/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.constants.ts b/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.constants.ts
new file mode 100644
index 0000000000..2e4118377c
--- /dev/null
+++ b/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.constants.ts
@@ -0,0 +1,32 @@
+/* eslint-disable lingui/no-unlocalized-strings */
+import InstagramIcon from 'web-components/src/components/icons/social/InstagramIcon';
+import LinkedInIcon from 'web-components/src/components/icons/social/LinkedInIcon';
+import TwitterIcon from 'web-components/src/components/icons/social/TwitterIcon';
+import YoutubeIcon from 'web-components/src/components/icons/social/YoutubeIcon';
+
+import { TerrasosSocialItem } from './Terrasos.types';
+
+export const terrasosFooterSocialItems: TerrasosSocialItem[] = [
+ {
+ name: 'Twitter',
+ href: 'https://x.com/TerrasosCo',
+ Icon: TwitterIcon,
+ },
+ {
+ name: 'LinkedIn',
+ href: 'https://www.linkedin.com/company/terrasos/',
+ Icon: LinkedInIcon,
+ className: 'p-[3px]',
+ },
+ {
+ name: 'Instagram',
+ href: 'https://www.instagram.com/terrasos_co/',
+ Icon: InstagramIcon,
+ className: 'p-[3px]',
+ },
+ {
+ name: 'YouTube',
+ href: 'https://www.youtube.com/channel/UCXMGrR3xfTDL2Z1CyMPURJg',
+ Icon: YoutubeIcon,
+ },
+];
diff --git a/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.stories.tsx b/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.stories.tsx
new file mode 100644
index 0000000000..f7c846b932
--- /dev/null
+++ b/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.stories.tsx
@@ -0,0 +1,21 @@
+import { Meta, StoryObj } from '@storybook/react';
+
+import { TerrasosFooter } from './TerrasosFooter';
+import { terrasosFooterSocialItems } from './TerrasosFooter.constants';
+
+export default {
+ title: 'Marketplace/Atoms/TerrasosFooter',
+ component: TerrasosFooter,
+} as Meta;
+
+type Story = StoryObj;
+
+export const Basic: Story = {
+ render: args => ,
+};
+
+Basic.args = {
+ poweredBy: 'Powered by',
+ copyright: 'Copyright © 2024 Terrasos | All rights reserved',
+ socialItems: terrasosFooterSocialItems,
+};
diff --git a/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.tsx b/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.tsx
new file mode 100644
index 0000000000..287fccb3be
--- /dev/null
+++ b/web-marketplace/src/components/organisms/TerrasosFooter/TerrasosFooter.tsx
@@ -0,0 +1,58 @@
+import RegenIcon from 'web-components/src/components/icons/RegenIcon';
+import { cn } from 'web-components/src/utils/styles/cn';
+
+import { Link } from 'components/atoms';
+
+import { TerrasosSocialItem } from './Terrasos.types';
+
+export interface Props {
+ poweredBy: string;
+ copyright: string;
+ socialItems: TerrasosSocialItem[];
+ className?: string;
+}
+
+export const TerrasosFooter = ({
+ poweredBy,
+ copyright,
+ socialItems,
+ className,
+}: Props): JSX.Element => {
+ return (
+
+
+
+
+
+ {poweredBy}
+
+
+
+
+
+ {copyright}
+
+
+ {socialItems.map(item => (
+
+
+
+ ))}
+
+
+
+ );
+};
diff --git a/web-marketplace/src/components/organisms/TerrasosFooter/index.ts b/web-marketplace/src/components/organisms/TerrasosFooter/index.ts
new file mode 100644
index 0000000000..83005bcff9
--- /dev/null
+++ b/web-marketplace/src/components/organisms/TerrasosFooter/index.ts
@@ -0,0 +1 @@
+export { TerrasosFooter as default } from './TerrasosFooter';
diff --git a/web-marketplace/src/lib/env.ts b/web-marketplace/src/lib/env.ts
index a80ff588e3..4031774bbd 100644
--- a/web-marketplace/src/lib/env.ts
+++ b/web-marketplace/src/lib/env.ts
@@ -1,5 +1,7 @@
import { MARKETPLACE_CLIENT_TYPE } from 'clients/Clients.types';
+import { ColorScheme } from 'web-components/src/theme/theme.types';
+
export const IS_DEV = import.meta.env.DEV;
export const apiServerUrl = import.meta.env.VITE_API_URI;
export const SKIPPED_CLASS_ID = import.meta.env.VITE_SKIPPED_CLASS_ID;
@@ -16,3 +18,5 @@ export const DEFAULT_COMMUNITY_PROJECTS_FILTER =
export const MARKETPLACE_CLIENT = (import.meta.env.VITE_MARKETPLACE_CLIENT ??
'regen') as MARKETPLACE_CLIENT_TYPE;
export const IS_TERRASOS = MARKETPLACE_CLIENT === 'terrasos';
+export const IS_REGEN = MARKETPLACE_CLIENT === 'regen';
+export const COLOR_SCHEME: ColorScheme = IS_TERRASOS ? 'terrasos' : 'regen';
diff --git a/web-marketplace/src/lib/i18n/locales/en.po b/web-marketplace/src/lib/i18n/locales/en.po
index 025fd179b7..60f9b7ec27 100644
--- a/web-marketplace/src/lib/i18n/locales/en.po
+++ b/web-marketplace/src/lib/i18n/locales/en.po
@@ -1,6 +1,6 @@
msgid ""
msgstr ""
-"POT-Creation-Date: 2024-10-14 10:17+0200\n"
+"POT-Creation-Date: 2024-10-16 09:16+0200\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=utf-8\n"
"Content-Transfer-Encoding: 8bit\n"
@@ -350,7 +350,7 @@ msgid "all profiles"
msgstr ""
#: src/components/organisms/RegistryLayout/RegistryLayout.config.tsx:41
-#: src/pages/Projects/Projects.tsx:73
+#: src/pages/Projects/Projects.tsx:74
msgid "All projects"
msgstr ""
@@ -901,7 +901,7 @@ msgstr ""
msgid "Class ID: unique identifier of the credit class on Regen Ledger."
msgstr ""
-#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:165
+#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:180
msgid "Clear all"
msgstr ""
@@ -1009,6 +1009,10 @@ msgstr ""
msgid "Copy link to project page"
msgstr ""
+#: src/components/organisms/RegistryLayout/RegistryLayout.constants.ts:27
+msgid "Copyright © 2024 Terrasos | All rights reserved"
+msgstr ""
+
#: src/components/organisms/BuyCreditsModal/BuyCreditsModal.tsx:546
#: src/lib/constants/shared.constants.tsx:58
#: src/lib/constants/shared.constants.tsx:157
@@ -2556,12 +2560,16 @@ msgstr ""
msgid "Postal Code"
msgstr ""
+#: src/components/organisms/RegistryLayout/RegistryLayout.constants.ts:26
+msgid "Powered by"
+msgstr ""
+
#: src/lib/constants/shared.constants.tsx:176
msgid "prefinance"
msgstr ""
#: src/components/organisms/RegistryLayout/RegistryLayout.config.tsx:49
-#: src/pages/Projects/Projects.tsx:83
+#: src/pages/Projects/Projects.tsx:84
msgid "Prefinance projects"
msgstr ""
@@ -2855,7 +2863,7 @@ msgstr ""
msgid "Projects"
msgstr ""
-#: src/pages/Projects/Projects.tsx:126
+#: src/pages/Projects/Projects.tsx:127
msgid "projects tabs"
msgstr ""
@@ -3197,7 +3205,7 @@ msgstr ""
msgid "Select a wallet"
msgstr ""
-#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:143
+#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:158
msgid "Select all"
msgstr ""
@@ -3373,7 +3381,7 @@ msgstr ""
msgid "Sorry, your transaction was not successful."
msgstr ""
-#: src/pages/Projects/AllProjects/AllProjects.tsx:207
+#: src/pages/Projects/AllProjects/AllProjects.tsx:211
msgid "Sort by:"
msgstr ""
diff --git a/web-marketplace/src/lib/i18n/locales/es.po b/web-marketplace/src/lib/i18n/locales/es.po
index be778bf139..d7e5db5820 100644
--- a/web-marketplace/src/lib/i18n/locales/es.po
+++ b/web-marketplace/src/lib/i18n/locales/es.po
@@ -1,6 +1,6 @@
msgid ""
msgstr ""
-"POT-Creation-Date: 2024-10-14 10:17+0200\n"
+"POT-Creation-Date: 2024-10-16 09:16+0200\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=utf-8\n"
"Content-Transfer-Encoding: 8bit\n"
@@ -350,7 +350,7 @@ msgid "all profiles"
msgstr ""
#: src/components/organisms/RegistryLayout/RegistryLayout.config.tsx:41
-#: src/pages/Projects/Projects.tsx:73
+#: src/pages/Projects/Projects.tsx:74
msgid "All projects"
msgstr ""
@@ -901,7 +901,7 @@ msgstr ""
msgid "Class ID: unique identifier of the credit class on Regen Ledger."
msgstr ""
-#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:165
+#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:180
msgid "Clear all"
msgstr ""
@@ -1009,6 +1009,10 @@ msgstr ""
msgid "Copy link to project page"
msgstr ""
+#: src/components/organisms/RegistryLayout/RegistryLayout.constants.ts:27
+msgid "Copyright © 2024 Terrasos | All rights reserved"
+msgstr ""
+
#: src/components/organisms/BuyCreditsModal/BuyCreditsModal.tsx:546
#: src/lib/constants/shared.constants.tsx:58
#: src/lib/constants/shared.constants.tsx:157
@@ -2556,12 +2560,16 @@ msgstr ""
msgid "Postal Code"
msgstr ""
+#: src/components/organisms/RegistryLayout/RegistryLayout.constants.ts:26
+msgid "Powered by"
+msgstr ""
+
#: src/lib/constants/shared.constants.tsx:176
msgid "prefinance"
msgstr ""
#: src/components/organisms/RegistryLayout/RegistryLayout.config.tsx:49
-#: src/pages/Projects/Projects.tsx:83
+#: src/pages/Projects/Projects.tsx:84
msgid "Prefinance projects"
msgstr ""
@@ -2855,7 +2863,7 @@ msgstr ""
msgid "Projects"
msgstr ""
-#: src/pages/Projects/Projects.tsx:126
+#: src/pages/Projects/Projects.tsx:127
msgid "projects tabs"
msgstr ""
@@ -3197,7 +3205,7 @@ msgstr ""
msgid "Select a wallet"
msgstr ""
-#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:143
+#: src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx:158
msgid "Select all"
msgstr ""
@@ -3373,7 +3381,7 @@ msgstr ""
msgid "Sorry, your transaction was not successful."
msgstr ""
-#: src/pages/Projects/AllProjects/AllProjects.tsx:207
+#: src/pages/Projects/AllProjects/AllProjects.tsx:211
msgid "Sort by:"
msgstr ""
diff --git a/web-marketplace/src/lib/normalizers/projects/normalizeProjectsWithOrderData.ts b/web-marketplace/src/lib/normalizers/projects/normalizeProjectsWithOrderData.ts
index 3d3c72c72f..d1674e5476 100644
--- a/web-marketplace/src/lib/normalizers/projects/normalizeProjectsWithOrderData.ts
+++ b/web-marketplace/src/lib/normalizers/projects/normalizeProjectsWithOrderData.ts
@@ -1,6 +1,7 @@
import { ProjectInfo } from '@regen-network/api/lib/generated/regen/ecocredit/v1/query';
import { AllCreditClassQuery } from 'generated/sanity-graphql';
+import { IS_TERRASOS } from 'lib/env';
import { ProjectWithOrderData } from 'pages/Projects/AllProjects/AllProjects.types';
import {
@@ -38,10 +39,14 @@ export const normalizeProjectsWithOrderData = ({
creditClassIdOrUrl: project.classId ?? '',
});
+ const defaultProjectImage = IS_TERRASOS
+ ? '/jpg/default-project2.jpg'
+ : '/jpg/default-project.jpg';
+
return {
id: project.id,
name: project.id,
- imgSrc: '/jpg/default-project.jpg',
+ imgSrc: defaultProjectImage,
place: project.jurisdiction,
area: 0,
areaUnit: '',
diff --git a/web-marketplace/src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx b/web-marketplace/src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx
index 2ede1b475b..cac851e948 100644
--- a/web-marketplace/src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx
+++ b/web-marketplace/src/pages/Projects/AllProjects/AllProjects.SideFilter.tsx
@@ -24,6 +24,7 @@ import {
useCommunityProjectsAtom,
} from 'lib/atoms/projects.atoms';
import { SEE_LESS, SEE_MORE } from 'lib/constants/shared.constants';
+import { COLOR_SCHEME, IS_TERRASOS } from 'lib/env';
import { useTracker } from 'lib/tracker/useTracker';
import { CommunityFilter } from './AllProjects.CommunityFilter';
@@ -80,9 +81,19 @@ export const SideFilter = ({
size="small"
onClick={() => setIsOpen(true)}
startIcon={
-
+
}
- sx={[{ mr: 4 }, ...sxToArray(sx)]}
+ sx={[
+ {
+ mr: 4,
+ },
+ ...sxToArray(sx),
+ ]}
>
{_(SIDE_FILTERS_BUTTON)}
diff --git a/web-marketplace/src/pages/Projects/AllProjects/AllProjects.tsx b/web-marketplace/src/pages/Projects/AllProjects/AllProjects.tsx
index 5d43986140..19963e88df 100644
--- a/web-marketplace/src/pages/Projects/AllProjects/AllProjects.tsx
+++ b/web-marketplace/src/pages/Projects/AllProjects/AllProjects.tsx
@@ -30,7 +30,12 @@ import {
getProjectCardButtonMapping,
getProjectCardPurchaseDetailsTitleMapping,
} from 'lib/constants/shared.constants';
-import { CREDIT_CLASS_FILTERS_TO_DESELECT, IS_TERRASOS } from 'lib/env';
+import {
+ COLOR_SCHEME,
+ CREDIT_CLASS_FILTERS_TO_DESELECT,
+ IS_REGEN,
+ IS_TERRASOS,
+} from 'lib/env';
import { getAllSanityCreditClassesQuery } from 'lib/queries/react-query/sanity/getAllCreditClassesQuery/getAllCreditClassesQuery';
import { useTracker } from 'lib/tracker/useTracker';
@@ -233,10 +238,14 @@ export const AllProjects: React.FC> = () => {
place={project?.place}
area={project?.area}
areaUnit={project?.areaUnit}
- onButtonClick={() => {
- setSelectedProject(project);
- setIsBuyFlowStarted(true);
- }}
+ onButtonClick={
+ IS_TERRASOS
+ ? undefined
+ : () => {
+ setSelectedProject(project);
+ setIsBuyFlowStarted(true);
+ }
+ }
purchaseInfo={project.purchaseInfo || {}}
onClick={() => navigate(`/project/${project.id}`)}
imageStorageBaseUrl={IMAGE_STORAGE_BASE_URL}
@@ -253,6 +262,7 @@ export const AllProjects: React.FC> = () => {
bodyTexts={bodyTexts}
purchaseDetailsTitles={purchaseDetailsTitles}
buttons={buttons}
+ useProjectCardButton={IS_REGEN}
/>
);
@@ -292,6 +302,7 @@ export const AllProjects: React.FC> = () => {
page={Number(routePage)}
onChange={(event, value) => navigate(`/projects/${value}`)}
size={isMobile ? 'small' : 'large'}
+ colorScheme={COLOR_SCHEME}
/>
{config.buySellOrderFlow && (
diff --git a/web-marketplace/src/pages/Projects/Projects.tsx b/web-marketplace/src/pages/Projects/Projects.tsx
index a20a6f9f35..bbbd5e5dfe 100644
--- a/web-marketplace/src/pages/Projects/Projects.tsx
+++ b/web-marketplace/src/pages/Projects/Projects.tsx
@@ -19,6 +19,7 @@ import {
useCommunityProjectsAtom,
} from 'lib/atoms/projects.atoms';
import { client as sanityClient } from 'lib/clients/sanity';
+import { IS_TERRASOS } from 'lib/env';
import { getAllHomePageQuery } from 'lib/queries/react-query/sanity/getAllHomePageQuery/getAllHomePageQuery';
import { Link } from 'components/atoms';
@@ -154,7 +155,7 @@ const Projects = (): JSX.Element => {
/>
- {gettingStartedResourcesSection && (
+ {gettingStartedResourcesSection && !IS_TERRASOS && (