Fixing page width overflow after bottom cards change (#276)

Author: lidiazuin

preview-src/docs-hub.adoc

@@ -7,15 +7,15 @@
 // :page-disablefeedback: true
 :page-toclevels: -1
 
-[.display.cards.not-selectable]
+[.cards.not-selectable]
 == Developer tools documentation
 
 Use Neo4j tools to query and manage your databases, import data, and create graphical visualizations. 
 
 === Neo4j Bloom/Explore
 
 [.icon]
-image:icons/ndl/science-molecule.svg[]
+image:icons/ndl/icon-scientist.svg[]
 
 [.description]
 Visualize and explore graph data using natural language search and an intuitive and graphical interface.
@@ -27,7 +27,7 @@ link:{docs-home}/aura/preview/explore/introduction/[Explore (Aura)]
 === Neo4j Browser/Query
 
 [.icon]
-image:icons/ndl/data-science.svg[]
+image:icons/ndl/icon-scientist.svg[]
 
 [.description]
 Write and execute Cypher queries and visualize the results in nodes and relationships.
@@ -44,7 +44,7 @@ link:{docs-home}/aura/preview/query/introduction/[Query (Aura)]
 Neo4j Data Importer
 
 [.icon]
-image:icons/ndl/query-browser.svg[]
+image:icons/ndl/icon-scientist.svg[]
 
 [.description]
 Learn how to model and import data to your Neo4j database.
@@ -60,7 +60,7 @@ link:{docs-home}/data-importer[]
 Neo4j Desktop
 
 [.icon]
-image:icons/ndl/neo4j-tools.svg[]
+image:icons/ndl/icon-scientist.svg[]
 
 [.description]
 Learn how to experience Neo4j on your local desktop.
@@ -73,7 +73,7 @@ link:{docs-home}/desktop-manual[]
 === Neo4j Ops Manager
 
 [.icon]
-image:icons/ndl/query-browser.svg[]
+image:icons/ndl/icon-scientist.svg[]
 
 [.category]
 Neo4j Ops Manager

preview-src/docs-ndl.adoc

@@ -199,7 +199,7 @@ xref:tutorials:index.adoc[All tutorials]
 --
 
 
-[.cards.icon-s.align-center]
+[.cards.bottom-cards]
 == Other resources
 
 === Join forums and discussions

src/css/docs-ndl.css

@@ -588,6 +588,11 @@ body.docs-ndl .cards .sectionbody > div.sect2 {
   /* margin-right: 1rem; */
 }
 
+body.docs-ndl .cards.bottom-cards .sectionbody > div.sect2 {
+  flex: 0 1 49%;
+}
+  /* margin-right: 1rem; */
+
 body.docs-ndl.explainer .sectionbody > div.sect2 {
   flex: 0 1 49%;
 }
@@ -733,11 +738,6 @@ body.docs-ndl .widget.highlights:nth-of-type(even) .openblock {
   /* margin-right:40px; */
 }
 
-/* For the bottom cards */
-body.docs-ndl .cards:nth-last-child(-n+2) .sectionbody {
-  flex: 0 0 152%;
-}
-
 body.docs-ndl body.docs-ndl .cards .sect2 .icon img {
   width: 4rem;
   height: 4rem;
@@ -940,6 +940,7 @@ body.docs-ndl .cards .sect2 .ulist ul li {
     margin: 1rem auto;
   }
 
+  body.docs-ndl .bottom-cards .sect2 > a,
   body.docs-ndl .cards .sect2 > a {
     align-items: center;
   }
@@ -953,6 +954,7 @@ body.docs-ndl .cards .sect2 .ulist ul li {
     text-align: left;
   }
 
+  body.docs-ndl .cards.bottom-cards .sectionbody > div.sect2,
   body.docs-ndl .cards .sectionbody > div.sect2 {
     /* min-width: 90%; */
     flex: 1 1 100%;