From fd12c3f0719431317ce8bf9f17ae051339e43950 Mon Sep 17 00:00:00 2001
From: Michal Vanko <mklakakilli@gmail.com>
Date: Fri, 7 May 2021 09:46:50 +0200
Subject: [PATCH] Fix layout

---
 ...-javascript-to-javascript-application-testing.md |  2 +-
 src/routes/$layout.svelte                           |  4 +---
 src/styles/global.module.less                       | 13 +++++++------
 src/styles/variables.module.less                    |  1 +
 4 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/_posts/blog/2021-05-07-introduction-javascript-to-javascript-application-testing.md b/_posts/blog/2021-05-07-introduction-javascript-to-javascript-application-testing.md
index 2198afa..2422623 100644
--- a/_posts/blog/2021-05-07-introduction-javascript-to-javascript-application-testing.md
+++ b/_posts/blog/2021-05-07-introduction-javascript-to-javascript-application-testing.md
@@ -206,7 +206,7 @@ This code is usually tested by the authors of those libraries.
 
 ### Additional resources for integration tests
 
-- [What is API testing](https://www.edureka.co/blog/what-is-api-testing) by [Archana Choudary @ edureka.com](https://www.edureka.co/blog/author/archana-cedureka-co/]
+- [What is API testing](https://www.edureka.co/blog/what-is-api-testing) by [Archana Choudary @ edureka.com](https://www.edureka.co/blog/author/archana-cedureka-co/)
 - [GraphQL integration tests with apollo-server-testing, jest-mongodb and nock](https://medium.com/@jdeflaux/graphql-integration-tests-with-apollo-server-testing-jest-mongodb-and-nock-af5a82e95954) by [Julien Deflaux @ medium.com](https://medium.com/@jdeflaux)
 
 ## End to End (e2e) testing
diff --git a/src/routes/$layout.svelte b/src/routes/$layout.svelte
index fe67303..01ccb89 100644
--- a/src/routes/$layout.svelte
+++ b/src/routes/$layout.svelte
@@ -38,12 +38,12 @@
   .app-content {
     display: grid;
     grid-template-rows: auto 1fr auto;
+    grid-template-columns: 100%;
     min-height: 100vh;
   }
 
   main {
     position: relative;
-    max-width: 100vw;
     padding: 1.2em;
 
     h1,
@@ -76,7 +76,6 @@
       max-width: 48rem;
       margin-left: auto;
       margin-right: auto;
-      box-shadow: @content-box-shadow;
     }
     figure {
       max-width: @max-image-size;
@@ -91,7 +90,6 @@
 
     img {
       width: 100%;
-      margin: 0 0 1em 0;
       border-radius: 5px;
       box-shadow: @content-box-shadow;
     }
diff --git a/src/styles/global.module.less b/src/styles/global.module.less
index 12968d7..3a81f28 100644
--- a/src/styles/global.module.less
+++ b/src/styles/global.module.less
@@ -71,22 +71,23 @@ a {
 }
 
 main {
-  code,
+  // code,
   pre,
-  code[class*='language-'],
+  // code[class*='language-'],
   pre[class*='language-'],
-  :not(pre) > code[class*='language-'] {
+  :not(pre) > code {
     font-family: menlo, inconsolata, monospace;
     background-color: tint(@bg-color, 20%);
     padding: 0.2em 0.4em;
     color: lighten(@article-text-color, 15%);
-    text-shadow: 0 1px white;
-    line-height: 1.4em;
+    line-height: 1em;
+    box-shadow: @code-box-shadow;
+    border-radius: 3px;
   }
 
   code,
   code[class*='language-'] {
-    font-size: 0.84em;
+    font-size: 0.76em;
   }
 }
 
diff --git a/src/styles/variables.module.less b/src/styles/variables.module.less
index 75b3d0a..b058570 100644
--- a/src/styles/variables.module.less
+++ b/src/styles/variables.module.less
@@ -25,6 +25,7 @@
 @menu-bg-color: fade(@tearkiss, 40%);
 
 @content-box-shadow: 0px 0px 2px 1px fade(desaturate(@tearkiss, 50%), 50%);
+@code-box-shadow: inset 0px 0px 2px 1px fade(desaturate(@tearkiss, 50%), 20%);
 
 @media-l: 1000px;
 @media-m: 700px;