From 250f904946ec3debe5cd95cb6cdc9d5ae31373f0 Mon Sep 17 00:00:00 2001 From: LUXEY Adrien Date: Tue, 2 Feb 2021 22:36:36 +0100 Subject: branches et canopee --- lab/README.md | 32 ----- lab/assets/css/branches-et-canopee.css | 111 +++++++++++++++++ lab/assets/css/deuxfleurs-chato-fullwidth.css | 132 --------------------- lab/assets/css/deuxfleurs-chato.css | 111 ----------------- lab/branches-et-canopee.html | 121 +++++++++++++++++++ .../branches-et-canopee/branches-et-canopee.png | Bin 0 -> 3980572 bytes .../branches-et-canopee/branches-et-canopee.xcf | Bin 0 -> 14167250 bytes .../branches-et-canopee_commentaire-ronce.png | Bin 0 -> 1041783 bytes lab/gimp/idee_adrien.png | Bin 3980572 -> 0 bytes lab/gimp/idee_adrien.xcf | Bin 14167250 -> 0 bytes lab/gimp/idee_adrien_commentaire_ronce.png | Bin 1041783 -> 0 bytes lab/index-fullwidth.html | 122 ------------------- lab/index.html | 123 ------------------- lab/notes/framework_html.md | 43 ------- lab/parallax.html | 70 +++++++++++ lab/sandbox/assets | 1 - lab/sandbox/parallax.html | 70 ----------- 17 files changed, 302 insertions(+), 634 deletions(-) delete mode 100644 lab/README.md create mode 100644 lab/assets/css/branches-et-canopee.css delete mode 100644 lab/assets/css/deuxfleurs-chato-fullwidth.css delete mode 100644 lab/assets/css/deuxfleurs-chato.css create mode 100644 lab/branches-et-canopee.html create mode 100644 lab/gimp/branches-et-canopee/branches-et-canopee.png create mode 100644 lab/gimp/branches-et-canopee/branches-et-canopee.xcf create mode 100644 lab/gimp/branches-et-canopee/branches-et-canopee_commentaire-ronce.png delete mode 100644 lab/gimp/idee_adrien.png delete mode 100644 lab/gimp/idee_adrien.xcf delete mode 100644 lab/gimp/idee_adrien_commentaire_ronce.png delete mode 100644 lab/index-fullwidth.html delete mode 100644 lab/index.html delete mode 100644 lab/notes/framework_html.md create mode 100644 lab/parallax.html delete mode 120000 lab/sandbox/assets delete mode 100644 lab/sandbox/parallax.html (limited to 'lab') diff --git a/lab/README.md b/lab/README.md deleted file mode 100644 index 7ee5c11..0000000 --- a/lab/README.md +++ /dev/null @@ -1,32 +0,0 @@ -# Laboratoire du futur site web de Deuxfleurs - -## Objectifs techniques - -* Responsive mobile-first design. -* [Media queries CSS](https://www.w3schools.com/css/css_rwd_mediaqueries.asp) : Des images envoyées adaptées à la taille des viewports. -* Pas besoin de Javascript : Le CSS3 ça déchire, on peut faire des infobulles, des animations, de la parallax. (Navigateurs compatibles depuis 7 ans ou plus.) - -## Idées graphiques - -* Des bouts de branches et de canopée qui défilent lors du scroll, contenant des éléments de texte ou autre contenu. -* Un header avec des onglets sur PC et un « menu-sandwich » sur le côté sur téléphone. -* Exploiter l'illustration au maximum. En la laissant fixée en fond de page tandis que les éléments graphiques défilent ? - - -## Inspirations - -* [MDN - Création de tooltips et remarques sur l'accessibilité du contenu](https://developer.mozilla.org/en-US/docs/Web/CSS/::after#tooltips) - - On peut faire tout ce qu'il faut avec CSS3 ! - - Néanmoins, *rendre un site accessible sans outils a l'air compliqué*. - -* [W3C Semantic HTML](https://www.w3schools.com/html/html5_semantic_elements.asp) - - Utiliser des bannières qui donnent du sens au contenu. - -* [Semantic CSS] (https://adamwathan.me/css-utility-classes-and-separation-of-concerns/) - - Le fait de ne pas donner d'éléments de graphisme dans notre markup HTML, mais seulement dans le CSS. Par exemple, mettre une classe "text-center" à un <p> est considéré une mauvaise pratique. - - diff --git a/lab/assets/css/branches-et-canopee.css b/lab/assets/css/branches-et-canopee.css new file mode 100644 index 0000000..1e34f0c --- /dev/null +++ b/lab/assets/css/branches-et-canopee.css @@ -0,0 +1,111 @@ +@import 'normalize.css'; +@import 'chota.min.css'; + +/* font-size: + * HTML font size is 16px on most browsers, sometimes 14px. + * Chota sets `font-size: 62.5%;`, that is 10px on most browsers. + */ + +:root { + /* Blanc cassé (offset autour de #main-page) */ + --bg-color: #f4f4f4; + /* Bleu turquoise du ciel au lion */ + --bg-secondary-color: #cafaef; + /* Gris violet du sol */ + --bg-ternary-color: #c7c9e2; + --bg-canopee-color: #151a05; + --color-canopee: #a0c43c; + --bg-branche-color: #381e02; + --color-primary: #14854F; + --color-text-light: #fafafa; + --color-lightGrey: #d2d6dd; + --color-grey: #747681; + --color-darkGrey: #3f4144; + --color-error: #d43939; + --color-success: #28bd14; + --grid-maxWidth: 120rem; + --grid-gutter: 0rem; + --font-size: 1.6rem; + --font-color: #333333; + --font-family-sans: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next", + "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", + "Droid Sans", "Helvetica Neue", sans-serif; + --font-family-mono: monaco, "Consolas", "Lucida Console", monospace; +} + +body { + background-color: var(--bg-color); +} + +#main-page { + background-color: var(--bg-secondary-color); + padding: 0; +} + +header { + margin-bottom: 4rem; +} + +header>nav { + background-color: var(--bg-canopee-color); + padding-left: 1rem; + padding-right: 1rem; +} + +#logo { + font-size: 3.2rem; + color: var(--color-text-light); +} + +section div { + padding-left: 4rem; + padding-right: 4rem; + margin-top: 2rem; +} + +section p { + padding-left: 2rem; + padding-right: 2rem; + font-size: 2rem; +} + +section .canopee { + border-radius: 3rem; + background-color: var(--bg-canopee-color); + color: var(--color-canopee); + margin-bottom: 4rem; +} + +section .canopee.left { + margin-left: 0; + padding-left: 6rem; + border-top-left-radius: 0rem; + border-bottom-left-radius: 0rem; +} + +section .canopee.right { + margin-right: 0; + border-top-right-radius: 0rem; + border-bottom-right-radius: 0rem; +} + +section .canopee p { + font-size: 1.6rem; +} + +section .branche { + background-color: var(--bg-branche-color); + color: var(--color-text-light); + padding-bottom: 4rem; + padding-top: 4rem; +} + +section .branche p { + font-size: 2.6rem; + margin: 0; +} + +footer { + padding: 4rem; + border-top: 1px solid var(--bg-color); +} \ No newline at end of file diff --git a/lab/assets/css/deuxfleurs-chato-fullwidth.css b/lab/assets/css/deuxfleurs-chato-fullwidth.css deleted file mode 100644 index dbec9b6..0000000 --- a/lab/assets/css/deuxfleurs-chato-fullwidth.css +++ /dev/null @@ -1,132 +0,0 @@ -@import 'normalize.css'; -@import 'chota.min.css'; - -/* font-size: - * HTML font size is 16px on most browsers, sometimes 14px. - * Chota sets `font-size: 62.5%;`, that is 10px on most browsers. - */ - -:root { - /* Blanc cassé (offset autour de #main-page) */ - --bg-color: #f4f4f4; - /* Bleu turquoise du ciel au lion */ - --bg-secondary-color: #cafaef; - /* Gris violet du sol */ - --bg-ternary-color: #c7c9e2; - --bg-canopee-color: #151a05; - --color-canopee: #a0c43c; - --bg-branche-color: #381e02; - --color-primary: #14854F; - --color-text-light: #fafafa; - --color-lightGrey: #d2d6dd; - --color-grey: #747681; - --color-darkGrey: #3f4144; - --color-error: #d43939; - --color-success: #28bd14; - /*--grid-maxWidth: 120rem;*/ - --grid-maxWidth: 100%; - --grid-gutter: 0rem; - --font-size: 1.6rem; - --font-color: #333333; - --font-family-sans: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next", - "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", - "Droid Sans", "Helvetica Neue", sans-serif; - --font-family-mono: monaco, "Consolas", "Lucida Console", monospace; -} - -body { - background-color: var(--bg-color); -} - -#main-page { - background-color: var(--bg-secondary-color); - padding: 0; -} - -header { - margin-bottom: 4rem; - height: 100%; -} - -#logo { - font-size: 3.2rem; - color: var(--color-text-light); -} - -header>nav { - background-color: var(--bg-canopee-color); - padding-left: 1rem; - padding-right: 1rem; -} - -#illustration { - background-image: url("../images/illustration-ronce_800x510px.png"); - height: 100%; - /* Create the parallax scrolling effect */ - background-attachment: fixed; - background-position: center; - background-repeat: no-repeat; - background-size: cover; -} -@media screen and (min-width: 800px) { - #illustration { - background-image: url("../images/illustration-ronce_1200x765px.png"); - } -} -@media screen and (min-width: 1200px) { - #illustration { - background-image: url("../images/illustration-ronce_2400x1531px.png"); - - } -} - - -section div { - padding-left: 4rem; - padding-right: 4rem; - margin-top: 2rem; -} - -section p { - padding-left: 2rem; - padding-right: 2rem; - font-size: 2rem; -} - -section .canopee { - background-color: var(--bg-canopee-color); - color: var(--color-canopee); - margin-bottom: 4rem; -} -section .canopee.left { - margin-left: 0; - padding-left: 6rem; - border-top-right-radius: 3rem; - border-bottom-right-radius: 3rem; -} -section .canopee.right { - margin-right: 0; - border-top-left-radius: 3rem; - border-bottom-left-radius: 3rem; -} - -section .canopee p { - font-size: 1.6rem; -} - -section .branche { - background-color: var(--bg-branche-color); - color: var(--color-text-light); - padding-bottom: 4rem; - padding-top: 4rem; -} - -section .branche p { - font-size: 2.6rem; - margin: 0; -} - -footer { - padding: 4rem; - border-top: 1px solid var(--bg-color); -} \ No newline at end of file diff --git a/lab/assets/css/deuxfleurs-chato.css b/lab/assets/css/deuxfleurs-chato.css deleted file mode 100644 index 1e34f0c..0000000 --- a/lab/assets/css/deuxfleurs-chato.css +++ /dev/null @@ -1,111 +0,0 @@ -@import 'normalize.css'; -@import 'chota.min.css'; - -/* font-size: - * HTML font size is 16px on most browsers, sometimes 14px. - * Chota sets `font-size: 62.5%;`, that is 10px on most browsers. - */ - -:root { - /* Blanc cassé (offset autour de #main-page) */ - --bg-color: #f4f4f4; - /* Bleu turquoise du ciel au lion */ - --bg-secondary-color: #cafaef; - /* Gris violet du sol */ - --bg-ternary-color: #c7c9e2; - --bg-canopee-color: #151a05; - --color-canopee: #a0c43c; - --bg-branche-color: #381e02; - --color-primary: #14854F; - --color-text-light: #fafafa; - --color-lightGrey: #d2d6dd; - --color-grey: #747681; - --color-darkGrey: #3f4144; - --color-error: #d43939; - --color-success: #28bd14; - --grid-maxWidth: 120rem; - --grid-gutter: 0rem; - --font-size: 1.6rem; - --font-color: #333333; - --font-family-sans: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next", - "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", - "Droid Sans", "Helvetica Neue", sans-serif; - --font-family-mono: monaco, "Consolas", "Lucida Console", monospace; -} - -body { - background-color: var(--bg-color); -} - -#main-page { - background-color: var(--bg-secondary-color); - padding: 0; -} - -header { - margin-bottom: 4rem; -} - -header>nav { - background-color: var(--bg-canopee-color); - padding-left: 1rem; - padding-right: 1rem; -} - -#logo { - font-size: 3.2rem; - color: var(--color-text-light); -} - -section div { - padding-left: 4rem; - padding-right: 4rem; - margin-top: 2rem; -} - -section p { - padding-left: 2rem; - padding-right: 2rem; - font-size: 2rem; -} - -section .canopee { - border-radius: 3rem; - background-color: var(--bg-canopee-color); - color: var(--color-canopee); - margin-bottom: 4rem; -} - -section .canopee.left { - margin-left: 0; - padding-left: 6rem; - border-top-left-radius: 0rem; - border-bottom-left-radius: 0rem; -} - -section .canopee.right { - margin-right: 0; - border-top-right-radius: 0rem; - border-bottom-right-radius: 0rem; -} - -section .canopee p { - font-size: 1.6rem; -} - -section .branche { - background-color: var(--bg-branche-color); - color: var(--color-text-light); - padding-bottom: 4rem; - padding-top: 4rem; -} - -section .branche p { - font-size: 2.6rem; - margin: 0; -} - -footer { - padding: 4rem; - border-top: 1px solid var(--bg-color); -} \ No newline at end of file diff --git a/lab/branches-et-canopee.html b/lab/branches-et-canopee.html new file mode 100644 index 0000000..e4be0a4 --- /dev/null +++ b/lab/branches-et-canopee.html @@ -0,0 +1,121 @@ + + + + + + + + + Deuxfleurs + + + + + +
+ +
+ + + +
+ +
+
+
+

