HTML & CSS
If you have another environment like PHP you can still use Playbook through the raw CSS and using the copy
HTML button on and Rails kit. See details below:
Add the Playbook NPM Package
yarn add "playbook-ui@stable"
This will allow you to choose what version you want.
yarn install
Import the CSS
@import "playbook-ui/dis/playbook";
@import "playbook-ui/dist/reset";
Optionally you can import the Javascript if you want some of the interactivity
This will add all the Javascript to use the popovers & graphs for example.
import 'playbook-ui/dist/playbook-rails.js';
Navigate to the Rails Kits and copy the raw HTML from the examples
How to include CSS and Javascript Assets
To include CSS and JavaScript files in an HTML document, follow these steps:
- Create a CSS file with the extension ".css" and a JavaScript file with the extension ".js". Place them in a directory on your server, preferably in a subdirectory named "css" or "js" respectively.
- Open the HTML file you want to add the assets to in a text editor.
- To include a CSS file in the HTML document, add the following code to the "head" section of the HTML document:
<link rel="stylesheet" type="text/css" href="path/to/your/css/file.css">
Replace "path/to/your/css/file.css" with the actual path to your CSS file.
- To include a JavaScript file in the HTML document, add the following code to the "head" section of the HTML document:
<script src="path/to/your/js/file.js"></script>
Replace "path/to/your/js/file.js" with the actual path to your JavaScript file.
- Save the HTML file and upload all the files (HTML, CSS, and JavaScript) to your server.
- Test your HTML document in a web browser to ensure that the assets are being loaded correctly.