From 14da1e2340012a5fb69ef3da1594e21606dfb02e Mon Sep 17 00:00:00 2001
From: "Collin M. Barrett" <collinbarrett@users.noreply.github.com>
Date: Mon, 22 Nov 2021 04:26:41 -0600
Subject: [PATCH] =?UTF-8?q?refactor(ui):=20=E2=99=BB=F0=9F=8E=A8=20css=20t?=
 =?UTF-8?q?weaks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../languageCloud/LanguageCloud.module.css         |  7 -------
 web/src/components/languageCloud/LanguageCloud.tsx |  3 +--
 .../maintainerCloud/MaintainerCloud.module.css     |  7 -------
 .../components/maintainerCloud/MaintainerCloud.tsx |  3 +--
 .../softwareCloud/SoftwareCloud.module.css         |  4 ----
 web/src/components/softwareCloud/SoftwareCloud.tsx | 14 +++++++++++---
 .../components/syntaxCloud/SyntaxCloud.module.css  |  7 -------
 web/src/components/syntaxCloud/SyntaxCloud.tsx     |  3 +--
 web/src/components/tagCloud/TagCloud.module.css    |  7 -------
 web/src/components/tagCloud/TagCloud.tsx           |  3 +--
 web/src/hooks/useTablePageSizer.tsx                |  4 ++--
 web/src/index.css                                  | 10 +++++++++-
 12 files changed, 26 insertions(+), 46 deletions(-)
 delete mode 100644 web/src/components/languageCloud/LanguageCloud.module.css
 delete mode 100644 web/src/components/maintainerCloud/MaintainerCloud.module.css
 delete mode 100644 web/src/components/softwareCloud/SoftwareCloud.module.css
 delete mode 100644 web/src/components/syntaxCloud/SyntaxCloud.module.css
 delete mode 100644 web/src/components/tagCloud/TagCloud.module.css

diff --git a/web/src/components/languageCloud/LanguageCloud.module.css b/web/src/components/languageCloud/LanguageCloud.module.css
deleted file mode 100644
index 879bc4070..000000000
--- a/web/src/components/languageCloud/LanguageCloud.module.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.grow {
-  /* allow for 2nd row's tags' bottom border to not be chopped in AllListsTable */
-  max-height: none !important;
-
-  /* leave vertical gap between rows of tags */
-  line-height: 28px;
-}
diff --git a/web/src/components/languageCloud/LanguageCloud.tsx b/web/src/components/languageCloud/LanguageCloud.tsx
index 3c306d495..674d2f9ad 100644
--- a/web/src/components/languageCloud/LanguageCloud.tsx
+++ b/web/src/components/languageCloud/LanguageCloud.tsx
@@ -1,6 +1,5 @@
 import { Tag } from "antd";
 import { Language } from "../../interfaces/Language";
