Rework theme mechanism

pil0u · Dec 4, 2023 · 12bf582 · 12bf582
1 parent 1ece930
commit 12bf582
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 85 deletions.
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
@@ -0,0 +1,2 @@
+/*= require rouge */
+/*= require tailwind */
diff --git a/app/assets/stylesheets/application.tailwind.css b/app/assets/stylesheets/application.tailwind.css
@@ -1,6 +1,5 @@
 @import "fonts";
 @import "font_awesome";
-@import "rouge";
 @import "tailwindcss/base";
 @import "tailwindcss/components";
 
@@ -33,6 +32,10 @@
     @apply last:mb-0
   }
 
+  pre.code-highlighter {
+    @apply px-6 py-4 border border-aoc-gray-darker rounded;
+  }
+
   .code-highlight h1 {
     @apply my-4 border-b border-aoc-gray-darker pb-2 font-semibold text-4xl
   }
@@ -49,7 +52,7 @@
     @apply my-4 relative pt-2 !bg-dark border border-aoc-gray-darker rounded;
   }
 
-  .code-highlight pre::before {
+  pre.code-highlighter::before {
     @apply absolute top-0 right-0 border-b border-l rounded-bl border-aoc-gray-darker px-2 font-semibold;
 
     content: attr(lang);

diff --git a/app/assets/stylesheets/rouge.css b/app/assets/stylesheets/rouge.css
diff --git a/app/assets/stylesheets/rouge.css.erb b/app/assets/stylesheets/rouge.css.erb
@@ -0,0 +1,3 @@
+<%# Only decent ones are: 'base16.dark', 'molokai', 'monokai.sublime' and 'thankful_eyes' %>
+<%# or we could make a custom one ourselves %>
+<%= Rouge::Theme.find("molokai").render(scope: ".code-highlighter") %>
diff --git a/app/components/snippets/box_component.html.erb b/app/components/snippets/box_component.html.erb
@@ -7,7 +7,7 @@
     <% end %>
   </div>
 
-  <pre class="code-highlight break-words text-sm whitespace-normal" data-language="<%= @snippet.language %>">
+  <pre class="snippet break-words text-sm whitespace-normal" data-language="<%= @snippet.language %>">
     <%= raw render_markdown @snippet.code, default_language: @snippet.language %>
   </pre>
 

diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -8,7 +8,7 @@
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
 
-    <%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %>
+    <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
     <%= javascript_importmap_tags %>
   </head>