Merge branch 'blog/seoc' into 'master'

Blog/Sane explanation of compilers

See merge request Syndamia/syndamiadotcom!7

1 files changed, 24 insertions, 45 deletions

diff --git a/src/styles.css b/src/styles.css
index cf639fd..5857b46 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -74,18 +74,6 @@
   --tr-bg-color: #fff;
 }
 
-/* Custom mouse text selection colors */
-
-::selection {
-  background: var(--bg-selection-color);
-  color: var(--fg-selection-color);
-  }
-  ::-moz-selection {
-    background: var(--bg-selection-color);
-    color: var(--fg-selection-color);
-    }
-
-
 /* Global */
 
 body {
@@ -109,7 +97,7 @@ img {
   .file-icon        { min-width: 1.3em; vertical-align: text-bottom; }
   .borderless, .oldschool-badge, .file-icon { border: none; }
 
-  .setting-btn { border: none !important; vertical-align: middle; }
+  .setting-btn { border: none; vertical-align: middle; }
   .btn:hover   { cursor: pointer; }
 
   /* image-show.js */
@@ -118,8 +106,8 @@ img {
       border: none;
       height: 100vh;
       left: 0;
-      max-width: none !important;
-      max-height: none !important;
+      max-width: none;
+      max-height: none;
       object-fit: contain;
       padding: 1em;
       position: fixed;
@@ -131,7 +119,6 @@ img {
 
 
 strong { color: var(--strong-color); }
-
 a, a strong {
     border-bottom: 1px dashed;
     color: var(--a-color);
@@ -196,41 +183,33 @@ h1, h2, h3, h4, h5, h6, b {
     h3::after { content: " \2550"; }
 
 /* The following CSS is a modified version of sindresorhus's github-markdown-css repo: https://github.com/sindresorhus/github-markdown-css */
-pre {
-    background-color: var(--pre-bg-color);
-    font-size: 85%;
-    line-height: 1.45;
-    overflow: auto;
-    padding: 16px;
-    word-break: normal;
-    word-wrap: normal;
-  }
-  code, pre {
-      font-family: monospace;
-      font-size: 1em;
+code, pre {
+  background-color: var(--pre-bg-color);
+  font-family: monospace;
+  line-height: 1em;
+}
+  pre {
+      overflow: auto;
+      padding: 0.9em;
+      word-break: normal;
+      word-wrap: normal;
     }
-
   code {
-      background-color: var(--code-bg-color);
-      font-size: 85%;
       margin: 0;
-      padding: 0 .4em;
+      font-size: 85%;
+      padding: 0 0.4em;
     }
   pre code {
-      background-color: var(--code-bg-color);
       border: 0;
       display: inline;
-      line-height: inherit;
-      margin: 0;
       overflow: visible;
       padding: 0;
       word-wrap: normal;
     }
   pre > code {
-      background-color: inherit;
       white-space: pre;
       word-break: normal;
-      padding-right: 16px;
+      padding-right: 0.9em;
     }
   table code {
       font-size: 0.7em;
@@ -241,8 +220,7 @@ pre {
 table {
     border-spacing: 0;
     border-collapse: collapse;
-    margin-top: 10px;
-    margin-bottom: 10px;
+    margin: 0.6em 0;
     overflow: auto;
     width: 100%;
   }
@@ -250,11 +228,10 @@ table {
   table td:not(:first-of-type), table th:not(:first-of-type) {
       border-left: 2px dashed var(--table-border-color);
     }
-  table td:not(:empty) { padding: 0.5em; }
+  table td:not(:empty), table th:not(:empty) { padding: 0.5em; }
   table th:not(:empty) {
       font-size: 1.1em;
-      font-weight: 600;
-      padding: 0.2em;
+      font-weight: bold;
     }
 
   table tr:not(:first-of-type) {
@@ -290,7 +267,7 @@ dt { font-size: 1.2em; }
 
 /* Main elements: content-wrapper, sidebar, article, header, footer */
 
-#content-wrapper {
+#content-wrapper, .sidebar {
     border-right: 3px solid var(--accent-line-color);
     display: flex;
     flex-direction: row;
@@ -401,7 +378,10 @@ dt { font-size: 1.2em; }
 /* Small screen support */
 
 @media screen and (max-width: 610px) {
-  article            { max-width: calc(100vw - 16px - 3px); }
+  article {
+      border-top: none;
+      max-width: calc(100vw - 16px - 3px);
+    }
   table td, table th { word-break: break-all; }
 
   #content-wrapper { flex-direction: column; }
@@ -412,7 +392,6 @@ dt { font-size: 1.2em; }
     #index-contents-img { max-width: 4.38em; }
 
   .sidebar {
-      margin-right: 8px;
       max-width: initial;
       padding-right: 1em;
     }