Fix box-shadows for the bottom section cards.

Rachelwrq · Jan 23, 2018 · 655e15b · 655e15b
1 parent 90ade6f
commit 655e15b
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 19 deletions.
diff --git a/src/main/content/_assets/css/guide.css b/src/main/content/_assets/css/guide.css
@@ -21,10 +21,6 @@
     color: #24253a;
 }
 
-#guide_content #related_guides_header h2 {
-    margin-bottom: 32px;
-}
-
 #guide_content h3 {
     font-size: 16px;
     line-height: 26px;
@@ -63,7 +59,7 @@
 #guide_content code,
 #guide_content pre  {
     /* Bootstrap override */
-    background-color: #F3F4F7;
+    background-color: #FFFFFF;
     color: #5e6b8d;
 }
 
@@ -73,8 +69,8 @@
 }
 
 #guide_content pre {
-    border-radius: 0;
-    border: none;
+    border:5px solid #e8eaee;
+    border-radius:3px;
     padding: 30px;
     margin-top: 15px;
     margin-bottom: 15px;
@@ -87,19 +83,19 @@
 #guide_content div.sect1 {
     padding-bottom: 50px;
     margin-bottom: 10px;
-    padding-left: 50px;
-    padding-right: 50px;
+    padding-left: 60px;
+    padding-right: 60px;
     margin-left: -15px;
     margin-right: -15px;
     background-color: white;
 }
 
 #guide_content div.sect1:not(#guide_meta) {
-    box-shadow: inset 0px 94px 0px 0px #F7F9E5;
+    box-shadow: inset 0px 94px 0px 0px #F7F9E5, 0px 5px 11px -3px rgba(0,0,0,0.27);
 }
 
 #guide_content .sect1 h2 {
-    padding-top: 51px;
+    padding-top: 48px;
     margin-top: 10px;
     margin-bottom: 21px;
 }
@@ -150,12 +146,10 @@
 }
 
 #guide_column {
-    /* background-color: white; */
     color: #24253a;
-    /* padding-top: 45px;
-    padding-bottom: 90px;*/
-    /* padding-left: 50px;
-    padding-right: 50px; */
+}
+
+#guide_content > .sect1 {
     -webkit-box-shadow: 0px 5px 11px -3px rgba(0,0,0,0.27);
     -moz-box-shadow: 0px 5px 11px -3px rgba(0,0,0,0.27);
     box-shadow: 0px 5px 11px -3px rgba(0,0,0,0.27);

diff --git a/src/main/content/_assets/js/guide.js b/src/main/content/_assets/js/guide.js
@@ -162,7 +162,8 @@ $(document).ready(function() {
     if( $('#related-guides').length ) {
         // Add _one_ Related guides link to the very bottom of the table of contents.
         // The assumption is that the TOC only contains one `sectlevel1` class.
-        $('#toc_container ul.sectlevel1').append('<li><a href="#related-guides">Related guides</a></li>')
+        $('#toc_container ul.sectlevel1').append('<li><a href="#related-guides">Related guides</a></li>');
+        $('#related-guides').addClass('sect1');
     }
 
     // TABLE OF CONTENT

diff --git a/src/main/content/_layouts/guide.html b/src/main/content/_layouts/guide.html
@@ -52,8 +52,8 @@ <h1 id="guide_title">{{ page.title }}</h1>
 
                     <!-- Related guides section -->
                     {% if page.related-guides %}
-                    <div id="related-guides" class="row">
-                        <div id="related_guides_header" class="col-sm-12">
+                    <div id="related-guides" class="">
+                        <div id="related_guides_header" class="">
                             <h2>Related guides</h2>
                         </div>
                         {% for related-guide in page.related-guides %}