Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/justalever/tailwind-navbar
A completely responsive CSS-only navbar using Tailwind CSS
https://github.com/justalever/tailwind-navbar
Last synced: 12 days ago
JSON representation
A completely responsive CSS-only navbar using Tailwind CSS
- Host: GitHub
- URL: https://github.com/justalever/tailwind-navbar
- Owner: justalever
- Created: 2019-06-02T13:59:31.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-09-07T10:00:44.000Z (over 1 year ago)
- Last Synced: 2024-10-09T13:06:40.517Z (3 months ago)
- Language: JavaScript
- Size: 12.7 KB
- Stars: 76
- Watchers: 4
- Forks: 21
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- tailwindcss-awesome - justalever/tailwind-navbar - A completely responsive CSS-only navbar using Tailwind CSS <br/> (23 stars / 2020-09-18 / 5 commits ) (Running the update / By Popularity)
README
# Let's Build with Tailwind CSS - Responsive Navbar
This project users a [simple starter project](https://github.com/tailwindcss/playground.git) for playing around with Tailwind in a proper PostCSS environment.
To get started:
1. Clone the repository:
```bash
git clone https://github.com/tailwindcss/playground.git tailwindcss-playground
cd tailwindcss-playground
```
2. Install the dependencies:
```bash
# Using npm
npm install
# Using Yarn
yarn
```
3. Start the development server:
```bash
# Using npm
npm run serve
# Using Yarn
yarn run serve
```
Now you should be able to see the project running at localhost:8080.
4. Open `public/index.html` in your editor and start experimenting!
## Building for production
Even though this isn't necessarily a starter kit for a proper project, we've included an example of setting up both [Purgecss](https://www.purgecss.com/) and [cssnano](https://cssnano.co/) to optimize your CSS for production.
To build an optimized version of your CSS, simply run:
```bash
# Using npm
npm run production
# Using Yarn
yarn run production
```
After that's done, check out `./public/build/tailwind.css` to see the optimized output.