diff --git a/src/components/App/App.css b/src/components/App/App.css index 2dc97d2..42b559f 100644 --- a/src/components/App/App.css +++ b/src/components/App/App.css @@ -114,3 +114,16 @@ a.main-link:after { a.main-link:hover:after { width: 0%; } + +.badge.new { + color: #ff6e60; +} + +.badge.updated { + color: #397fff; +} + +.badge { + font-size: 24px; + line-height: 0.5em; +} diff --git a/src/components/IconGrid/IconGrid.tsx b/src/components/IconGrid/IconGrid.tsx index efa94fd..806dcad 100644 --- a/src/components/IconGrid/IconGrid.tsx +++ b/src/components/IconGrid/IconGrid.tsx @@ -14,7 +14,15 @@ import TagCloud from "./TagCloud"; import Notice from "../Notice/Notice"; import "./IconGrid.css"; -const defaultSearchTags = ["*new*", "communication", "editor", "emoji", "maps", "weather"]; +const defaultSearchTags = [ + "*new*", + "*updated*", + "communication", + "editor", + "emoji", + "maps", + "weather", +]; type IconGridProps = {}; diff --git a/src/components/IconGrid/IconGridItem.tsx b/src/components/IconGrid/IconGridItem.tsx index ecd2ee4..37f8196 100644 --- a/src/components/IconGrid/IconGridItem.tsx +++ b/src/components/IconGrid/IconGridItem.tsx @@ -36,6 +36,8 @@ const IconGridItem: React.FC = (props) => { const { name, Icon } = entry; const [open, setOpen] = useRecoilState(iconPreviewOpenAtom); const isOpen = open === name; + const isNew = entry.tags.includes("*new*"); + const isUpdated = entry.tags.includes("*updated*"); const delayRef = useRef(0); const offset = useRef({ top: 0, left: 0 }); const ref = useRef(); @@ -84,11 +86,15 @@ const IconGridItem: React.FC = (props) => { onClick={handleOpen} > -

{name}

+

+ {name} + {isNew && } + {isUpdated && } +

- - {isOpen && } - + + {isOpen && } + ); }; diff --git a/src/components/IconGrid/TagCloud.css b/src/components/IconGrid/TagCloud.css index 1ee8f94..793edd6 100644 --- a/src/components/IconGrid/TagCloud.css +++ b/src/components/IconGrid/TagCloud.css @@ -29,4 +29,4 @@ button.tag-button:focus { .dark { color: white; -} \ No newline at end of file +} diff --git a/src/components/IconGrid/TagCloud.tsx b/src/components/IconGrid/TagCloud.tsx index 5d376b4..85121f8 100644 --- a/src/components/IconGrid/TagCloud.tsx +++ b/src/components/IconGrid/TagCloud.tsx @@ -29,6 +29,8 @@ const TagCloud: React.FC = ({ name, tags, isDark }) => { onClick={() => void handleTagClick(tag)} > {tag} + {tag === "*new*" && } + {tag === "*updated*" && } ))} diff --git a/src/lib/icons.ts b/src/lib/icons.ts index 66fc82b..ffa2c80 100644 --- a/src/lib/icons.ts +++ b/src/lib/icons.ts @@ -1682,6 +1682,7 @@ export const icons: ReadonlyArray = [ IconCategory.OBJECTS, ], tags: [ + "*updated*", "addition", "sum", "subtraction", @@ -9189,6 +9190,7 @@ export const icons: ReadonlyArray = [ "machinery", "mechanical", "repairs", + "*updated*", ], Icon: Icons.Wrench, },