Modernize UI with Tailwind

.github/workflows/ruby.yml

@@ -9,7 +9,7 @@ jobs:
     runs-on: ubuntu-latest
     services:
       postgres:
-        image: postgres:11
+        image: postgres:16
         ports:
           - 5432:5432
         env:

.gitignore

@@ -36,3 +36,4 @@
 /node_modules
 
 config/cloudinary.yml/
+/bin/tailwindcss

Gemfile

@@ -18,7 +18,7 @@ gem 'pg', '~> 1.1'
 gem 'puma', '< 7'
 
 # Bundle and transpile JavaScript [https://github.com/rails/jsbundling-rails]
-gem 'jsbundling-rails'
+# gem 'jsbundling-rails'
 
 # Hotwire's SPA-like page accelerator [https://turbo.hotwired.dev]
 gem 'turbo-rails'
@@ -27,7 +27,6 @@ gem 'turbo-rails'
 gem 'stimulus-rails'
 
 # Bundle and process CSS [https://github.com/rails/cssbundling-rails]
-gem 'cssbundling-rails'
 
 # Build JSON APIs with ease [https://github.com/rails/jbuilder]
 gem 'jbuilder'
@@ -48,7 +47,7 @@ gem 'tzinfo-data', platforms: %i[mingw mswin x64_mingw jruby]
 gem 'bootsnap', require: false
 
 # Use Sass to process CSS
-# gem "sassc-rails"
+gem 'sassc-rails'
 
 # Use Active Storage variants [https://guides.rubyonrails.org/active_storage_overview.html#transforming-images]
 gem 'image_processing', '~> 1.2'
@@ -75,6 +74,7 @@ end
 group :test do
   # Use system testing [https://guides.rubyonrails.org/testing.html#system-testing]
   gem 'capybara'
+  gem 'minitest', '~> 5.0'
   gem 'selenium-webdriver'
   gem 'webdrivers'
 end
@@ -83,6 +83,8 @@ gem 'cloudinary'
 gem 'devise'
 gem 'pagy', '~> 6.0'
 gem 'rails_admin', '~> 3.0'
-gem 'sassc-rails'
-gem 'sass-rails', '~> 6.0'
-gem "sassc-rails"
+
+gem 'tailwindcss-rails', '~> 4.4'
+gem 'tailwindcss-ruby', '~> 4.1', '>= 4.1.18'
+
+gem 'importmap-rails', '~> 2.2'

Gemfile.lock

@@ -79,70 +79,78 @@ GEM
     addressable (2.8.5)
       public_suffix (>= 2.0.2, < 6.0)
     ast (2.4.2)
-    aws_cf_signer (0.1.3)
     base64 (0.3.0)
     bcrypt (3.1.19)
-    benchmark (0.4.1)
-    bigdecimal (3.2.3)
+    benchmark (0.5.0)
+    bigdecimal (4.0.1)
     bindex (0.8.1)
-    bootsnap (1.16.0)
+    bootsnap (1.22.0)
       msgpack (~> 1.2)
     builder (3.3.0)
-    byebug (11.1.3)
-    capybara (3.39.2)
+    byebug (13.0.0)
+      reline (>= 0.6.0)
+    capybara (3.40.0)
       addressable
       matrix
       mini_mime (>= 0.1.3)
-      nokogiri (~> 1.8)
+      nokogiri (~> 1.11)
       rack (>= 1.6.0)
       rack-test (>= 0.6.3)
       regexp_parser (>= 1.5, < 3.0)
       xpath (~> 3.2)
-    cloudinary (1.27.0)
-      aws_cf_signer
-      rest-client (>= 2.0.0)
-    concurrent-ruby (1.3.5)
-    connection_pool (2.5.4)
+    cloudinary (2.4.4)
+      faraday (>= 2.0.1, < 3.0.0)
+      faraday-follow_redirects (~> 0.5)
+      faraday-multipart (~> 1.0, >= 1.0.4)
+      ostruct
+    concurrent-ruby (1.3.6)
+    connection_pool (3.0.2)
     crass (1.0.6)
-    cssbundling-rails (1.4.1)
-      railties (>= 6.0.0)
     csv (3.3.0)
-    date (3.4.1)
-    debug (1.9.2)
+    date (3.5.1)
+    debug (1.11.1)
       irb (~> 1.10)
       reline (>= 0.3.8)
-    devise (4.9.4)
+    devise (5.0.0)
       bcrypt (~> 3.0)
       orm_adapter (~> 0.1)
-      railties (>= 4.1.0)
+      railties (>= 7.0)
       responders
       warden (~> 1.2.3)
-    domain_name (0.5.20190701)
-      unf (>= 0.0.5, < 1.0.0)
     drb (2.2.3)
