changed background of footer and features-section

Signed-off-by: Priyanshu Singh <reveur.guy99@gmail.com>

Author: reveurguy

themes/containerd/assets/sass/style.sass

@@ -256,3 +256,12 @@ hr.short-hr
 .subtitle strong
     color: white;
     font-weight: 600;
+
+.footer .container .columns .column ul li a, .footer .container .columns .column
+	color: white;
+
+.buttons
+	justify-content: space-around;
+
+.hr
+	margin: 1rem 0;

themes/containerd/layouts/index.html

@@ -20,7 +20,7 @@
       <br />
 
       <div class="buttons is-centered">
-        <a class="button is-large is-link is-rounded is-borderless has-text-weight-bold" href="/docs/getting-started">
+        <a class="button is-large is-rounded is-borderless has-text-weight-bold" href="/docs/getting-started">
           <span class="icon">
             <i class="fas fa-sm fa-play"></i>
           </span>
@@ -75,15 +75,15 @@
   </div>
 </section>
 
-<section class="section is-grey" id="features">
+<section class="section has-background-pattern has-text-white" id="features">
   <div class="container">
     <div class="columns">
       <div class="column is-one-quarter">
         <p class="is-size-3 is-size-4-mobile has-text-weight-semibold">
           Features
         </p>
 
-        <hr class="short-hr is-black" />
+        <hr class="short-hr" />
       </div>
 
       <div class="column">

themes/containerd/layouts/partials/footer.html

@@ -1,4 +1,4 @@
-{{- $logo          := "img/logos/footer-logo.png" | relURL }}
+{{- $logo          := "/img/logos/navbar-light-logo.png" | relURL }}
 {{- $docs          := where .Site.Pages "Section" "docs" }}
 {{- $year          := now.Year }}
 {{- $twitterHandle := .Site.Params.twitterHandle }}
@@ -7,19 +7,19 @@
 {{- $githubUrl     := printf "https://github.com/%s" $githubRepo }}
 {{- $slackChannel  := .Site.Params.slackChannel }}
 {{- $projectPages  := where .Site.RegularPages "Section" "" }}
-<div class="footer">
+<div class="footer has-background-pattern has-text-white">
   <div class="container">
     <div class="columns">
-      <div class="column">
-        <img src="{{ $logo }}" class="is-footer-logo" alt="containerd footer logo">
+      <div class="column" style="display: flex;justify-content: center;align-items: center;">
+        <img style=" transform: rotate(270deg) scale(1.7);" src="{{ $logo }}" class="is-footer-logo" alt="containerd footer logo">
       </div>
 
        <div class="column">
-        <span class="is-size-4 is-size-5-mobile">
+        <span class="is-size-4 is-size-5-mobile has-text-weight-bold">
           Docs
         </span>
 
-        <hr class="hr has-background-grey">
+        <hr class="hr  ">
 
         <ul>
           {{- range $docs }}
@@ -33,11 +33,11 @@
       </div>
 
       <div class="column">
-        <span class="is-size-4 is-size-5-mobile">
+        <span class="is-size-4 is-size-5-mobile  has-text-weight-bold">
           Project
         </span>
 
-        <hr class="hr has-background-grey">
+        <hr class="hr  ">
 
         <ul>
           <li>
@@ -57,14 +57,14 @@
       </div>
 
       <div class="column">
-        <span class="is-size-4 is-size-5-mobile">
+        <span class="is-size-4 is-size-5-mobile  has-text-weight-bold">
           Community
         </span>
 
-        <hr class="hr has-background-grey">
+        <hr class="hr  ">
 
         <div class="buttons">
-          <a class="button has-background-twitter-blue is-borderless has-text-white" href="{{ $twitterUrl }}">
+          <a class="button is-medium has-background-twitter-blue is-borderless has-text-white has-text-weight-semibold" href="{{ $twitterUrl }}">
             <span class="icon">
               <i class="fab fa-twitter" aria-hidden="true"></i>
             </span>
@@ -73,16 +73,16 @@
             </span>
           </a>
 
-          <a class="button is-borderless has-background-black has-text-white" href="{{ $githubUrl }}">
+          <a class="button is-medium is-borderless has-background-white has-text-black has-text-weight-semibold" href="{{ $githubUrl }}">
             <span class="icon">
-              <i class="fab fa-github" aria-hidden="true"></i>
+              <i style="color:black" class="fab fa-github" aria-hidden="true"></i>
             </span>
             <span>
               GitHub
             </span>
           </a>
 
-          <a class="button is-borderless has-background-slack-green has-text-white" href="{{ $slackChannel }}">
+          <a class="button is-medium is-borderless has-background-slack-green has-text-white has-text-weight-semibold" href="{{ $slackChannel }}">
             <span class="icon">
               <i class="fab fa-slack" aria-hidden="true"></i>
             </span>
@@ -95,19 +95,19 @@
       </div> <!-- .column -->
     </div> <!-- .column -->
 
-    <hr class="hr has-background-grey-lighter">
+    <hr style="background: transparent;" class="hr">
   </div> <!-- .columns -->
 
   <div class="container has-text-centered">
-    <div class="has-text-weight-light">
+    <div class="has-text-weight-normal">
       <p class="is-size-5 is-size-6-mobile">
         &copy; containerd Authors {{ $year }} | Documentation Distributed under <a href="https://creativecommons.org/licenses/by/4.0/">CC-BY-4.0</a>
       </p>
 
       <br />
 
       <p>
-        &copy; {{ $year }} The Linux Foundation. All rights reserved. The Linux Foundation has registered trademarks and uses trademarks. For a list of trademarks of The Linux Foundation, please see our <a href="https://www.linuxfoundation.org/trademark-usage">Trademark Usage</a> page.
+        &copy; {{ $year }} The Linux Foundation. All rights reserved. The Linux Foundation has registered trademarks and uses trademarks. For a list of trademarks of The Linux Foundation, please see our <a class="has-text-white" href="https://www.linuxfoundation.org/trademark-usage">Trademark Usage</a> page.
       </p>
     </div>
   </div> <!-- .container -->

themes/containerd/layouts/partials/navbar.html

@@ -64,7 +64,7 @@
             {{- end }}
 
             <a class="navbar-item" href="https://github.com/cncf/artwork/blob/master/examples/graduated.md#containerd-logos">
-              Containerd Branding
+              containerd branding
             </a>
           </div>
         </div> <!-- .navbar-item -->
@@ -78,9 +78,9 @@
                 </span>
               </a>
 
-              <a class="button is-borderless has-background-black has-text-white" href="{{ $githubUrl }}">
+              <a class="button is-borderless has-background-white has-text-white" href="{{ $githubUrl }}">
                 <span class="icon">
-                  <i class="fab fa-github" aria-hidden="true"></i>
+                  <i class="fab fa-github" aria-hidden="true" style="color:black"></i>
                 </span>
               </a>