Ready for test.mushroomobserver.org

.github/workflows/ci_rails.yml

@@ -69,6 +69,9 @@ jobs:
       - name: Update translation files
         run: bundle exec rake lang:update
 
+      - name: Compile SASS to CSS
+        run: bundle exec rails dartsass:build
+
       # And finally we can run the test suite
       - name: Run tests
         env:

.gitignore

@@ -47,3 +47,6 @@ public/field_slips
 # DB snapshots are often lying about, don't want them accidentally checked in.
 checkpoint*
 db/checkpoint*
+
+/app/assets/builds/*
+!/app/assets/builds/.keep

Gemfile

@@ -45,15 +45,16 @@ gem("cache_with_locale")
 # solid_queue for jobs
 gem("solid_queue")
 
-# sprockets for asset compilation and versioning
+# sprockets for asset compilation and versioning.
+# Needed by gem bootstrap-sass, but not bootstrap (v4+)
 gem("sprockets-rails")
 # Fix a version problem betw stimulus and sprockets. (not sprockets-rails)
 # Delete this dependency declaration if the issue gets resolved:
 # https://github.com/hotwired/stimulus-rails/issues/108
 gem("sprockets", "~>4.2.1")
 # Compile SCSS for stylesheets
-gem("dartsass-sprockets")
-# Use bootstrap style generator
+gem("dartsass-rails")
+# Bootstrap 3 SCSS and JS
 gem("bootstrap-sass")
 # Use Terser as compressor for JavaScript assets
 gem("terser")

Gemfile.lock

@@ -111,12 +111,9 @@ GEM
     cuprite (0.15)
       capybara (~> 3.0)
       ferrum (~> 0.14.0)
-    dartsass-sprockets (3.1.0)
-      railties (>= 4.0.0)
-      sassc-embedded (~> 1.69)
-      sprockets (> 3.0)
-      sprockets-rails
-      tilt
+    dartsass-rails (0.5.0)
+      railties (>= 6.0.0)
+      sass-embedded (~> 1.63)
     database_cleaner-active_record (2.1.0)
       activerecord (>= 5.a)
       database_cleaner-core (~> 2.0.0)
@@ -143,11 +140,11 @@ GEM
       raabro (~> 1.4)
     globalid (1.2.1)
       activesupport (>= 6.1)
-    google-protobuf (4.26.0-arm64-darwin)
+    google-protobuf (4.26.1-arm64-darwin)
       rake (>= 13)
-    google-protobuf (4.26.0-x86_64-darwin)
+    google-protobuf (4.26.1-x86_64-darwin)
       rake (>= 13)
-    google-protobuf (4.26.0-x86_64-linux)
+    google-protobuf (4.26.1-x86_64-linux)
       rake (>= 13)
     hashdiff (1.1.0)
     i18n (1.14.4)
@@ -299,16 +296,14 @@ GEM
       rubocop (>= 0.90.0)
     ruby-progressbar (1.13.0)
     rubyzip (2.3.2)
-    sass-embedded (1.72.0-arm64-darwin)
+    sass-embedded (1.75.0-arm64-darwin)
       google-protobuf (>= 3.25, < 5.0)
-    sass-embedded (1.72.0-x86_64-darwin)
+    sass-embedded (1.75.0-x86_64-darwin)
       google-protobuf (>= 3.25, < 5.0)
-    sass-embedded (1.72.0-x86_64-linux-gnu)
+    sass-embedded (1.75.0-x86_64-linux-gnu)
       google-protobuf (>= 3.25, < 5.0)
     sassc (2.4.0)
       ffi (~> 1.9)
-    sassc-embedded (1.70.1)
-      sass-embedded (~> 1.70)
     set (1.1.0)
     simplecov (0.22.0)
       docile (~> 1.1)
@@ -343,7 +338,6 @@ GEM
     terser (1.2.0)
       execjs (>= 0.3.0, < 3)
     thor (1.3.1)
-    tilt (2.3.0)
     timeout (0.4.1)
     trilogy (2.7.0)
     ttfunk (1.8.0)
@@ -407,7 +401,7 @@ DEPENDENCIES
   cache_with_locale
   capybara
   cuprite
-  dartsass-sprockets
+  dartsass-rails
   database_cleaner-active_record
   debug
   fastimage

Procfile.dev

@@ -0,0 +1,2 @@
+css: bin/rails dartsass:watch
+solidqueueworker: bundle exec rake solid_queue:start

app/assets/config/manifest.js

@@ -1,11 +1,6 @@
+//= link_tree ../fonts
 //= link_tree ../images
 //= link_tree ../../javascript .js
 //= link_tree ../../../vendor/javascript .js
 
-//= link Admin.css
-//= link Agaricus.css
-//= link Amanita.css
-//= link BlackOnWhite.css
-//= link Cantharellaceae.css
-//= link Hygrocybe.css
-//= link Sudo.css
+//= link_tree ../builds

app/assets/stylesheets/mo/_maps.scss

@@ -37,7 +37,7 @@
   position:    absolute;
   width:       40px;
   height:      40px;
-  background:  image-url("red_pin.png");
+  background:  url("red_pin.png");
 }
 
 .thumbnail-buttons {
@@ -52,7 +52,7 @@
 .minus-button {
   width:       16px;
   height:      16px;
-  background:  image-url("thumbnail-map-buttons.png");
+  background:  url("thumbnail-map-buttons.png");
 }
 
 .minus-button {

app/assets/stylesheets/mo/_utilities.scss

@@ -663,3 +663,11 @@
     overflow-x: scroll
   }
 }
+
+// @source - [@Stephn-R](https://github.com/sass/sass/issues/1395#issuecomment-57483844)
+// @description converts 1 or more characters into a unicode
+// @markup {scss}
+// unicode("e655"); // "\e655"
+@function unicode($str){
+  @return unquote("\"")+unquote(str-insert($str, "\\", 1))+unquote("\"")
+}

app/assets/stylesheets/mushroom_observer.scss

@@ -4,6 +4,12 @@
 @import "bootstrap-sprockets";
 // This map sets Bootstrap's variables with those theme color variables.
 @import "mo/map_theme_vars_to_bootstrap_vars"; // Overwrite bootstrap variables
+// Because bootstrap-sass adds a url(font-path( that doesn't work.
+@font-face {
+  font-family: "Glyphicons Halflings";
+  src: url("bootstrap/glyphicons-halflings-regular.eot");
+  src: url("bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("bootstrap/glyphicons-halflings-regular.woff2") format("woff2"), url("bootstrap/glyphicons-halflings-regular.woff") format("woff"), url("bootstrap/glyphicons-halflings-regular.ttf") format("truetype"), url("bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg")
+}
 @import "bootstrap";
 
 // Now, set custom styles for MO elements.

app/views/controllers/application/app/_head.html.erb

@@ -11,6 +11,7 @@
 
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
 <meta name="viewport" content="width=device-width, initial-scale=1"/>
+<meta charset="utf-8"/>
 <meta name="turbo-refresh-scroll" content="preserve">
 <%= auto_discovery_link_tag(
   :rss, activity_logs_rss_path, { title: :app_rss.l }

bin/dev

@@ -0,0 +1,8 @@
+#!/usr/bin/env sh
+
+if ! gem list foreman -i --silent; then
+  echo "Installing foreman..."
+  gem install foreman
+fi
+
+exec foreman start -f Procfile.dev "$@"

config/initializers/dartsass.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+Rails.application.config.dartsass.builds = {
+  # "mushroom_observer.scss" => "mushroom_observer.css",
+  "Admin.scss" => "Admin.css",
+  "Agaricus.scss" => "Agaricus.css",
+  "Amanita.scss" => "Amanita.css",
+  "BlackOnWhite.scss" => "BlackOnWhite.css",
+  "Cantharellaceae.scss" => "Cantharellaceae.css",
+  "Hygrocybe.scss" => "Hygrocybe.css",
+  "Sudo.scss" => "Sudo.css"
+}
+
+# silence the deprecation warnings for Bootstrap 3, while active
+Rails.application.config.dartsass.build_options << " --quiet-deps"