Style edits per Gratas's feedback

styles/_footer.scss

@@ -1,7 +1,11 @@
 /* Footer ------------------------------------------------------------------- */
 
 .xrpl-footer {
-  margin: 0 48px;
+  >:first-child {
+    border-top: 1px solid white;
+    padding: 100px 48px 48px 48px;
+  }
+
   @include media-breakpoint-down(md) {
     margin: 0 24px;
   }

styles/_landings.scss

@@ -201,17 +201,3 @@
 .landing a.card:hover h3 {
   text-decoration: underline;
 }
-
-/* "Related Projects" boxes -------------- */
-
-.interledger-link .project-icon {
-  width: 80px;
-}
-
-.xpring-link .project-icon {
-  height: 60px;
-  width: 100px;
-  line-height: 20px;
-  vertical-align: middle;
-  margin: 9px 0;
-}

styles/_layout.scss

@@ -29,7 +29,7 @@ section {
   box-sizing: border-box;
   justify-content: center;
   align-items: center;
-  border-radius: 8px;
+  border-radius: $border-radius-lg;
 
   &::before {
     content: '';
@@ -50,7 +50,6 @@ section {
   }
 }
 
-
 // Card Grid styles ------------------------------------------------------------
 
 .card-grid {

styles/_top-nav.scss

@@ -1,24 +1,24 @@
 /* Top navigation ----------------------------------------------------------- */
 .top-nav {
-  // Logo
+  margin-top: 20px;
 
+  // Logo
   .navbar-brand {
     text-decoration: none;
     white-space: pre;
     -webkit-transition: opacity 200ms ease, color 200ms ease;
     transition: opacity 200ms ease, color 200ms ease;
 
+    &:hover {
+      opacity: 0.75;
+    }
+
     @include media-breakpoint-down(md) {
       img {
         width: 120px;
       }
     }
   }
-  .navbar-brand:hover {
-    opacity: 1.0;
-    // Hack: turn white logo to approximately $green
-    filter: brightness(0.5) sepia(1) saturate(5000%) hue-rotate(114deg) brightness(1.96) saturate(87%);
-  }
 
   // Main Links ----------------------------------------------------------------
   .navbar-nav {
@@ -87,7 +87,7 @@
 
     .dropdown-item {
       line-height: 262%;
-      padding: 0 3rem;
+      padding: 0 .875rem;
 
       &:hover {
         color: $primary;
@@ -136,10 +136,14 @@
     .dropdown-menu {
       border-width: 1px;
       backdrop-filter: blur(8px);
-      border-radius: 8px;
+      border-radius: $border-radius-lg;
-      padding: 0.5rem 1rem;
+      padding: 0.5rem 0.75rem;
       min-width: 250px;
 
+      &.smaller-dropdown {
+        min-width: unset;
+      }
+
       .dropdown-item {
         line-height: 44px;
       }
@@ -158,6 +162,11 @@
       flex-grow: 1;
     }
 
+    #topsearchbox:active {
+      box-shadow: none;
+      border-color: $white;
+    }
+
     @include media-breakpoint-up(lg) { // Desktop search styling ---------------
       position: static; // allows search bar to be positioned screen-center
       .dropdown-toggle {
@@ -166,7 +175,7 @@
 
       .dropdown-menu {
         padding: 0;
-        border-radius: 8px;
+        border-radius: $border-radius-lg;
         width: 640px;
         left: calc(50% - 320px);
         background-color: $gray-900;
@@ -186,7 +195,7 @@
         border-left: 1px solid black;
       }
     }
-    @include media-breakpoint-down(lg) { // Mobile search styling --------------
+    @include media-breakpoint-down(md) { // Mobile search styling --------------
       .form-inline label {
         margin-bottom: 0;
 
@@ -215,7 +224,7 @@
     .algolia-autocomplete .ds-dropdown-menu [class^="ds-dataset-"] {
       background-color: rgba(0,0,0,0.9);
       border: 1px solid $gray-900;
-      border-radius: 8px;
+      border-radius: $border-radius-lg;
     }
     .algolia-autocomplete .ds-dropdown-menu::before {
       background-color: rgba(0,0,0,0.9);

styles/xrpl.scss

@@ -8,8 +8,8 @@ $nav-link-padding-y: 1rem;
 $navbar-nav-link-padding-x: 1.25rem;
 $navbar-nav-link-padding-y: 1rem;
 $border-radius: 0;
-$border-radius-lg: 0;
+$border-radius-lg: 8px;
-$border-radius-sm: 0;
+$border-radius-sm: 4px;
 $dropdown-border-width: 1px;
 
 $input-btn-padding-y: 1rem;

tool/template-footer.html

@@ -1,5 +1,5 @@
 <footer class="xrpl-footer" role="contentinfo">
-  <section class="container-fluid card-grid card-grid-Nx1">
+  <section class="container card-grid card-grid-Nx1">
     {% set funnels = [] %}
     {% for page in pages %}
       {% if page.funnel is defined and page.funnel not in funnels %}
@@ -21,7 +21,7 @@
     {% endfor %}
   </section>
 
-  <section class="container-fluid p-5 pl-sm-0">
+  <section class="container">
 
     <div class="absolute_bottom_footer">
       <span>&copy; XRP Ledger Project 2020</span>

tool/template-home.html

@@ -85,17 +85,17 @@
         <div class="w-100 mt-20"></div>
 
         <div class="card-deck">
-            <div class="card rounded hc mb-10" id="hc-1">
+            <div class="card rounded-lg hc mb-10" id="hc-1">
               <h3 class="mb-12 h2">{% trans %}Uses of XRP{% endtrans %}</h3>
               <p>{% trans %}XRP is helping solve previously unsolvable problems for people and industries around the world, and is one of the only digital assets with a commercial use case.{% endtrans %}</p>
               <a href="uses.html" class="arrow-link mt-12 text-white">{% trans %}Explore Uses{% endtrans %}</a>
             </div>
-            <div class="card rounded hc mb-10" id="hc-2">
+            <div class="card rounded-lg hc mb-10" id="hc-2">
               <h3 class="mb-12 h2">{% trans %}Businesses on the Ledger{% endtrans %}</h3>
               <p class="pb-lg-4">{% trans %}From gaming to web monetization, XRP and the XRP Ledger are powering innovative new technology across the payments space.{% endtrans %}</p>
               <a href="businesses.html" class="arrow-link mt-12 text-white">{% trans %}Explore Businesses{% endtrans %}</a>
             </div>
-            <div class="card rounded hc mb-10" id="hc-3">
+            <div class="card rounded-lg hc mb-10" id="hc-3">
               <h3 class="mb-12 h2">{% trans %}Real-World Impact{% endtrans %}</h3>
               <p class="pb-lg-4">{% trans %}With its real-world utility and inherently green design, XRP helps ensure a more sustainable future for our planet and global economy.{% endtrans %}</p>
               <a href="impact.html" class="arrow-link mt-12 text-white">{% trans %}Explore Impact{% endtrans %}</a>

tool/template-top-nav.html

@@ -67,7 +67,7 @@
         <a class="nav-link dropdown-toggle with-caret" type="button" id="language_selector_header_btn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
           {{(config.languages|selectattr('code', 'eq', target.lang)|first).display_name}}
         </a>
-        <div class="dropdown-menu" aria-labelledby="language_selector_header_btn">
+        <div class="dropdown-menu smaller-dropdown" aria-labelledby="language_selector_header_btn">
           {% for lang in config.languages %}
           <a class="dropdown-item" href="{{lang.prefix}}{{currentpage.html}}">{{lang.display_name}}</a>
           {% endfor %}