https://github.com/elcascarudo-dev/navbar-responsibe-tailwindcss-angular9

Menú responsivo con TailWindcss y Angular9 ( Sin JavaScript)
https://github.com/elcascarudo-dev/navbar-responsibe-tailwindcss-angular9

angular9-example tailwindcss

Last synced: 29 days ago
JSON representation

Menú responsivo con TailWindcss y Angular9 ( Sin JavaScript)

• Host: GitHub
• URL: https://github.com/elcascarudo-dev/navbar-responsibe-tailwindcss-angular9
• Owner: elcascarudo-dev
• Created: 2020-05-10T18:25:56.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T18:02:46.000Z (almost 2 years ago)
• Last Synced: 2023-03-07T04:21:51.474Z (almost 2 years ago)
• Topics: angular9-example, tailwindcss
• Language: CSS
• Homepage: https://elcascarudo-dev.github.io/NavBar-responsibe-tailwindcss-angular9/
• Size: 1.17 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 25
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        

# TailwindCssMenu

  

Este proyecto esta construido con los siguientes FrameWorks:

  

* Angular 9

* TailwindCss

* Font-Awesome

  

  

### Descripción

  

Menú responsivo en Angular y CSS. Este ejmple fue tomado del sitio de TailWindCss, se tradue el ejemplo de Vue.JS a Angular9

  

## Compilar para GitHub Pages

  

```

ng build --prod --base-href "https://elcascarudo-dev.github.io/NavBar-responsibe-tailwindcss-angular9/" --output-path=docs

```

  

## Descargar y ejecutar

```

git clone https://github.com/elcascarudo-dev/NavBar-responsibe-tailwindcss-angular9.git

```

```

npm install

```

## Algunos comandos

- Instalación TailWind css

[Instalación TailWind css](https://tailwindcss.com/docs/installation/)

- Compilación TailWindcss

```

npx tailwindcss build tailwind.css -o src/assets/output.css

```

- Compilación de mis CSS en Tail Wind Css

En el 'tailwind.css' agragr los nombres de las clases que deseamos crar

```

@tailwind base;

@tailwind components;

.btn-resp-menu{

	@apply mb-1 block px-2 py-1 text-white font-semibold rounded;

}

.btn-resp-menu:fover {

	@apply bg-gray-800

}

@screen sm {

	.btn-resp-menu {

		@apply mb-0 ml-2

	}

}

@tailwind utilities;

```

y compilar

```

npx tailwindcss build tailwind.css -o src/assets/output.css --watch

```