feat: remove tailwind

src/pages/404.html

@@ -3,30 +3,20 @@ title: 404
 layout: default
 permalink: /404.html
 ---
-
-{% image './src/assets/img/404.jpg', title, 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
-<div class="text-center w-full">
-  <h2
-    class="m-0 text-4xl font-black leading-tight tracking-normal dark:text-white md:text-6xl mb-4"
-  >
-    {{ title }}
-  </h2>
-  <h3
-    class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6"
-  >
-    What kind of idiots do you have working here?
-  </h3>
-  <div class="flex justify-center">
-    <a
-      href="/"
-      class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline icon--bold font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200"
-    >
-      {% tablericon "receipt-2" "Receipt" %} Skip out on the room service bill
-    </a>
+<div class="four-oh-four__wrapper">
+  {% image './src/assets/img/404.jpg', title, 'image__banner' %}
+  <div class="text-center">
+    <h2 class="page__header">{{ title }}</h2>
+    <h3>What kind of idiots do you have working here?</h3>
+    <div class="flex justify-center">
+      <a href="/" class="pill--button">
+        {% tablericon "receipt-2" "Receipt" %} Skip out on the room service bill
+      </a>
+    </div>
   </div>
+  <hr />
+  {% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
 </div>
-<hr />
-{% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
 <script>
   document.addEventListener('DOMContentLoaded', function () {
     plausible('404', { props: { path: document.location.pathname } })