diff --git a/public/assets/images/icons/headerIcons/DefaultProfileImageIcon.tsx b/public/assets/images/icons/headerIcons/DefaultProfileImageIcon.tsx index d5304e9b1..c23e9e9f6 100644 --- a/public/assets/images/icons/headerIcons/DefaultProfileImageIcon.tsx +++ b/public/assets/images/icons/headerIcons/DefaultProfileImageIcon.tsx @@ -1,13 +1,23 @@ const DefaultProfileImageIcon = () => { return ( - - - + + + + + + + + + + ); }; diff --git a/public/assets/images/icons/projectV2/PointMarkerIconsSymbol.tsx b/public/assets/images/icons/projectV2/PointMarkerIconsSymbol.tsx new file mode 100644 index 000000000..7925b0a60 --- /dev/null +++ b/public/assets/images/icons/projectV2/PointMarkerIconsSymbol.tsx @@ -0,0 +1,272 @@ +// Todo - move to a common location +import type { IconProps } from '../../../../../src/features/common/types/common'; + +export const Agroforestry = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + ); +}; + +export const Conservation = ({ color }: IconProps) => { + return ( + + + + + + + + + + + + ); +}; + +export const ManagedRegeneration = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + + + + + + + + + + + + + ); +}; + +export const Mangroves = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + ); +}; + +export const NaturalRegeneration = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + ); +}; + +export const OtherPlanting = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + ); +}; + +export const RegisteredTreeIcon = () => { + return ( + + + + + + + ); +}; + +export const TreePlanting = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + + + + + + + + ); +}; + +export const UrbanRestoration = ({ + color = 'currentColor', + width, + height, +}: IconProps) => { + return ( + + + + + + + + + + + + + + ); +}; diff --git a/src/features/projectsV2/ProjectListControls/microComponents/ClassificationDropDown.tsx b/src/features/projectsV2/ProjectListControls/microComponents/ClassificationDropDown.tsx index ae5794ecf..6977bd0f6 100644 --- a/src/features/projectsV2/ProjectListControls/microComponents/ClassificationDropDown.tsx +++ b/src/features/projectsV2/ProjectListControls/microComponents/ClassificationDropDown.tsx @@ -6,6 +6,16 @@ import { useMemo } from 'react'; import { useTranslations } from 'next-intl'; import styles from '../styles/ProjectListControls.module.scss'; import { availableFilters } from '../../../../utils/projectV2'; +import { + TreePlanting, + Agroforestry, + NaturalRegeneration, + ManagedRegeneration, + UrbanRestoration, + OtherPlanting, + Mangroves, +} from '../../../../../public/assets/images/icons/projectV2/PointMarkerIconsSymbol'; +// import TreePlanting from '../../../../../public/assets/images/icons/project/TreePlanting'; interface ClassificationDropDownProps { selectedClassification: TreeProjectClassification[]; @@ -13,6 +23,16 @@ interface ClassificationDropDownProps { selectedMode?: ViewMode; } +const classificationItemIcons = { + 'large-scale-planting': , + agroforestry: , + 'natural-regeneration': , + 'managed-regeneration': , + 'urban-planting': , + 'other-planting': , + mangroves: , +}; + export const ClassificationDropDown = ({ selectedClassification, setSelectedClassification, @@ -67,12 +87,13 @@ export const ClassificationDropDown = ({ onClick={() => handleFilterSelection(filterItem)} >
+ {classificationItemIcons[filterItem]} {tAllProjects(`classificationTypes.${filterItem}`)}
{index !== availableFilters.length - 1 && ( diff --git a/src/features/projectsV2/ProjectListControls/styles/ProjectListControls.module.scss b/src/features/projectsV2/ProjectListControls/styles/ProjectListControls.module.scss index f75910deb..3289303ad 100644 --- a/src/features/projectsV2/ProjectListControls/styles/ProjectListControls.module.scss +++ b/src/features/projectsV2/ProjectListControls/styles/ProjectListControls.module.scss @@ -236,6 +236,14 @@ top: 67px; } +.classificationItem { + display: flex; + color: rgba($dark, 1); + width: 100%; + align-items: center; + gap: 4px; +} + .classificationUnselected { font-size: $fontXXSmall; line-height: normal; diff --git a/src/features/user/Profile/ProfileCard/index.tsx b/src/features/user/Profile/ProfileCard/index.tsx index 42bccac9b..e9d8189c2 100644 --- a/src/features/user/Profile/ProfileCard/index.tsx +++ b/src/features/user/Profile/ProfileCard/index.tsx @@ -4,10 +4,8 @@ import React from 'react'; import { Avatar } from '@mui/material'; import getImageUrl from '../../../../utils/getImageURL'; import styles from './ProfileCard.module.scss'; -import { - DefaultUserProfileImage, - SettingsIcon, -} from '../../../../../public/assets/images/icons/ProfilePageV2Icons'; +import { SettingsIcon } from '../../../../../public/assets/images/icons/ProfilePageV2Icons'; +import DefaultProfileImageIcon from '../../../../../public/assets/images/icons/headerIcons/DefaultProfileImageIcon'; import Link from 'next/link'; import ProfileActions from './ProfileActions'; import DonorCircleMemberBadge from './MicroComponents/DonorCircleMemberBadge'; @@ -27,9 +25,7 @@ const ProfileCard = ({ userProfile, profilePageType }: ProfileV2Props) => { {userImageUrl && !userImageUrl.includes('development') ? ( ) : ( - - - + )}
diff --git a/src/features/user/Settings/EditProfile/EditProfile.module.scss b/src/features/user/Settings/EditProfile/EditProfile.module.scss index 840ea04f8..c8bb23b2c 100644 --- a/src/features/user/Settings/EditProfile/EditProfile.module.scss +++ b/src/features/user/Settings/EditProfile/EditProfile.module.scss @@ -266,7 +266,6 @@ .noProfilePic { text-align: center; - background-color: $backgroundColorDark; height: 100px; width: 100px; border-radius: 100px; diff --git a/src/features/user/Settings/EditProfile/EditProfileForm.tsx b/src/features/user/Settings/EditProfile/EditProfileForm.tsx index bd9bdc9ef..68fe5dcae 100644 --- a/src/features/user/Settings/EditProfile/EditProfileForm.tsx +++ b/src/features/user/Settings/EditProfile/EditProfileForm.tsx @@ -28,7 +28,7 @@ import Delete from '../../../../../public/assets/images/icons/manageProjects/Del import CustomTooltip from '../../../common/Layout/CustomTooltip'; import NewToggleSwitch from '../../../common/InputTypes/NewToggleSwitch'; import { useRouter } from 'next/router'; -import { DefaultUserProfileImage } from '../../../../../public/assets/images/icons/ProfilePageV2Icons'; +import DefaultProfileImageIcon from '../../../../../public/assets/images/icons/headerIcons/DefaultProfileImageIcon'; import themeProperties from '../../../../theme/themeProperties'; import NewInfoIcon from '../../../../../public/assets/images/icons/projectV2/NewInfoIcon'; @@ -274,7 +274,7 @@ export default function EditProfileForm() {
) : (
- +
)}