-import styles from "./LanguageCloud.module.css";
 
 interface Props {
   languages: Language[];
@@ -9,7 +8,7 @@ interface Props {
 
 export const LanguageCloud = (props: Props) =>
   props.languages && props.languages.length ? (
-    <div className={styles.grow}>
+    <div>
       {props.showLabel && (
         <h3>{`Language${props.languages.length > 1 ? "s" : ""}:`}</h3>
       )}
diff --git a/web/src/components/maintainerCloud/MaintainerCloud.module.css b/web/src/components/maintainerCloud/MaintainerCloud.module.css
deleted file mode 100644
index 879bc4070..000000000
--- a/web/src/components/maintainerCloud/MaintainerCloud.module.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.grow {
-  /* allow for 2nd row's tags' bottom border to not be chopped in AllListsTable */
-  max-height: none !important;
-
-  /* leave vertical gap between rows of tags */
-  line-height: 28px;
-}
diff --git a/web/src/components/maintainerCloud/MaintainerCloud.tsx b/web/src/components/maintainerCloud/MaintainerCloud.tsx
index 83d10ba7b..5bf1ec8a7 100644
--- a/web/src/components/maintainerCloud/MaintainerCloud.tsx
+++ b/web/src/components/maintainerCloud/MaintainerCloud.tsx
@@ -1,6 +1,5 @@
 import { Tag } from "antd";
 import { Maintainer } from "../../interfaces/Maintainer";
-import styles from "./MaintainerCloud.module.css";
 
 interface Props {
   maintainers: Maintainer[];
@@ -8,7 +7,7 @@ interface Props {
 
 export const MaintainerCloud = (props: Props) =>
   props.maintainers && props.maintainers.length ? (
-    <div className={styles.grow}>
+    <div>
       {props.maintainers.map((m: Maintainer, i: number) =>
         m.url ? (
           <Tag key={i}>
diff --git a/web/src/components/softwareCloud/SoftwareCloud.module.css b/web/src/components/softwareCloud/SoftwareCloud.module.css
deleted file mode 100644
index 5daff62ad..000000000
--- a/web/src/components/softwareCloud/SoftwareCloud.module.css
+++ /dev/null
@@ -1,4 +0,0 @@
-/* allow for 2nd row's bottom border to not be chopped in AllListsTable */
-.grow {
-  max-height: none !important;
-}
diff --git a/web/src/components/softwareCloud/SoftwareCloud.tsx b/web/src/components/softwareCloud/SoftwareCloud.tsx
index ce2e38fcc..db7140aed 100644
--- a/web/src/components/softwareCloud/SoftwareCloud.tsx
+++ b/web/src/components/softwareCloud/SoftwareCloud.tsx
@@ -1,5 +1,4 @@
 import { Software } from "../../interfaces/Software";
-import styles from "./SoftwareCloud.module.css";
 import { SoftwareIcon } from "./SoftwareIcon";
 
 interface Props {
@@ -9,11 +8,20 @@ interface Props {
 
 export const SoftwareCloud = (props: Props) =>
   props.software && props.software.length ? (
-    <div className={styles.grow}>
+    <div>
       {props.showLabel && <h3>{`Software:`}</h3>}
       {props.software.map((s: Software, i: number) =>
         s.homeUrl ? (
-          <a key={i} href={s.homeUrl} target="_blank" rel="noopener noreferrer">
+          <a
+            key={i}
+            href={s.homeUrl}
+            target="_blank"
+            rel="noopener noreferrer"
+            style={{
+              display: "inline-block",
+              height: "20px",
+            }}
+          >
             <SoftwareIcon id={s.id} />
           </a>
         ) : (
diff --git a/web/src/components/syntaxCloud/SyntaxCloud.module.css b/web/src/components/syntaxCloud/SyntaxCloud.module.css
deleted file mode 100644
index 879bc4070..000000000
--- a/web/src/components/syntaxCloud/SyntaxCloud.module.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.grow {
-  /* allow for 2nd row's tags' bottom border to not be chopped in AllListsTable */
-  max-height: none !important;
-
-  /* leave vertical gap between rows of tags */
-  line-height: 28px;
-}
diff --git a/web/src/components/syntaxCloud/SyntaxCloud.tsx b/web/src/components/syntaxCloud/SyntaxCloud.tsx
index 9ccaf06e3..96b279638 100644
--- a/web/src/components/syntaxCloud/SyntaxCloud.tsx
+++ b/web/src/components/syntaxCloud/SyntaxCloud.tsx
@@ -1,6 +1,5 @@
 import { Syntax } from "../../interfaces/Syntax";
 import { SyntaxTag } from "../SyntaxTag";
-import styles from "./SyntaxCloud.module.css";
 
 interface Props {
   syntaxes: Syntax[];
@@ -9,7 +8,7 @@ interface Props {
 
 export const SyntaxCloud = (props: Props) =>
   props.syntaxes && props.syntaxes.length ? (
-    <div className={styles.grow}>
+    <div>
       {props.showLabel && (
         <h3>{`Syntax${props.syntaxes.length > 1 ? "es" : ""}:`}</h3>
       )}
diff --git a/web/src/components/tagCloud/TagCloud.module.css b/web/src/components/tagCloud/TagCloud.module.css
deleted file mode 100644
index 879bc4070..000000000
--- a/web/src/components/tagCloud/TagCloud.module.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.grow {
-  /* allow for 2nd row's tags' bottom border to not be chopped in AllListsTable */
-  max-height: none !important;
-
-  /* leave vertical gap between rows of tags */
-  line-height: 28px;
-}
diff --git a/web/src/components/tagCloud/TagCloud.tsx b/web/src/components/tagCloud/TagCloud.tsx
index f88646357..edb0e2be4 100644
--- a/web/src/components/tagCloud/TagCloud.tsx
+++ b/web/src/components/tagCloud/TagCloud.tsx
@@ -1,6 +1,5 @@
 import { Tag } from "antd";
 import { Tag as TagInterface } from "../../interfaces/Tag";
-import styles from "./TagCloud.module.css";
 
 interface Props {
   tags: TagInterface[];
@@ -9,7 +8,7 @@ interface Props {
 
 export const TagCloud = (props: Props) =>
   props.tags && props.tags.length ? (
-    <div className={styles.grow}>
+    <div>
       {props.showLabel && <h3>{`Tag${props.tags.length > 1 ? "s" : ""}:`}</h3>}
       {props.tags.map((t: TagInterface, i: number) => (
         <Tag key={i} title={t.description}>
diff --git a/web/src/hooks/useTablePageSizer.tsx b/web/src/hooks/useTablePageSizer.tsx
index e94b0efa9..3ef57d6c7 100644
--- a/web/src/hooks/useTablePageSizer.tsx
+++ b/web/src/hooks/useTablePageSizer.tsx
@@ -19,8 +19,8 @@ export const useTablePageSizer = () => {
 const calculateSize = () => ({
   pageSize:
     window.innerWidth < 576
-      ? Math.floor((window.innerHeight - 211) / 49)
-      : Math.floor((window.innerHeight - 187) / 61),
+      ? Math.floor((window.innerHeight - 214) / 51)
+      : Math.floor((window.innerHeight - 187) / 63),
   isNarrowWindow: window.innerWidth < 576 ? true : false,
   isWideWindow: window.innerWidth > 1918 ? true : false,
 });
diff --git a/web/src/index.css b/web/src/index.css
index 64f2203c3..bcb51070b 100644
--- a/web/src/index.css
+++ b/web/src/index.css
@@ -13,10 +13,18 @@ code {
 }
 
 td.ant-table-cell > * {
-  height: 40px;
+  height: 42px;
   overflow: hidden;
 }
 
+td.ant-table-cell {
+  padding: 2px 4px 4px 2px;
+}
+
 td.ant-table-column-sort {
   background: rgb(20, 20, 20);
 }
+
+.ant-tag {
+  margin: 0px 8px 2px 0px;
+}