From 780d4712e2097ff68ad4cd1dd04a6d34e5216b52 Mon Sep 17 00:00:00 2001
From: Jacek Lebioda <jacek.lebioda@uni.lu>
Date: Wed, 3 Jul 2019 15:09:39 +0200
Subject: [PATCH] Responsive footer
---
_sass/elixir/_layout.scss | 35 ++++++++++++++++++++++++++++++-----
elixir-theme.gemspec | 2 +-
2 files changed, 31 insertions(+), 6 deletions(-)
diff --git a/_sass/elixir/_layout.scss b/_sass/elixir/_layout.scss
index f7d97e7..7ff42ca 100644
--- a/_sass/elixir/_layout.scss
+++ b/_sass/elixir/_layout.scss
@@ -138,10 +138,18 @@
#site-footer-primary {
#site-footer-primary-wrapper {
display: flex;
- flex-direction: row;
+ flex-direction: column;
+ flex-wrap: wrap;
background: #3e3e3e;
font-size: 0.875rem;
- padding-left: 13%;
+
+ @media only screen and (min-width: 600px) {
+ padding-left: 13%;
+ }
+
+ @media only screen and (max-width: 600px) {
+ padding-left: 2%;
+ }
div {
margin-left: 15px;
@@ -207,10 +215,18 @@
#site-footer-secondary-wrapper {
background: #023452;
border-top: 1px solid #333;
- padding-left: 13%;
color: #ebebeb;
font-size: 0.875rem;
display: flex;
+ flex-wrap: wrap-reverse;
+
+ @media only screen and (min-width: 600px) {
+ padding-left: 13%;
+ }
+
+ @media only screen and (max-width: 600px) {
+ padding-left: 2%;
+ }
div {
margin-left: 15px;
@@ -221,8 +237,17 @@
padding-inline-start: 0px;
padding-right: 100px;
- li {
- display: inline-block;
+ @media only screen and (min-width: 600px) {
+ li {
+ display: inline-block;
+ }
+ }
+
+ @media only screen and (max-width: 600px) {
+ li {
+ display: list-item;
+ margin-top: 7px;
+ }
}
a {
diff --git a/elixir-theme.gemspec b/elixir-theme.gemspec
index 4341833..a13eb10 100644
--- a/elixir-theme.gemspec
+++ b/elixir-theme.gemspec
@@ -2,7 +2,7 @@
Gem::Specification.new do |spec|
spec.name = "elixir-theme"
- spec.version = "0.1.36"
+ spec.version = "0.2.1"
spec.authors = ["jacek.lebioda"]
spec.email = ["jacek.lebioda@uni.lu"]
--
GitLab