Bienvenue chez Deuxfleurs !

+
+ +
+

+ Nous sommes une association pour
+ une informatique écologique et humaine,
+ et nous sommes en colère.
+ Nous avons donc pris le maquis. +

+
+
+ +
+
+

Nous hébergeons

+

+ Celles et ceux qui ont besoin d'outils libres
+ pour discuter, collaborer, s'organiser, se divertir... +

+
+ +
+ +
+

Sans parasite !

+

+ Toutes nos constructions loufoques
+ sont garanties sans ver espion.
+ Nous préférons le bon goût d'un logiciel bien fait. +

+
+
+ +
+
+

Infrastructure raisonnée

+

+ On essaye d'héberger nos ordinateurs à la maison.
+ Et c'est pas si facile ! +

+
+ +
+ +
+

Nous créons

+

+ Des logiciels pour améliorer
+ et interconnecter nos cabanes. +

+
+
+ +
+
+
+

Nous recrutons

+ +

+ Des bâtisseuses de cabanes ou des évadés... +

+
+
+ +
+
+
+
+

... des mondes d'en bas.

+
+
+
+
+
+ +
+ Tous droits réservés à notre pangolin alcoolique. +
+ +
+ + + \ No newline at end of file diff --git a/lab/gimp/branches-et-canopee/branches-et-canopee.png b/lab/gimp/branches-et-canopee/branches-et-canopee.png new file mode 100644 index 0000000..145afc8 Binary files /dev/null and b/lab/gimp/branches-et-canopee/branches-et-canopee.png differ diff --git a/lab/gimp/branches-et-canopee/branches-et-canopee.xcf b/lab/gimp/branches-et-canopee/branches-et-canopee.xcf new file mode 100644 index 0000000..b25850f Binary files /dev/null and b/lab/gimp/branches-et-canopee/branches-et-canopee.xcf differ diff --git a/lab/gimp/branches-et-canopee/branches-et-canopee_commentaire-ronce.png b/lab/gimp/branches-et-canopee/branches-et-canopee_commentaire-ronce.png new file mode 100644 index 0000000..da0e896 Binary files /dev/null and b/lab/gimp/branches-et-canopee/branches-et-canopee_commentaire-ronce.png differ diff --git a/lab/gimp/idee_adrien.png b/lab/gimp/idee_adrien.png deleted file mode 100644 index 145afc8..0000000 Binary files a/lab/gimp/idee_adrien.png and /dev/null differ diff --git a/lab/gimp/idee_adrien.xcf b/lab/gimp/idee_adrien.xcf deleted file mode 100644 index b25850f..0000000 Binary files a/lab/gimp/idee_adrien.xcf and /dev/null differ diff --git a/lab/gimp/idee_adrien_commentaire_ronce.png b/lab/gimp/idee_adrien_commentaire_ronce.png deleted file mode 100644 index da0e896..0000000 Binary files a/lab/gimp/idee_adrien_commentaire_ronce.png and /dev/null differ diff --git a/lab/index-fullwidth.html b/lab/index-fullwidth.html deleted file mode 100644 index 4eb3282..0000000 --- a/lab/index-fullwidth.html +++ /dev/null @@ -1,122 +0,0 @@ - - - - - - - - - Deuxfleurs - - - - - - - -
- -
- - -
- -
- -
-
-

