Improve "Languages" widget appearance

Related to a70c0e7

README.md

@@ -67,7 +67,7 @@ googleAnalytics = "" # Enable Google Analytics by entering your tracking id
   authorbox = true # Show authorbox at bottom of pages if true
   toc = true # Enable Table of Contents
   post_navigation = true # Show post navigation at bottom of pages if true
-  # post_meta = ["date", "categories"] # Order of post meta information. Use ["none"] to turn off completely.
+  # post_meta = ["date", "categories", "translations"] # Order of post meta information. Use ["none"] to turn off completely.
   postSections = ["post"] # the section pages to show on home page and the "Recent articles" widget
   #postSections = ["blog", "news"] # alternative that shows more than one section's pages
   #dateformat = "2006-01-02" # change the format of dates
@@ -81,7 +81,7 @@ googleAnalytics = "" # Enable Google Analytics by entering your tracking id
   list = "left"  # Configure layout for list pages
   single = false # Configure layout for single pages
   # Enable widgets in given order
-  widgets = ["search", "recent", "categories", "taglist", "social"]
+  widgets = ["search", "recent", "categories", "taglist", "social", "languages"]
 
 [Params.widgets]
   recent_num = 5 # Set the number of articles in the "Recent articles" widget

layouts/partials/widgets/languages.html

@@ -5,7 +5,12 @@ <h4 class="widget__title">{{ T "languages_title" }}</h4>
 	<div class="widget__content">
 		<ul class="widget__list">
 			{{- range .Site.Home.AllTranslations }}
-			<li class="widget__item"><a class="widget-languages__link widget__link" href="{{ .RelPermalink }}"><span class="widget-languages__link-btn widget__link-btn btn">{{ .Language | upper }}</span><span class="widget-languages__link-text widget__link-text">{{ .Language.LanguageName | title | humanize }}</span></a></li>
+			<li class="widget__item">
+				<a class="widget-languages__link widget__link" href="{{ .RelPermalink }}">
+					<span class="widget-languages__link-btn widget__link-btn btn">{{ .Language | upper }}</span>
+					<span class="widget-languages__link-text widget__link-text">{{ .Language.LanguageName | title | humanize }}</span>
+				</a>
+			</li>
 			{{- end }}
 		</ul>
 	</div>

static/css/style.css

@@ -1097,6 +1097,20 @@ textarea {
 	text-transform: uppercase;
 }
 
+/* Languages Widget */
+.widget-languages__link {
+	display: block;
+}
+
+.widget-languages__link:hover .widget-languages__link-btn {
+	color: #fff;
+	background: #e64946;
+}
+
+.widget-languages__link-btn {
+	display: inline-block;
+}
+
 /* Footer */
 .footer {
 	padding: 10px 25px;