xevion/rdap
1
0
Fork 0
mirror of https://github.com/Xevion/rdap.git synced 2025-12-10 16:08:15 -06:00
Code Issues Packages Projects Releases Wiki Activity

add clsx, add bottom padding for ErrorCard

Browse Source
This commit is contained in:
Xevion
2024-05-09 02:15:11 -05:00
parent c3fe5691c6
commit f37e6f87a2
4 changed files with 12 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -11,6 +11,7 @@
"dependencies": { "dependencies": {
"@headlessui/react": "^1.7.11", "@headlessui/react": "^1.7.11",
"@heroicons/react": "^2.0.16", "@heroicons/react": "^2.0.16",
"clsx": "^2.1.1",
"date-fns": "^2.29.3", "date-fns": "^2.29.3",
"immutability-helper": "^3.1.1", "immutability-helper": "^3.1.1",
"ipaddr.js": "^2.0.1", "ipaddr.js": "^2.0.1",

7
src/components/common/ErrorCard.tsx
View File

@@ -1,19 +1,22 @@
import { FunctionComponent, ReactNode } from "react"; import type { FunctionComponent, ReactNode } from "react";
import { XCircleIcon } from "@heroicons/react/20/solid"; import { XCircleIcon } from "@heroicons/react/20/solid";
import clsx from "clsx";
export type ErrorCardProps = { export type ErrorCardProps = {
title: ReactNode; title: ReactNode;
description?: ReactNode; description?: ReactNode;
issues?: ReactNode[]; issues?: ReactNode[];
className?: string;
}; };
const ErrorCard: FunctionComponent<ErrorCardProps> = ({ const ErrorCard: FunctionComponent<ErrorCardProps> = ({
title, title,
description, description,
issues, issues,
className,
}) => { }) => {
return ( return (
<div className="rounded-md border border-red-700/30 bg-zinc-800 p-4"> <div className={clsx(className, "rounded-md border border-red-700/30 bg-zinc-800 p-4")}>
<div className="flex"> <div className="flex">
<div className="flex-shrink-0"> <div className="flex-shrink-0">
<XCircleIcon className="h-5 w-5 text-red-300" aria-hidden="true" /> <XCircleIcon className="h-5 w-5 text-red-300" aria-hidden="true" />

1
src/pages/index.tsx
View File

@@ -54,6 +54,7 @@ const Index: NextPage = () => {
<ErrorCard <ErrorCard
title="An error occurred while performing a lookup." title="An error occurred while performing a lookup."
description={error} description={error}
className="mb-2"
/> />
) : null} ) : null}
{response != null ? <Generic data={response} /> : null} {response != null ? <Generic data={response} /> : null}

5
yarn.lock
View File

@@ -554,6 +554,11 @@ client-only@0.0.1, client-only@^0.0.1:
resolved "https://registry.yarnpkg.com/client-only/-/client-only-0.0.1.tgz#38bba5d403c41ab150bff64a95c85013cf73bca1" resolved "https://registry.yarnpkg.com/client-only/-/client-only-0.0.1.tgz#38bba5d403c41ab150bff64a95c85013cf73bca1"
integrity sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA== integrity sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==
clsx@^2.1.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.1.1.tgz#eed397c9fd8bd882bfb18deab7102049a2f32999"
integrity sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==
color-convert@^2.0.1: color-convert@^2.0.1:
version "2.0.1" version "2.0.1"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-2.0.1.tgz#72d3a68d598c9bdb3af2ad1e84f21d896abd4de3" resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-2.0.1.tgz#72d3a68d598c9bdb3af2ad1e84f21d896abd4de3"