From 291a21897a558e7d2ce788000ae5c4e41679028e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sergio=20Abreu=20Garc=C3=ADa?= Date: Mon, 15 Oct 2018 22:52:45 +0200 Subject: Example site added to documentation. Fixed navbar heigh bug on vertical layout. --- README.md | 3 ++- assets/sass/partials/_navbar.scss | 1 + exampleSite/content/1 About.md | 4 +++- ...a.scss_b27f143fe5adcb935bdf6c4b60c97419.content | 25 ++++++++++++---------- 4 files changed, 20 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index 22564ce..5eaf089 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,8 @@ simplicity and elegance. I love challenges, and making a single page application using Hugo, a static site generator, seemed like a good one. The SPA core is made using plain Javascript (only JQuery is used for the Ajax requests). I aim to provide a simple but powerful design anyone can use, either -for personal or professional matters. +for personal or professional matters. [Here](https://saggamedeveloper.github.io/Cafe-website-SPA/) +you can see a working site example using this theme. If you make any website using this theme I encourage you to open an issue, I will be glad to showcase your site. diff --git a/assets/sass/partials/_navbar.scss b/assets/sass/partials/_navbar.scss index ff14e65..28e75fc 100644 --- a/assets/sass/partials/_navbar.scss +++ b/assets/sass/partials/_navbar.scss @@ -6,6 +6,7 @@ text-align: center; min-height: 1.3rem; + @include respond-to(vertical-layout) { min-height: 0; } overflow: hidden; diff --git a/exampleSite/content/1 About.md b/exampleSite/content/1 About.md index b751ed0..73a838d 100644 --- a/exampleSite/content/1 About.md +++ b/exampleSite/content/1 About.md @@ -14,7 +14,9 @@ simplicity and elegance.

I love challenges, and making a single page application using Hugo, a static site generator, seemed like a good one. The SPA core is made using plain Javascript (only JQuery is used for the Ajax requests). I aim to provide a simple but powerful design anyone can use, either -for personal or professional matters.

+for personal or professional matters. +Here +you can see a working site example using this theme.

If you make any website using this theme I encourage you to open an issue, I will be glad to showcase your site.

diff --git a/resources/_gen/assets/scss/sass/hugo_minimalist_spa.scss_b27f143fe5adcb935bdf6c4b60c97419.content b/resources/_gen/assets/scss/sass/hugo_minimalist_spa.scss_b27f143fe5adcb935bdf6c4b60c97419.content index d051e58..7822cd3 100644 --- a/resources/_gen/assets/scss/sass/hugo_minimalist_spa.scss_b27f143fe5adcb935bdf6c4b60c97419.content +++ b/resources/_gen/assets/scss/sass/hugo_minimalist_spa.scss_b27f143fe5adcb935bdf6c4b60c97419.content @@ -44,7 +44,7 @@ a { -ms-transition: color 0.3s ease; -o-transition: color 0.3s ease; transition: color 0.3s ease; - color: #FFC98A; } + color: #8cadbd; } .social-media-element { -webkit-transition: fill 0.3s ease; @@ -76,7 +76,7 @@ a { -ms-transition: fill 0.3s ease; -o-transition: fill 0.3s ease; transition: fill 0.3s ease; - fill: #FFB865; } + fill: #386d7a; } .tabs-list a { color: #1f84b6; @@ -132,7 +132,7 @@ a { flex-direction: row; justify-content: space-evenly; align-items: center; - background-color: #111111; + background-color: #2b0f04; color: black; } @media only screen and (max-width: 820px) and (orientation: portrait) { .general-layout { @@ -194,14 +194,14 @@ a { justify-content: center; align-items: center; align-content: center; - color: #1f84b6; + color: #8cadbd; max-height: 100%; width: 100%; height: 100%; margin: 0; } .social-media-element { - fill: #1f84b6; + fill: #8cadbd; width: calc(13% + 0.8rem); margin: calc(1% + 0.15rem); } @media only screen and (max-width: 820px) and (orientation: portrait) { @@ -247,11 +247,11 @@ a { .tabs-list { margin: 0 1.2rem; } .tabs-list h1 { - color: #5863b8; } + color: #4a8fa0; } .tabs-list h2 { - color: #505792; } + color: #3d7887; } .tabs-list h3 { - color: #464c7d; } + color: #2d5e6a; } .tabs-list p, .tabs-list h1, .tabs-list h2, .tabs-list h3, .tabs-list a { overflow: visible; } @@ -273,18 +273,21 @@ a { text-align: center; min-height: 1.3rem; overflow: hidden; - background-color: #474747; + background-color: #e7c19c; -webkit-transition: max-height 0.7s; -moz-transition: max-height 0.7s; -ms-transition: max-height 0.7s; -o-transition: max-height 0.7s; transition: max-height 0.7s; } + @media only screen and (max-width: 820px) and (orientation: portrait) { + .navbar { + min-height: 0; } } @media only screen and (max-width: 820px) and (orientation: portrait) { .navbar { width: 100%; } } .navbar-element { - color: white; + color: #386d7a; font-family: 'default'; font-weight: 700; margin: 1.2rem 0 0.6rem 0; @@ -297,7 +300,7 @@ a { font-size: calc(1.2rem); } } .collapsible-menu { - fill: white; + fill: #386d7a; align-self: center; width: 1.5rem; height: 1.5rem; } -- cgit v1.2.3