Bienvenue chez Deuxfleurs !

-
- -
-

- Nous sommes une association pour
- une informatique écologique et humaine,
- et nous sommes en colère.
- Nous avons donc pris le maquis. -

-
-
- -
-
-

Nous hébergeons

-

- Celles et ceux qui ont besoin d'outils libres
- pour discuter, collaborer, s'organiser, se divertir... -

-
- -
- -
-

Sans parasite !

-

- Toutes nos constructions loufoques
- sont garanties sans ver espion.
- Nous préférons le bon goût d'un logiciel bien fait. -

-
-
- -
-
-

Infrastructure raisonnée

-

- On essaye d'héberger nos ordinateurs à la maison.
- Et c'est pas si facile ! -

-
- -
- -
-

Nous créons

-

- Des logiciels pour améliorer
- et interconnecter nos cabanes. -

-
-
- -
-
-
-

Nous recrutons

- -

- Des bâtisseuses de cabanes ou des évadés... -

-
-
- -
-
-
-
-

... des mondes d'en bas.

-
-
-
-
- -
- Tous droits réservés à notre pangolin alcoolique. -
- -
- - - \ No newline at end of file diff --git a/lab/index.html b/lab/index.html deleted file mode 100644 index 1eb7ecf..0000000 --- a/lab/index.html +++ /dev/null @@ -1,123 +0,0 @@ - - - - - - - - - Deuxfleurs - - - - - - - -
- -
- - - -
- -
-
-
-

