mirror of
https://forge.chapril.org/tykayn/orgmode-to-gemini-blog
synced 2025-06-20 09:04:42 +02:00
up style
This commit is contained in:
Tykayn
tykayn
parent
906e253dae
commit
76008e80bf
5 changed files with 232 additions and 207 deletions
|
|
@ -5,6 +5,9 @@
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
*::before, *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 1rem;
|
||||
|
|
@ -17,6 +20,8 @@ body {
|
|||
line-height: 1.5em;
|
||||
color: #000;
|
||||
background: #fff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
nav,
|
||||
|
|
@ -34,10 +39,13 @@ h4,
|
|||
h5,
|
||||
h6 {
|
||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
margin-top: 1em;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
color: #333;
|
||||
text-decoration: none !important;
|
||||
overflow-wrap: break-word;
|
||||
text-wrap: balance;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
hr + h1 {
|
||||
|
|
@ -48,24 +56,25 @@ h1:first-letter {
|
|||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* 1. Use a more-intuitive box-sizing model */
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
*::before, *::after {
|
||||
box-sizing: border-box;
|
||||
h1 {
|
||||
color: #221d30;
|
||||
font-size: 2.5rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
padding-bottom: 20vh;
|
||||
padding-bottom: 2rem;
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Improve media defaults */
|
||||
.content {
|
||||
font-size: 1.2rem;
|
||||
min-height: 15rem;
|
||||
}
|
||||
.content img,
|
||||
.content picture,
|
||||
|
|
@ -76,7 +85,7 @@ body {
|
|||
display: block;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
max-width: 100%;
|
||||
max-width: 100vw;
|
||||
}
|
||||
|
||||
pre,
|
||||
|
|
@ -99,7 +108,7 @@ main a:hover h2 {
|
|||
color: rgb(0, 123, 255);
|
||||
}
|
||||
.nav a, .page__index a {
|
||||
padding: 0.55rem 2rem;
|
||||
padding: 0.5rem 2rem;
|
||||
display: block;
|
||||
margin-right: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
|
|
@ -131,59 +140,25 @@ p {
|
|||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #221d30;
|
||||
font-size: 2.5rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
overflow-wrap: break-word;
|
||||
text-wrap: balance;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
#root,
|
||||
#__next {
|
||||
isolation: isolate;
|
||||
}
|
||||
|
||||
input,
|
||||
button,
|
||||
textarea,
|
||||
select {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 4ch;
|
||||
padding-right: 4ch;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 1em;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
#tags_page li {
|
||||
display: inline;
|
||||
}
|
||||
li a {
|
||||
display: inline-block;
|
||||
margin-right: 1em;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
#title-block-header {
|
||||
|
|
@ -258,14 +233,8 @@ li a {
|
|||
border-radius: 1rem;
|
||||
margin-top: 7rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
min-height: 15rem;
|
||||
}
|
||||
|
||||
.after-article {
|
||||
border-top: 1px solid #dedede;
|
||||
padding: 1rem;
|
||||
.body-wrap .site-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.site-footer {
|
||||
|
|
@ -275,8 +244,14 @@ li a {
|
|||
color: #dedede;
|
||||
}
|
||||
|
||||
.body-wrap .site-header {
|
||||
display: none;
|
||||
article {
|
||||
width: 75ch;
|
||||
max-width: calc(100vw - 6rem);
|
||||
}
|
||||
|
||||
.after-article {
|
||||
border-top: 1px solid #dedede;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.article-navigation {
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../styles_src/style_general.scss"],"names":[],"mappings":";AAAA;AACA;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;EAIE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAEA;EACE;;AAEA;EAEE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;;AAEA;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;EACA;EACA;EACA;;;AAIJ;AAAA;EAEE;;;AAIF;EACE;EAEA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAKJ;EAGE;EACA;EACA;EACA;;AAGF;EACE;EACA;;;AAKJ;EACE;;AAEA;EAEE;EACA;;;AAIJ;AAAA;AAAA;AAAA;EAIE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAAA;EAIE;;;AAGF;EACE;EACA;;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;EACA;;;AAKJ;EACE;;;AAGF;EACE;EACA;;;AAIA;EACE;;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAIJ;EAEE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;;AAIJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AAIA;EACE;;;AAIJ;EACE;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;;;AAMF;AAAA;EACE;;AAGF;AAAA;EACE;EACA;;AAGA;AAAA;EACE;EACA;;;AAMN;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAIA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;;AAIJ;EACE;IACE;;EAGF;IACE","file":"style_general.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../styles_src/style_general.scss"],"names":[],"mappings":";AAAA;AA6CA;EACE;EACA;EACA;;AAEA;EAEE;;;AAIJ;EACE,WAvCe;EAwCf,aApBiB;;;AAuBnB;EACE;EACA,WA5Ce;EA6Cf,aAxCiB;EAyCjB,OA9DW;EA+DX,YA9DiB;EA+DjB;EACA,gBArCW;;;AAwCb;AAAA;AAAA;AAAA;EAIE,WA1DoB;EA2DpB;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME,aA9CoB;EA+CpB,YAzDW;EA0DX,eAxDW;EAyDX,OAnFc;EAoFd;EACA;EACA;EACA,aAnEoB;;;AAsEtB;EACE,YAhEW;;;AAmEb;EACE;;;AAGF;EACE,OAlGiB;EAmGjB,WApFa;EAqFb;;;AAGF;EACE,WAxFa;EAyFb;;;AAGF;EACE,WA5Fa;EA6Fb;;;AAGF;EACE,WApGkB;EAqGlB;;AAEA;AAAA;AAAA;AAAA;AAAA;EAKE,OAhHY;EAiHZ;EACA,YArGS;EAsGT,eAtGS;EAuGT;;;AAIJ;AAAA;EAEE;;;AAIF;EACE;EACA,eA7GiB;EA8GjB,OA1IW;EA2IX;EACA,SAtHW;;AAwHX;EACE,YAzIkB;EA0IlB,OAhJS;;AAkJT;EACE,OAnJO;;AAuJX;EAEE;EACA;EACA,cArIS;EAsIT,eAtIS;;AAyIX;EACE;EACA;;;AAIJ;EACE,YAlIe;;AAoIf;EACE;EACA,YAvIe;;;AA2InB;AAAA;AAAA;AAAA;EAIE;;;AAGF;EACE;EACA;EACA,YAjKW;EAkKX,eAnKW;;;AAsKb;AAAA;EAEE;;;AAGF;EACE;EACA;;;AAGF;EACE,eAjLW;;AAmLX;EACE;;AAGF;EACE;EACA,cAzLS;;;AA8Lb;EACE;;;AAGF;EACE;EACA;;;AAIA;EACE;;;AAKF;EACE,OA7MS;EA8MT,QA9MS;EA+MT,cAjNS;;AAoNX;EACE;EACA;;;AAIJ;EACE,YA1NW;EA2NX,eA3NW;EA4NX;;AAEA;EACE;EACA,SAlOS;EAmOT;EACA,eA9Ne;;;AAkOnB;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA,SA/OS;;;AAmPb;EACE;EACA,SArPW;EAsPX;EACA;;;AAGF;AAAA;EAEE,QA5PW;EA6PX,OAtRiB;EAuRjB;;;AAGF;EACE,YArRc;;;AAwRhB;EACE,YA/RiB;EAgSjB,SAnQkB;EAoQlB;EACA,YAzQW;EA0QX,eApQiB;EAqQjB;;AAEA;EACE;;;AAIJ;EACE;EACA,SAlRW;EAmRX,YA1SgB;EA2ShB,OA1SkB;;;AA6SpB;EACE,OAvSc;EAwSd;;;AAGF;EACE;EACA,SAhSW;;;AAmSb;EACE,YAlSW;EAmSX,eAnSW;;AAqSX;EACE,eAtSS;;;AA0Sb;EACE,YA7SW;EA8SX,eA9SW;;AAgTX;EACE;EACA,SAnTS;;;AA0TX;AAAA;EACE;;AAGF;AAAA;EACE;EACA;;AAEA;AAAA;EACE;EACA,SApUO;;;AAyUb;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA,cA9UW;EA+UX,aAhVW;EAiVX,gBAjVW;;;AAoVb;EACE;;;AAIA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA,cArWS;;;AAyWb;EACE;IACE;;EAGF;IACE,SA/WS","file":"style_general.css"}
|
||||
42
templates/styles_src/_variables.scss
Normal file
42
templates/styles_src/_variables.scss
Normal file
|
|
@ -0,0 +1,42 @@
|
|||
// Variables de couleurs
|
||||
$color-text: #000;
|
||||
$color-background: #fff;
|
||||
$color-heading: #333;
|
||||
$color-heading-h1: #221d30;
|
||||
$color-link: rgb(0, 123, 255);
|
||||
$color-footer-bg: #aaa;
|
||||
$color-footer-text: #dedede;
|
||||
$color-page-bg: #f4f4f4;
|
||||
$color-border: #dedede;
|
||||
$color-blockquote-border: grey;
|
||||
$color-link-hover-bg: #303030;
|
||||
|
||||
// Variables de taille
|
||||
$article-width: 75ch;
|
||||
$container-max-width: 70ch;
|
||||
$font-size-base: 1rem;
|
||||
$font-size-body: 1.5rem;
|
||||
$font-size-content: 1.2rem;
|
||||
$font-size-h1: 2.5rem;
|
||||
$font-size-h2: 2rem;
|
||||
$font-size-h3: 1.5rem;
|
||||
$line-height-base: 1.5em;
|
||||
$line-height-heading: 1.3em;
|
||||
|
||||
// Variables d'espacement
|
||||
$spacing-xs: 0.5rem;
|
||||
$spacing-sm: 1rem;
|
||||
$spacing-md: 1.5rem;
|
||||
$spacing-lg: 2rem;
|
||||
$spacing-xl: 5rem;
|
||||
$padding-container: 5% 6%;
|
||||
$border-radius-sm: 0.5rem;
|
||||
$border-radius-md: 1rem;
|
||||
|
||||
// Variables de police
|
||||
$font-family-base: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
$font-family-heading: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
|
||||
// Variables de transition
|
||||
$transition-hover: 0.25s all ease-in;
|
||||
$transition-out: 0.25s box-shadow ease-out;
|
||||
|
|
@ -1,28 +1,79 @@
|
|||
/*style général scss*/
|
||||
|
||||
// Variables de couleurs
|
||||
$color-text: #000;
|
||||
$color-background: #fff;
|
||||
$color-heading: #333;
|
||||
$color-heading-h1: #221d30;
|
||||
$color-link: rgb(0, 123, 255);
|
||||
$color-footer-bg: #aaa;
|
||||
$color-footer-text: #dedede;
|
||||
$color-page-bg: #f4f4f4;
|
||||
$color-border: #dedede;
|
||||
$color-blockquote-border: grey;
|
||||
$color-link-hover-bg: #303030;
|
||||
|
||||
// Variables de taille
|
||||
$article-width: 75ch;
|
||||
$container-max-width: 70ch;
|
||||
$font-size-base: 1rem;
|
||||
$font-size-body: 1.5rem;
|
||||
$font-size-content: 1.2rem;
|
||||
$font-size-h1: 2.5rem;
|
||||
$font-size-h2: 2rem;
|
||||
$font-size-h3: 1.5rem;
|
||||
$line-height-base: 1.5em;
|
||||
$line-height-heading: 1.3em;
|
||||
|
||||
// Variables d'espacement
|
||||
$spacing-xs: 0.5rem;
|
||||
$spacing-sm: 1rem;
|
||||
$spacing-md: 1.5rem;
|
||||
$spacing-lg: 2rem;
|
||||
$spacing-xl: 5rem;
|
||||
$padding-container: 5% 6%;
|
||||
$border-radius-sm: 0.5rem;
|
||||
$border-radius-md: 1rem;
|
||||
|
||||
// Variables de police
|
||||
$font-family-base: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
$font-family-heading: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
|
||||
// Variables de transition
|
||||
$transition-hover: 0.25s all ease-in;
|
||||
$transition-out: 0.25s box-shadow ease-out;
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 1rem;
|
||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
font-size: $font-size-base;
|
||||
font-family: $font-family-base;
|
||||
}
|
||||
|
||||
body {
|
||||
text-align: left;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.5em;
|
||||
color: #000;
|
||||
background: #fff;
|
||||
font-size: $font-size-body;
|
||||
line-height: $line-height-base;
|
||||
color: $color-text;
|
||||
background: $color-background;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
padding-bottom: $spacing-lg;
|
||||
}
|
||||
|
||||
nav,
|
||||
.navbar,
|
||||
.container,
|
||||
.body-wrap {
|
||||
max-width: 70ch;
|
||||
max-width: $container-max-width;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
|
@ -32,53 +83,54 @@ h3,
|
|||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 2rem;
|
||||
color: #333;
|
||||
font-family: $font-family-heading;
|
||||
margin-top: $spacing-sm;
|
||||
margin-bottom: $spacing-lg;
|
||||
color: $color-heading;
|
||||
text-decoration: none !important;
|
||||
overflow-wrap: break-word;
|
||||
text-wrap: balance;
|
||||
line-height: $line-height-heading;
|
||||
}
|
||||
|
||||
hr+h1 {
|
||||
margin-top: 5rem;
|
||||
margin-top: $spacing-xl;
|
||||
}
|
||||
|
||||
h1:first-letter {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* 1. Use a more-intuitive box-sizing model */
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
h1 {
|
||||
color: $color-heading-h1;
|
||||
font-size: $font-size-h1;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
padding-bottom: 20vh;
|
||||
padding-bottom: 2rem;
|
||||
h2 {
|
||||
font-size: $font-size-h2;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: $font-size-h3;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Improve media defaults */
|
||||
.content {
|
||||
font-size: 1.2rem;
|
||||
font-size: $font-size-content;
|
||||
min-height: 15rem;
|
||||
|
||||
img,
|
||||
picture,
|
||||
video,
|
||||
canvas,
|
||||
svg {
|
||||
width: 75ch;
|
||||
width: $article-width;
|
||||
display: block;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
max-width: 100%;
|
||||
margin-top: $spacing-sm;
|
||||
margin-bottom: $spacing-sm;
|
||||
max-width: 100vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -90,45 +142,40 @@ pre,
|
|||
// ancres
|
||||
a {
|
||||
display: inline-block;
|
||||
|
||||
border-radius: 1rem;
|
||||
color: rgb(0, 123, 255);
|
||||
border-radius: $border-radius-md;
|
||||
color: $color-link;
|
||||
text-decoration: none;
|
||||
padding: 1rem;
|
||||
padding: $spacing-sm;
|
||||
|
||||
main &:hover {
|
||||
background: #303030;
|
||||
color: rgb(0, 123, 255);
|
||||
background: $color-link-hover-bg;
|
||||
color: $color-link;
|
||||
|
||||
h2 {
|
||||
color: rgb(0, 123, 255);
|
||||
color: $color-link;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.nav &,
|
||||
|
||||
.page__index & {
|
||||
padding: 0.55rem 2rem;
|
||||
padding: $spacing-xs $spacing-lg;
|
||||
display: block;
|
||||
margin-right: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
margin-right: $spacing-sm;
|
||||
margin-bottom: $spacing-sm;
|
||||
}
|
||||
|
||||
.site-footer & {
|
||||
margin: 0 1rem;
|
||||
margin: 0 $spacing-sm;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
a img {
|
||||
transition: 0.25s box-shadow ease-out;
|
||||
transition: $transition-out;
|
||||
|
||||
&:hover {
|
||||
|
||||
box-shadow: 0 0 1rem #ccc;
|
||||
transition: 0.25s all ease-in;
|
||||
box-shadow: 0 0 $spacing-sm #ccc;
|
||||
transition: $transition-hover;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -142,35 +189,8 @@ select {
|
|||
p {
|
||||
overflow-wrap: break-word;
|
||||
text-wrap: pretty;
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #221d30;
|
||||
font-size: 2.5rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5rem;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
overflow-wrap: break-word;
|
||||
text-wrap: balance;
|
||||
line-height: 1.3em;
|
||||
margin-top: $spacing-md;
|
||||
margin-bottom: $spacing-sm;
|
||||
}
|
||||
|
||||
#root,
|
||||
|
|
@ -178,20 +198,13 @@ h6 {
|
|||
isolation: isolate;
|
||||
}
|
||||
|
||||
input,
|
||||
button,
|
||||
textarea,
|
||||
select {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 4ch;
|
||||
padding-right: 4ch;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 1em;
|
||||
margin-bottom: $spacing-sm;
|
||||
|
||||
#tags_page & {
|
||||
display: inline;
|
||||
|
|
@ -199,7 +212,7 @@ li {
|
|||
|
||||
a {
|
||||
display: inline-block;
|
||||
margin-right: 1em;
|
||||
margin-right: $spacing-sm;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -221,28 +234,27 @@ li {
|
|||
|
||||
.navbar-menu {
|
||||
img {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
margin-right: 1rem;
|
||||
width: $spacing-lg;
|
||||
height: $spacing-lg;
|
||||
margin-right: $spacing-sm;
|
||||
}
|
||||
|
||||
a {
|
||||
margin: 0 1rem;
|
||||
margin: 0 $spacing-sm;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
#recherche {
|
||||
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
margin-top: $spacing-md;
|
||||
margin-bottom: $spacing-md;
|
||||
float: right;
|
||||
|
||||
input {
|
||||
background: transparent;
|
||||
padding: 0.5rem;
|
||||
padding: $spacing-xs;
|
||||
border: solid 1px #555;
|
||||
border-radius: 0.5rem;
|
||||
border-radius: $border-radius-sm;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -252,82 +264,80 @@ li {
|
|||
.site-icon {
|
||||
width: 9rem;
|
||||
height: auto;
|
||||
margin: 1rem auto;
|
||||
margin: $spacing-sm auto;
|
||||
position: static;
|
||||
padding: 1rem;
|
||||
padding: $spacing-sm;
|
||||
}
|
||||
}
|
||||
|
||||
.header-image {
|
||||
text-align: center;
|
||||
padding: 1rem;
|
||||
padding: $spacing-sm;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.blog-title,
|
||||
.blog-subtitle {
|
||||
margin: 1rem;
|
||||
color: #fff;
|
||||
text-shadow: 0 0 1rem #555;
|
||||
margin: $spacing-sm;
|
||||
color: $color-background;
|
||||
text-shadow: 0 0 $spacing-sm #555;
|
||||
}
|
||||
|
||||
#page {
|
||||
background: #f4f4f4;
|
||||
background: $color-page-bg;
|
||||
}
|
||||
|
||||
.body-wrap {
|
||||
background: #fff;
|
||||
padding: 5% 6%;
|
||||
background: $color-background;
|
||||
padding: $padding-container;
|
||||
margin-bottom: 5%;
|
||||
margin-top: 1rem;
|
||||
border-radius: 1rem;
|
||||
margin-top: $spacing-sm;
|
||||
border-radius: $border-radius-md;
|
||||
margin-top: 7rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
min-height: 15rem;
|
||||
|
||||
}
|
||||
|
||||
.after-article {
|
||||
border-top: 1px solid #dedede;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
|
||||
.site-footer {
|
||||
min-height: 20vh;
|
||||
padding: 2rem;
|
||||
background: #aaa;
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
.body-wrap {
|
||||
.site-header {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.site-footer {
|
||||
min-height: 20vh;
|
||||
padding: $spacing-lg;
|
||||
background: $color-footer-bg;
|
||||
color: $color-footer-text;
|
||||
}
|
||||
|
||||
article {
|
||||
width: $article-width;
|
||||
max-width: calc(100vw - 6rem);
|
||||
}
|
||||
|
||||
.after-article {
|
||||
border-top: 1px solid $color-border;
|
||||
padding: $spacing-sm;
|
||||
}
|
||||
|
||||
.article-navigation {
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
margin-top: $spacing-lg;
|
||||
margin-bottom: $spacing-lg;
|
||||
|
||||
a {
|
||||
padding-right: 2rem;
|
||||
padding-right: $spacing-lg;
|
||||
}
|
||||
}
|
||||
|
||||
.article-tags {
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
margin-top: $spacing-sm;
|
||||
margin-bottom: $spacing-sm;
|
||||
|
||||
a {
|
||||
margin-right: 1ch;
|
||||
padding: 0.5rem;
|
||||
padding: $spacing-xs;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.article-tags,
|
||||
.tags {
|
||||
ul {
|
||||
|
|
@ -338,15 +348,13 @@ li {
|
|||
margin-right: 2ch;
|
||||
display: inline-block;
|
||||
|
||||
|
||||
a {
|
||||
margin-right: 1ch;
|
||||
padding: 0.5rem;
|
||||
padding: $spacing-xs;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
blockquote,
|
||||
q {
|
||||
-webkit-hyphens: none;
|
||||
|
|
@ -354,10 +362,10 @@ q {
|
|||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
quotes: none;
|
||||
border-left: 3px solid grey;
|
||||
padding-left: 2rem;
|
||||
padding-top: 1.5rem;
|
||||
padding-bottom: 1.5rem;
|
||||
border-left: 3px solid $color-blockquote-border;
|
||||
padding-left: $spacing-lg;
|
||||
padding-top: $spacing-md;
|
||||
padding-bottom: $spacing-md;
|
||||
}
|
||||
|
||||
.article-main-content {
|
||||
|
|
@ -376,16 +384,16 @@ q {
|
|||
img {
|
||||
max-width: 3rem;
|
||||
height: 3rem;
|
||||
margin-right: 1rem;
|
||||
margin-right: $spacing-sm;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 75ch) {
|
||||
@media (max-width: $article-width) {
|
||||
body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1rem;
|
||||
padding: $spacing-sm;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue