pro/2022_WEBSITE_kosmopolit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

css reorganisees par sections

Browse Source
This commit is contained in:
hugogogo
2021-03-12 18:34:01 +01:00
parent 409ec82f3b
commit 9c236d37e1
8 changed files with 84 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
styles/global.css
View File

@@ -1,6 +1,10 @@
/*----------------------------------------------*/
/*GLOBAL VARIABLE*/
:root {
/*COLOR*/
/* background*/
--color-back-base: hsl(0, 0%, 100%);
--color-back-dark: hsl(0, 0%, 95%);
/* color range */
--color-purple: hsl(324, 86%, 52%); /* #ee1998 - rgb(238, 25, 152) */
--color-pink: hsl(324, 100%, 74%); /* #ff7bca - rgb(255, 123, 202) */
@@ -12,16 +16,25 @@
--hue-2: 86;
--hue-3: 59;
--hue-4: 189;
/*BODY*/
/* background*/
--color-back-base: hsl(0, 0%, 100%);
--color-back-dark: hsl(0, 0%, 95%);
/*text*/
--color-text: hsl(0, 0%, 10%);
--color-text-light: hsl(0, 0%, 25%);
--color-text-strong: hsl(0, 0%, 5%);
--color-text-1: hsl(var(--hue-1), 80%, 50%);
--color-text-2: hsl(var(--hue-2), 90%, 30%);
--color-text-3: hsl(var(--hue-3), 90%, 30%);
--color-text-4: hsl(var(--hue-4), 70%, 40%);
/*links*/
--hue-link: var(--hue-3);
--color-link: hsl(var(--hue-link), 70%, 40%);
--color-link-hover: hsl(var(--hue-link), 70%, 50%);
--color-link-active: hsl(var(--hue-link), 70%, 50%);
--color-link-visited: hsl(var(--hue-link), 60%, 30%);
/* lines*/
--color-lines-main: hsl(var(--hue-1), 50%, 80%);
--color-lines-aside-l: hsl(var(--hue-2), 50%, 80%);
--color-lines-aside-r: hsl(var(--hue-3), 50%, 80%);
--color-lines-nav: hsl(var(--hue-4), 50%, 80%);
--color-lines-1: hsl(var(--hue-1), 50%, 80%);
--color-lines-2: hsl(var(--hue-2), 50%, 80%);
--color-lines-3: hsl(var(--hue-3), 50%, 80%);
--color-lines-4: hsl(var(--hue-4), 50%, 80%);
/* buttons*/
--hue-btn: 12;
--color-btn: hsl(var(--hue-btn), 1%, 1%);
@@ -33,19 +46,6 @@
--font-fallback: 'cabrion';
/* colors texts */
/*text*/
--color-text: hsl(0, 0%, 10%);
--color-text-light: hsl(0, 0%, 25%);
--color-text-strong: hsl(0, 0%, 5%);
/*texts links*/
--hue-link: var(--hue-3);
--color-link: hsl(var(--hue-link), 70%, 40%);
--color-link-hover: hsl(var(--hue-link), 70%, 50%);
--color-link-active: hsl(var(--hue-link), 70%, 50%);
--color-link-visited: hsl(var(--hue-link), 60%, 30%);
/*titles*/
--color-title-1: hsl(0, 0%, 10%);
--color-title-2: hsl(0, 0%, 10%);
/*skeleton*/
--gap-unit: 10px;