essai de reglage largeur texte main

This commit is contained in:
hugogogo
2021-03-08 17:43:18 +01:00
parent edd79b3848
commit 360e10592a
4 changed files with 18 additions and 34 deletions

View File

@@ -62,8 +62,6 @@ html {
/*BODY*/
/* the page is designed for a maximum screen*/
body {
max-width: var(--max-screen);
margin: auto;
background-color: var(--base-back-color);
}
@@ -112,6 +110,7 @@ body nav a.nav_logo {
/*CONTAINER*/
body .container_main {
margin: auto;
flex-direction: row;
}
@@ -139,6 +138,7 @@ body aside.page_content .table_box > * {
/*MAIN*/
body main {
max-width: var(--max-main-width);
}
body main > * {
margin: var(--gap-unit) 0px;
@@ -152,11 +152,6 @@ body main h2 {
border-bottom: 1px solid lightgrey;
}
/*PATH*/
body main .page_path {
margin-top: 0px;
}
/*TITLE*/
body main .page_title {
position: relative;

View File

@@ -33,32 +33,35 @@
--font-texts: 'louisgeorge';
--font-fallback: 'cabrion';
--max-p-width: 700px;
/* colors texts */
/*text*/
--color-text: hsl(0, 0%, 10%);
--color-text-light: hsl(0, 0%, 25%);
--color-text-strong: hsl(0, 0%, 5%);
/*links*/
--hue-link: 59;
--hue-link: 189;
--hue-link: 324;
--hue-link: 189;
--hue-link: 59;
--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), 70%, 20%);
--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;
--max-screen: 1060px;
--max-screen: 1560px;
--base-font-size: 10px;
--nav-height: 40px;
--base-back-color: white;
--aside-left-width: 200px;
--aside-right-width: 200px;
--aside-margin: 30px;
--max-main-width: var(--max-p-width);
}

View File

@@ -9,16 +9,17 @@ a, p, li {
font-family: var(--font-texts), var(--font-fallback), sans-serif;
}
/*colors*/
a, a:link {
/*links when they are part of a text*/
p a, p a:link {
color: var(--color-link);
}
a:visited {
p a:visited {
color: var(--color-link-visited);
}
a:hover {
p a:hover {
color: var(--color-link-hover);
}
a:active {
p a:active {
color: var(--color-link-active);
}
p, span {
@@ -34,6 +35,7 @@ main {
p {
font-size: 1.8em;
line-height: 1.5em;
max-width: var(--max-p-width);
}
h1 {
font-size: 3.5em;