diff options
author | LUXEY Adrien <adrien.luxey@inria.fr> | 2021-02-02 22:36:36 +0100 |
---|---|---|
committer | LUXEY Adrien <adrien.luxey@inria.fr> | 2021-02-02 22:36:36 +0100 |
commit | 250f904946ec3debe5cd95cb6cdc9d5ae31373f0 (patch) | |
tree | 48f4d834ede3e84850bc05aef019be37c8c43880 /lab/assets/css/branches-et-canopee.css | |
parent | 2c98b6ebeb3cfa3d812a72f75cbbdf1f403699a7 (diff) | |
download | design-250f904946ec3debe5cd95cb6cdc9d5ae31373f0.tar.gz design-250f904946ec3debe5cd95cb6cdc9d5ae31373f0.zip |
branches et canopee
Diffstat (limited to 'lab/assets/css/branches-et-canopee.css')
-rw-r--r-- | lab/assets/css/branches-et-canopee.css | 111 |
1 files changed, 111 insertions, 0 deletions
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 |