changed styles of article so that they would not affect docs pages (#59)

qdrant-landing/themes/qdrant/layouts/partials/blogpost.html

@@ -12,7 +12,9 @@
         </div>
         {{ end }}
         <div class="lower-box pt-0">
-            <article>{{ .Content }}</article>
+            <article class="{{ if eq .Section "blog"}}blog{{else if eq .Section "articles"}}article{{end}}">
+                {{ .Content }}
+            </article>
             <hr>
             <div class="clearfix">
                 <div class="pull-left">

qdrant-landing/themes/qdrant/static/css/article.scss

@@ -1,16 +1,16 @@
 article aside[role="alert"],
 article aside[role="status"] {
-  border: 1px solid transparent;
-  position: relative;
-  padding: .75rem 1.25rem .75rem 3rem;
   margin-bottom: 1rem;
+  padding: .75rem 1.25rem .75rem 3rem;
+  position: relative;
+  border: 1px solid transparent;
   border-radius: 0.25rem;
 }
 
 article aside[role="alert"] {
   color: var(--brand-primary);
-  background-color: #FBBFBF;
   border-color: #fdb8b8;
+  background-color: #FBBFBF;
 }
 
 article aside[role="alert"]:before,
@@ -19,46 +19,34 @@ article aside[role="status"]:before {
   position: absolute;
   top: calc(50% - 0.75rem);
   left: 0;
-  font-size: 1rem;
   text-align: center;
+  font-size: 1rem;
 }
 
 article aside[role="alert"]:before {
   content: "\f071";
   font-family: "Font Awesome 5 Free";
-  font-weight: 900;
   font-size: 1rem;
+  font-weight: 900;
 }
 
 article aside[role="status"] {
   color: var(--brand-secondary);
-  background-color: #d1ecf1;
   border-color: #bee5eb;
+  background-color: #d1ecf1;
 }
 
 article aside[role="status"]:before {
   content: "\f129";
   font-family: "Font Awesome 5 Free";
-  font-weight: 900;
   font-size: 1rem;
+  font-weight: 900;
 }
 
 article:first-of-type {
-  padding-top: 18px;
-  font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif;
-  font-size: 20px;
-
-  @include media-breakpoint-up(md) {
-    padding-top: 38px;
-  }
 
   table {
     @extend .table;
-    font-size: 18px;
-    color: rgb(41, 41, 41);
-    @include media-breakpoint-up(md) {
-      font-size: 20px;
-    }
   }
 
   pre {
@@ -67,8 +55,73 @@ article:first-of-type {
 
   img {
     display: block;
-    margin-left: auto;
     margin-right: auto;
+    margin-left: auto;
+  }
+
+  ul,
+  ol {
+    margin-top: 1em;
+    margin-bottom: 1em;
+  }
+
+  ul > li {
+    margin: 0 0 0 2em;
+    position: relative;
+    list-style: disc;
+  }
+
+  ol > li {
+    margin: 0 0 0 2em;
+    position: relative;
+    list-style: decimal;
+  }
+
+  h1 {
+    font-size: 2.25rem;
+  }
+
+  h2 {
+    font-size: 1.75rem;
+  }
+
+  h3 {
+    font-size: 1.25rem;
+  }
+
+  h4 {
+    font-size: 1.25rem;
+  }
+
+  h5 {
+    font-size: 1.25rem;
+  }
+
+  h6 {
+    font-size: 1.25rem;
+  }
+
+  p {
+    margin-bottom: 0.7rem;
+    line-height: 1.8em;
+  }
+
+  figure {
+    text-align: center;
+  }
+}
+
+.article,
+.blog {
+  font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif;
+  font-size: 20px;
+
+  table {
+    color: rgb(41, 41, 41);
+    font-size: 18px;
+    @include media-breakpoint-up(md) {
+      font-size: 20px;
+    }
   }
 
   ul,
@@ -78,11 +131,8 @@ article:first-of-type {
   }
 
   ul > li {
-    list-style: disc;
-    margin: 0 0 0 2em;
-    position: relative;
-    font-size: 18px;
     color: rgb(41, 41, 41);
+    font-size: 18px;
     line-height: 32px;
     @include media-breakpoint-up(md) {
       font-size: 20px;
@@ -90,11 +140,8 @@ article:first-of-type {
   }
 
   ol > li {
-    list-style: decimal;
-    margin: 0 0 0 2em;
-    position: relative;
-    font-size: 18px;
     color: rgb(41, 41, 41);
+    font-size: 18px;
     line-height: 32px;
     @include media-breakpoint-up(md) {
       font-size: 20px;
@@ -126,23 +173,62 @@ article:first-of-type {
     font-size: 1.45rem;
   }
 
-  h6 {
-    font-size: 1.25rem;
-  }
-
   p {
-    line-height: 32px;
-    margin-top: 0.86em;
-    margin-bottom: 1.5em;
-    font-size: 18px;
     color: rgb(41, 41, 41);
+    font-size: 18px;
+    line-height: 32px;
     @include media-breakpoint-up(md) {
       font-size: 20px;
     }
   }
+}
 
-  figure {
+.article {
-    text-align: center;
+  padding-right: 180px;
+  padding-left: 180px;
+  padding-top: 18px;
+
+  @media only screen and (max-width: 599px) {
+    padding-right: 0;
+    padding-left: 0;
   }
 
+  @media only screen and (max-width: 1023px) {
+    padding-right: 10px;
+    padding-left: 10px;
+  }
+
+  @include media-breakpoint-up(md) {
+    padding-top: 38px;
+  }
+
+  p {
+    margin-top: 0.86em;
+    margin-bottom: 1.5em;
+  }
+}
+
+.blog {
+  padding-right: 70px;
+  padding-left: 70px;
+  padding-top: 20px;
+
+  @media only screen and (max-width: 599px) {
+    padding-right: 0;
+    padding-left: 0;
+  }
+
+  @media only screen and (max-width: 1023px) {
+    padding-right: 10px;
+    padding-left: 10px;
+  }
+
+  p {
+    margin-top: 0.86em;
+    margin-bottom: 1.5em;
+
+    &:first-child {
+      margin-top: 0;
+    }
+  }
 }

qdrant-landing/themes/qdrant/static/css/main.css

@@ -9999,17 +9999,17 @@ article:first-of-type table th {
 /* @import url('jquery.mCustomScrollbar.min.css'); */
 article aside[role=alert],
 article aside[role=status] {
-  border: 1px solid transparent;
-  position: relative;
-  padding: 0.75rem 1.25rem 0.75rem 3rem;
   margin-bottom: 1rem;
+  padding: 0.75rem 1.25rem 0.75rem 3rem;
+  position: relative;
+  border: 1px solid transparent;
   border-radius: 0.25rem;
 }
 
 article aside[role=alert] {
   color: var(--brand-primary);
-  background-color: #FBBFBF;
   border-color: #fdb8b8;
+  background-color: #FBBFBF;
 }
 
 article aside[role=alert]:before,
@@ -10018,126 +10018,221 @@ article aside[role=status]:before {
   position: absolute;
   top: calc(50% - 0.75rem);
   left: 0;
-  font-size: 1rem;
   text-align: center;
+  font-size: 1rem;
 }
 
 article aside[role=alert]:before {
   content: "\f071";
   font-family: "Font Awesome 5 Free";
-  font-weight: 900;
   font-size: 1rem;
+  font-weight: 900;
 }
 
 article aside[role=status] {
   color: var(--brand-secondary);
-  background-color: #d1ecf1;
   border-color: #bee5eb;
+  background-color: #d1ecf1;
 }
 
 article aside[role=status]:before {
   content: "\f129";
   font-family: "Font Awesome 5 Free";
-  font-weight: 900;
   font-size: 1rem;
+  font-weight: 900;
 }
 
-article:first-of-type {
-  padding-top: 18px;
-  font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif;
-  font-size: 20px;
-}
-@media (min-width: 768px) {
-  article:first-of-type {
-    padding-top: 38px;
-  }
-}
-article:first-of-type table {
-  font-size: 18px;
-  color: rgb(41, 41, 41);
-}
-@media (min-width: 768px) {
-  article:first-of-type table {
-    font-size: 20px;
-  }
-}
 article:first-of-type pre {
   position: relative;
 }
 article:first-of-type img {
   display: block;
-  margin-left: auto;
   margin-right: auto;
+  margin-left: auto;
 }
 article:first-of-type ul,
 article:first-of-type ol {
-  margin-top: 0.86em;
+  margin-top: 1em;
-  margin-bottom: 1.5em;
+  margin-bottom: 1em;
 }
 article:first-of-type ul > li {
-  list-style: disc;
   margin: 0 0 0 2em;
   position: relative;
-  font-size: 18px;
+  list-style: disc;
-  color: rgb(41, 41, 41);
-  line-height: 32px;
-}
-@media (min-width: 768px) {
-  article:first-of-type ul > li {
-    font-size: 20px;
-  }
 }
 article:first-of-type ol > li {
-  list-style: decimal;
   margin: 0 0 0 2em;
   position: relative;
-  font-size: 18px;
+  list-style: decimal;
-  color: rgb(41, 41, 41);
-  line-height: 32px;
-}
-@media (min-width: 768px) {
-  article:first-of-type ol > li {
-    font-size: 20px;
-  }
-}
-article:first-of-type h1, article:first-of-type h2, article:first-of-type h3, article:first-of-type h4, article:first-of-type h5, article:first-of-type h6 {
-  margin-bottom: 1rem;
-  font-weight: 600;
 }
 article:first-of-type h1 {
-  font-size: 2.45rem;
+  font-size: 2.25rem;
 }
 article:first-of-type h2 {
-  font-size: 2rem;
+  font-size: 1.75rem;
 }
 article:first-of-type h3 {
-  font-size: 1.45rem;
+  font-size: 1.25rem;
 }
 article:first-of-type h4 {
-  font-size: 1.45rem;
+  font-size: 1.25rem;
 }
 article:first-of-type h5 {
-  font-size: 1.45rem;
+  font-size: 1.25rem;
 }
 article:first-of-type h6 {
   font-size: 1.25rem;
 }
 article:first-of-type p {
-  line-height: 32px;
+  margin-bottom: 0.7rem;
-  margin-top: 0.86em;
+  line-height: 1.8em;
-  margin-bottom: 1.5em;
-  font-size: 18px;
-  color: rgb(41, 41, 41);
-}
-@media (min-width: 768px) {
-  article:first-of-type p {
-    font-size: 20px;
-  }
 }
 article:first-of-type figure {
   text-align: center;
 }
 
+.article,
+.blog {
+  font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif;
+  font-size: 20px;
+}
+.article table,
+.blog table {
+  color: rgb(41, 41, 41);
+  font-size: 18px;
+}
+@media (min-width: 768px) {
+  .article table,
+.blog table {
+    font-size: 20px;
+  }
+}
+.article ul,
+.article ol,
+.blog ul,
+.blog ol {
+  margin-top: 0.86em;
+  margin-bottom: 1.5em;
+}
+.article ul > li,
+.blog ul > li {
+  color: rgb(41, 41, 41);
+  font-size: 18px;
+  line-height: 32px;
+}
+@media (min-width: 768px) {
+  .article ul > li,
+.blog ul > li {
+    font-size: 20px;
+  }
+}
+.article ol > li,
+.blog ol > li {
+  color: rgb(41, 41, 41);
+  font-size: 18px;
+  line-height: 32px;
+}
+@media (min-width: 768px) {
+  .article ol > li,
+.blog ol > li {
+    font-size: 20px;
+  }
+}
+.article h1, .article h2, .article h3, .article h4, .article h5, .article h6,
+.blog h1,
+.blog h2,
+.blog h3,
+.blog h4,
+.blog h5,
+.blog h6 {
+  margin-bottom: 1rem;
+  font-weight: 600;
+}
+.article h1,
+.blog h1 {
+  font-size: 2.45rem;
+}
+.article h2,
+.blog h2 {
+  font-size: 2rem;
+}
+.article h3,
+.blog h3 {
+  font-size: 1.45rem;
+}
+.article h4,
+.blog h4 {
+  font-size: 1.45rem;
+}
+.article h5,
+.blog h5 {
+  font-size: 1.45rem;
+}
+.article p,
+.blog p {
+  color: rgb(41, 41, 41);
+  font-size: 18px;
+  line-height: 32px;
+}
+@media (min-width: 768px) {
+  .article p,
+.blog p {
+    font-size: 20px;
+  }
+}
+
+.article {
+  padding-right: 180px;
+  padding-left: 180px;
+  padding-top: 18px;
+}
+@media only screen and (max-width: 599px) {
+  .article {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .article {
+    padding-right: 10px;
+    padding-left: 10px;
+  }
+}
+@media (min-width: 768px) {
+  .article {
+    padding-top: 38px;
+  }
+}
+.article p {
+  margin-top: 0.86em;
+  margin-bottom: 1.5em;
+}
+
+.blog {
+  padding-right: 70px;
+  padding-left: 70px;
+  padding-top: 20px;
+}
+@media only screen and (max-width: 599px) {
+  .blog {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .blog {
+    padding-right: 10px;
+    padding-left: 10px;
+  }
+}
+.blog p {
+  margin-top: 0.86em;
+  margin-bottom: 1.5em;
+}
+.blog p:first-child {
+  margin-top: 0;
+}
+
 .logo__link {
   display: block;
   height: 100%;
@@ -17850,8 +17945,6 @@ img {
   font-size: 16px;
   line-height: 1.8em;
   margin-bottom: 28px;
-  padding-left: 180px;
-  padding-right: 180px;
 }
 
 .blog-detail .inner-box .lower-box .column {

qdrant-landing/themes/qdrant/static/css/main.scss

@@ -6920,8 +6920,6 @@ img{
 	font-size:16px;
 	line-height:1.8em;
 	margin-bottom:28px;
-	padding-left:180px;
-	padding-right:180px;
 }
 
 .blog-detail .inner-box .lower-box .column{

qdrant-landing/themes/qdrant/static/css/responsive.css

@@ -975,11 +975,6 @@
     padding-left: 25px;
   }
 
-  .blog-detail .inner-box .lower-box article {
-    padding-left: 25px;
-    padding-right: 25px;
-  }
-
 }
 
 @media only screen and (max-width: 599px) {
@@ -1069,11 +1064,6 @@
     padding-left: 15px;
   }
 
-  .blog-detail .inner-box .lower-box article {
-    padding-left: 0;
-    padding-right: 0;
-  }
-
 }
 
 @media only screen and (max-width: 479px) {