From 6be1a80fe8f7741d359bac931d08384455494c13 Mon Sep 17 00:00:00 2001
From: Nuno Sempere <nuno.semperelh@protonmail.com>
Date: Thu, 7 Jul 2022 16:34:25 +0000
Subject: [PATCH] feat: Add blockquotes and code css

---
 pub/style/:w        | 201 ++++++++++++++++++++++++++++++++++++++++++++
 pub/style/style.css |  38 ++++++++-
 2 files changed, 238 insertions(+), 1 deletion(-)
 create mode 100644 pub/style/:w

diff --git a/pub/style/:w b/pub/style/:w
new file mode 100644
index 0000000..c18fe77
--- /dev/null
+++ b/pub/style/:w
@@ -0,0 +1,201 @@
+/* latin-ext */
+@font-face {
+  font-family: 'Source Serif Pro';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(https://nunosempere.com/.resources/source-serif-pro-latin-ext.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Source Serif Pro';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(https://nunosempere.com/.resources/source-serif-pro-latin.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Body */
+
+body {
+  display: flex;
+  flex-wrap: wrap;
+  font-family: serif;
+  /* font-family: 'Source Serif Pro', serif; */
+  font-size: 1.5em;
+  background-color: #fff;
+
+}
+
+/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
+@media screen and (max-width: 600px) {
+  body {
+    font-size: 1em;
+  }
+  .hidden-mobile {
+    display: none;
+  }
+
+}
+
+/* header */
+header {
+  flex-basis: 100%;
+  flex-shrink: 0;
+  background-color: #eee;
+  clear: both;
+  padding: 0em;
+  margin: 0;
+}
+
+header h1 {
+  margin-left: 0.7em;
+}
+
+header a {
+  /* 
+  color: inherit;
+  */
+  text-decoration: none;
+  color: black;
+  /* 
+   * color: #005386;
+   */
+}
+
+header h1 span {
+  margin-left: 0em;
+  font-size: 70%;
+  color: #555;
+  /*
+  font-style: italic;
+  */
+}
+
+/* Navigation bar */
+header nav {
+  display: flex;
+  justify-content: space-between;
+}
+
+body>nav {
+  float: left;
+  margin: 0 1px 0 0;
+  border-right: 1px dotted #ccc;
+  width: 350px;
+}
+
+nav a{
+  /* 
+  color: inherit;
+  */
+  text-decoration: none; 
+  color: #005386;
+}
+
+nav a:hover {
+  background-color: #ddd;
+}
+
+nav ul {
+  display: flex;
+  flex-direction: column;
+  list-style-type: none;
+  list-style-position: outside;
+  padding-left: 0;
+}
+
+nav li ul {
+  padding-left: 0.6em;
+}
+
+nav li a {
+  display: block;
+  margin: 0;
+  padding: 0.3em 2em 0.8ex 1em;
+}
+
+/* Other sections */
+
+article{
+  padding: 0.3em 0 0 0;
+  flex-basis: 70%;
+  padding-left: 1em;
+}
+
+footer {
+  flex-shrink: 0;
+  display: flex;
+  justify-content: space-between;
+  padding: 1em 0em 1em 1em;
+  border-top: 1px dotted #ccc;
+}
+
+/* links */
+
+a {
+  color: #005386;
+}
+
+/* Images and figures */
+
+figure figcaption {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+figcaption {
+  text-align: center;
+  font-size: 12px;
+}
+
+img {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  width: 80%;
+}
+
+.img-frontpage-center {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  width: 300px;
+}
+
+.img-medium-center {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  width: 50%;
+}
+
+/* Block quotes */
+
+blockquote{
+  width:60%;
+  margin: 5px auto;
+  font-style:italic;
+  color: #555555;
+  padding: 1.2em 30px 1.2em 75px;
+  border-left:8px solid #005386 ;
+  line-height:1.3;
+  position: relative;
+  background:#EDEDED;
+}
+
+blockquote::before{
+  font-family:Arial;
+  content: "\201C";
+  color:#005386;
+  font-size:4em;
+  position: absolute;
+  left: 10px;
+  top:-10px;
+}
+
+/* Code bloocks */
+pre { white-space: pre-wrap; }
diff --git a/pub/style/style.css b/pub/style/style.css
index 9267174..0627be4 100755
--- a/pub/style/style.css
+++ b/pub/style/style.css
@@ -84,7 +84,7 @@ body>nav {
   float: left;
   margin: 0 1px 0 0;
   border-right: 1px dotted #ccc;
-  width: 250px;
+  width: 350px;
 }
 
 nav a{
@@ -173,3 +173,39 @@ img {
   width: 50%;
 }
 
+/* Block quotes */
+
+blockquote{
+  width:60%;
+  margin: 5px auto;
+  font-style:italic;
+  color: #555555;
+  padding: 1.2em 30px 1.2em 75px;
+  border-left:8px solid #005386 ;
+  line-height:1.3;
+  position: relative;
+  background: #F0F0F0;
+}
+
+blockquote::before{
+  font-family:Arial;
+  content: "\201C";
+  color:#005386;
+  font-size:4em;
+  position: absolute;
+  left: 10px;
+  top:-10px;
+}
+
+/* Code bloocks */
+pre, code {
+  display: block;
+  overflow-x: auto; 
+  tab-width: 2;
+  line-height:1.7;
+  padding: 0.5em 0.5em 0.5em 0.5em;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  margin: 2em;
+  background: #F0F0F0;
+}