Fix Grommet Icons stroke not being provided by currentColor

- Improve dark-mode placeholder text color

src/components/render/DisplayIconSingle.tsx

@@ -32,7 +32,7 @@ const IconInternal: FunctionComponent<IconInternalProps> = ({label, children, on
 const DisplayIconSingle: FunctionComponent<DisplayIconSingleProps> = ({setId, id}) => {
     // eslint-disable-next-line
     const IconSet = loadable.lib(() => getIcons(setId));
-    const iconClass = "text-slate-700 dark:text-slate-200 group-hover:text-slate-900 group-hover:scale-125 transition-transform w-8 h-8";
+    const iconClass = "text-slate-700 stroke-slate-700 dark:text-slate-200 dark:stroke-slate-200 group-hover:text-slate-900 group-hover:scale-125 transition-transform w-8 h-8";
 
     return <IconSet fallback={<IconInternal label="...">
         <BsQuestionCircle className={iconClass}/>
@@ -42,7 +42,7 @@ const DisplayIconSingle: FunctionComponent<DisplayIconSingleProps> = ({setId, id
             return <IconInternal label={id} onClick={() => {
                 void navigator.clipboard.writeText(`import {${id}} from "react-icons/${setId}";`)
             }}>
-                <Icon className={iconClass}/>
+                <Icon className={classNames(iconClass, setId === 'gr' ? 'forceStroke' : null)}/>
             </IconInternal>
 
         }}

src/pages/index.tsx

@@ -75,7 +75,7 @@ const Home: NextPage = () => {
                     <input
                         ref={searchRef}
                         autoFocus
-                        className="placeholder:text-zinc-400 dark:text-zinc-200 dark:placeholder:text-zinc-300 grow bg-transparent ring-0 outline-none text-xl"
+                        className="placeholder:text-zinc-400 dark:text-zinc-200 dark:placeholder:text-zinc-400 grow bg-transparent ring-0 outline-none text-xl"
                         placeholder="Search for an icon..."
                         onChange={({target: {value}}) => setQuery(value)}
                         value={query}

src/styles/globals.scss

@@ -14,4 +14,10 @@ html {
 code {
     font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
     Bitstream Vera Sans Mono, Courier New, monospace;
+}
+
+.forceStroke {
+    > path, g {
+        stroke: currentColor;
+    }
 }