say class, not className

Author: mlc

src/About.tsx

@@ -3,7 +3,7 @@ import type { FunctionComponent } from 'preact';
 const About: FunctionComponent = () => (
   <>
     <h2>About</h2>
-    <p className="hint">
+    <p class="hint">
       This is a utility for finding your closest photo for several different
       game modes. All computations are performed on your computer and no data is
       transmitted anywhere. If you want to see or modify the source code, feel

src/Data.tsx

@@ -34,7 +34,7 @@ const Data: FunctionComponent = () => {
         Load File
       </FileInput>
       <MaybeError error={error} />
-      <p className="hint">
+      <p class="hint">
         Supported files:{' '}
         <a href="https://en.wikipedia.org/wiki/Comma-separated_values">CSV</a>{' '}
         with latitude and longitude columns, or{' '}

src/Icon.tsx

@@ -8,7 +8,7 @@ interface Props {
 
 const Icon: FunctionComponent<Props> = ({ name, label, onClick }) => (
   <span
-    className="icon"
+    class="icon"
     role={onClick ? 'button' : 'img'}
     aria-label={label}
     onClick={onClick}

src/MaybeError.tsx

@@ -6,7 +6,7 @@ interface Props {
 
 const MaybeError: FunctionComponent<Props> = ({ error }) => {
   if (error) {
-    return <p className="error">{error}</p>;
+    return <p class="error">{error}</p>;
   } else {
     return null;
   }

src/Radio.tsx

@@ -65,7 +65,7 @@ export function Selector<T extends string | number>({
   );
 
   return (
-    <p id={id} className="selector">
+    <p id={id} class="selector">
       {children}
       {values.map(([value, name]) => (
         <Radio

src/Results/PositionCell.tsx

@@ -19,7 +19,7 @@ const PositionCell: FunctionComponent<Props> = ({ coord }) => {
     navigator.clipboard.writeText(stringCoord).catch(console.error);
   }, [stringCoord]);
   return (
-    <td className="position">
+    <td class="position">
       <a href={url}>{stringCoord}</a>
       <Icon name="copy" label="Copy coordinates" onClick={onCopyClick} />
     </td>