UI: footer and headers
This commit is contained in:
parent
71fb210127
commit
5730c9bbff
|
@ -17392,6 +17392,7 @@ p:last-child {
|
|||
|
||||
.typography ul li {
|
||||
list-style: none;
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
|
||||
.typography ul li:before {
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@a2nt/ss-bootstrap-ui-webpack-boilerplate",
|
||||
"version": "2.0.2",
|
||||
"version": "2.0.3",
|
||||
"author": "Tony Air <tony@twma.pro>",
|
||||
"license": "MIT",
|
||||
"description": "This UI Kit allows you to build Bootstrap 4 webapp with some extra UI features. It's easy to extend and easy to convert HTML templates to CMS templates.",
|
||||
|
|
|
@ -0,0 +1,65 @@
|
|||
'use strict';
|
||||
|
||||
import Events from '../_events';
|
||||
|
||||
const HeaderUI = (($) => {
|
||||
const D = document;
|
||||
const W = window;
|
||||
const $Body = $('html,body');
|
||||
const NAME = 'HeaderUI';
|
||||
const CLASSNAME = `js${NAME}`;
|
||||
|
||||
class HeaderUI {
|
||||
static init() {
|
||||
const ui = this;
|
||||
ui.dispose();
|
||||
|
||||
if (!$(`.${CLASSNAME}`).length) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(`Initializing: ${NAME}`);
|
||||
|
||||
const $header = $('#Header,.jsHeaderUI');
|
||||
const updateHeader = () => {
|
||||
const h = $header.height();
|
||||
const s = $Body.scrollTop();
|
||||
if (s > h) {
|
||||
$Body.addClass('shrink');
|
||||
} else {
|
||||
$Body.removeClass('shrink');
|
||||
}
|
||||
};
|
||||
|
||||
updateHeader();
|
||||
$Body.on('scroll resize', () => {
|
||||
updateHeader();
|
||||
});
|
||||
|
||||
const updateFooter = (i, el) => {
|
||||
const $el = $(el);
|
||||
$el.css('height', 'auto');
|
||||
const footerHeight = $el.height();
|
||||
|
||||
$el.css('margin-top', -footerHeight);
|
||||
$el.siblings('.wrapper').css('padding-bottom', footerHeight);
|
||||
};
|
||||
|
||||
$('.footer,.jsFooterUI').each(updateFooter);
|
||||
}
|
||||
|
||||
static dispose() {
|
||||
console.log(`Destroying: ${NAME}`);
|
||||
}
|
||||
}
|
||||
|
||||
$(W).on(`${Events.AJAX} ${Events.LOADED}`, () => {
|
||||
HeaderUI.init();
|
||||
});
|
||||
|
||||
W.HeaderUI = new HeaderUI();
|
||||
|
||||
return HeaderUI;
|
||||
})($);
|
||||
|
||||
export default HeaderUI;
|
|
@ -11,6 +11,7 @@ import Spinner from './_components/_ui.spinner';
|
|||
import AjaxUI from './_components/_ui.ajax';
|
||||
|
||||
import FormBasics from './_components/_ui.form.basics';
|
||||
import HeaderUI from './_components/_ui.header-footer';
|
||||
|
||||
import SmoothScroll from 'smooth-scroll';
|
||||
const smoothScroll = SmoothScroll();
|
||||
|
|
|
@ -114,6 +114,7 @@ ul {
|
|||
|
||||
li {
|
||||
list-style: none;
|
||||
margin: 0.5em 0;
|
||||
|
||||
&:before {
|
||||
content: '\2022';
|
||||
|
|
Loading…
Reference in New Issue