Add language switch at bottom of page

1 files changed, 48 insertions, 0 deletions

diff --git a/assets/_main.scss b/assets/_main.scss
index 3cfb66d..ce810dd 100644
--- a/assets/_main.scss
+++ b/assets/_main.scss
@@ -227,6 +227,54 @@ ul.pagination {
   }
 }
 
+
+.book-languages {
+  position: relative;
+  overflow: visible;
+
+  padding: $padding-16;
+  margin: -$padding-16;
+
+  &:hover .book-languages-list {
+    display: block;
+  }
+
+  .book-languages-list {
+    display: none;
+
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    padding: $padding-8 0;
+
+    background: $body-background;
+    box-shadow: 0 0 $padding-4 rgba(0, 0, 0, 0.1);
+
+    li {
+      padding: $padding-8 $padding-16;
+      white-space: nowrap;
+    }
+
+    img {
+      opacity: .1;
+    }
+
+    li.active img {
+      opacity: 1;
+    }
+
+    a {
+      color: inherit;
+    }
+  }
+
+  ul {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+}
+
 .book-posts {
   min-width: $body-min-width;
   max-width: $body-min-width * 2;