3 files changed, 61 insertions, 0 deletions
diff --git a/pydis_site/static/css/content/color.css b/pydis_site/static/css/content/color.css
new file mode 100644
index 00000000..f4801c28
--- /dev/null
+++ b/pydis_site/static/css/content/color.css
@@ -0,0 +1,7 @@
+.content .fa-github {
+    color: black;
+}
+
+.content .fa-github:hover {
+    color: #7289DA;
+}
diff --git a/pydis_site/static/css/content/tag.css b/pydis_site/static/css/content/tag.css
new file mode 100644
index 00000000..79795f9e
--- /dev/null
+++ b/pydis_site/static/css/content/tag.css
@@ -0,0 +1,13 @@
+.content a * {
+    /* This is the original color, but propagated down the chain */
+    /* which allows for elements inside links, such as codeblocks */
+    color: #7289DA;
+}
+
+.content a *:hover {
+    color: dimgray;
+}
+
+span.update-time {
+    text-decoration: black underline dotted;
+}
diff --git a/pydis_site/static/js/content/listing.js b/pydis_site/static/js/content/listing.js
new file mode 100644
index 00000000..4b722632
--- /dev/null
+++ b/pydis_site/static/js/content/listing.js
@@ -0,0 +1,41 @@
+/**
+ * Trim a tag listing to only show a few lines of content.
+ */
+function trimTag() {
+    const containers = document.getElementsByClassName("tag-container");
+    for (const container of containers) {
+        if (container.textContent.startsWith("Contains the following tags:")) {
+            // Tag group, no need to trim
+            continue;
+        }
+
+        // Remove every element after the first two paragraphs
+        while (container.children.length > 2) {
+            container.removeChild(container.lastChild);
+        }
+
+        // Trim down the elements if they are too long
+        const containerLength = container.textContent.length;
+        if (containerLength > 300) {
+            if (containerLength - container.firstChild.textContent.length > 300) {
+                // The first element alone takes up more than 300 characters
+                container.removeChild(container.lastChild);
+            }
+
+            let last = container.lastChild.lastChild;
+            while (container.textContent.length > 300 && container.lastChild.childNodes.length > 0) {
+                last = container.lastChild.lastChild;
+                last.remove();
+            }
+
+            if (container.textContent.length > 300 && (last instanceof HTMLElement && last.tagName !== "CODE")) {
+                // Add back the final element (up to a period if possible)
+                const stop = last.textContent.indexOf(".");
+                last.textContent = last.textContent.slice(0, stop > 0 ? stop + 1: null);
+                container.lastChild.appendChild(last);
+            }
+        }
+    }
+}
+
+trimTag();