kevin/hypothetical
1
0
Fork 0
mirror of https://github.com/prurigro/hypothetical.git synced 2024-11-22 07:54:11 -05:00
Code Issues Projects Releases Packages Wiki Activity

Replace the sticky footer with flexbox

Browse source
This commit is contained in:
Kevin MacMartin 2017-01-26 19:25:22 -05:00
parent ce9973caab
commit baa0c8b56a
5 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
bower.json
View file

@ -14,7 +14,6 @@
"simplemde": "~1.11.2",
"datetimepicker": "~2.5.4",
"SpinKit": "~1.2.5",
"jQuery.stickyFooter": "https://github.com/miWebb/jQuery.stickyFooter.git#~1.2.3",
"bootstrap-sass": "^3.3.7",
"list.js": "^1.4.1",
"what-input": "^4.0.6"

3
gulpfile.js
View file

@ -33,8 +33,7 @@ const jsPublic = [
const jsPublicLibs = [
"bower_components/jquery/dist/jquery.js",
"bower_components/bootstrap-sass/assets/javascripts/bootstrap.js",
"bower_components/what-input/dist/what-input.js",
"bower_components/jQuery.stickyFooter/assets/js/jquery.stickyfooter.js"
"bower_components/what-input/dist/what-input.js"
];
// javascript files for the dashboard

3
resources/assets/js/app.js
View file

@ -1,8 +1,5 @@
// run once the document is ready
$(document).ready(function() {
$("footer").stickyFooter({ content: "#page-content" });
$(window).on("load", function() { $(this).trigger("resize"); });
switch (SiteVars.page) {
case "":
subscriptionFormInit();

12
resources/assets/sass/app.scss vendored
View file

@ -33,10 +33,20 @@ html {
body {
@include font-sans;
width: 100%;
padding-top: $nav-height;
color: $c-text;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-overflow-scrolling: touch;
@media (max-width: $grid-float-breakpoint-max) { padding-top: $nav-height-mobile; }
}
#page-container {
display: flex;
min-height: 100vh;
padding-top: $nav-height;
flex-direction: column;
#main-content {
flex: 1;
}
}

4
resources/views/layouts/base.blade.php
View file

@ -49,10 +49,12 @@
<body class="page-{{ $body_class }} {{ $device_mobile ? 'mobile-browser' : 'desktop-browser' }}">
@yield('page-top')
<div id="page-content">
<div id="page-container">
<div id="main-content">
@yield('content')
</div>
@yield('page-bottom')
</div>
</body>
</html>