Merge pull request #651 from sul-dlss/no-sass

Replace deprecated libsass with dart sass

.gitignore

@@ -34,3 +34,6 @@ config/environments/*.local.yml
 /yarn-error.log
 yarn-debug.log*
 .yarn-integrity
+
+/app/assets/builds/*
+!/app/assets/builds/.keep

Gemfile

@@ -29,10 +29,6 @@ gem "stimulus-rails"
 # Build JSON APIs with ease [https://github.com/rails/jbuilder]
 gem "jbuilder"
 
-# Use SCSS for stylesheets
-gem 'sass-rails', '>= 6.0'
-# Use Uglifier as compressor for JavaScript assets
-gem 'uglifier', '>= 2.7.2'
 # A gem for simple rails environment specific config
 gem 'config'
 
@@ -51,11 +47,9 @@ gem 'okcomputer'
 gem 'mods_display', '~> 1.1'
 gem 'htmlentities'
 gem 'dor-rights-auth', '~> 1.6'
-gem 'bootstrap'
 gem 'faraday'
 gem 'addressable'
 gem 'tophat'
-gem 'sul_styles', '~> 0.6'
 
 # Use recaptcha gem to prevent robots spamming the feedback form
 gem 'recaptcha'
@@ -94,9 +88,6 @@ group :development, :test do
   gem 'rubocop-rails', require: false
   gem 'rubocop-rspec', require: false
 
-  # scss_lint will test the scss files to enfoce styles
-  gem 'scss_lint', require: false
-
   gem 'simplecov', require: false
 end
 
@@ -109,3 +100,5 @@ group :deployment do
   gem 'capistrano-shared_configs'
   gem 'dlss-capistrano'
 end
+
+gem "cssbundling-rails", "~> 1.1"

Gemfile.lock

@@ -81,15 +81,9 @@ GEM
     airbrussh (1.4.1)
       sshkit (>= 1.6.1, != 1.7.0)
     ast (2.4.2)
-    autoprefixer-rails (10.4.7.0)
-      execjs (~> 2)
     bindex (0.8.1)
     bootsnap (1.15.0)
       msgpack (~> 1.2)
-    bootstrap (5.2.3)
-      autoprefixer-rails (>= 9.1.0)
-      popper_js (>= 2.11.6, < 3)
-      sassc-rails (>= 2.0.0)
     builder (3.2.4)
     bundler-audit (0.9.1)
       bundler (>= 1.2.0, < 3)
@@ -128,6 +122,8 @@ GEM
       deep_merge (~> 1.2, >= 1.2.1)
       dry-validation (~> 1.0, >= 1.0.0)
     crass (1.0.6)
+    cssbundling-rails (1.1.2)
+      railties (>= 6.0.0)
     date (3.3.3)
     debug (1.7.1)
       irb (>= 1.5.0)
@@ -177,12 +173,10 @@ GEM
     edtf (3.1.0)
       activesupport (>= 3.0, < 8.0)
     erubi (1.12.0)
-    execjs (2.8.1)
     faraday (2.7.2)
       faraday-net_http (>= 2.0, < 3.1)
       ruby2_keywords (>= 0.0.4)
     faraday-net_http (3.0.2)
-    ffi (1.15.5)
     globalid (1.0.0)
       activesupport (>= 5.0)
     honeybadger (5.0.2)
@@ -250,7 +244,6 @@ GEM
     parallel (1.22.1)
     parser (3.2.0.0)
       ast (~> 2.4.1)
-    popper_js (2.11.6)
     public_suffix (5.0.1)
     puma (5.6.5)
       nio4r (~> 2.0)
@@ -275,7 +268,6 @@ GEM
     rails-dom-testing (2.0.3)
       activesupport (>= 4.2.0)
       nokogiri (>= 1.6)
-    rails-file-icons (0.0.1)
     rails-html-sanitizer (1.4.4)
       loofah (~> 2.19, >= 2.19.1)
     railties (7.0.4)
@@ -287,9 +279,6 @@ GEM
       zeitwerk (~> 2.5)
     rainbow (3.1.1)
     rake (13.0.6)
-    rb-fsevent (0.11.2)
-    rb-inotify (0.10.1)
-      ffi (~> 1.0)
     recaptcha (5.12.3)
       json
     regexp_parser (2.6.1)
@@ -340,23 +329,6 @@ GEM
     ruby-progressbar (1.11.0)
     ruby2_keywords (0.0.5)
     rubyzip (2.3.2)
-    sass (3.7.4)
-      sass-listen (~> 4.0.0)
-    sass-listen (4.0.0)
-      rb-fsevent (~> 0.9, >= 0.9.4)
-      rb-inotify (~> 0.9, >= 0.9.7)
-    sass-rails (6.0.0)
-      sassc-rails (~> 2.1, >= 2.1.1)
-    sassc (2.4.0)
-      ffi (~> 1.9)
-    sassc-rails (2.1.2)
-      railties (>= 4.0.0)
-      sassc (>= 2.0)
-      sprockets (> 3.0)
-      sprockets-rails
-      tilt
-    scss_lint (0.59.0)
-      sass (~> 3.5, >= 3.5.5)
     selenium-webdriver (4.7.1)
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
@@ -385,10 +357,7 @@ GEM
       mods (~> 3.0, >= 3.0.3)
     stimulus-rails (1.2.1)
       railties (>= 6.0.0)
-    sul_styles (0.7.0)
-      rails (>= 4.1, < 8)
     thor (1.2.1)
-    tilt (2.0.11)
     timeout (0.3.1)
     tophat (2.3.1)
       actionpack (>= 3.0.0)
@@ -398,8 +367,6 @@ GEM
       railties (>= 6.0.0)
     tzinfo (2.0.5)
       concurrent-ruby (~> 1.0)
-    uglifier (4.2.0)
-      execjs (>= 0.3.0, < 3)
     unicode-display_width (2.4.2)
     view_component (2.82.0)
       activesupport (>= 5.2.0, < 8.0)
@@ -429,7 +396,6 @@ PLATFORMS
 DEPENDENCIES
   addressable
   bootsnap (>= 1.1.0)
-  bootstrap
   cancancan
   capistrano (~> 3.0)
   capistrano-bundler
@@ -438,6 +404,7 @@ DEPENDENCIES
   capistrano-shared_configs
   capybara
   config
+  cssbundling-rails (~> 1.1)
   debug
   dlss-capistrano
   dor-rights-auth (~> 1.6)
@@ -452,25 +419,20 @@ DEPENDENCIES
   okcomputer
   puma (~> 5.0)
   rails (~> 7.0.0)
-  rails-file-icons
   recaptcha
   rspec-rails (~> 6.0)
   rubocop
   rubocop-performance
   rubocop-rails
   rubocop-rspec
-  sass-rails (>= 6.0)
-  scss_lint
   selenium-webdriver (!= 3.13.0)
   simplecov
   sprockets-rails
   sqlite3 (~> 1.4)
   stimulus-rails
-  sul_styles (~> 0.6)
   tophat
   turbo-rails
   tzinfo-data
-  uglifier (>= 2.7.2)
   web-console (>= 3.3.0)
   webdrivers
 

Procfile.dev

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

README.md

@@ -12,7 +12,7 @@ Please create a github release before deploying.
 
 ## Requirements
 
-1. Ruby (2.2.5 or greater)
+1. Ruby (3.1 or greater)
 2. [bundler](http://bundler.io/) gem
 
 ## Installation
@@ -28,7 +28,7 @@ Move into the app and install dependencies
 
 Start the development server
 
-    $ rails s
+    $ bin/dev
 
 ## Configuring
 

app/assets/config/manifest.js

@@ -1,5 +1,4 @@
 //= link_tree ../images
-//= link application.css
-//= link print.css
 //= link_tree ../../javascript .js
 //= link_tree ../../../vendor/javascript .js
+//= link_tree ../builds

app/assets/stylesheets/application.scss → app/assets/stylesheets/application.sass.scss

@@ -5,7 +5,7 @@
 @import 'searchworks-mixins';
 
 @import 'bootstrap-variables';
-@import 'bootstrap';
+@import 'bootstrap/scss/bootstrap';
 @import 'bootstrap-mixins';
 @import 'bootstrap-overrides';
 

app/assets/stylesheets/deja-vu-font.scss

@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'dejavu_sansextralight';
-  src: font-url('DejaVuSans-ExtraLight-webfont.eot');
-  src: font-url('DejaVuSans-ExtraLight-webfont.eot?#iefix') format('embedded-opentype'),
-       font-url('DejaVuSans-ExtraLight-webfont.woff') format('woff'),
-       font-url('DejaVuSans-ExtraLight-webfont.ttf') format('truetype'),
-       font-url('DejaVuSans-ExtraLight-webfont.svg#dejavu_sansextralight') format('svg');
+  src: url('DejaVuSans-ExtraLight-webfont.eot');
+  src: url('DejaVuSans-ExtraLight-webfont.eot?#iefix') format('embedded-opentype'),
+       url('DejaVuSans-ExtraLight-webfont.woff') format('woff'),
+       url('DejaVuSans-ExtraLight-webfont.ttf') format('truetype'),
+       url('DejaVuSans-ExtraLight-webfont.svg#dejavu_sansextralight') format('svg');
   font-weight: normal;
   font-style: normal;
 }

app/assets/stylesheets/print.scss

@@ -4,7 +4,7 @@
 @import 'searchworks-mixins';
 @import 'bootstrap-variables';
 
-@import 'bootstrap';
+@import 'bootstrap/scss/bootstrap';
 
 @import 'bootstrap-mixins';
 

app/assets/stylesheets/sul-styles.scss

@@ -0,0 +1,4 @@
+@import 'sul-styles/su_web_colors';
+@import 'sul-styles/su_primary_colors';
+@import 'sul-styles/variables';
+@import 'sul-styles/sul_footer';

app/assets/stylesheets/sul-styles/su_primary_colors.scss

@@ -0,0 +1,34 @@
+/*
+  Stanford Primary Colors
+  from https://identity.stanford.edu/overview/color.html
+*/
+
+// Primary Palette
+// $color-cardinal-red: #8c1515;
+// $color-cool-gray: #4d4f53;
+$color-black: #000;
+
+// Neutral Color Palette
+// $color-pantone-467: #d2c295;
+// $color-pantone-465: #b3995d;
+// $color-pantone-403: #928b81;
+$color-pantone-401: #b6b1a9;
+// $color-pantone-7527: #dad7cb;
+// $color-pantone-5665: #c7d1c5;
+// $color-pantone-445: #4d5357;
+// $color-pantone-405: #5f574f;
+
+// Deep Tone Color Palette
+// $color-pantone-1817: #5e3032;
+// $color-pantone-7526: #8d3c1e;
+// $color-pantone-3165: #00505c;
+// $color-pantone-561: #175e54;
+// $color-pantone-262: #53284f;
+
+// Bright Color Palette
+// $color-pantone-2925: #0098db;
+// $color-pantone-3145: #007c92;
+// $color-pantone-334: #009b76;
+// $color-pantone-7511: #b26f16;
+// $color-pantone-144: #e98300;
+// $color-pantone-124: #eaab00;

app/assets/stylesheets/sul-styles/su_web_colors.scss

@@ -0,0 +1,34 @@
+/*
+  Stanford Web Colors
+  from https://identity.stanford.edu/web-toolkit/color.html
+*/
+
+// Red
+$color-cardinal-red: #8c1515;
+// $color-dark-red: #820000;
+
+// Black
+$color-blackish: #2e2d29;
+// $color-black-80: #585754;
+
+// Warm Gray
+$color-gray: #3f3c30;
+// $color-gray-90: #565347;
+$color-gray-60: #8a887d;
+
+// Sandstone
+// $color-sandstone: #ddcf99;
+// $color-sandstone-50: #eee6cb;
+// $color-sandstone-35: #f3efd8;
+// $color-sandstone-25: #f6f3e5;
+// $color-sandstone-20: #f8f6ea;
+
+// Beige
+// $color-beige: #9d9573;
+// $color-beige-85: #aca68d;
+// $color-beige-60: #c4bfa9;
+$color-beige-40: #d5d0c0;
+$color-beige-30: #e3dfd5;
+$color-beige-20: #e9e6df;
+$color-beige-10: #f2f1eb;
+$color-beige-05: #fbfbf9;