https://github.com/filipchalupa/cviceni-eleventy-struktura
https://github.com/filipchalupa/cviceni-eleventy-struktura
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/filipchalupa/cviceni-eleventy-struktura
- Owner: FilipChalupa
- Created: 2021-11-02T18:32:49.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-11-02T18:33:20.000Z (over 3 years ago)
- Last Synced: 2024-12-26T13:24:57.895Z (4 months ago)
- Language: Nunjucks
- Size: 525 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Eleventy
## Zadání
- Spusť si tento projekt postavený na [Eleventy](https://www.11ty.dev/).
### Instalace závislostí
`npm install`
### Produkční sestavení
`npm run build`
### Vývojové sestavení
`npm run dev`
- Koukni do prohlížeče, že se ti stránka při vývojovém sestavení načte.
- Zkontroluj, že se proklikneš na všechny tři podstránky (úvodní, ceník, o nás).
- Na úvodní stránce by měl být obrázek.
- Všechny stránky by měly být drobně nastylované.
- Přidej další podstránku `Kontakt`.
- Do zdrojové složky `src` přidej soubor `kontakt.njk`. Můžeš se inspirovat podle `o-nas.njk`. Pro obsah použij následující HTML:
```html
Kontakt
Otevírací doba
Každý den od 9:00 do 18:00.
Adresa
Václavské náměstí 837/11
Nové Město, Praha 1,
110 00
Česká republika
```
- Odkaz na kontakt přidej do společné navigace v hlavičce.
- Výsledek by měl vypadat takto:
## Bonus
- Doplň do kontaktní stránky odkazy na sociální sítě.
- Do složky `src/obrazky` stáhni ikonku [Instagramu](https://iconmonstr.com/instagram-12-svg/) a [Facebooku](https://iconmonstr.com/facebook-2-svg/).
- Nachystej si soubor `src/casti/socialni-site.njk` podle předlohy.
```html
```
- Nachystanou komponentu zapoj pod adresu na kontaktní stránce.
```njk
Sociální sítě
{% include "socialni-site.njk" %}
```
- Dostyluj komponentu `socialni-site` tak, aby ikonky měly mezi sebou mezeru `0.5rem`. Na hover/focus jim přidej stín `box-shadow: 0 0 0.5rem rgba(#000000, 0.4)`. Styly piš do souboru `src/styly/komponenty/socialni-site.scss`. Nezapomeň na import v `index.scss`.
- Výsledek by měl vypadat takto:
- Proveď produční sestavení a výslednou stránku ve složce `dist` vystav na [Netlify Drop](https://app.netlify.com/drop).