kazhnuz/moineau
1
0
Fork 0
Code Issues 7 Pull requests Releases 2 Wiki Activity

css: finish responsive wrapper support

Browse source
This commit is contained in:
Kazhnuz 2018-10-03 17:02:35 +02:00
parent 8662d30bcb
commit bbfa34f229
2 changed files with 28 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
css/clear-typography.css
View file

@ -79,21 +79,35 @@ a {
/* ------------------ WRAPPERS ------------------- */
.text-wrapper {
font-size: calc(3mm + 1.1vw);
font-size: calc(2.5mm + 1vw);
margin: auto;
line-height: 1.5em;
}
@media screen and (min-width: 640px) {
.text-wrapper.size-640 {
max-width: 640px;
font-size: calc(2.5mm + 6.4px);
}
}
@media screen and (min-width: 800px) {
.text-wrapper {
font-size: calc(3mm + 8.8px);;
.text-wrapper.size-800 {
font-size: calc(2.5mm + 8.0px);
max-width: 800px;
}
}
@media screen and (min-width: 920px) {
.text-wrapper.size-920 {
font-size: calc(2.5mm + 9.2px);
max-width: 800px;
}
}
@media screen and (min-width: 1200px) {
.text-wrapper .size-1200 {
font-size: calc(3mm + 13.1px);;
.text-wrapper.size-1200 {
font-size: calc(2.5mm + 12px);
max-width: 800px;
}
}
@ -174,12 +188,12 @@ hr {
blockquote {
border-top: 0px;
border-left: 2px;
border-left: 0.15em;
border-right: 0px;
border-bottom: 0px;
border-color: rgba(1, 1, 1, 0.15);
border-style: solid;
border-radius:3px;
border-radius: 3px;
margin: 0.5em;
margin-left: 0.1em;
margin-right: 0.1em;
@ -187,7 +201,7 @@ blockquote {
padding-left: 1em;
padding-right: 1em;
max-width:100%
max-width: 100%
}
.night-mode blockquote {
@ -196,12 +210,12 @@ blockquote {
pre {
border-top: 0px;
border-left: 2px;
border-left: 0.15em;
border-right: 0px;
border-bottom: 0px;
border-color: rgba(1,1,1,0.20);
border-style: solid;
border-radius:3px;
border-radius: 3px;
margin: 0px;
margin-left: 0.1em;
margin-right: 0.1em;
@ -210,7 +224,8 @@ pre {
padding-right: 1em;
background-color:#EEE;
max-width:100%
max-width:100%;
overflow-x: scroll;
}
.night-mode pre {

2
example.html
View file

@ -18,7 +18,7 @@
</head>
<body>
<article class="text-wrapper">
<article class="text-wrapper size-920">
<h1>
Titre de niveau 1
</h1>