Install and setup tailwind
This commit is contained in:
parent
676f416cae
commit
7521ebaa45
10 changed files with 58 additions and 1 deletions
3
.gitignore
vendored
3
.gitignore
vendored
|
@ -33,3 +33,6 @@
|
||||||
|
|
||||||
# Ignore master key for decrypting credentials and more.
|
# Ignore master key for decrypting credentials and more.
|
||||||
/config/master.key
|
/config/master.key
|
||||||
|
|
||||||
|
/app/assets/builds/*
|
||||||
|
!/app/assets/builds/.keep
|
||||||
|
|
2
Gemfile
2
Gemfile
|
@ -70,3 +70,5 @@ group :test do
|
||||||
gem "selenium-webdriver"
|
gem "selenium-webdriver"
|
||||||
gem "webdrivers"
|
gem "webdrivers"
|
||||||
end
|
end
|
||||||
|
|
||||||
|
gem "tailwindcss-rails", "~> 2.0"
|
||||||
|
|
|
@ -177,6 +177,8 @@ GEM
|
||||||
sqlite3 (1.5.4-x86_64-linux)
|
sqlite3 (1.5.4-x86_64-linux)
|
||||||
stimulus-rails (1.1.1)
|
stimulus-rails (1.1.1)
|
||||||
railties (>= 6.0.0)
|
railties (>= 6.0.0)
|
||||||
|
tailwindcss-rails (2.0.21-x86_64-linux)
|
||||||
|
railties (>= 6.0.0)
|
||||||
thor (1.2.1)
|
thor (1.2.1)
|
||||||
timeout (0.3.0)
|
timeout (0.3.0)
|
||||||
turbo-rails (1.3.2)
|
turbo-rails (1.3.2)
|
||||||
|
@ -217,6 +219,7 @@ DEPENDENCIES
|
||||||
sprockets-rails
|
sprockets-rails
|
||||||
sqlite3 (~> 1.4)
|
sqlite3 (~> 1.4)
|
||||||
stimulus-rails
|
stimulus-rails
|
||||||
|
tailwindcss-rails (~> 2.0)
|
||||||
turbo-rails
|
turbo-rails
|
||||||
tzinfo-data
|
tzinfo-data
|
||||||
web-console
|
web-console
|
||||||
|
|
2
Procfile.dev
Normal file
2
Procfile.dev
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
web: bin/rails server -p 3000
|
||||||
|
css: bin/rails tailwindcss:watch
|
0
app/assets/builds/.keep
Normal file
0
app/assets/builds/.keep
Normal file
|
@ -2,3 +2,4 @@
|
||||||
//= link_directory ../stylesheets .css
|
//= link_directory ../stylesheets .css
|
||||||
//= link_tree ../../javascript .js
|
//= link_tree ../../javascript .js
|
||||||
//= link_tree ../../../vendor/javascript .js
|
//= link_tree ../../../vendor/javascript .js
|
||||||
|
//= link_tree ../builds
|
||||||
|
|
13
app/assets/stylesheets/application.tailwind.css
Normal file
13
app/assets/stylesheets/application.tailwind.css
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
||||||
|
|
||||||
|
/*
|
||||||
|
|
||||||
|
@layer components {
|
||||||
|
.btn-primary {
|
||||||
|
@apply py-2 px-4 bg-blue-200;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
*/
|
|
@ -5,12 +5,15 @@
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||||
<%= csrf_meta_tags %>
|
<%= csrf_meta_tags %>
|
||||||
<%= csp_meta_tag %>
|
<%= csp_meta_tag %>
|
||||||
|
<%= stylesheet_link_tag "tailwind", "inter-font", "data-turbo-track": "reload" %>
|
||||||
|
|
||||||
<%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
|
<%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
|
||||||
<%= javascript_importmap_tags %>
|
<%= javascript_importmap_tags %>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<main class="container mx-auto mt-28 px-5 flex">
|
||||||
<%= yield %>
|
<%= yield %>
|
||||||
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
8
bin/dev
Executable file
8
bin/dev
Executable file
|
@ -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 "$@"
|
22
config/tailwind.config.js
Normal file
22
config/tailwind.config.js
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
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'),
|
||||||
|
]
|
||||||
|
}
|
Loading…
Reference in a new issue