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/assets/css/branches-et-canopee.css | 111 ++++++++++++++++++++++ lab/assets/css/deuxfleurs-chato-fullwidth.css | 132 -------------------------- lab/assets/css/deuxfleurs-chato.css | 111 ---------------------- 3 files changed, 111 insertions(+), 243 deletions(-) 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 (limited to 'lab/assets/css') 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 -- cgit v1.2.3