diff --git a/.gitignore b/.gitignore index 80f191c..5e1d5ae 100644 --- a/.gitignore +++ b/.gitignore @@ -32,3 +32,6 @@ # IDE config /.idea + +/app/assets/builds/* +!/app/assets/builds/.keep diff --git a/Gemfile b/Gemfile index fbedd7c..adde6bd 100644 --- a/Gemfile +++ b/Gemfile @@ -70,3 +70,5 @@ group :test do gem "selenium-webdriver" gem "webdrivers" end + +gem "tailwindcss-rails", "~> 2.0" diff --git a/Gemfile.lock b/Gemfile.lock index e3b5249..c9a543c 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -189,6 +189,8 @@ GEM stimulus-rails (1.2.2) railties (>= 6.0.0) stringio (3.0.8) + tailwindcss-rails (2.0.30-arm64-darwin) + railties (>= 6.0.0) thor (1.2.2) timeout (0.4.0) turbo-rails (1.4.0) @@ -230,6 +232,7 @@ DEPENDENCIES selenium-webdriver sprockets-rails stimulus-rails + tailwindcss-rails (~> 2.0) turbo-rails tzinfo-data web-console diff --git a/Procfile.dev b/Procfile.dev new file mode 100644 index 0000000..023e98a --- /dev/null +++ b/Procfile.dev @@ -0,0 +1,2 @@ +web: bin/rails server -p 3000 +css: bin/rails tailwindcss:watch diff --git a/app/assets/builds/.keep b/app/assets/builds/.keep new file mode 100644 index 0000000..e69de29 diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js index ddd546a..b06fc42 100644 --- a/app/assets/config/manifest.js +++ b/app/assets/config/manifest.js @@ -2,3 +2,4 @@ //= link_directory ../stylesheets .css //= link_tree ../../javascript .js //= link_tree ../../../vendor/javascript .js +//= link_tree ../builds diff --git a/app/assets/stylesheets/application.tailwind.css b/app/assets/stylesheets/application.tailwind.css new file mode 100644 index 0000000..8666d2f --- /dev/null +++ b/app/assets/stylesheets/application.tailwind.css @@ -0,0 +1,13 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +/* + +@layer components { + .btn-primary { + @apply py-2 px-4 bg-blue-200; + } +} + +*/ diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 0435f27..ed75ff6 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -5,12 +5,15 @@ <%= csrf_meta_tags %> <%= csp_meta_tag %> + <%= stylesheet_link_tag "tailwind", "inter-font", "data-turbo-track": "reload" %> <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %> <%= javascript_importmap_tags %> - <%= yield %> +
+ <%= yield %> +
diff --git a/bin/dev b/bin/dev new file mode 100755 index 0000000..74ade16 --- /dev/null +++ b/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 "$@" diff --git a/config/tailwind.config.js b/config/tailwind.config.js new file mode 100644 index 0000000..39364de --- /dev/null +++ b/config/tailwind.config.js @@ -0,0 +1,23 @@ +const defaultTheme = require('tailwindcss/defaultTheme') + +module.exports = { + content: [ + './public/*.html', + './app/helpers/**/*.rb', + './app/javascript/**/*.js', + './app/views/**/*.{erb,haml,html,slim}' + ], + theme: { + extend: { + fontFamily: { + sans: ['Inter var', ...defaultTheme.fontFamily.sans], + }, + }, + }, + plugins: [ + require('@tailwindcss/forms'), + require('@tailwindcss/aspect-ratio'), + require('@tailwindcss/typography'), + require('@tailwindcss/container-queries'), + ] +}