Bienvenue chez Deuxfleurs !

-
- -
-

- Nous sommes une association pour
- une informatique écologique et humaine,
- et nous sommes en colère.
- Nous avons donc pris le maquis. -

-
-
- -
-
-

Nous hébergeons

-

- Celles et ceux qui ont besoin d'outils libres
- pour discuter, collaborer, s'organiser, se divertir... -

-
- -
- -
-

Sans parasite !

-

- Toutes nos constructions loufoques
- sont garanties sans ver espion.
- Nous préférons le bon goût d'un logiciel bien fait. -

-
-
- -
-
-

Infrastructure raisonnée

-

- On essaye d'héberger nos ordinateurs à la maison.
- Et c'est pas si facile ! -

-
- -
- -
-

Nous créons

-

- Des logiciels pour améliorer
- et interconnecter nos cabanes. -

-
-
- -
-
-
-

Nous recrutons

- -

- Des bâtisseuses de cabanes ou des évadés... -

-
-
- -
-
-
-
-

... des mondes d'en bas.

-
-
-
-
-
- -
- Tous droits réservés à notre pangolin alcoolique. -
- -
- - - \ No newline at end of file diff --git a/lab/notes/framework_html.md b/lab/notes/framework_html.md deleted file mode 100644 index 00bdc9a..0000000 --- a/lab/notes/framework_html.md +++ /dev/null @@ -1,43 +0,0 @@ -## Framework HTML - -__OUTDATED__ - -### Pourquoi ? - -Un framework HTML, c'est un include CSS, et parfois du JS. Ca va de Bootstrap/Foundation, qui sont des framworks immenses (avec fonction « carrousel d'images » et une foule de trucs dont on se cogne) à Skeleton/Mini, qui essayent d'être le plus simple possible tout en apportant les fonctionnalités *vitales* à un site web moderne : - -* **responsive design** : les media queries and co, qui permettent de charger du contenu différent par taille de viewport, c'est du pur HTML5/CSS et c'est chiant à écrire à la main). - - Le design par grille de 12 colonnes aide énormément à concevoir un site en pensant *mobile-first* : "Si cette div est vue sur mobile, faites qu'elle prenne toute la largeur. Si un écran PC large, faites qu'elle ne prenne que 4 colonnes sur 12." - - Je constate que certains frameworks vraiment minimalistes ne permettent pas de définir un nombre de colonnes par div en fonction de la taille du viewport. C'est soit le système de colonnes, soit toutes les div font 12 sur petit viewport. Ça suffira ou pas ? - -* **normalisation**: chaque navigateur a sa propre idée de ce que devrait être la taille du corps de texte. Il faut redéfinir tous les défauts pour s'assurer un rendu homogène sur tout navigateur. C'est le taff de [Normalize.css](https://necolas.github.io/normalize.css/), inclut dans la plupart des frameworks HTML. - -* **sucre** : Si la box modale info/warning/error peut être déjà définie clairement une bonne fois pour toutes, on ne sera pas tentés d'en faire une implem par box au lieu de fouiller le CSS. Ce genre de trucs, c'est pas vital et faut pas que ça *bloat*. - -Non-goals : - -* **LESS/SCSS** : CSS avec des variables et des includes, dans l'idée du *Don't Repeat Yourself*. Personnellement ça me saoule d'avoir à compiler du CSS avant de display, ça m'intéresse pas. - -* **Node** : Plus généralement, tout framework HTML qui demande Node, ça me gave. On en aura assez à faire avec le templating Jinja ou autre. - -### Qui sont les candidats ? - -Sources : une recherche web "small html responsive framework" et [Awesome CSS](https://github.com/troxler/awesome-css-frameworks) - -* [mini.css](https://minicss.org/) (dépôt archivé, flexible reponsive grid, CSS variables, flexbox) - - Essayé. Je voudrais un menu header à onglets sur PC qui se transforme en menu « [drawer](https://minicss.org/docs#drawer) » sur le côté pour mobile. - Il y a des briques pour faire à peu près ça, mais la complexité de la doc me décourage. Je préfère essayer quelque chose qui ait moins d'ambitions mais soit plus facile à utiliser. Go Chota. - -* [Skeleton](http://getskeleton.com/) (12 cols grid, but not responsive: either follow the defined number of columns, or full-size for small viewports) -* [Pure](https://purecss.io/) (flexible responsive grid, with shitty class names) -* **[Chota](https://jenil.github.io/chota/)** (flexible reponsive grid, CSS variables means recent browser versions only) -* [Turret.css](https://turretcss.com/) (orienté accessibilité, pas de grille ?) - -### Décision - -On part sur [mini.css](https://minicss.org/), parce qu'il les features que j'aime, est pas verbeux, bien minifié, et est supporté par des navigateurs assez anciens. - - diff --git a/lab/parallax.html b/lab/parallax.html new file mode 100644 index 0000000..f3ab3da --- /dev/null +++ b/lab/parallax.html @@ -0,0 +1,70 @@ + + + + + + + CSS Scrolling Parallax + + + + + + +
+

