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", "simplemde": "~1.11.2",
"datetimepicker": "~2.5.4", "datetimepicker": "~2.5.4",
"SpinKit": "~1.2.5", "SpinKit": "~1.2.5",
"jQuery.stickyFooter": "https://github.com/miWebb/jQuery.stickyFooter.git#~1.2.3",
"bootstrap-sass": "^3.3.7", "bootstrap-sass": "^3.3.7",
"list.js": "^1.4.1", "list.js": "^1.4.1",
"what-input": "^4.0.6" "what-input": "^4.0.6"

3
gulpfile.js
View file

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

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

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

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

@ -33,10 +33,20 @@ html {
body { body {
@include font-sans; @include font-sans;
width: 100%; width: 100%;
padding-top: $nav-height;
color: $c-text; color: $c-text;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
@media (max-width: $grid-float-breakpoint-max) { padding-top: $nav-height-mobile; } @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;
}
}

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

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