-    erb (5.0.2)
+    erb (6.0.1)
     erubi (1.13.1)
+    faraday (2.14.1)
+      faraday-net_http (>= 2.0, < 3.5)
+      json
+      logger
+    faraday-follow_redirects (0.5.0)
+      faraday (>= 1, < 3)
+    faraday-multipart (1.2.0)
+      multipart-post (~> 2.0)
+    faraday-net_http (3.4.2)
+      net-http (~> 0.5)
     ffi (1.15.5)
     globalid (1.2.1)
       activesupport (>= 6.1)
-    http-accept (1.7.0)
-    http-cookie (1.0.5)
-      domain_name (~> 0.5)
-    i18n (1.14.7)
+    i18n (1.14.8)
       concurrent-ruby (~> 1.0)
-    image_processing (1.12.2)
-      mini_magick (>= 4.9.5, < 5)
+    image_processing (1.14.0)
+      mini_magick (>= 4.9.5, < 6)
       ruby-vips (>= 2.0.17, < 3)
-    io-console (0.8.1)
-    irb (1.15.2)
+    importmap-rails (2.2.3)
+      actionpack (>= 6.0.0)
+      activesupport (>= 6.0.0)
+      railties (>= 6.0.0)
+    io-console (0.8.2)
+    irb (1.17.0)
       pp (>= 0.6.0)
+      prism (>= 1.3.0)
       rdoc (>= 4.0.0)
       reline (>= 0.4.2)
-    jbuilder (2.12.0)
-      actionview (>= 5.0.0)
-      activesupport (>= 5.0.0)
-    jsbundling-rails (1.1.2)
-      railties (>= 6.0.0)
+    jbuilder (2.14.1)
+      actionview (>= 7.0.0)
+      activesupport (>= 7.0.0)
     json (2.7.2)
     kaminari (1.2.2)
       activesupport (>= 4.1.0)
@@ -158,7 +166,7 @@ GEM
     kaminari-core (1.2.2)
     language_server-protocol (3.17.0.3)
     logger (1.7.0)
-    loofah (2.24.1)
+    loofah (2.25.0)
       crass (~> 1.0.2)
       nokogiri (>= 1.12.0)
     mail (2.8.1)
@@ -168,14 +176,14 @@ GEM
       net-smtp
     marcel (1.0.4)
     matrix (0.4.2)
-    mime-types (3.5.0)
-      mime-types-data (~> 3.2015)
-    mime-types-data (3.2023.0808)
     mini_magick (4.12.0)
     mini_mime (1.1.5)
-    minitest (5.25.5)
+    minitest (5.27.0)
     msgpack (1.7.2)
+    multipart-post (2.4.1)
     nested_form (0.3.2)
+    net-http (0.9.1)
+      uri (>= 0.11.1)
     net-imap (0.5.10)
       date
       net-protocol
@@ -185,36 +193,38 @@ GEM
       timeout
     net-smtp (0.5.1)
       net-protocol
-    netrc (0.11.0)
     nio4r (2.7.4)
-    nokogiri (1.18.9-x86_64-darwin)
+    nokogiri (1.19.0-x86_64-darwin)
       racc (~> 1.4)
-    nokogiri (1.18.9-x86_64-linux-gnu)
+    nokogiri (1.19.0-x86_64-linux-gnu)
       racc (~> 1.4)
     orm_adapter (0.5.0)
-    pagy (6.0.4)
+    ostruct (0.6.3)
+    pagy (6.5.0)
     parallel (1.26.3)
     parser (3.3.5.0)
       ast (~> 2.4.1)
       racc
-    pg (1.5.3)
-    pp (0.6.2)
+    pg (1.6.3-x86_64-darwin)
+    pg (1.6.3-x86_64-linux)
+    pp (0.6.3)
       prettyprint
     prettyprint (0.2.0)
-    psych (5.2.6)
+    prism (1.9.0)
+    psych (5.3.1)
       date
       stringio
     public_suffix (5.0.3)
-    puma (6.4.2)
+    puma (6.6.1)
       nio4r (~> 2.0)
     racc (1.8.1)
-    rack (3.2.1)
+    rack (3.2.4)
     rack-session (2.1.1)
       base64 (>= 0.1.0)
       rack (>= 3.0.0)
     rack-test (2.2.0)
       rack (>= 1.3)
-    rackup (2.2.1)
+    rackup (2.3.1)
       rack (>= 3)
     rails (8.0.2.1)
       actioncable (= 8.0.2.1)
@@ -253,24 +263,20 @@ GEM
       thor (~> 1.0, >= 1.2.2)
       zeitwerk (~> 2.6)
     rainbow (3.1.1)
-    rake (13.3.0)
-    rdoc (6.14.2)
+    rake (13.3.1)
+    rdoc (7.2.0)
       erb
       psych (>= 4.0.0)
