From 129b476977aed71977d5c468d42ab24b581360e8 Mon Sep 17 00:00:00 2001
From: ccd0 <admin@containerchan.org>
Date: Wed, 30 Sep 2015 22:02:54 -0700
Subject: [PATCH] Show party hats in 4chan X catalog view.

---
 src/General/Index.coffee  |  9 ++++++---
 src/General/css/style.css | 19 +++++++++++++++++++
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/src/General/Index.coffee b/src/General/Index.coffee
index 12191621a..e3d7797ce 100644
--- a/src/General/Index.coffee
+++ b/src/General/Index.coffee
@@ -88,9 +88,12 @@ Index =
     $.asap (-> $('.board > .thread > .postContainer', doc) or d.readyState isnt 'loading'), ->
       return unless Main.isThisPageLegit()
       Index.hat = $ '.board > .thread > img:first-child'
-      if Index.hat and Index.nodes
-        for threadRoot in Index.nodes
-          $.prepend threadRoot, Index.hat.cloneNode false
+      if Index.hat
+        if Index.nodes
+          for threadRoot in Index.nodes
+            $.prepend threadRoot, Index.hat.cloneNode false
+        $.addClass doc, 'hats-enabled'
+        $.addStyle ".catalog-thread::after {background-image: url(#{Index.hat.src});}"
 
       board = $ '.board'
       $.replace board, Index.root
diff --git a/src/General/css/style.css b/src/General/css/style.css
index c57a96bf0..bd5f62b84 100755
--- a/src/General/css/style.css
+++ b/src/General/css/style.css
@@ -669,6 +669,7 @@ div[data-checked="false"] > .suboption-list {
   margin: 0 2px 5px;
   word-wrap: break-word;
   vertical-align: top;
+  position: relative;
 }
 .catalog-thread > a {
   flex-shrink: 0;
@@ -750,6 +751,24 @@ div[data-checked="false"] > .suboption-list {
   display: inline-block;
   max-width: 100%;
 }
+:root.hats-enabled .catalog-thread::after {
+  content: '';
+  pointer-events: none;
+  position: absolute;
+  background-size: contain;
+}
+:root.hats-enabled .catalog-small .catalog-thread::after {
+  left: -10px;
+  top: -65px;
+  width: 100px;
+  height: 100px;
+}
+:root.hats-enabled .catalog-large .catalog-thread::after {
+  left: -15px;
+  top: -105px;
+  width: 160px;
+  height: 160px;
+}
 
 /* Announcement Hiding */
 :root.hide-announcement #globalMessage {