Remove card classes, improve padding/margin spacing, styling general

src/components/common/Property.tsx

@@ -17,7 +17,7 @@ const Property: FunctionComponent<PropertyProps> = ({
 }) => {
   return (
     <>
-      <dt className={titleClass}>{title}:</dt>
+      <dt className={classNames("font-medium", titleClass)}>{title}:</dt>
       <dd className={classNames("mt-2 mb-2 ml-6", valueClass)}>{children}</dd>
     </>
   );

src/components/lookup/DomainCard.tsx

@@ -11,11 +11,12 @@ export type DomainProps = {
 
 const DomainCard: FunctionComponent<DomainProps> = ({ data }: DomainProps) => {
   return (
-    <div className="card">
-      <div className="card-header">
-        {data.ldhName ?? data.unicodeName} ({data.handle})
+    <div className="mb-4 bg-zinc-800">
+      <div className="bg-zinc-700 p-2 pl-5">
+        <span className="font-mono">{data.ldhName ?? data.unicodeName}</span> (
+        {data.handle})
       </div>
-      <div className="card-body">
+      <div className="p-2 px-4">
         <dl>
           {data.unicodeName != undefined ? (
             <Property title="Unicode Name">{data.unicodeName}</Property>

src/components/lookup/Generic.tsx

@@ -28,10 +28,8 @@ const Generic: FunctionComponent<ObjectProps> = ({ data }: ObjectProps) => {
     case "nameserver":
     default:
       return (
-        <div className="card my-2">
-          <div className="card-header">
-            Not implemented. (<pre>{data.objectClassName ?? "null"}</pre>)
-          </div>
+        <div className="my-2">
+          Not implemented. (<pre>{data.objectClassName ?? "null"}</pre>)
         </div>
       );
   }

src/styles/globals.scss

@@ -14,16 +14,6 @@ body {
   @apply bg-zinc-900 text-white;
 }
 
-.card {
-  @apply bg-zinc-800 mb-4;
-  .card-header {
-    @apply bg-zinc-700;
-  }
-}
-
-.navbar {
-  @apply bg-zinc-850;
-}
 
 dl {
   margin: 0;