Merge pull request #17 from 2martens/style-fixes

Fixes menu visibility and footer size
This commit is contained in:
Jim Martens 2017-12-29 12:31:19 +01:00 committed by GitHub
commit 25c42852f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 34 additions and 9 deletions

View File

@ -22,7 +22,7 @@ $navbarHeight: 58px;
#main {
margin-top: $navbarHeight + 15px;
margin-bottom: 295px;
margin-bottom: $navbarHeight + 15px;
}
#main.submenu {
@ -56,4 +56,16 @@ $navbarHeight: 58px;
.card.sidebar {
width: 20rem;
}
@include media-breakpoint-up(md) {
#main {
margin-bottom: 295px;
}
}
@include media-breakpoint-down(sm) {
.md-up {
display: none;
}
}

View File

@ -1,3 +1,14 @@
//= require popper
//= require bootstrap/util
//= require bootstrap/collapse
"use strict";
$(function() {
let mainMenu = $('#mainmenuNavbar');
mainMenu.on('show.bs.collapse', function (e) {
$('#submenuNavbar').addClass('invisible');
});
mainMenu.on('hidden.bs.collapse', function (e) {
$('#submenuNavbar').removeClass('invisible');
});
});

View File

@ -1,7 +1,7 @@
<footer class="site-footer small text-muted py-3 fixed-bottom">
<div class="container">
<div class="row">
<div class="col-sm-4">
<div class="col-md-4">
<nav>
<ul class="nav">
{% for item in site.data.footer-menu.items %}
@ -12,12 +12,14 @@
</ul>
</nav>
{% if site.data.promotion.show %}
<a href="{{ site.data.promotion.link }}">
<img src="{{ site.data.promotion.image }}" alt="{{ site.data.promotion.title }} promotional image" />
</a>
<div class="md-up">
<a href="{{ site.data.promotion.link }}">
<img src="{{ site.data.promotion.image }}" alt="{{ site.data.promotion.title }} promotional image" />
</a>
</div>
{% endif %}
</div>
<div class="col-sm-8">
<div class="col-md-8 md-up">
<ul class="list-unstyled">
{% if site.data.author.github_username %}
<li>

View File

@ -1,5 +1,5 @@
<header class="site-header">
<nav class="navbar navbar-expand-lg navbar-light fixed-top">
<nav id="mainmenuNavbar" class="navbar navbar-expand-lg navbar-light fixed-top">
<div class="container">
<a class="navbar-brand" href="{{ site.baseurl }}/">
<img src="{{ site.data.author.brand_logo }}" width="30" height="30" class="d-inline-block align-top"

View File

@ -25,10 +25,10 @@
{% endif %}
<div class="container">
<div class="row">
<main class="col-sm-9">
<main class="col-md-9">
{{ content }}
</main>
<div class="col-sm-3">
<div class="col-md-3">
{% include sidebar.html %}
</div>
</div>