From 73ef2c557b4b888655516ee23af031768163788f Mon Sep 17 00:00:00 2001
From: mohamed chiheb ben jemaa <mc.benjemaa@gmail.com>
Date: Fri, 16 Aug 2019 04:28:33 +0100
Subject: [PATCH] adjust and center Blog links (#15541)

---
 layouts/blog/baseof.html | 16 ++++++++--------
 static/css/blog.css      | 15 +++++++++++++--
 2 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/layouts/blog/baseof.html b/layouts/blog/baseof.html
index 358cb7bd3c..85095f152c 100644
--- a/layouts/blog/baseof.html
+++ b/layouts/blog/baseof.html
@@ -20,15 +20,15 @@
 					<div class="widget-content">
 						{{ with site.Home.OutputFormats.Get "rss" -}}
 						<link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink | safeURL }}" title="{{ site.Title }}">
-						<a class="widget-link" href="{{ .Permalink | safeURL }}"> <i class="fas fa-rss fab-icon"> </i> RSS Feed </a>
+						<a class="widget-link" href="{{ .Permalink | safeURL }}"><div> <i class="fas fa-rss fab-icon"> </i> <div class="widget-link-text">RSS Feed</div></div> </a>
 						{{ end -}}
-						<a class="widget-link" href="https://kubernetes.io/docs/contribute/start/#write-a-blog-post"><i class="fa fa-edit fab-icon"></i> Submit a Post</a>
-						<a class="widget-link" href="https://twitter.com/kubernetesio"> <i class="fab fa-twitter-square fab-icon"> </i> @Kubernetesio</a>
-						<a class="widget-link" href="https://github.com/kubernetes/kubernetes"> <i class="fab fa-github-square fab-icon"></i> View on GitHub </a>
-						<a class="widget-link" href="http://slack.k8s.io"><i class="fab fa-slack fab-icon"> </i> #kubernetes-users </a>
-						<a class="widget-link" href="https://stackoverflow.com/questions/tagged/kubernetes"><i class="fab fa-stack-overflow fab-icon"></i> Stack Overflow</a>
-						<a class="widget-link" href="https://discuss.kubernetes.io"><i class="fab fa-discourse fab-icon"></i>Forum</a>
-						<a class="widget-link" href="https://kubernetes.io/docs/setup"><i class="fa fa-download fab-icon"></i> Download Kubernetes</a>
+						<a class="widget-link" href="https://kubernetes.io/docs/contribute/start/#write-a-blog-post"><div> <i class="fa fa-edit fab-icon"></i> <div class="widget-link-text">Submit a Post</div></div></a>
+						<a class="widget-link" href="https://twitter.com/kubernetesio"><div> <i class="fab fa-twitter-square fab-icon"> </i> <div class="widget-link-text"> @Kubernetesio</div></div></a>
+						<a class="widget-link" href="https://github.com/kubernetes/kubernetes"><div> <i class="fab fa-github-square fab-icon"></i> <div class="widget-link-text"> on GitHub </div></div></a>
+						<a class="widget-link" href="http://slack.k8s.io"><div><i class="fab fa-slack fab-icon"> </i> <div class="widget-link-text">#kubernetes-users </div></div></a>
+						<a class="widget-link" href="https://stackoverflow.com/questions/tagged/kubernetes"><div><i class="fab fa-stack-overflow fab-icon"></i> <div class="widget-link-text"> Overflow</div></div></a>
+						<a class="widget-link" href="https://discuss.kubernetes.io"><div> <i class="fab fa-discourse fab-icon"></i><div class="widget-link-text"> Forum </div></div></a>
+						<a class="widget-link" href="https://kubernetes.io/docs/setup"><div><i class="fa fa-download fab-icon"></i> <div class="widget-link-text"> Kubernetes</div></div></a>
 					</div>
 					{{ partialCached "blog/archive.html" . }}
 				</div>
diff --git a/static/css/blog.css b/static/css/blog.css
index 7098e241ea..c584ee4e53 100644
--- a/static/css/blog.css
+++ b/static/css/blog.css
@@ -271,7 +271,7 @@ h3.post-title{
   box-sizing: border-box;
   padding: 0 0 0 15px;
   margin: 10px 0;
-  line-height: 40px;
+  line-height: 50px;
   white-space: nowrap;
   font-family: Roboto, sans-serif;
 }
@@ -401,10 +401,21 @@ ul {
 
 /* Sidebar Icon Styles */
 .widget-link svg {
-  font-size: 48px;
+  font-size: 40px;
   color:#326DE6;
+  vertical-align: middle;
+  width: 40px !important;
 }
 
+.widget-link div {
+  display: flex;
+}
+
+.widget-link .widget-link-text {
+  margin-left: 6px;
+}
+
+
 /* SideNavigation Styles */
 .heading-year-toggle-checkbox,
 .heading-month-toggle-checkbox{