diff --git a/components/Badge/index.tsx b/components/Badge/index.tsx index b6abac33..de649bd9 100644 --- a/components/Badge/index.tsx +++ b/components/Badge/index.tsx @@ -30,7 +30,7 @@ export default function Badge({ name, id, avatar, tokens, owned }: BadgeProps) { href={`/badge/${id}`} className={`h-full w-full ${owned ? "opacity-100" : "opacity-30"}`} > -
+
{!badgeLoaded && } diff --git a/components/BadgeFilter/index.tsx b/components/BadgeFilter/index.tsx index 5a1bfed4..4d40fcb1 100644 --- a/components/BadgeFilter/index.tsx +++ b/components/BadgeFilter/index.tsx @@ -6,7 +6,7 @@ export default function BadgeFilter({ onChange }) { to standardize styles for the container +export function InputBase({ + text, + id, + fgColor, + bgColor, + enabled, + children, +}: InputBaseProps) { + let textColor = `text-${fgColor}`; + let backColor = `bg-${bgColor}`; + + return ( +
+ +
+ {children} +
+
+ ); +} + +export default forwardRef(function Input( { text, id, name, type, value, - autocomplete, + autoComplete, fgColor, bgColor, onChange, @@ -24,40 +59,27 @@ export default forwardRef(function Input( }, ref ) { - let textColor = `text-${fgColor}`; - let backColor = `bg-${bgColor}`; - - if (enabled === false) { - textColor = "text-gray-500"; - backColor = "bg-gray-100"; - } else if (enabled === true) { - textColor = `bg-${fgColor}`; - backColor = `bg-${bgColor}`; - } - return ( -
- -
- -
-
+ + + ); }); diff --git a/components/JoinUs/index.jsx b/components/JoinUs/index.jsx index cecc6b0f..c62ad1a1 100644 --- a/components/JoinUs/index.jsx +++ b/components/JoinUs/index.jsx @@ -2,7 +2,7 @@ export default function JoinUs(props) { return ( Join us 👋 diff --git a/components/Layout/Layout.tsx b/components/Layout/Layout.tsx index 2a82e41b..6619ac00 100644 --- a/components/Layout/Layout.tsx +++ b/components/Layout/Layout.tsx @@ -64,7 +64,7 @@ export default function Layout({ title, description, children }: LayoutProps) { /> {/* NAVBAR */} -