diff --git a/src/components/main/HomePageFilters.tsx b/src/components/main/HomePageFilters.tsx
index 8bf7bd10f..b0c1c67f0 100644
--- a/src/components/main/HomePageFilters.tsx
+++ b/src/components/main/HomePageFilters.tsx
@@ -1,6 +1,8 @@
import { Col, Radio, RadioChangeEvent, Row, Select } from 'antd'
import clsx from 'clsx'
import { useRouter } from 'next/router'
+import { MdVerified } from 'react-icons/md'
+import { ReactNode } from 'react-markdown'
import config from 'src/config'
import { useIsMyAddressWhitelisted } from 'src/config/constants'
import LatestPostsPage from '../posts/LatestPostsPage'
@@ -29,9 +31,18 @@ const commonFilterOption = [{ label: 'Latest', value: 'latest' }]
// ]
// : []
-type Filter = { label: string; value: string; icon?: string }
+type Filter = { label: string; value: string; icon?: ReactNode }
+
+const verifiedIcon = (
+
+)
+
export const postFilterOpt: Filter[] = [
- { label: 'Featured Posts', icon: '✅', value: 'suggested' },
+ {
+ label: 'Featured Posts',
+ icon: verifiedIcon,
+ value: 'suggested',
+ },
{ label: 'Hot Posts', icon: '🔥', value: 'hot' },
{ label: 'All Posts', value: 'latest' },
// removed most liked and commented
@@ -55,7 +66,11 @@ export const commentFilterOpt: Filter[] = enableGraphQl
// : []
export const spaceFilterOpt: Filter[] = [
- { label: 'Featured Creators', icon: '✅', value: 'suggested' },
+ {
+ label: 'Featured Creators',
+ icon: verifiedIcon,
+ value: 'suggested',
+ },
{ label: 'Creators Staking', value: 'creators' },
// ...offchainSpaceFilterOpt,
]
diff --git a/src/components/spaces/helpers/OfficialSpaceStatus.tsx b/src/components/spaces/helpers/OfficialSpaceStatus.tsx
index 922ed53bf..71bd5a538 100644
--- a/src/components/spaces/helpers/OfficialSpaceStatus.tsx
+++ b/src/components/spaces/helpers/OfficialSpaceStatus.tsx
@@ -1,7 +1,8 @@
-import { CheckCircleFilled, HourglassOutlined } from '@ant-design/icons'
+import { HourglassOutlined } from '@ant-design/icons'
import { Tag, Tooltip } from 'antd'
import clsx from 'clsx'
import Link from 'next/link'
+import { MdVerified } from 'react-icons/md'
import { useIsMobileWidthOrDevice } from 'src/components/responsive'
import messages from 'src/messages'
import { SpaceStruct } from 'src/types'
@@ -19,7 +20,7 @@ type InnerIconProps = {
icon: JSX.Element
}
-const officialSpaceIcon =
+const officialSpaceIcon =
const unclaimedSpaceIcon =
diff --git a/src/components/spaces/spaces.module.sass b/src/components/spaces/spaces.module.sass
index 173462a43..7ca4cb847 100644
--- a/src/components/spaces/spaces.module.sass
+++ b/src/components/spaces/spaces.module.sass
@@ -8,12 +8,12 @@
text-align: left
.OfficialSpaceIcon
- margin-left: $space_tiny
- font-size: $font_big
+ margin-left: $space_mini
+ font-size: 1.1em
.ClaimedOfficialSpaceIcon
@extend .OfficialSpaceIcon
- color: $color_green
+ color: #1D9AF1
.ClaimSpacePendingIcon
padding: $space_mini
diff --git a/src/styles/subsocial.scss b/src/styles/subsocial.scss
index a015717a3..7fa27366b 100644
--- a/src/styles/subsocial.scss
+++ b/src/styles/subsocial.scss
@@ -2325,3 +2325,7 @@ hr {
}
}
}
+
+.VerifiedIcon {
+ color: #1d9af1;
+}