Can you help me on how to install metronic tailwind theme on rails?
I'm having problems because there is no installation file. Can you help me?
Replies (3)
Hi
Open Metronic Tailwind HTML folder
/metronic-v9.0.4/metronic-tailwind-html/webpack.config.js Copy the tailwind.config.js file from the Metronic HTML folder.
Add the following to your Rails file app/javascript/stylesheets/application.scss file:
<pre> @import "tailwindcss/base"; @import "tailwindcss/components"; @import "tailwindcss/utilities"; </pre>- You’ll need to copy the relevant CSS and assets from the Metronic Tailwind theme into your Rails project. From here: /metronic-v9.0.4/metronic-tailwind-html/dist/assets
Place the Metronic CSS files into app/javascript/stylesheets/ or include them in the application.scss file. Metronic provides a compiled Tailwind CSS file in dist/assets. Move any JavaScript or other assets (like images or fonts) into appropriate folders within app/javascript/ or app/assets/.
- Configure Layout Files Update your Rails views (app/views/layouts/application.html.erb) to include the correct HTML structure from Metronic’s theme. Copy the HTML layout and paste it inside your Rails layout files. Properly link the CSS and JS files by using Rails’ asset pipeline.
Hi,
Please note that there aren't any installation docs for Rails available at the moment.
In the meantime, are you able to create a new Rails project on your own? You can follow this guide to get started:
Thank you
Hi
At the moment, there are no installation docs for Rails yet. Here’s a general process you can use:
-
Extract the contents of the theme files locally.
-
First, you must set up Tailwind in your Rails app. Follow these steps to create Rails project.
Run the following command in your Rails application folder to install Tailwind:
<pre> rails new myapp cd myapp rails webpacker:install </pre>Copy the tailwind.config.js file from the Metronic HTML folder.
Add the following to your app/javascript/stylesheets/application.scss file:
@import "tailwindcss/base"; @import "tailwindcss/components"; @import "tailwindcss/utilities";
- You’ll need to copy the relevant CSS and assets from the Metronic Tailwind theme into your Rails project.
Place the Metronic CSS files into app/javascript/stylesheets/ or include them in the application.scss file. Metronic provides a compiled Tailwind CSS file in dist/assets. Move any JavaScript or other assets (like images or fonts) into appropriate folders within app/javascript/ or app/assets/.
- Configure Layout Files Update your Rails views (app/views/layouts/application.html.erb) to include the correct HTML structure from Metronic’s theme. Copy the HTML layout and paste it inside your Rails layout files. Properly link the CSS and JS files by using Rails’ asset pipeline.