+      tsort
     redis (4.8.1)
     regexp_parser (2.8.1)
-    reline (0.6.2)
+    reline (0.6.3)
       io-console (~> 0.5)
     responders (3.1.1)
       actionpack (>= 5.2)
       railties (>= 5.2)
-    rest-client (2.1.0)
-      http-accept (>= 1.7.0, < 2.0)
-      http-cookie (>= 1.0.2, < 2.0)
-      mime-types (>= 1.16, < 4.0)
-      netrc (~> 0.8)
     rexml (3.2.6)
-    rubocop (1.66.1)
+    rubocop (1.68.0)
       json (~> 2.3)
       language_server-protocol (>= 3.17.0)
       parallel (~> 1.10)
@@ -282,7 +288,7 @@ GEM
       unicode-display_width (>= 2.4.0, < 3.0)
     rubocop-ast (1.32.3)
       parser (>= 3.3.1.0)
-    rubocop-rails (2.26.2)
+    rubocop-rails (2.29.1)
       activesupport (>= 4.2.0)
       rack (>= 1.1)
       rubocop (>= 1.52.0, < 2.0)
@@ -291,8 +297,6 @@ GEM
     ruby-vips (2.1.4)
       ffi (~> 1.12)
     rubyzip (2.3.2)
-    sass-rails (6.0.0)
-      sassc-rails (~> 2.1, >= 2.1.1)
     sassc (2.4.0)
       ffi (~> 1.9)
     sassc-rails (2.1.2)
@@ -306,30 +310,33 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
-    sprockets (4.2.0)
+    sprockets (4.2.2)
       concurrent-ruby (~> 1.0)
+      logger
       rack (>= 2.2.4, < 4)
     sprockets-rails (3.5.2)
       actionpack (>= 6.1)
       activesupport (>= 6.1)
       sprockets (>= 3.0.0)
-    stimulus-rails (1.2.2)
+    stimulus-rails (1.3.4)
       railties (>= 6.0.0)
-    stringio (3.1.7)
-    thor (1.4.0)
-    tilt (2.2.0)
+    stringio (3.2.0)
+    tailwindcss-rails (4.4.0)
+      railties (>= 7.0.0)
+      tailwindcss-ruby (~> 4.0)
+    tailwindcss-ruby (4.1.18-x86_64-darwin)
+    tailwindcss-ruby (4.1.18-x86_64-linux-gnu)
+    thor (1.5.0)
+    tilt (2.7.0)
     timeout (0.4.3)
-    turbo-rails (2.0.7)
-      actionpack (>= 6.0.0)
-      activejob (>= 6.0.0)
-      railties (>= 6.0.0)
+    tsort (0.2.0)
+    turbo-rails (2.0.23)
+      actionpack (>= 7.1.0)
+      railties (>= 7.1.0)
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
-    unf (0.1.4)
-      unf_ext
-    unf_ext (0.0.8.2)
     unicode-display_width (2.6.0)
-    uri (1.0.3)
+    uri (1.1.1)
     useragent (0.16.11)
     warden (1.2.9)
       rack (>= 2.0.9)
@@ -349,7 +356,7 @@ GEM
     websocket-extensions (0.1.5)
     xpath (3.2.0)
       nokogiri (~> 1.8)
-    zeitwerk (2.7.3)
+    zeitwerk (2.7.4)
 
 PLATFORMS
   x86_64-darwin-19
@@ -362,12 +369,12 @@ DEPENDENCIES
   byebug
   capybara
   cloudinary
-  cssbundling-rails
   debug
   devise
   image_processing (~> 1.2)
+  importmap-rails (~> 2.2)
   jbuilder
-  jsbundling-rails
+  minitest (~> 5.0)
   pagy (~> 6.0)
   pg (~> 1.1)
   puma (< 7)
@@ -376,11 +383,12 @@ DEPENDENCIES
   redis (~> 4.0)
   rubocop
   rubocop-rails
-  sass-rails (~> 6.0)
   sassc-rails
   selenium-webdriver
   sprockets-rails
   stimulus-rails
+  tailwindcss-rails (~> 4.4)
+  tailwindcss-ruby (~> 4.1, >= 4.1.18)
   turbo-rails
   tzinfo-data
   web-console

Procfile.dev

@@ -1,3 +1,2 @@
 web: unset PORT && bin/rails server
-js: yarn build --watch
-css: yarn build:css --watch
+css: bin/rails tailwindcss:watch

README.md

@@ -6,7 +6,7 @@ Adventist Learning Center provides quality education to Syrian and Kurdish Refug
 
 - Ruby
 - Ruby on Rails
-- SCSS
+- Tailwind
 - PostgreSQL
 
 ## Getting Started