Coucou

+
+
+
+

Cute Kitten

+

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

+ +

Flank spare ribs capicola, strip steak biltong pancetta bresaola tri-tip cow landjaeger. Short ribs sirloin beef ribs, flank capicola ribeye turducken. Sirloin boudin andouille tail. Ham flank tail sausage t-bone, jerky landjaeger kevin porchetta ground round pork belly.

+
+
+

Boring

+

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

+
+
+

Fluffy Kitten

+

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

+

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

+
+
+ + + \ No newline at end of file diff --git a/lab/sandbox/assets b/lab/sandbox/assets deleted file mode 120000 index ec2e4be..0000000 --- a/lab/sandbox/assets +++ /dev/null @@ -1 +0,0 @@ -../assets \ No newline at end of file diff --git a/lab/sandbox/parallax.html b/lab/sandbox/parallax.html deleted file mode 100644 index f3ab3da..0000000 --- a/lab/sandbox/parallax.html +++ /dev/null @@ -1,70 +0,0 @@ - - - - - - - CSS Scrolling Parallax - - - - - - -
-

Coucou

-
-
-
-

Cute Kitten

-

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

- -

Flank spare ribs capicola, strip steak biltong pancetta bresaola tri-tip cow landjaeger. Short ribs sirloin beef ribs, flank capicola ribeye turducken. Sirloin boudin andouille tail. Ham flank tail sausage t-bone, jerky landjaeger kevin porchetta ground round pork belly.

-
-
-

Boring

-

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

-
-
-

Fluffy Kitten

-

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

-

Bacon ipsum dolor sit amet chicken pork loin hamburger ball tip, swine tenderloin salami meatball boudin tri-tip fatback shank bacon. Pork salami kevin, brisket spare ribs strip steak ham hock porchetta. Pork belly short loin tail porchetta. Pork pig meatball, beef ribs doner jerky tri-tip hamburger filet mignon strip steak ball tip ham tail tongue corned beef.

-
-
- - - \ No newline at end of file -- cgit v1.2.3