OCram85/beautifulSA-jekyll
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

change width of navbar collapse; fixes #719

Browse Source
This commit is contained in:
Dean Attali 2020-09-16 03:38:58 +00:00
parent d5859860e3
commit c54c6bd9e9
3 changed files with 13 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@ -1,3 +1,7 @@
## Unreleased version
- Changed the width at which the navbar collapses to a higher threshold because most modern non-mobile browsers are >1000px
## v5.0.0 (2020-09-15) ## v5.0.0 (2020-09-15)
One of the major changes in this version is that a lot of time was spent on rethinking the entire SEO and social media sharing model (how a page looks on eg. Google, Twitter, Facebok). It was redesigned to be more simple and customizable. The new documentation has a section dedicated to SEO and social media sharing of a page. Unfortunately some changes that are not backwards-compatible had to be made. One of the major changes in this version is that a lot of time was spent on rethinking the entire SEO and social media sharing model (how a page looks on eg. Google, Twitter, Facebok). It was redesigned to be more simple and customizable. The new documentation has a section dedicated to SEO and social media sharing of a page. Unfortunately some changes that are not backwards-compatible had to be made.

2
_includes/nav.html
View File

@ -1,4 +1,4 @@
<nav class="navbar navbar-expand-md navbar-light fixed-top navbar-custom {% if page.nav-short %}top-nav-short-permanent{% else %}top-nav-regular{% endif %}"> <nav class="navbar navbar-expand-lg navbar-light fixed-top navbar-custom {% if page.nav-short %}top-nav-short-permanent{% else %}top-nav-regular{% endif %}">
{%- if site.title-img -%} {%- if site.title-img -%}
<a class="navbar-brand navbar-brand-logo" href="{{ '' | absolute_url }}"><img alt="{{ site.title }} Logo" src="{{ site.title-img }}"/></a> <a class="navbar-brand navbar-brand-logo" href="{{ '' | absolute_url }}"><img alt="{{ site.title }} Logo" src="{{ site.title-img }}"/></a>

25
assets/css/beautifuljekyll.css
View File

@ -75,15 +75,6 @@ hr.small {
margin: -3.125rem 0 0; margin: -3.125rem 0 0;
} }
.main-content {
padding-top: 5rem;
}
@media (min-width: 768px) {
.main-content {
padding-top: 8.125rem;
}
}
.hideme { .hideme {
display: none; display: none;
} }
@ -228,7 +219,7 @@ img {
border-width: 0.4em; border-width: 0.4em;
} }
@media (min-width: 768px) { @media (min-width: 992px) {
.navbar-custom { .navbar-custom {
padding-top: 1.25rem; padding-top: 1.25rem;
padding-bottom: 1.25rem; padding-bottom: 1.25rem;
@ -243,17 +234,17 @@ img {
height: 3.125rem; height: 3.125rem;
} }
.navbar-expand-md .navbar-nav .nav-link { .navbar-expand-lg .navbar-nav .nav-link {
padding-left: 0.9375rem; padding-left: 0.9375rem;
padding-right: 0.9375rem; padding-right: 0.9375rem;
} }
.navbar-expand-md .navbar-nav .nav-item:not(.dropdown):last-child .nav-link { .navbar-expand-lg .navbar-nav .nav-item:not(.dropdown):last-child .nav-link {
padding-right: 0; padding-right: 0;
} }
} }
@media (min-width: 768px) { @media (min-width: 992px) {
.navbar-custom .nav-item.dropdown:hover { .navbar-custom .nav-item.dropdown:hover {
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
} }
@ -281,7 +272,7 @@ img {
font-weight: normal; font-weight: normal;
} }
@media (min-width: 768px) { @media (min-width: 992px) {
.navbar-custom .nav-item.dropdown .dropdown-menu { .navbar-custom .nav-item.dropdown .dropdown-menu {
text-align: center; text-align: center;
} }
@ -293,7 +284,7 @@ img {
} }
} }
@media (max-width: 767px) { @media (max-width: 991px) {
.navbar-custom .navbar-collapse { .navbar-custom .navbar-collapse {
border-top: 1px solid {{ site.navbar-border-col | default: "#DDDDDD" }}; border-top: 1px solid {{ site.navbar-border-col | default: "#DDDDDD" }};
margin: 0 -1rem; margin: 0 -1rem;
@ -355,7 +346,7 @@ img {
display: none; display: none;
} }
@media (min-width: 768px) { @media (min-width: 992px) {
.navbar-custom.top-nav-regular .avatar-container { .navbar-custom.top-nav-regular .avatar-container {
width: 6.25rem; width: 6.25rem;
} }
@ -701,7 +692,7 @@ nav.top-nav-short-permanent ~ header > .intro-header.big-img {
bottom: 0; bottom: 0;
display: none; display: none;
} }
@media (min-width: 768px) { @media (min-width: 992px) {
.intro-header { .intro-header {
margin-top: 8.125rem; margin-top: 8.125rem;
} }