Update menu

brenomfviana · Mar 10, 2019 · c71bc15 · c71bc15
1 parent 4332ed3
commit c71bc15
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -10,6 +10,8 @@
 
 ![SCREENSHOT](img/screenshot-ii.png)
 
+> NOTE: My cat is cute.
+
 ### On GitHub
 
 GitHub - for your user account pages or repository gh-pages - only supports a limited set of themes.

diff --git a/_includes/header.html b/_includes/header.html
@@ -13,7 +13,7 @@
 
 <aside class="menu">
 
-	<ul>
+	<ul class="top-menu">
 		{% if page.url != '/about' %}
 			{% assign link = '/about' %}
 			<li> <a href="{{ link | prepend: site.baseurl | prepend: site.url }}"> About </a> </li>
@@ -32,6 +32,8 @@
 		{% else %}
 			<li style="font-weight:bold;"> <a> Projects </a> </li>
 		{% endif %}
+	</ul>
+	<ul class="bottom-menu">
 		{% if page.url != '/talks' %}
 			{% assign link = '/talks' %}
 			<li> <a href="{{ link | prepend: site.baseurl | prepend: site.url }}"> Talks </a> </li>

diff --git a/_sass/main.scss b/_sass/main.scss
@@ -78,11 +78,25 @@ blockquote {
   padding: 5px 30px;
   background: #eee;
 }
+
 .menu {
   width: 100%;
   position: relative;
   margin: 0px auto 35px;
   text-align: center;
+  @media screen and (max-width: 420px) {
+    .top-menu {
+      width: 100%;
+      margin-bottom: 20px;
+    }
+    .bottom-menu {
+      width: 100%;
+    }
+  }
+  @media screen and (min-width: 420px) {
+    display: flex;
+    justify-content: center;
+  }
   ul {
     list-style-type: none;
     display: flex;