### Setup ZestUI Rails Application Source: https://zestui.com/docs/installation Command to run the initial setup script for a new ZestUI Rails application. This prepares the development environment and installs necessary dependencies. ```shell ./bin/setup ``` -------------------------------- ### Start ZestUI Development Server Source: https://zestui.com/docs/installation Command to start the development server for a ZestUI-integrated Rails application. Access the running application via http://localhost:3000. ```shell ./bin/dev ``` -------------------------------- ### Run ZestUI Installer Generator Source: https://zestui.com/docs/installation Executes the ZestUI Rails generator to install the framework. The ZESTUI_PATH environment variable specifies the location of the ZestUI folder. ```shell ZESTUI_PATH=../zestui rails g zestui:install ``` -------------------------------- ### Install ZestUI JavaScript Dependencies Source: https://zestui.com/docs/installation Installs required JavaScript packages for ZestUI, including TailwindCSS plugins and gesture libraries, using either Yarn or npm. ```shell # If you are using yarn yarn add @tailwindcss/forms --dev yarn add tailwindcss-animate --dev yarn add tinygesture # if you are using node npm install -D @tailwindcss/forms npm install -D tailwindcss-animate npm install tinygesture ``` -------------------------------- ### Render ZestUI Theme Accent Partial Source: https://zestui.com/docs/installation Renders a partial responsible for applying the selected accent color theme in ZestUI. ```ruby <%= render partial: "shared/zui_theme_accent" %> ``` -------------------------------- ### ZestUI Toast Wrapper and Flash Integration Source: https://zestui.com/docs/installation Includes ZestUI's toast wrapper and a helper to convert flash messages into toasts within your application layout. ```ruby <%= zui 'toast/wrapper' do %> <%= zui_flash_to_toast %> <%= content_for(:toast_wrapper) %> <% end %> ``` -------------------------------- ### Add ZestUI Gem to Rails Project Source: https://zestui.com/docs/installation Installs the ZestUI gem into your Rails application using Bundler. Ensure you have the gem added to your Gemfile. ```ruby bundle add zestui ``` -------------------------------- ### Configure Tailwind CSS with ZestUI Preset Source: https://zestui.com/docs/installation Integrates ZestUI's Tailwind CSS preset into your project's `tailwind.config.js` file, defining content sources and applying presets. ```javascript const zestuiPreset = require("./config/zestui/tailwind/preset"); module.exports = { presets: [zestuiPreset], content: [ "./app/views/**/*.rb", "./app/components/**/*.rb", "./app/views/**/*.html.erb", "./app/helpers/**/*.rb", "./app/assets/stylesheets/**/*.css", "./app/javascript/**/*.js", ], }; ``` -------------------------------- ### Create New Rails App with TailwindCSS Source: https://zestui.com/docs/installation Command to generate a new Rails application pre-configured with TailwindCSS and esbuild, suitable for ZestUI integration. ```shell rails new -a propshaft -j esbuild -c tailwind ``` -------------------------------- ### Import ZestUI CSS in Application Source: https://zestui.com/docs/installation Imports the main ZestUI CSS file into your application's primary Tailwind CSS file, ensuring all ZestUI styles are loaded. ```css @import './zui/index.css'; ``` -------------------------------- ### Configure Body Tag for ZestUI Layout Source: https://zestui.com/docs/installation Applies styling to the `` tag to ensure proper layout and prevent horizontal scrolling within the ZestUI application. ```html class="max-w-[100vw] overflow-x-hidden bg-background text-gray-text" ``` -------------------------------- ### Configure HTML Tag for ZestUI Theming Source: https://zestui.com/docs/installation Adds necessary classes and data attributes to the `` tag in your application layout for ZestUI's dark mode and accent color theming. ```html class="dark" data-zui-accent="jade" data-zui-gray="slate" ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.