Change how CSS is loaded

app/controllers/application_controller.rb

@@ -19,6 +19,7 @@ class ApplicationController < ActionController::Base
   helper_method :current_session
   helper_method :current_flavour
   helper_method :current_skin
+  helper_method :current_theme
   helper_method :single_user_mode?
   helper_method :use_seamless_external_login?
   helper_method :omniauth_only?

app/controllers/concerns/theming_concern.rb

@@ -18,6 +18,11 @@ def current_skin
     [current_user&.setting_skin, Setting.skin, 'default'].find { |skin| skins.include?(skin) }
   end
 
+  def current_theme
+    # TODO: simplify that thing
+    "skins/#{current_flavour}/#{current_skin}/common"
+  end
+
   def valid_pack_data?(data, pack_name)
     data['pack'].is_a?(Hash) && data['pack'][pack_name].present?
   end
@@ -51,7 +56,7 @@ def pack(data, pack_name, skin)
 
     if skin != 'default' && data['skin'][skin]
       pack_data[:skin] = skin if data['skin'][skin].include?(pack_name)
-    elsif data['pack'][pack_name]['stylesheet']
+    else
       pack_data[:skin] = 'default'
     end
 

app/javascript/flavours/glitch/theme.yml

@@ -13,12 +13,8 @@ pack:
       - flavours/glitch/async/compose
       - flavours/glitch/async/home_timeline
       - flavours/glitch/async/notifications
-  inert:
-    filename: inert.js
-    stylesheet: true
-  mailer:
-    filename: mailer.js
-    stylesheet: true
+  inert: inert.js
+  mailer: mailer.js
   public: public.tsx
   settings: public.tsx
   sign_up: sign_up.js

app/javascript/flavours/vanilla/theme.yml

@@ -13,12 +13,8 @@ pack:
       - features/compose
       - features/home_timeline
       - features/notifications
-  inert:
-    filename: inert.js
-    stylesheet: true
-  mailer:
-    filename: mailer.js
-    stylesheet: true
+  inert: inert.js
+  mailer: mailer.js
   public: public.tsx
   settings: public.tsx
   sign_up: sign_up.js

app/javascript/skins/glitch/default/common.scss

@@ -0,0 +1 @@
+@import 'flavours/glitch/styles/application';

app/javascript/skins/vanilla/default/common.scss

@@ -0,0 +1 @@
+@import 'styles/application';

app/views/layouts/_theme.html.haml

@@ -1,10 +1,5 @@
 - if theme && theme[:pack]
   - pack_path = "flavours/#{theme[:flavour]}/#{theme[:pack]}"
   = javascript_pack_tag pack_path, crossorigin: 'anonymous'
-  - if theme[:skin]
-    - if !theme[:flavour] || theme[:skin] == 'default'
-      = stylesheet_pack_tag pack_path, media: 'all', crossorigin: 'anonymous'
-    - else
-      = stylesheet_pack_tag "skins/#{theme[:flavour]}/#{theme[:skin]}/#{theme[:pack]}", media: 'all', crossorigin: 'anonymous'
   - theme[:preload]&.each do |link|
     %link{ href: asset_pack_path("#{link}.js"), crossorigin: 'anonymous', rel: 'preload', as: 'script' }/

app/views/layouts/application.html.haml

@@ -26,11 +26,13 @@
 
     %title= html_title
 
-    = javascript_pack_tag 'common', crossorigin: 'anonymous'
-
+    = stylesheet_pack_tag 'common', media: 'all', crossorigin: 'anonymous'
+    = stylesheet_pack_tag current_theme, media: 'all', crossorigin: 'anonymous'
     -# Needed for the wicg-inert polyfill. It needs to be on it's own <style> tag, with this `id`
     = stylesheet_pack_tag 'flavours/vanilla/inert', media: 'all', id: 'inert-style'
 
+    = javascript_pack_tag 'common', crossorigin: 'anonymous'
+
     - if @theme
       - if @theme[:supported_locales].include? I18n.locale.to_s
         = preload_pack_asset "locales/#{@theme[:flavour]}/#{I18n.locale}-json.js"
@@ -39,13 +41,13 @@
     = csrf_meta_tags unless skip_csrf_meta_tags?
     %meta{ name: 'style-nonce', content: request.content_security_policy_nonce }
 
+    = stylesheet_link_tag custom_css_path, skip_pipeline: true, host: root_url, media: 'all'
+
     = yield :header_tags
 
     -# These must come after :header_tags to ensure our initial state has been defined.
     = render partial: 'layouts/theme', object: @theme
 
-    = stylesheet_link_tag custom_css_path, skip_pipeline: true, host: root_url, media: 'all'
-
   %body{ class: body_classes }
     = content_for?(:content) ? yield(:content) : yield