From 66bff55af92776444620f6c46a1ce3b8645527ae Mon Sep 17 00:00:00 2001
From: pikselkraft <pikselkraft@protonmail.com>
Date: Tue, 26 May 2020 12:45:22 +0200
Subject: [PATCH] fichiers sass communs

---
 assets/styles/a11y.sass    | 25 ++++++++++++
 assets/styles/content.sass |  2 +
 assets/styles/html.sass    | 19 +++++++++
 assets/styles/main.sass    |  7 ++--
 assets/styles/print.sass   | 84 ++++++++++++++++++++++++++++++++++++++
 assets/styles/reset.sass   | 55 +++++++++++++++++++++++++
 6 files changed, 188 insertions(+), 4 deletions(-)
 create mode 100644 assets/styles/a11y.sass
 create mode 100644 assets/styles/content.sass
 create mode 100644 assets/styles/html.sass
 create mode 100644 assets/styles/print.sass
 create mode 100644 assets/styles/reset.sass

diff --git a/assets/styles/a11y.sass b/assets/styles/a11y.sass
new file mode 100644
index 0000000..aece8cd
--- /dev/null
+++ b/assets/styles/a11y.sass
@@ -0,0 +1,25 @@
+/* A11y */
+
+a.skip-main
+  left: -999px
+  position: absolute
+  top: auto
+  width: 1px
+  height: 1px
+  overflow: hidden
+  z-index: -999
+
+a.skip-main:focus, a.skip-main:active
+  color: $color-primary
+  background-color: $color-secondary
+  left: auto
+  top: auto
+  width: 20%
+  height: auto
+  overflow: auto
+  padding: 3px
+  border-radius: 10px
+  border: 2px solid $color-primary
+  text-align: center
+  font-size: 1.2em
+  z-index: 999
diff --git a/assets/styles/content.sass b/assets/styles/content.sass
new file mode 100644
index 0000000..461e8f1
--- /dev/null
+++ b/assets/styles/content.sass
@@ -0,0 +1,2 @@
+.container
+  padding: 1rem
diff --git a/assets/styles/html.sass b/assets/styles/html.sass
new file mode 100644
index 0000000..d1d51cd
--- /dev/null
+++ b/assets/styles/html.sass
@@ -0,0 +1,19 @@
+html
+  /*-webkit-font-smoothing: antialiased*/
+  /*--moz-osx-font-smoothing: grayscale*/
+  scroll-behavior: smooth
+  /* In most browsers, this defaults to 16 pixels */
+  font-size: 100%
+
+body
+  color: $color-primary
+  background-color: $color-secondary
+  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"
+
+p,
+ul:not([class]),
+ol[class],
+dl,
+table
+  margin-bottom: -webkit-calc(1.115rem + 0.1vw)
+  margin-bottom: calc(1.115rem + 0.1vw)
diff --git a/assets/styles/main.sass b/assets/styles/main.sass
index e16ed9a..629de2c 100644
--- a/assets/styles/main.sass
+++ b/assets/styles/main.sass
@@ -1,5 +1,4 @@
 @import "./variables"
-
-body
-  color: $color-primary
-  background-color: $color-secondary
+@import "./html"
+@import "./a11y"
+@import "./content"
diff --git a/assets/styles/print.sass b/assets/styles/print.sass
new file mode 100644
index 0000000..47d4f3d
--- /dev/null
+++ b/assets/styles/print.sass
@@ -0,0 +1,84 @@
+/* Print */
+
+@media print
+*
+  background: transparent !important
+  box-shadow: none !important
+  text-shadow: none !important
+
+body
+  width: auto
+  margin: auto
+  font-family: serif
+  font-size: 12pt
+
+nav,
+footer
+  display: none
+
+p,
+.p-like,
+h1,
+.h1-like,
+h2,
+.h2-like,
+h3,
+.h3-like,
+h4,
+.h4-like,
+h5,
+.h5-like,
+h6,
+.h6-like,
+blockquote,
+ul,
+ol
+  color: #000
+  margin: auto
+
+img
+ max-width: 100% !important
+
+.print
+  display: block
+
+.no-print
+  display: none
+
+p,
+.p-like,
+blockquote
+  orphans: 3
+  widows: 3
+
+blockquote,
+ul,
+ol,
+img
+  page-break-inside: avoid
+
+h1,
+.h1-like
+  page-break-before: always
+
+h1,
+.h1-like,
+h2,
+.h2-like,
+h3,
+.h3-like,
+caption
+  page-break-after: avoid
+
+a
+  color: #000
+
+a[href^="http"]:not([href*="pikselkraft.com"]):after
+  content: " (" attr(href) ")"
+
+a[href^="javascript:"]::after,
+a[href^="#"]::after
+  content: ""
+
+abbr[title]:after
+  content: " (" attr(title) ")"
diff --git a/assets/styles/reset.sass b/assets/styles/reset.sass
new file mode 100644
index 0000000..b3fc6ab
--- /dev/null
+++ b/assets/styles/reset.sass
@@ -0,0 +1,55 @@
+/* Reset CSS */
+/* Box sizing rules */
+*,
+*::before,
+*::after {
+  box-sizing: border-box
+}
+
+/* Remove default margin */
+body,
+h1,
+h2,
+h3,
+h4,
+h5,
+p,
+ul[class]
+ol[class],
+li,
+figure,
+figcaption,
+blockquote,
+dl,
+dd {
+  margin: 0
+}
+
+/* Make images easier to work with */
+img {
+  max-width: 100%
+  display: block
+}
+
+/* Natural flow and rhythm in articles by default */
+article > * + * {
+  margin-top: 1em
+}
+
+/* Inherit fonts for inputs and buttons */
+input,
+button,
+textarea,
+select {
+  font: inherit
+}
+
+/* Remove all animations and transitions for people that prefer not to see them */
+@media (prefers-reduced-motion: reduce) {
+  * {
+    animation-duration: 0.01ms !important
+    animation-iteration-count: 1 !important
+    transition-duration: 0.01ms !important
+    scroll-behavior: auto !important
+  }
+}