mirror of https://github.com/ColorlibHQ/AdminLTE
Raphael Jackstadt
GitHub
commit
ae419c1f72
|
|
@ -4,7 +4,8 @@ import PushMenu from './PushMenu'
|
|||
import Treeview from './Treeview'
|
||||
import DirectChat from './DirectChat'
|
||||
import TodoList from './TodoList'
|
||||
import Widget from './Widget'
|
||||
import CardWidget from './CardWidget'
|
||||
import CardRefresh from './CardRefresh'
|
||||
|
||||
export {
|
||||
ControlSidebar,
|
||||
|
|
@ -13,5 +14,6 @@ export {
|
|||
Treeview,
|
||||
DirectChat,
|
||||
TodoList,
|
||||
Widget
|
||||
CardWidget,
|
||||
CardRefresh
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,164 @@
|
|||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE CardRefresh.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
|
||||
const CardRefresh = (($) => {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
const NAME = 'CardRefresh'
|
||||
const DATA_KEY = 'lte.cardrefresh'
|
||||
const EVENT_KEY = `.${DATA_KEY}`
|
||||
const JQUERY_NO_CONFLICT = $.fn[NAME]
|
||||
|
||||
const Event = {
|
||||
LOADED: `loaded${EVENT_KEY}`,
|
||||
OVERLAY_ADDED: `overlay.added${EVENT_KEY}`,
|
||||
OVERLAY_REMOVED: `overlay.removed${EVENT_KEY}`,
|
||||
}
|
||||
|
||||
const ClassName = {
|
||||
CARD: 'card',
|
||||
}
|
||||
|
||||
const Selector = {
|
||||
CARD: `.${ClassName.CARD}`,
|
||||
DATA_REFRESH: '[data-card-widget="card-refresh"]',
|
||||
}
|
||||
|
||||
const Default = {
|
||||
source: '',
|
||||
sourceSelector: '',
|
||||
params: {},
|
||||
trigger: Selector.DATA_REFRESH,
|
||||
content: '.card-body',
|
||||
loadInContent: true,
|
||||
loadOnInit: true,
|
||||
responseType: '',
|
||||
overlayTemplate: '<div class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>',
|
||||
onLoadStart: function () {
|
||||
},
|
||||
onLoadDone: function (response) {
|
||||
return response;
|
||||
}
|
||||
}
|
||||
|
||||
class CardRefresh {
|
||||
constructor(element, settings) {
|
||||
this._element = element
|
||||
this._parent = element.parents(Selector.CARD).first()
|
||||
this._settings = $.extend({}, Default, settings)
|
||||
this._overlay = $(this._settings.overlayTemplate)
|
||||
|
||||
if (element.hasClass(ClassName.CARD)) {
|
||||
this._parent = element
|
||||
}
|
||||
|
||||
if (this._settings.source === '') {
|
||||
throw new Error('Source url was not defined. Please specify a url in your CardRefresh source option.');
|
||||
}
|
||||
|
||||
this._init();
|
||||
|
||||
if (this._settings.loadOnInit) {
|
||||
this.load();
|
||||
}
|
||||
}
|
||||
|
||||
load() {
|
||||
this._addOverlay()
|
||||
this._settings.onLoadStart.call($(this))
|
||||
|
||||
$.get(this._settings.source, this._settings.params, function (response) {
|
||||
if (this._settings.loadInContent) {
|
||||
if (this._settings.sourceSelector != '') {
|
||||
response = $(response).find(this._settings.sourceSelector).html()
|
||||
}
|
||||
|
||||
this._parent.find(this._settings.content).html(response)
|
||||
}
|
||||
|
||||
this._settings.onLoadDone.call($(this), response)
|
||||
this._removeOverlay();
|
||||
}.bind(this), this._settings.responseType !== '' && this._settings.responseType)
|
||||
|
||||
const loadedEvent = $.Event(Event.LOADED)
|
||||
$(this._element).trigger(loadedEvent)
|
||||
}
|
||||
|
||||
_addOverlay() {
|
||||
this._parent.append(this._overlay)
|
||||
|
||||
const overlayAddedEvent = $.Event(Event.OVERLAY_ADDED)
|
||||
$(this._element).trigger(overlayAddedEvent)
|
||||
};
|
||||
|
||||
_removeOverlay() {
|
||||
this._parent.find(this._overlay).remove()
|
||||
|
||||
const overlayRemovedEvent = $.Event(Event.OVERLAY_REMOVED)
|
||||
$(this._element).trigger(overlayRemovedEvent)
|
||||
};
|
||||
|
||||
|
||||
// Private
|
||||
|
||||
_init(card) {
|
||||
$(this).find(this._settings.trigger).on('click', () => {
|
||||
this.load()
|
||||
})
|
||||
}
|
||||
|
||||
// Static
|
||||
|
||||
static _jQueryInterface(config) {
|
||||
let data = $(this).data(DATA_KEY)
|
||||
let options = $(this).data()
|
||||
|
||||
if (!data) {
|
||||
data = new CardRefresh($(this), options)
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data: config)
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/load/)) {
|
||||
data[config]()
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Data API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$(document).on('click', Selector.DATA_REFRESH, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
CardRefresh._jQueryInterface.call($(this), 'load')
|
||||
})
|
||||
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = CardRefresh._jQueryInterface
|
||||
$.fn[NAME].Constructor = CardRefresh
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT
|
||||
return CardRefresh._jQueryInterface
|
||||
}
|
||||
|
||||
return CardRefresh
|
||||
})(jQuery)
|
||||
|
||||
export default CardRefresh
|
||||
|
|
@ -0,0 +1,249 @@
|
|||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE CardWidget.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
|
||||
const CardWidget = (($) => {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
const NAME = 'CardWidget'
|
||||
const DATA_KEY = 'lte.cardwidget'
|
||||
const EVENT_KEY = `.${DATA_KEY}`
|
||||
const JQUERY_NO_CONFLICT = $.fn[NAME]
|
||||
|
||||
const Event = {
|
||||
EXPANDED: `expanded${EVENT_KEY}`,
|
||||
COLLAPSED: `collapsed${EVENT_KEY}`,
|
||||
MAXIMIZED: `maximized${EVENT_KEY}`,
|
||||
MINIMIZED: `minimized${EVENT_KEY}`,
|
||||
REMOVED: `removed${EVENT_KEY}`
|
||||
}
|
||||
|
||||
const ClassName = {
|
||||
CARD: 'card',
|
||||
COLLAPSED: 'collapsed-card',
|
||||
WAS_COLLAPSED: 'was-collapsed',
|
||||
MAXIMIZED: 'maximized-card',
|
||||
}
|
||||
|
||||
const Selector = {
|
||||
DATA_REMOVE: '[data-card-widget="remove"]',
|
||||
DATA_COLLAPSE: '[data-card-widget="collapse"]',
|
||||
DATA_MAXIMIZE: '[data-card-widget="maximize"]',
|
||||
CARD: `.${ClassName.CARD}`,
|
||||
CARD_HEADER: '.card-header',
|
||||
CARD_BODY: '.card-body',
|
||||
CARD_FOOTER: '.card-footer',
|
||||
COLLAPSED: `.${ClassName.COLLAPSED}`,
|
||||
}
|
||||
|
||||
const Default = {
|
||||
animationSpeed: 'normal',
|
||||
collapseTrigger: Selector.DATA_COLLAPSE,
|
||||
removeTrigger: Selector.DATA_REMOVE,
|
||||
maximizeTrigger: Selector.DATA_MAXIMIZE,
|
||||
collapseIcon: 'fa-minus',
|
||||
expandIcon: 'fa-plus',
|
||||
maximizeIcon: 'fa-expand',
|
||||
minimizeIcon: 'fa-compress',
|
||||
}
|
||||
|
||||
class CardWidget {
|
||||
constructor(element, settings) {
|
||||
this._element = element
|
||||
this._parent = element.parents(Selector.CARD).first()
|
||||
|
||||
if (element.hasClass(ClassName.CARD)) {
|
||||
this._parent = element
|
||||
}
|
||||
|
||||
this._settings = $.extend({}, Default, settings)
|
||||
}
|
||||
|
||||
collapse() {
|
||||
this._parent.children(`${Selector.CARD_BODY}, ${Selector.CARD_FOOTER}`)
|
||||
.slideUp(this._settings.animationSpeed, () => {
|
||||
this._parent.addClass(ClassName.COLLAPSED)
|
||||
})
|
||||
this._element.children(this._settings.collapseTrigger + ' .' + this._settings.collapseIcon)
|
||||
.addClass(this._settings.expandIcon)
|
||||
.removeClass(this._settings.collapseIcon)
|
||||
|
||||
const collapsed = $.Event(Event.COLLAPSED)
|
||||
|
||||
this._element.trigger(collapsed, this._parent)
|
||||
}
|
||||
|
||||
expand() {
|
||||
this._parent.children(`${Selector.CARD_BODY}, ${Selector.CARD_FOOTER}`)
|
||||
.slideDown(this._settings.animationSpeed, () => {
|
||||
this._parent.removeClass(ClassName.COLLAPSED)
|
||||
})
|
||||
|
||||
this._element.children(this._settings.collapseTrigger + ' .' + this._settings.expandIcon)
|
||||
.addClass(this._settings.collapseIcon)
|
||||
.removeClass(this._settings.expandIcon)
|
||||
|
||||
const expanded = $.Event(Event.EXPANDED)
|
||||
|
||||
this._element.trigger(expanded, this._parent)
|
||||
}
|
||||
|
||||
remove() {
|
||||
this._parent.slideUp()
|
||||
|
||||
const removed = $.Event(Event.REMOVED)
|
||||
|
||||
this._element.trigger(removed, this._parent)
|
||||
}
|
||||
|
||||
toggle() {
|
||||
if (this._parent.hasClass(ClassName.COLLAPSED)) {
|
||||
this.expand()
|
||||
return
|
||||
}
|
||||
|
||||
this.collapse()
|
||||
}
|
||||
|
||||
maximize() {
|
||||
this._element.children(this._settings.maximizeTrigger + ' .' + this._settings.maximizeIcon)
|
||||
.addClass(this._settings.minimizeIcon)
|
||||
.removeClass(this._settings.maximizeIcon)
|
||||
this._parent.css({
|
||||
'height': this._parent.height(),
|
||||
'width': this._parent.width(),
|
||||
'transition': 'all .15s'
|
||||
}).delay(150).queue(function(){
|
||||
$(this).addClass(ClassName.MAXIMIZED)
|
||||
$('html').addClass(ClassName.MAXIMIZED)
|
||||
if ($(this).hasClass(ClassName.COLLAPSED)) {
|
||||
$(this).addClass(ClassName.WAS_COLLAPSED)
|
||||
}
|
||||
$(this).dequeue()
|
||||
})
|
||||
|
||||
const maximized = $.Event(Event.MAXIMIZED)
|
||||
|
||||
this._element.trigger(maximized, this._parent)
|
||||
}
|
||||
|
||||
minimize() {
|
||||
this._element.children(this._settings.maximizeTrigger + ' .' + this._settings.minimizeIcon)
|
||||
.addClass(this._settings.maximizeIcon)
|
||||
.removeClass(this._settings.minimizeIcon)
|
||||
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' +
|
||||
'width:' + this._parent[0].style.width + ' !important; transition: all .15s;'
|
||||
).delay(10).queue(function(){
|
||||
$(this).removeClass(ClassName.MAXIMIZED)
|
||||
$('html').removeClass(ClassName.MAXIMIZED)
|
||||
$(this).css({
|
||||
'height': 'inherit',
|
||||
'width': 'inherit'
|
||||
})
|
||||
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
|
||||
$(this).removeClass(ClassName.WAS_COLLAPSED)
|
||||
}
|
||||
$(this).dequeue()
|
||||
})
|
||||
|
||||
const MINIMIZED = $.Event(Event.MINIMIZED)
|
||||
|
||||
this._element.trigger(MINIMIZED, this._parent)
|
||||
}
|
||||
|
||||
toggleMaximize() {
|
||||
if (this._parent.hasClass(ClassName.MAXIMIZED)) {
|
||||
this.minimize()
|
||||
return
|
||||
}
|
||||
|
||||
this.maximize()
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
_init(card) {
|
||||
this._parent = card
|
||||
|
||||
$(this).find(this._settings.collapseTrigger).click(() => {
|
||||
this.toggle()
|
||||
})
|
||||
|
||||
$(this).find(this._settings.maximizeTrigger).click(() => {
|
||||
this.toggleMaximize()
|
||||
})
|
||||
|
||||
$(this).find(this._settings.removeTrigger).click(() => {
|
||||
this.remove()
|
||||
})
|
||||
}
|
||||
|
||||
// Static
|
||||
|
||||
static _jQueryInterface(config) {
|
||||
let data = $(this).data(DATA_KEY)
|
||||
|
||||
if (!data) {
|
||||
data = new CardWidget($(this), data)
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data: config)
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|maximize|minimize|toggleMaximize/)) {
|
||||
data[config]()
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Data API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$(document).on('click', Selector.DATA_COLLAPSE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
CardWidget._jQueryInterface.call($(this), 'toggle')
|
||||
})
|
||||
|
||||
$(document).on('click', Selector.DATA_REMOVE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
CardWidget._jQueryInterface.call($(this), 'remove')
|
||||
})
|
||||
|
||||
$(document).on('click', Selector.DATA_MAXIMIZE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
CardWidget._jQueryInterface.call($(this), 'toggleMaximize')
|
||||
})
|
||||
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = CardWidget._jQueryInterface
|
||||
$.fn[NAME].Constructor = CardWidget
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT
|
||||
return CardWidget._jQueryInterface
|
||||
}
|
||||
|
||||
return CardWidget
|
||||
})(jQuery)
|
||||
|
||||
export default CardWidget
|
||||
|
|
@ -12,13 +12,14 @@ const ControlSidebar = (($) => {
|
|||
*/
|
||||
|
||||
const NAME = 'ControlSidebar'
|
||||
const DATA_KEY = 'lte.control.sidebar'
|
||||
const DATA_KEY = 'lte.controlsidebar'
|
||||
const EVENT_KEY = `.${DATA_KEY}`
|
||||
const JQUERY_NO_CONFLICT = $.fn[NAME]
|
||||
const DATA_API_KEY = '.data-api'
|
||||
|
||||
const Event = {
|
||||
CLICK_DATA_API: `click${EVENT_KEY}${DATA_API_KEY}`
|
||||
COLLAPSED: `collapsed${EVENT_KEY}`,
|
||||
EXPANDED: `expanded${EVENT_KEY}`
|
||||
}
|
||||
|
||||
const Selector = {
|
||||
|
|
@ -29,12 +30,12 @@ const ControlSidebar = (($) => {
|
|||
|
||||
const ClassName = {
|
||||
CONTROL_SIDEBAR_ANIMATE: 'control-sidebar-animate',
|
||||
CONTROL_SIDEBAR_OPEN : 'control-sidebar-open',
|
||||
CONTROL_SIDEBAR_SLIDE : 'control-sidebar-slide-open'
|
||||
CONTROL_SIDEBAR_OPEN: 'control-sidebar-open',
|
||||
CONTROL_SIDEBAR_SLIDE: 'control-sidebar-slide-open'
|
||||
}
|
||||
|
||||
const Default = {
|
||||
slide: true
|
||||
controlsidebarSlide: true
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -52,7 +53,7 @@ const ControlSidebar = (($) => {
|
|||
|
||||
show() {
|
||||
// Show the control sidebar
|
||||
if (this._config.slide) {
|
||||
if (this._config.controlsidebarSlide) {
|
||||
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
|
||||
$('body').removeClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function(){
|
||||
$(Selector.CONTROL_SIDEBAR).hide()
|
||||
|
|
@ -62,13 +63,16 @@ const ControlSidebar = (($) => {
|
|||
} else {
|
||||
$('body').removeClass(ClassName.CONTROL_SIDEBAR_OPEN)
|
||||
}
|
||||
|
||||
const expandedEvent = $.Event(Event.EXPANDED)
|
||||
$(this._element).trigger(expandedEvent)
|
||||
}
|
||||
|
||||
collapse() {
|
||||
// Collapse the control sidebar
|
||||
if (this._config.slide) {
|
||||
if (this._config.controlsidebarSlide) {
|
||||
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
|
||||
$(Selector.CONTROL_SIDEBAR).show().delay(100).queue(function(){
|
||||
$(Selector.CONTROL_SIDEBAR).show().delay(10).queue(function(){
|
||||
$('body').addClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function(){
|
||||
$('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
|
||||
$(this).dequeue()
|
||||
|
|
@ -78,11 +82,12 @@ const ControlSidebar = (($) => {
|
|||
} else {
|
||||
$('body').addClass(ClassName.CONTROL_SIDEBAR_OPEN)
|
||||
}
|
||||
|
||||
const collapsedEvent = $.Event(Event.COLLAPSED)
|
||||
$(this._element).trigger(collapsedEvent)
|
||||
}
|
||||
|
||||
toggle() {
|
||||
this._setMargin()
|
||||
|
||||
const shouldOpen = $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || $('body')
|
||||
.hasClass(ClassName.CONTROL_SIDEBAR_SLIDE)
|
||||
if (shouldOpen) {
|
||||
|
|
@ -100,12 +105,6 @@ const ControlSidebar = (($) => {
|
|||
return $.extend({}, Default, config)
|
||||
}
|
||||
|
||||
_setMargin() {
|
||||
$(Selector.CONTROL_SIDEBAR).css({
|
||||
top: $(Selector.MAIN_HEADER).innerHeight()
|
||||
})
|
||||
}
|
||||
|
||||
// Static
|
||||
|
||||
static _jQueryInterface(operation) {
|
||||
|
|
|
|||
|
|
@ -17,6 +17,10 @@ const DirectChat = (($) => {
|
|||
const JQUERY_NO_CONFLICT = $.fn[NAME]
|
||||
const DATA_API_KEY = '.data-api'
|
||||
|
||||
const Event = {
|
||||
TOGGLED: `toggled{EVENT_KEY}`
|
||||
}
|
||||
|
||||
const Selector = {
|
||||
DATA_TOGGLE: '[data-widget="chat-pane-toggle"]',
|
||||
DIRECT_CHAT: '.direct-chat'
|
||||
|
|
@ -38,6 +42,9 @@ const DirectChat = (($) => {
|
|||
|
||||
toggle() {
|
||||
$(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN);
|
||||
|
||||
const toggledEvent = $.Event(Event.TOGGLED)
|
||||
$(this._element).trigger(toggledEvent)
|
||||
}
|
||||
|
||||
// Static
|
||||
|
|
|
|||
|
|
@ -18,27 +18,29 @@ const PushMenu = (($) => {
|
|||
|
||||
const Event = {
|
||||
COLLAPSED: `collapsed${EVENT_KEY}`,
|
||||
SHOWN : `shown${EVENT_KEY}`
|
||||
SHOWN: `shown${EVENT_KEY}`
|
||||
}
|
||||
|
||||
const Default = {
|
||||
autoCollapseSize: false,
|
||||
screenCollapseSize: 768
|
||||
screenCollapseSize: 768,
|
||||
enableRemember: false,
|
||||
noTransitionAfterReload: true
|
||||
}
|
||||
|
||||
const Selector = {
|
||||
TOGGLE_BUTTON : '[data-widget="pushmenu"]',
|
||||
SIDEBAR_MINI : '.sidebar-mini',
|
||||
TOGGLE_BUTTON: '[data-widget="pushmenu"]',
|
||||
SIDEBAR_MINI: '.sidebar-mini',
|
||||
SIDEBAR_COLLAPSED: '.sidebar-collapse',
|
||||
BODY : 'body',
|
||||
OVERLAY : '#sidebar-overlay',
|
||||
WRAPPER : '.wrapper'
|
||||
BODY: 'body',
|
||||
OVERLAY: '#sidebar-overlay',
|
||||
WRAPPER: '.wrapper'
|
||||
}
|
||||
|
||||
const ClassName = {
|
||||
SIDEBAR_OPEN: 'sidebar-open',
|
||||
COLLAPSED : 'sidebar-collapse',
|
||||
OPEN : 'sidebar-open',
|
||||
COLLAPSED: 'sidebar-collapse',
|
||||
OPEN: 'sidebar-open',
|
||||
SIDEBAR_MINI: 'sidebar-mini'
|
||||
}
|
||||
|
||||
|
|
@ -64,6 +66,10 @@ const PushMenu = (($) => {
|
|||
show() {
|
||||
$(Selector.BODY).addClass(ClassName.OPEN).removeClass(ClassName.COLLAPSED)
|
||||
|
||||
if(this._options.enableRemember) {
|
||||
localStorage.setItem(`remember${EVENT_KEY}`, ClassName.OPEN);
|
||||
}
|
||||
|
||||
const shownEvent = $.Event(Event.SHOWN)
|
||||
$(this._element).trigger(shownEvent)
|
||||
}
|
||||
|
|
@ -71,6 +77,10 @@ const PushMenu = (($) => {
|
|||
collapse() {
|
||||
$(Selector.BODY).removeClass(ClassName.OPEN).addClass(ClassName.COLLAPSED)
|
||||
|
||||
if(this._options.enableRemember) {
|
||||
localStorage.setItem(`remember${EVENT_KEY}`, ClassName.COLLAPSED);
|
||||
}
|
||||
|
||||
const collapsedEvent = $.Event(Event.COLLAPSED)
|
||||
$(this._element).trigger(collapsedEvent)
|
||||
}
|
||||
|
|
@ -105,9 +115,26 @@ const PushMenu = (($) => {
|
|||
}
|
||||
}
|
||||
|
||||
remember() {
|
||||
if(this._options.enableRemember) {
|
||||
var toggleState = localStorage.getItem(`remember${EVENT_KEY}`);
|
||||
if (toggleState == ClassName.COLLAPSED){
|
||||
if (this._options.noTransitionAfterReload) {
|
||||
$("body").addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(10).queue(function() {
|
||||
$(this).removeClass('hold-transition');
|
||||
$(this).dequeue()
|
||||
});
|
||||
} else {
|
||||
$("body").addClass(ClassName.COLLAPSED);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
_init() {
|
||||
this.remember()
|
||||
this.autoCollapse()
|
||||
|
||||
$(window).resize(() => {
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@ const Treeview = (($) => {
|
|||
this.collapse(openTreeview, openMenuLi)
|
||||
}
|
||||
|
||||
treeviewMenu.slideDown(this._config.animationSpeed, () => {
|
||||
treeviewMenu.stop().slideDown(this._config.animationSpeed, () => {
|
||||
parentLi.addClass(ClassName.OPEN)
|
||||
$(this._element).trigger(expandedEvent)
|
||||
})
|
||||
|
|
@ -78,7 +78,7 @@ const Treeview = (($) => {
|
|||
collapse(treeviewMenu, parentLi) {
|
||||
const collapsedEvent = $.Event(Event.COLLAPSED)
|
||||
|
||||
treeviewMenu.slideUp(this._config.animationSpeed, () => {
|
||||
treeviewMenu.stop().slideUp(this._config.animationSpeed, () => {
|
||||
parentLi.removeClass(ClassName.OPEN)
|
||||
$(this._element).trigger(collapsedEvent)
|
||||
treeviewMenu.find(`${Selector.OPEN} > ${Selector.TREEVIEW_MENU}`).slideUp()
|
||||
|
|
@ -159,4 +159,4 @@ const Treeview = (($) => {
|
|||
return Treeview
|
||||
})(jQuery)
|
||||
|
||||
export default Treeview
|
||||
export default Treeview
|
||||
|
|
|
|||
|
|
@ -1,226 +0,0 @@
|
|||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE Widget.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
|
||||
const Widget = (($) => {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
const NAME = 'Widget'
|
||||
const DATA_KEY = 'lte.widget'
|
||||
const EVENT_KEY = `.${DATA_KEY}`
|
||||
const JQUERY_NO_CONFLICT = $.fn[NAME]
|
||||
|
||||
const Event = {
|
||||
EXPANDED : `expanded${EVENT_KEY}`,
|
||||
COLLAPSED: `collapsed${EVENT_KEY}`,
|
||||
MAXIMIZED: `maximized${EVENT_KEY}`,
|
||||
MINIMIZED: `minimized${EVENT_KEY}`,
|
||||
REMOVED : `removed${EVENT_KEY}`
|
||||
}
|
||||
|
||||
const Selector = {
|
||||
DATA_REMOVE : '[data-widget="remove"]',
|
||||
DATA_COLLAPSE : '[data-widget="collapse"]',
|
||||
DATA_MAXIMIZE : '[data-widget="maximize"]',
|
||||
CARD : '.card',
|
||||
CARD_HEADER : '.card-header',
|
||||
CARD_BODY : '.card-body',
|
||||
CARD_FOOTER : '.card-footer',
|
||||
COLLAPSED : '.collapsed-card',
|
||||
COLLAPSE_ICON : '.fa-minus',
|
||||
EXPAND_ICON : '.fa-plus'
|
||||
}
|
||||
|
||||
const ClassName = {
|
||||
COLLAPSED : 'collapsed-card',
|
||||
WAS_COLLAPSED : 'was-collapsed',
|
||||
MAXIMIZED : 'maximized-card',
|
||||
COLLAPSE_ICON : 'fa-minus',
|
||||
EXPAND_ICON : 'fa-plus',
|
||||
MAXIMIZE_ICON : 'fa-expand',
|
||||
MINIMIZE_ICON : 'fa-compress',
|
||||
}
|
||||
|
||||
const Default = {
|
||||
animationSpeed : 'normal',
|
||||
collapseTrigger: Selector.DATA_COLLAPSE,
|
||||
removeTrigger : Selector.DATA_REMOVE
|
||||
}
|
||||
|
||||
class Widget {
|
||||
constructor(element, settings) {
|
||||
this._element = element
|
||||
this._parent = element.parents(Selector.CARD).first()
|
||||
this._settings = $.extend({}, Default, settings)
|
||||
}
|
||||
|
||||
collapse() {
|
||||
this._parent.children(`${Selector.CARD_BODY}, ${Selector.CARD_FOOTER}`)
|
||||
.slideUp(this._settings.animationSpeed, () => {
|
||||
this._parent.addClass(ClassName.COLLAPSED)
|
||||
})
|
||||
|
||||
this._element.children(Selector.COLLAPSE_ICON)
|
||||
.addClass(ClassName.EXPAND_ICON)
|
||||
.removeClass(ClassName.COLLAPSE_ICON)
|
||||
|
||||
const collapsed = $.Event(Event.COLLAPSED)
|
||||
|
||||
this._element.trigger(collapsed, this._parent)
|
||||
}
|
||||
|
||||
expand() {
|
||||
this._parent.children(`${Selector.CARD_BODY}, ${Selector.CARD_FOOTER}`)
|
||||
.slideDown(this._settings.animationSpeed, () => {
|
||||
this._parent.removeClass(ClassName.COLLAPSED)
|
||||
})
|
||||
|
||||
this._element.children(Selector.EXPAND_ICON)
|
||||
.addClass(ClassName.COLLAPSE_ICON)
|
||||
.removeClass(ClassName.EXPAND_ICON)
|
||||
|
||||
const expanded = $.Event(Event.EXPANDED)
|
||||
|
||||
this._element.trigger(expanded, this._parent)
|
||||
}
|
||||
|
||||
remove() {
|
||||
this._parent.slideUp()
|
||||
|
||||
const removed = $.Event(Event.REMOVED)
|
||||
|
||||
this._element.trigger(removed, this._parent)
|
||||
}
|
||||
|
||||
toggle() {
|
||||
if (this._parent.hasClass(ClassName.COLLAPSED)) {
|
||||
this.expand()
|
||||
return
|
||||
}
|
||||
|
||||
this.collapse()
|
||||
}
|
||||
|
||||
toggleMaximize() {
|
||||
var button = this._element.find('i')
|
||||
|
||||
if (this._parent.hasClass(ClassName.MAXIMIZED)) {
|
||||
button.addClass(ClassName.MAXIMIZE_ICON).removeClass(ClassName.MINIMIZE_ICON)
|
||||
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' +
|
||||
'width:' + this._parent[0].style.width + ' !important; transition: all .15s;'
|
||||
).delay(100).queue(function(){
|
||||
$(this).removeClass(ClassName.MAXIMIZED)
|
||||
$('html').removeClass(ClassName.MAXIMIZED)
|
||||
$(this).trigger(Event.MINIMIZED)
|
||||
$(this).css({
|
||||
'height': 'inherit',
|
||||
'width': 'inherit'
|
||||
})
|
||||
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
|
||||
$(this).removeClass(ClassName.WAS_COLLAPSED)
|
||||
}
|
||||
$(this).dequeue()
|
||||
})
|
||||
} else {
|
||||
button.addClass(ClassName.MINIMIZE_ICON).removeClass(ClassName.MAXIMIZE_ICON)
|
||||
this._parent.css({
|
||||
'height': this._parent.height(),
|
||||
'width': this._parent.width(),
|
||||
'transition': 'all .15s'
|
||||
}).delay(150).queue(function(){
|
||||
$(this).addClass(ClassName.MAXIMIZED)
|
||||
$('html').addClass(ClassName.MAXIMIZED)
|
||||
$(this).trigger(Event.MAXIMIZED)
|
||||
if ($(this).hasClass(ClassName.COLLAPSED)) {
|
||||
$(this).addClass(ClassName.WAS_COLLAPSED)
|
||||
}
|
||||
$(this).dequeue()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
_init(card) {
|
||||
this._parent = card
|
||||
|
||||
$(this).find(this._settings.collapseTrigger).click(() => {
|
||||
this.toggle()
|
||||
})
|
||||
|
||||
$(this).find(this._settings.removeTrigger).click(() => {
|
||||
this.remove()
|
||||
})
|
||||
}
|
||||
|
||||
// Static
|
||||
|
||||
static _jQueryInterface(config) {
|
||||
return this.each(function () {
|
||||
let data = $(this).data(DATA_KEY)
|
||||
|
||||
if (!data) {
|
||||
data = new Widget($(this), data)
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config)
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|toggleMaximize/)) {
|
||||
data[config]()
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this))
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Data API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$(document).on('click', Selector.DATA_COLLAPSE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'toggle')
|
||||
})
|
||||
|
||||
$(document).on('click', Selector.DATA_REMOVE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'remove')
|
||||
})
|
||||
|
||||
$(document).on('click', Selector.DATA_MAXIMIZE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'toggleMaximize')
|
||||
})
|
||||
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = Widget._jQueryInterface
|
||||
$.fn[NAME].Constructor = Widget
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT
|
||||
return Widget._jQueryInterface
|
||||
}
|
||||
|
||||
return Widget
|
||||
})(jQuery)
|
||||
|
||||
export default Widget
|
||||
|
|
@ -182,6 +182,10 @@ const Plugins = [
|
|||
from: 'node_modules/select2/dist/',
|
||||
to : 'plugins/select2'
|
||||
},
|
||||
{
|
||||
from: 'node_modules/@ttskch/select2-bootstrap4-theme/dist/',
|
||||
to : 'plugins/select2-bootstrap4-theme'
|
||||
},
|
||||
// Sparklines
|
||||
{
|
||||
from: 'node_modules/sparklines/source/',
|
||||
|
|
@ -192,6 +196,10 @@ const Plugins = [
|
|||
from: 'node_modules/sweetalert2/dist/',
|
||||
to : 'plugins/sweetalert2'
|
||||
},
|
||||
{
|
||||
from: 'node_modules/@sweetalert2/theme-bootstrap-4/',
|
||||
to : 'plugins/sweetalert2-theme-bootstrap-4'
|
||||
},
|
||||
// Toastr
|
||||
{
|
||||
from: 'node_modules/toastr/build/',
|
||||
|
|
|
|||
|
|
@ -6,9 +6,9 @@
|
|||
*/
|
||||
// Bootstrap
|
||||
// ---------------------------------------------------
|
||||
@import '../../node_modules/bootstrap/scss/functions';
|
||||
@import '~bootstrap/scss/functions';
|
||||
@import 'bootstrap-variables';
|
||||
@import '../../node_modules/bootstrap/scss/bootstrap';
|
||||
@import '~bootstrap/scss/bootstrap';
|
||||
|
||||
// Variables and Mixins
|
||||
// ---------------------------------------------------
|
||||
|
|
|
|||
|
|
@ -314,7 +314,7 @@ $table-head-color: $gray-700 !default;
|
|||
$table-dark-bg: $gray-900 !default;
|
||||
$table-dark-accent-bg: rgba($white, .05) !default;
|
||||
$table-dark-hover-bg: rgba($white, .075) !default;
|
||||
$table-dark-border-color: lighten($gray-900, 7.5%) !default;
|
||||
$table-dark-border-color: lighten($gray-900, 10%) !default;
|
||||
$table-dark-color: $body-bg !default;
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
margin-left: .8rem;
|
||||
margin-right: .5rem;
|
||||
margin-top: -3px;
|
||||
max-height: 34px;
|
||||
max-height: 33px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
margin-left: .8rem;
|
||||
margin-right: .5rem;
|
||||
margin-top: -3px;
|
||||
max-height: 34px;
|
||||
max-height: 33px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -7,6 +7,10 @@
|
|||
@include box-shadow($card-shadow);
|
||||
|
||||
&.bg-dark {
|
||||
.card-header {
|
||||
border-color: $card-dark-border-color;
|
||||
}
|
||||
|
||||
&,
|
||||
.card-body {
|
||||
color: $white;
|
||||
|
|
@ -90,6 +94,7 @@ html.maximized-card {
|
|||
background-color: transparent;
|
||||
border-bottom: 1px solid $card-border-color;
|
||||
position: relative;
|
||||
padding: ($card-spacer-y / 3) * 2 $card-spacer-x;
|
||||
|
||||
@if $enable-rounded {
|
||||
@include border-top-radius($border-radius);
|
||||
|
|
@ -100,9 +105,8 @@ html.maximized-card {
|
|||
}
|
||||
|
||||
> .card-tools {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
top: .5rem;
|
||||
float: right;
|
||||
margin-right: -$card-spacer-y/3;
|
||||
|
||||
[data-toggle='tooltip'] {
|
||||
position: relative;
|
||||
|
|
@ -111,9 +115,11 @@ html.maximized-card {
|
|||
}
|
||||
|
||||
.card-title {
|
||||
float: left;
|
||||
font-size: $card-title-font-size;
|
||||
font-weight: $card-title-font-weight;
|
||||
margin: 0;
|
||||
padding: $card-spacer-y/3 0;
|
||||
}
|
||||
|
||||
// Box Tools Buttons
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ html.control-sidebar-animate {
|
|||
.control-sidebar {
|
||||
position: absolute;
|
||||
top: $main-header-height;
|
||||
z-index: 830;
|
||||
z-index: $zindex-control-sidebar;
|
||||
|
||||
&,
|
||||
&::before {
|
||||
|
|
@ -17,11 +17,11 @@ html.control-sidebar-animate {
|
|||
display: none;
|
||||
right: -$control-sidebar-width;
|
||||
width: $control-sidebar-width;
|
||||
@include transition(right $transition-speed $transition-fn);
|
||||
@include transition(right $transition-speed $transition-fn, display $transition-speed $transition-fn);
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: " ";
|
||||
content: '';
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
|
|
@ -29,6 +29,13 @@ html.control-sidebar-animate {
|
|||
}
|
||||
}
|
||||
|
||||
.control-sidebar-push-slide {
|
||||
.content-wrapper,
|
||||
.main-footer {
|
||||
@include transition(margin-right $transition-speed $transition-fn);
|
||||
}
|
||||
}
|
||||
|
||||
// Control sidebar open state
|
||||
.control-sidebar-open {
|
||||
@include media-breakpoint-up(md) {
|
||||
|
|
@ -41,9 +48,12 @@ html.control-sidebar-animate {
|
|||
}
|
||||
}
|
||||
|
||||
.content-wrapper,
|
||||
.main-footer {
|
||||
margin-right: $control-sidebar-width;
|
||||
&.control-sidebar-push,
|
||||
&.control-sidebar-push-slide {
|
||||
.content-wrapper,
|
||||
.main-footer {
|
||||
margin-right: $control-sidebar-width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -65,6 +75,15 @@ html.control-sidebar-animate {
|
|||
&,
|
||||
&::before {
|
||||
right: 0;
|
||||
@include transition(right $transition-speed $transition-fn, display $transition-speed $transition-fn);
|
||||
}
|
||||
}
|
||||
|
||||
&.control-sidebar-push,
|
||||
&.control-sidebar-push-slide {
|
||||
.content-wrapper,
|
||||
.main-footer {
|
||||
margin-right: $control-sidebar-width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -122,7 +122,7 @@
|
|||
|
||||
.direct-chat-contacts {
|
||||
@include translate(101%, 0);
|
||||
background: $gray-900;
|
||||
background: $dark;
|
||||
bottom: 0;
|
||||
color: $white;
|
||||
height: 250px;
|
||||
|
|
@ -132,6 +132,22 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.direct-chat-contacts-light {
|
||||
background: $light;
|
||||
|
||||
.contacts-list-name {
|
||||
color: $gray-700;
|
||||
}
|
||||
|
||||
.contacts-list-date {
|
||||
color: $gray-600;
|
||||
}
|
||||
|
||||
.contacts-list-msg {
|
||||
color: darken($gray-600, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
//Contacts list -- for displaying contacts in direct chat contacts pane
|
||||
.contacts-list {
|
||||
@extend .list-unstyled;
|
||||
|
|
@ -173,12 +189,12 @@
|
|||
}
|
||||
|
||||
.contacts-list-date {
|
||||
color: $gray-500;
|
||||
color: $gray-400;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.contacts-list-msg {
|
||||
color: darken($gray-500, 25%);
|
||||
color: darken($gray-400, 10%);
|
||||
}
|
||||
|
||||
// Color variants
|
||||
|
|
|
|||
|
|
@ -47,6 +47,10 @@ body,
|
|||
}
|
||||
|
||||
.layout-navbar-fixed & {
|
||||
.control-sidebar {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
a.anchor {
|
||||
display: block;
|
||||
position: relative;
|
||||
|
|
@ -66,7 +70,7 @@ body,
|
|||
top: 0;
|
||||
transition: width $transition-speed $transition-fn;
|
||||
width: $sidebar-width;
|
||||
z-index: $zindex-main-sidebar + 1;
|
||||
z-index: $zindex-main-header + 1;
|
||||
}
|
||||
|
||||
// Sidebar variants brand-link fix
|
||||
|
|
@ -89,7 +93,7 @@ body,
|
|||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: $zindex-main-sidebar - 1;
|
||||
z-index: $zindex-main-header - 1;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -119,6 +123,10 @@ body,
|
|||
}
|
||||
|
||||
.layout#{$infix}-navbar-fixed & {
|
||||
.control-sidebar {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
a.anchor {
|
||||
display: block;
|
||||
position: relative;
|
||||
|
|
@ -146,7 +154,7 @@ body,
|
|||
top: 0;
|
||||
transition: width $transition-speed $transition-fn;
|
||||
width: $sidebar-width;
|
||||
z-index: $zindex-main-sidebar + 1;
|
||||
z-index: $zindex-main-header + 1;
|
||||
}
|
||||
|
||||
// Sidebar variants brand-link fix
|
||||
|
|
@ -197,7 +205,7 @@ body,
|
|||
left: 0;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
z-index: $zindex-main-sidebar - 1;
|
||||
z-index: $zindex-main-footer;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -221,7 +229,7 @@ body,
|
|||
left: 0;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
z-index: $zindex-main-sidebar - 1;
|
||||
z-index: $zindex-main-footer;
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
|
|
@ -305,6 +313,10 @@ body,
|
|||
&::before {
|
||||
margin-left: -$sidebar-width;
|
||||
}
|
||||
|
||||
.nav-sidebar.nav-child-indent .nav-treeview {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(sm) {
|
||||
|
|
@ -373,6 +385,10 @@ body,
|
|||
.hold-transition {
|
||||
.content-wrapper,
|
||||
.main-header,
|
||||
.main-sidebar,
|
||||
.main-sidebar *,
|
||||
.control-sidebar,
|
||||
.control-sidebar *,
|
||||
.main-footer {
|
||||
transition: none !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -133,6 +133,7 @@
|
|||
|
||||
&.nav-child-indent {
|
||||
.nav-treeview {
|
||||
transition: padding $transition-speed $transition-fn;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
}
|
||||
|
||||
.bg-#{$name},
|
||||
.bg-#{$name}-gradient,
|
||||
.bg-gradient-#{$name},
|
||||
.card-#{$name}:not(.card-outline) {
|
||||
.btn-tool {
|
||||
color: rgba(color-yiq($color), 0.8);
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
}
|
||||
|
||||
.card.bg-#{$name},
|
||||
.card.bg-#{$name}-gradient {
|
||||
.card.bg-gradient-#{$name} {
|
||||
.bootstrap-datetimepicker-widget {
|
||||
.table td,
|
||||
.table th {
|
||||
|
|
@ -52,6 +52,10 @@
|
|||
color: color-yiq($color);
|
||||
}
|
||||
|
||||
table td.today::before {
|
||||
border-bottom-color: color-yiq($color);
|
||||
}
|
||||
|
||||
table td.active,
|
||||
table td.active:hover {
|
||||
background: lighten($color, 10%);
|
||||
|
|
@ -143,6 +147,10 @@
|
|||
&.sidebar-focused {
|
||||
width: $sidebar-width;
|
||||
|
||||
.nav-sidebar.nav-child-indent .nav-treeview {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
.brand-link {
|
||||
width: $sidebar-width;
|
||||
}
|
||||
|
|
@ -262,6 +270,32 @@
|
|||
border-left-color: $bg-color;
|
||||
}
|
||||
}
|
||||
|
||||
@each $name, $color in $theme-colors {
|
||||
&.bg-#{$name},
|
||||
&.bg-gradient-#{$name} {
|
||||
.direct-chat-timestamp {
|
||||
@if (color-yiq($color) == $yiq-text-dark) {
|
||||
color: lighten(color-yiq($color), 10%);
|
||||
} @else {
|
||||
color: darken(color-yiq($color), 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@each $name, $color in $colors {
|
||||
&.bg-#{$name},
|
||||
&.bg-gradient-#{$name} {
|
||||
.direct-chat-timestamp {
|
||||
@if (color-yiq($color) == $yiq-text-dark) {
|
||||
color: lighten(color-yiq($color), 10%);
|
||||
} @else {
|
||||
color: darken(color-yiq($color), 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Background Variant
|
||||
|
|
@ -277,13 +311,13 @@
|
|||
&.btn {
|
||||
&:hover {
|
||||
border-color: darken($color, 10%);
|
||||
color: color-yiq(darken($color, 7.5%));
|
||||
color: darken(color-yiq($color), 7.5%);
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.active {
|
||||
border-color: darken($color, 12.5%);
|
||||
color: color-yiq(darken($color, 10%));
|
||||
color: darken(color-yiq($color), 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -307,14 +341,14 @@
|
|||
&:hover {
|
||||
@include bg-gradient-variant('&', darken($color, 7.5%));
|
||||
border-color: darken($color, 10%);
|
||||
color: color-yiq(darken($color, 7.5%));
|
||||
color: darken(color-yiq($color), 7.5%);
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.active {
|
||||
@include bg-gradient-variant('&', darken($color, 10%));
|
||||
border-color: darken($color, 12.5%);
|
||||
color: color-yiq(darken($color, 10%));
|
||||
color: darken(color-yiq($color), 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -128,6 +128,7 @@ $control-sidebar-width: $sidebar-width !default;
|
|||
// Cards
|
||||
// --------------------------------------------------------
|
||||
$card-border-color: $gray-100 !default;
|
||||
$card-dark-border-color: lighten($gray-900, 10%) !default;
|
||||
$card-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2) !default;
|
||||
$card-title-font-size: $font-size-lg;
|
||||
$card-title-font-weight: $font-weight-normal;
|
||||
|
|
@ -151,8 +152,10 @@ $attachment-border-radius: 3px !default;
|
|||
|
||||
// Z-INDEX
|
||||
// --------------------------------------------------------
|
||||
$zindex-main-header: $zindex-fixed + 2 !default;
|
||||
$zindex-main-sidebar: $zindex-fixed + 6 !default;
|
||||
$zindex-main-header: $zindex-fixed + 4 !default;
|
||||
$zindex-main-sidebar: $zindex-fixed + 8 !default;
|
||||
$zindex-main-footer: $zindex-fixed + 1 !default;
|
||||
$zindex-control-sidebar: $zindex-fixed + 2 !default;
|
||||
$zindex-sidebar-mini-links: 010 !default;
|
||||
|
||||
// TRANSITIONS SETTINGS
|
||||
|
|
@ -179,15 +182,15 @@ $ribbon-border-size: 3px !default;
|
|||
$ribbon-line-height: 100% !default;
|
||||
$ribbon-padding: .375rem 0 !default;
|
||||
$ribbon-font-size: .8rem !default;
|
||||
$ribbon-width: 110px !default;
|
||||
$ribbon-wrapper-size: 90px !default;
|
||||
$ribbon-top: 9px !default;
|
||||
$ribbon-right: -12px !default;
|
||||
$ribbon-lg-wrapper-size: 180px !default;
|
||||
$ribbon-width: 90px !default;
|
||||
$ribbon-wrapper-size: 70px !default;
|
||||
$ribbon-top: 10px !default;
|
||||
$ribbon-right: -2px !default;
|
||||
$ribbon-lg-wrapper-size: 120px !default;
|
||||
$ribbon-lg-width: 160px !default;
|
||||
$ribbon-lg-top: 26px !default;
|
||||
$ribbon-lg-right: -59px !default;
|
||||
$ribbon-xl-wrapper-size: 240px !default;
|
||||
$ribbon-lg-right: 0px !default;
|
||||
$ribbon-xl-wrapper-size: 180px !default;
|
||||
$ribbon-xl-width: 240px !default;
|
||||
$ribbon-xl-top: 59px !default;
|
||||
$ribbon-xl-right: -48px !default;
|
||||
$ribbon-xl-top: 47px !default;
|
||||
$ribbon-xl-right: 4px !default;
|
||||
|
|
|
|||
|
|
@ -9,6 +9,11 @@
|
|||
border-color: #{$color};
|
||||
}
|
||||
|
||||
.icheck-#{$name} > input:first-child:not(:checked):not(:disabled):focus + label::before,
|
||||
.icheck-#{$name} > input:first-child:not(:checked):not(:disabled):focus + input[type="hidden"] + label::before {
|
||||
border-color: #{$color};
|
||||
}
|
||||
|
||||
.icheck-#{$name} > input:first-child:checked + label::before,
|
||||
.icheck-#{$name} > input:first-child:checked + input[type="hidden"] + label::before {
|
||||
background-color: #{$color};
|
||||
|
|
@ -23,6 +28,11 @@
|
|||
border-color: #{$color};
|
||||
}
|
||||
|
||||
.icheck-#{$name} > input:first-child:not(:checked):not(:disabled):focus + label::before,
|
||||
.icheck-#{$name} > input:first-child:not(:checked):not(:disabled):focus + input[type="hidden"] + label::before {
|
||||
border-color: #{$color};
|
||||
}
|
||||
|
||||
.icheck-#{$name} > input:first-child:checked + label::before,
|
||||
.icheck-#{$name} > input:first-child:checked + input[type="hidden"] + label::before {
|
||||
background-color: #{$color};
|
||||
|
|
|
|||
|
|
@ -18,108 +18,111 @@
|
|||
}
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--open {
|
||||
border-color: theme-color("primary");
|
||||
}
|
||||
|
||||
.select2-dropdown {
|
||||
border: 1px solid $gray-x-light;
|
||||
//border-radius: $input-radius;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: theme-color("primary");
|
||||
color: white;
|
||||
}
|
||||
|
||||
.select2-results__option {
|
||||
padding: 6px 12px;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
.select2-container .select2-selection--single .select2-selection__rendered {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
height: auto;
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
|
||||
padding-right: 6px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--single .select2-selection__arrow {
|
||||
height: 31px;
|
||||
right: 6px;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--single .select2-selection__arrow b {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.select2-dropdown,
|
||||
.select2-search--inline {
|
||||
.select2-search__field {
|
||||
border: 1px solid $gray-x-light;
|
||||
&:focus {
|
||||
outline: none;
|
||||
border: 1px solid theme-color("primary");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-disabled=true] {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true] {
|
||||
background-color: #ddd;
|
||||
&,
|
||||
&:hover {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
|
||||
//Multiple select
|
||||
.select2-container--default {
|
||||
.select2-selection--multiple {
|
||||
min-height: $input-height;
|
||||
&.select2-container--open {
|
||||
border-color: theme-color("primary");
|
||||
}
|
||||
|
||||
& .select2-dropdown {
|
||||
border: 1px solid $gray-x-light;
|
||||
//border-radius: $input-radius;
|
||||
&:focus {
|
||||
border-color: theme-color("primary");
|
||||
}
|
||||
}
|
||||
|
||||
.select2-selection__rendered li:first-child.select2-search.select2-search--inline {
|
||||
width: 100%;
|
||||
& .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: theme-color("primary");
|
||||
color: white;
|
||||
}
|
||||
|
||||
.select2-search__field {
|
||||
width: 100% !important;
|
||||
& .select2-results__option {
|
||||
padding: 6px 12px;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
& .select2-selection--single .select2-selection__rendered {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
height: auto;
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
&[dir="rtl"] .select2-selection--single .select2-selection__rendered {
|
||||
padding-right: 6px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
& .select2-selection--single .select2-selection__arrow {
|
||||
height: 31px;
|
||||
right: 6px;
|
||||
}
|
||||
|
||||
& .select2-selection--single .select2-selection__arrow b {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.select2-dropdown,
|
||||
.select2-search--inline {
|
||||
.select2-search__field {
|
||||
border: 1px solid $gray-x-light;
|
||||
&:focus {
|
||||
outline: none;
|
||||
border: 1px solid theme-color("primary");
|
||||
}
|
||||
}
|
||||
}
|
||||
&.select2-container--focus .select2-selection--multiple {
|
||||
border-color: $gray-x-light;
|
||||
|
||||
& .select2-results__option[aria-disabled=true] {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple .select2-selection__choice {
|
||||
background-color: theme-color("primary");
|
||||
border-color: darken(theme-color("primary"), 5%);
|
||||
padding: 0 10px;
|
||||
color: $white;
|
||||
}
|
||||
& .select2-results__option[aria-selected=true] {
|
||||
background-color: #ddd;
|
||||
&,
|
||||
&:hover {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
|
||||
margin-right: 5px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
&:hover {
|
||||
//Multiple select
|
||||
& {
|
||||
.select2-selection--multiple {
|
||||
min-height: $input-height;
|
||||
border: 1px solid $gray-x-light;
|
||||
//border-radius: $input-radius;
|
||||
&:focus {
|
||||
border-color: theme-color("primary");
|
||||
}
|
||||
|
||||
.select2-selection__rendered li:first-child.select2-search.select2-search--inline {
|
||||
width: 100%;
|
||||
|
||||
.select2-search__field {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.select2-container--focus .select2-selection--multiple {
|
||||
border-color: $gray-x-light;
|
||||
}
|
||||
}
|
||||
|
||||
& .select2-selection--multiple .select2-selection__choice {
|
||||
background-color: theme-color("primary");
|
||||
border-color: darken(theme-color("primary"), 5%);
|
||||
padding: 0 10px;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container .select2-selection--single .select2-selection__rendered li {
|
||||
padding-right: 10px;
|
||||
& .select2-selection--multiple .select2-selection__choice__remove {
|
||||
margin-right: 5px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
&:hover {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
& .select2-selection--single .select2-selection__rendered li {
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
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
|
|
@ -21,8 +21,13 @@
|
|||
* ====================================================
|
||||
*/
|
||||
var NAME = 'ControlSidebar';
|
||||
var DATA_KEY = 'lte.control.sidebar';
|
||||
var DATA_KEY = 'lte.controlsidebar';
|
||||
var EVENT_KEY = "." + DATA_KEY;
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
COLLAPSED: "collapsed" + EVENT_KEY,
|
||||
EXPANDED: "expanded" + EVENT_KEY
|
||||
};
|
||||
var Selector = {
|
||||
CONTROL_SIDEBAR: '.control-sidebar',
|
||||
DATA_TOGGLE: '[data-widget="control-sidebar"]',
|
||||
|
|
@ -34,7 +39,7 @@
|
|||
CONTROL_SIDEBAR_SLIDE: 'control-sidebar-slide-open'
|
||||
};
|
||||
var Default = {
|
||||
slide: true
|
||||
controlsidebarSlide: true
|
||||
/**
|
||||
* Class Definition
|
||||
* ====================================================
|
||||
|
|
@ -55,7 +60,7 @@
|
|||
|
||||
_proto.show = function show() {
|
||||
// Show the control sidebar
|
||||
if (this._config.slide) {
|
||||
if (this._config.controlsidebarSlide) {
|
||||
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE);
|
||||
$('body').removeClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () {
|
||||
$(Selector.CONTROL_SIDEBAR).hide();
|
||||
|
|
@ -65,13 +70,16 @@
|
|||
} else {
|
||||
$('body').removeClass(ClassName.CONTROL_SIDEBAR_OPEN);
|
||||
}
|
||||
|
||||
var expandedEvent = $.Event(Event.EXPANDED);
|
||||
$(this._element).trigger(expandedEvent);
|
||||
};
|
||||
|
||||
_proto.collapse = function collapse() {
|
||||
// Collapse the control sidebar
|
||||
if (this._config.slide) {
|
||||
if (this._config.controlsidebarSlide) {
|
||||
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE);
|
||||
$(Selector.CONTROL_SIDEBAR).show().delay(100).queue(function () {
|
||||
$(Selector.CONTROL_SIDEBAR).show().delay(10).queue(function () {
|
||||
$('body').addClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () {
|
||||
$('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE);
|
||||
$(this).dequeue();
|
||||
|
|
@ -81,11 +89,12 @@
|
|||
} else {
|
||||
$('body').addClass(ClassName.CONTROL_SIDEBAR_OPEN);
|
||||
}
|
||||
|
||||
var collapsedEvent = $.Event(Event.COLLAPSED);
|
||||
$(this._element).trigger(collapsedEvent);
|
||||
};
|
||||
|
||||
_proto.toggle = function toggle() {
|
||||
this._setMargin();
|
||||
|
||||
var shouldOpen = $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE);
|
||||
|
||||
if (shouldOpen) {
|
||||
|
|
@ -100,12 +109,6 @@
|
|||
|
||||
_proto._getConfig = function _getConfig(config) {
|
||||
return $.extend({}, Default, config);
|
||||
};
|
||||
|
||||
_proto._setMargin = function _setMargin() {
|
||||
$(Selector.CONTROL_SIDEBAR).css({
|
||||
top: $(Selector.MAIN_HEADER).innerHeight()
|
||||
});
|
||||
} // Static
|
||||
;
|
||||
|
||||
|
|
@ -356,7 +359,9 @@
|
|||
};
|
||||
var Default = {
|
||||
autoCollapseSize: false,
|
||||
screenCollapseSize: 768
|
||||
screenCollapseSize: 768,
|
||||
enableRemember: false,
|
||||
noTransitionAfterReload: true
|
||||
};
|
||||
var Selector = {
|
||||
TOGGLE_BUTTON: '[data-widget="pushmenu"]',
|
||||
|
|
@ -397,12 +402,22 @@
|
|||
|
||||
_proto.show = function show() {
|
||||
$(Selector.BODY).addClass(ClassName.OPEN).removeClass(ClassName.COLLAPSED);
|
||||
|
||||
if (this._options.enableRemember) {
|
||||
localStorage.setItem("remember" + EVENT_KEY, ClassName.OPEN);
|
||||
}
|
||||
|
||||
var shownEvent = $.Event(Event.SHOWN);
|
||||
$(this._element).trigger(shownEvent);
|
||||
};
|
||||
|
||||
_proto.collapse = function collapse() {
|
||||
$(Selector.BODY).removeClass(ClassName.OPEN).addClass(ClassName.COLLAPSED);
|
||||
|
||||
if (this._options.enableRemember) {
|
||||
localStorage.setItem("remember" + EVENT_KEY, ClassName.COLLAPSED);
|
||||
}
|
||||
|
||||
var collapsedEvent = $.Event(Event.COLLAPSED);
|
||||
$(this._element).trigger(collapsedEvent);
|
||||
};
|
||||
|
|
@ -435,12 +450,30 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
_proto.remember = function remember() {
|
||||
if (this._options.enableRemember) {
|
||||
var toggleState = localStorage.getItem("remember" + EVENT_KEY);
|
||||
|
||||
if (toggleState == ClassName.COLLAPSED) {
|
||||
if (this._options.noTransitionAfterReload) {
|
||||
$("body").addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(10).queue(function () {
|
||||
$(this).removeClass('hold-transition');
|
||||
$(this).dequeue();
|
||||
});
|
||||
} else {
|
||||
$("body").addClass(ClassName.COLLAPSED);
|
||||
}
|
||||
}
|
||||
}
|
||||
} // Private
|
||||
;
|
||||
|
||||
_proto._init = function _init() {
|
||||
var _this = this;
|
||||
|
||||
this.remember();
|
||||
this.autoCollapse();
|
||||
$(window).resize(function () {
|
||||
_this.autoCollapse();
|
||||
|
|
@ -585,7 +618,7 @@
|
|||
this.collapse(openTreeview, openMenuLi);
|
||||
}
|
||||
|
||||
treeviewMenu.slideDown(this._config.animationSpeed, function () {
|
||||
treeviewMenu.stop().slideDown(this._config.animationSpeed, function () {
|
||||
parentLi.addClass(ClassName.OPEN);
|
||||
$(_this._element).trigger(expandedEvent);
|
||||
});
|
||||
|
|
@ -595,7 +628,7 @@
|
|||
var _this2 = this;
|
||||
|
||||
var collapsedEvent = $.Event(Event.COLLAPSED);
|
||||
treeviewMenu.slideUp(this._config.animationSpeed, function () {
|
||||
treeviewMenu.stop().slideUp(this._config.animationSpeed, function () {
|
||||
parentLi.removeClass(ClassName.OPEN);
|
||||
$(_this2._element).trigger(collapsedEvent);
|
||||
treeviewMenu.find(Selector.OPEN + " > " + Selector.TREEVIEW_MENU).slideUp();
|
||||
|
|
@ -692,6 +725,9 @@
|
|||
var NAME = 'DirectChat';
|
||||
var DATA_KEY = 'lte.directchat';
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
TOGGLED: "toggled{EVENT_KEY}"
|
||||
};
|
||||
var Selector = {
|
||||
DATA_TOGGLE: '[data-widget="chat-pane-toggle"]',
|
||||
DIRECT_CHAT: '.direct-chat'
|
||||
|
|
@ -715,6 +751,8 @@
|
|||
|
||||
_proto.toggle = function toggle() {
|
||||
$(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN);
|
||||
var toggledEvent = $.Event(Event.TOGGLED);
|
||||
$(this._element).trigger(toggledEvent);
|
||||
} // Static
|
||||
;
|
||||
|
||||
|
|
@ -883,17 +921,17 @@
|
|||
|
||||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE Widget.js
|
||||
* AdminLTE CardWidget.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
var Widget = function ($) {
|
||||
var CardWidget = function ($) {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
var NAME = 'Widget';
|
||||
var DATA_KEY = 'lte.widget';
|
||||
var NAME = 'CardWidget';
|
||||
var DATA_KEY = 'lte.cardwidget';
|
||||
var EVENT_KEY = "." + DATA_KEY;
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
|
|
@ -903,43 +941,48 @@
|
|||
MINIMIZED: "minimized" + EVENT_KEY,
|
||||
REMOVED: "removed" + EVENT_KEY
|
||||
};
|
||||
var ClassName = {
|
||||
CARD: 'card',
|
||||
COLLAPSED: 'collapsed-card',
|
||||
WAS_COLLAPSED: 'was-collapsed',
|
||||
MAXIMIZED: 'maximized-card'
|
||||
};
|
||||
var Selector = {
|
||||
DATA_REMOVE: '[data-widget="remove"]',
|
||||
DATA_COLLAPSE: '[data-widget="collapse"]',
|
||||
DATA_MAXIMIZE: '[data-widget="maximize"]',
|
||||
CARD: '.card',
|
||||
DATA_REMOVE: '[data-card-widget="remove"]',
|
||||
DATA_COLLAPSE: '[data-card-widget="collapse"]',
|
||||
DATA_MAXIMIZE: '[data-card-widget="maximize"]',
|
||||
CARD: "." + ClassName.CARD,
|
||||
CARD_HEADER: '.card-header',
|
||||
CARD_BODY: '.card-body',
|
||||
CARD_FOOTER: '.card-footer',
|
||||
COLLAPSED: '.collapsed-card',
|
||||
COLLAPSE_ICON: '.fa-minus',
|
||||
EXPAND_ICON: '.fa-plus'
|
||||
};
|
||||
var ClassName = {
|
||||
COLLAPSED: 'collapsed-card',
|
||||
WAS_COLLAPSED: 'was-collapsed',
|
||||
MAXIMIZED: 'maximized-card',
|
||||
COLLAPSE_ICON: 'fa-minus',
|
||||
EXPAND_ICON: 'fa-plus',
|
||||
MAXIMIZE_ICON: 'fa-expand',
|
||||
MINIMIZE_ICON: 'fa-compress'
|
||||
COLLAPSED: "." + ClassName.COLLAPSED
|
||||
};
|
||||
var Default = {
|
||||
animationSpeed: 'normal',
|
||||
collapseTrigger: Selector.DATA_COLLAPSE,
|
||||
removeTrigger: Selector.DATA_REMOVE
|
||||
removeTrigger: Selector.DATA_REMOVE,
|
||||
maximizeTrigger: Selector.DATA_MAXIMIZE,
|
||||
collapseIcon: 'fa-minus',
|
||||
expandIcon: 'fa-plus',
|
||||
maximizeIcon: 'fa-expand',
|
||||
minimizeIcon: 'fa-compress'
|
||||
};
|
||||
|
||||
var Widget =
|
||||
var CardWidget =
|
||||
/*#__PURE__*/
|
||||
function () {
|
||||
function Widget(element, settings) {
|
||||
function CardWidget(element, settings) {
|
||||
this._element = element;
|
||||
this._parent = element.parents(Selector.CARD).first();
|
||||
|
||||
if (element.hasClass(ClassName.CARD)) {
|
||||
this._parent = element;
|
||||
}
|
||||
|
||||
this._settings = $.extend({}, Default, settings);
|
||||
}
|
||||
|
||||
var _proto = Widget.prototype;
|
||||
var _proto = CardWidget.prototype;
|
||||
|
||||
_proto.collapse = function collapse() {
|
||||
var _this = this;
|
||||
|
|
@ -948,7 +991,7 @@
|
|||
_this._parent.addClass(ClassName.COLLAPSED);
|
||||
});
|
||||
|
||||
this._element.children(Selector.COLLAPSE_ICON).addClass(ClassName.EXPAND_ICON).removeClass(ClassName.COLLAPSE_ICON);
|
||||
this._element.children(this._settings.collapseTrigger + ' .' + this._settings.collapseIcon).addClass(this._settings.expandIcon).removeClass(this._settings.collapseIcon);
|
||||
|
||||
var collapsed = $.Event(Event.COLLAPSED);
|
||||
|
||||
|
|
@ -962,7 +1005,7 @@
|
|||
_this2._parent.removeClass(ClassName.COLLAPSED);
|
||||
});
|
||||
|
||||
this._element.children(Selector.EXPAND_ICON).addClass(ClassName.COLLAPSE_ICON).removeClass(ClassName.EXPAND_ICON);
|
||||
this._element.children(this._settings.collapseTrigger + ' .' + this._settings.expandIcon).addClass(this._settings.collapseIcon).removeClass(this._settings.expandIcon);
|
||||
|
||||
var expanded = $.Event(Event.EXPANDED);
|
||||
|
||||
|
|
@ -986,46 +1029,59 @@
|
|||
this.collapse();
|
||||
};
|
||||
|
||||
_proto.maximize = function maximize() {
|
||||
this._element.children(this._settings.maximizeTrigger + ' .' + this._settings.maximizeIcon).addClass(this._settings.minimizeIcon).removeClass(this._settings.maximizeIcon);
|
||||
|
||||
this._parent.css({
|
||||
'height': this._parent.height(),
|
||||
'width': this._parent.width(),
|
||||
'transition': 'all .15s'
|
||||
}).delay(150).queue(function () {
|
||||
$(this).addClass(ClassName.MAXIMIZED);
|
||||
$('html').addClass(ClassName.MAXIMIZED);
|
||||
|
||||
if ($(this).hasClass(ClassName.COLLAPSED)) {
|
||||
$(this).addClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
|
||||
var maximized = $.Event(Event.MAXIMIZED);
|
||||
|
||||
this._element.trigger(maximized, this._parent);
|
||||
};
|
||||
|
||||
_proto.minimize = function minimize() {
|
||||
this._element.children(this._settings.maximizeTrigger + ' .' + this._settings.minimizeIcon).addClass(this._settings.maximizeIcon).removeClass(this._settings.minimizeIcon);
|
||||
|
||||
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' + 'width:' + this._parent[0].style.width + ' !important; transition: all .15s;').delay(10).queue(function () {
|
||||
$(this).removeClass(ClassName.MAXIMIZED);
|
||||
$('html').removeClass(ClassName.MAXIMIZED);
|
||||
$(this).css({
|
||||
'height': 'inherit',
|
||||
'width': 'inherit'
|
||||
});
|
||||
|
||||
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
|
||||
$(this).removeClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
|
||||
var MINIMIZED = $.Event(Event.MINIMIZED);
|
||||
|
||||
this._element.trigger(MINIMIZED, this._parent);
|
||||
};
|
||||
|
||||
_proto.toggleMaximize = function toggleMaximize() {
|
||||
var button = this._element.find('i');
|
||||
|
||||
if (this._parent.hasClass(ClassName.MAXIMIZED)) {
|
||||
button.addClass(ClassName.MAXIMIZE_ICON).removeClass(ClassName.MINIMIZE_ICON);
|
||||
|
||||
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' + 'width:' + this._parent[0].style.width + ' !important; transition: all .15s;').delay(100).queue(function () {
|
||||
$(this).removeClass(ClassName.MAXIMIZED);
|
||||
$('html').removeClass(ClassName.MAXIMIZED);
|
||||
$(this).trigger(Event.MINIMIZED);
|
||||
$(this).css({
|
||||
'height': 'inherit',
|
||||
'width': 'inherit'
|
||||
});
|
||||
|
||||
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
|
||||
$(this).removeClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
} else {
|
||||
button.addClass(ClassName.MINIMIZE_ICON).removeClass(ClassName.MAXIMIZE_ICON);
|
||||
|
||||
this._parent.css({
|
||||
'height': this._parent.height(),
|
||||
'width': this._parent.width(),
|
||||
'transition': 'all .15s'
|
||||
}).delay(150).queue(function () {
|
||||
$(this).addClass(ClassName.MAXIMIZED);
|
||||
$('html').addClass(ClassName.MAXIMIZED);
|
||||
$(this).trigger(Event.MAXIMIZED);
|
||||
|
||||
if ($(this).hasClass(ClassName.COLLAPSED)) {
|
||||
$(this).addClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
this.minimize();
|
||||
return;
|
||||
}
|
||||
|
||||
this.maximize();
|
||||
} // Private
|
||||
;
|
||||
|
||||
|
|
@ -1036,30 +1092,31 @@
|
|||
$(this).find(this._settings.collapseTrigger).click(function () {
|
||||
_this3.toggle();
|
||||
});
|
||||
$(this).find(this._settings.maximizeTrigger).click(function () {
|
||||
_this3.toggleMaximize();
|
||||
});
|
||||
$(this).find(this._settings.removeTrigger).click(function () {
|
||||
_this3.remove();
|
||||
});
|
||||
} // Static
|
||||
;
|
||||
|
||||
Widget._jQueryInterface = function _jQueryInterface(config) {
|
||||
return this.each(function () {
|
||||
var data = $(this).data(DATA_KEY);
|
||||
CardWidget._jQueryInterface = function _jQueryInterface(config) {
|
||||
var data = $(this).data(DATA_KEY);
|
||||
|
||||
if (!data) {
|
||||
data = new Widget($(this), data);
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config);
|
||||
}
|
||||
if (!data) {
|
||||
data = new CardWidget($(this), data);
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config);
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|toggleMaximize/)) {
|
||||
data[config]();
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this));
|
||||
}
|
||||
});
|
||||
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|maximize|minimize|toggleMaximize/)) {
|
||||
data[config]();
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this));
|
||||
}
|
||||
};
|
||||
|
||||
return Widget;
|
||||
return CardWidget;
|
||||
}();
|
||||
/**
|
||||
* Data API
|
||||
|
|
@ -1072,45 +1129,208 @@
|
|||
event.preventDefault();
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'toggle');
|
||||
CardWidget._jQueryInterface.call($(this), 'toggle');
|
||||
});
|
||||
$(document).on('click', Selector.DATA_REMOVE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'remove');
|
||||
CardWidget._jQueryInterface.call($(this), 'remove');
|
||||
});
|
||||
$(document).on('click', Selector.DATA_MAXIMIZE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'toggleMaximize');
|
||||
CardWidget._jQueryInterface.call($(this), 'toggleMaximize');
|
||||
});
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = Widget._jQueryInterface;
|
||||
$.fn[NAME].Constructor = Widget;
|
||||
$.fn[NAME] = CardWidget._jQueryInterface;
|
||||
$.fn[NAME].Constructor = CardWidget;
|
||||
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT;
|
||||
return Widget._jQueryInterface;
|
||||
return CardWidget._jQueryInterface;
|
||||
};
|
||||
|
||||
return Widget;
|
||||
return CardWidget;
|
||||
}(jQuery);
|
||||
|
||||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE CardRefresh.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
var CardRefresh = function ($) {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
var NAME = 'CardRefresh';
|
||||
var DATA_KEY = 'lte.cardrefresh';
|
||||
var EVENT_KEY = "." + DATA_KEY;
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
LOADED: "loaded" + EVENT_KEY,
|
||||
OVERLAY_ADDED: "overlay.added" + EVENT_KEY,
|
||||
OVERLAY_REMOVED: "overlay.removed" + EVENT_KEY
|
||||
};
|
||||
var ClassName = {
|
||||
CARD: 'card'
|
||||
};
|
||||
var Selector = {
|
||||
CARD: "." + ClassName.CARD,
|
||||
DATA_REFRESH: '[data-card-widget="card-refresh"]'
|
||||
};
|
||||
var Default = {
|
||||
source: '',
|
||||
sourceSelector: '',
|
||||
params: {},
|
||||
trigger: Selector.DATA_REFRESH,
|
||||
content: '.card-body',
|
||||
loadInContent: true,
|
||||
loadOnInit: true,
|
||||
responseType: '',
|
||||
overlayTemplate: '<div class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>',
|
||||
onLoadStart: function onLoadStart() {},
|
||||
onLoadDone: function onLoadDone(response) {
|
||||
return response;
|
||||
}
|
||||
};
|
||||
|
||||
var CardRefresh =
|
||||
/*#__PURE__*/
|
||||
function () {
|
||||
function CardRefresh(element, settings) {
|
||||
this._element = element;
|
||||
this._parent = element.parents(Selector.CARD).first();
|
||||
this._settings = $.extend({}, Default, settings);
|
||||
this._overlay = $(this._settings.overlayTemplate);
|
||||
|
||||
if (element.hasClass(ClassName.CARD)) {
|
||||
this._parent = element;
|
||||
}
|
||||
|
||||
if (this._settings.source === '') {
|
||||
throw new Error('Source url was not defined. Please specify a url in your CardRefresh source option.');
|
||||
}
|
||||
|
||||
this._init();
|
||||
|
||||
if (this._settings.loadOnInit) {
|
||||
this.load();
|
||||
}
|
||||
}
|
||||
|
||||
var _proto = CardRefresh.prototype;
|
||||
|
||||
_proto.load = function load() {
|
||||
this._addOverlay();
|
||||
|
||||
this._settings.onLoadStart.call($(this));
|
||||
|
||||
$.get(this._settings.source, this._settings.params, function (response) {
|
||||
if (this._settings.loadInContent) {
|
||||
if (this._settings.sourceSelector != '') {
|
||||
response = $(response).find(this._settings.sourceSelector).html();
|
||||
}
|
||||
|
||||
this._parent.find(this._settings.content).html(response);
|
||||
}
|
||||
|
||||
this._settings.onLoadDone.call($(this), response);
|
||||
|
||||
this._removeOverlay();
|
||||
}.bind(this), this._settings.responseType !== '' && this._settings.responseType);
|
||||
var loadedEvent = $.Event(Event.LOADED);
|
||||
$(this._element).trigger(loadedEvent);
|
||||
};
|
||||
|
||||
_proto._addOverlay = function _addOverlay() {
|
||||
this._parent.append(this._overlay);
|
||||
|
||||
var overlayAddedEvent = $.Event(Event.OVERLAY_ADDED);
|
||||
$(this._element).trigger(overlayAddedEvent);
|
||||
};
|
||||
|
||||
_proto._removeOverlay = function _removeOverlay() {
|
||||
this._parent.find(this._overlay).remove();
|
||||
|
||||
var overlayRemovedEvent = $.Event(Event.OVERLAY_REMOVED);
|
||||
$(this._element).trigger(overlayRemovedEvent);
|
||||
};
|
||||
|
||||
// Private
|
||||
_proto._init = function _init(card) {
|
||||
var _this = this;
|
||||
|
||||
$(this).find(this._settings.trigger).on('click', function () {
|
||||
_this.load();
|
||||
});
|
||||
} // Static
|
||||
;
|
||||
|
||||
CardRefresh._jQueryInterface = function _jQueryInterface(config) {
|
||||
var data = $(this).data(DATA_KEY);
|
||||
var options = $(this).data();
|
||||
|
||||
if (!data) {
|
||||
data = new CardRefresh($(this), options);
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config);
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/load/)) {
|
||||
data[config]();
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this));
|
||||
}
|
||||
};
|
||||
|
||||
return CardRefresh;
|
||||
}();
|
||||
/**
|
||||
* Data API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
|
||||
$(document).on('click', Selector.DATA_REFRESH, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
CardRefresh._jQueryInterface.call($(this), 'load');
|
||||
});
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = CardRefresh._jQueryInterface;
|
||||
$.fn[NAME].Constructor = CardRefresh;
|
||||
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT;
|
||||
return CardRefresh._jQueryInterface;
|
||||
};
|
||||
|
||||
return CardRefresh;
|
||||
}(jQuery);
|
||||
|
||||
exports.CardRefresh = CardRefresh;
|
||||
exports.CardWidget = CardWidget;
|
||||
exports.ControlSidebar = ControlSidebar;
|
||||
exports.DirectChat = DirectChat;
|
||||
exports.Layout = Layout;
|
||||
exports.PushMenu = PushMenu;
|
||||
exports.TodoList = TodoList;
|
||||
exports.Treeview = Treeview;
|
||||
exports.Widget = Widget;
|
||||
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
|
||||
|
|
|
|||
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
|
|
@ -54,6 +54,8 @@ navigation:
|
|||
url: components/direct-chat.html
|
||||
- title: Timeline
|
||||
url: components/timeline.html
|
||||
- title: Ribbons
|
||||
url: components/ribbons.html
|
||||
- title: JavaScript
|
||||
icon: fas fa-code
|
||||
url: javascript
|
||||
|
|
@ -64,10 +66,10 @@ navigation:
|
|||
url: javascript/push-menu.html
|
||||
- title: Treeview
|
||||
url: javascript/treeview.html
|
||||
- title: Widget
|
||||
url: javascript/widget.html
|
||||
# - title: CardRefresh
|
||||
# url: javascript/card-refresh.html
|
||||
- title: Card Widget
|
||||
url: javascript/card-widget.html
|
||||
- title: CardRefresh
|
||||
url: javascript/card-refresh.html
|
||||
- title: Control Sidebar
|
||||
url: javascript/control-sidebar.html
|
||||
- title: Direct Chat
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
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
|
|
@ -21,8 +21,13 @@
|
|||
* ====================================================
|
||||
*/
|
||||
var NAME = 'ControlSidebar';
|
||||
var DATA_KEY = 'lte.control.sidebar';
|
||||
var DATA_KEY = 'lte.controlsidebar';
|
||||
var EVENT_KEY = "." + DATA_KEY;
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
COLLAPSED: "collapsed" + EVENT_KEY,
|
||||
EXPANDED: "expanded" + EVENT_KEY
|
||||
};
|
||||
var Selector = {
|
||||
CONTROL_SIDEBAR: '.control-sidebar',
|
||||
DATA_TOGGLE: '[data-widget="control-sidebar"]',
|
||||
|
|
@ -34,7 +39,7 @@
|
|||
CONTROL_SIDEBAR_SLIDE: 'control-sidebar-slide-open'
|
||||
};
|
||||
var Default = {
|
||||
slide: true
|
||||
controlsidebarSlide: true
|
||||
/**
|
||||
* Class Definition
|
||||
* ====================================================
|
||||
|
|
@ -55,7 +60,7 @@
|
|||
|
||||
_proto.show = function show() {
|
||||
// Show the control sidebar
|
||||
if (this._config.slide) {
|
||||
if (this._config.controlsidebarSlide) {
|
||||
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE);
|
||||
$('body').removeClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () {
|
||||
$(Selector.CONTROL_SIDEBAR).hide();
|
||||
|
|
@ -65,13 +70,16 @@
|
|||
} else {
|
||||
$('body').removeClass(ClassName.CONTROL_SIDEBAR_OPEN);
|
||||
}
|
||||
|
||||
var expandedEvent = $.Event(Event.EXPANDED);
|
||||
$(this._element).trigger(expandedEvent);
|
||||
};
|
||||
|
||||
_proto.collapse = function collapse() {
|
||||
// Collapse the control sidebar
|
||||
if (this._config.slide) {
|
||||
if (this._config.controlsidebarSlide) {
|
||||
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE);
|
||||
$(Selector.CONTROL_SIDEBAR).show().delay(100).queue(function () {
|
||||
$(Selector.CONTROL_SIDEBAR).show().delay(10).queue(function () {
|
||||
$('body').addClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () {
|
||||
$('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE);
|
||||
$(this).dequeue();
|
||||
|
|
@ -81,11 +89,12 @@
|
|||
} else {
|
||||
$('body').addClass(ClassName.CONTROL_SIDEBAR_OPEN);
|
||||
}
|
||||
|
||||
var collapsedEvent = $.Event(Event.COLLAPSED);
|
||||
$(this._element).trigger(collapsedEvent);
|
||||
};
|
||||
|
||||
_proto.toggle = function toggle() {
|
||||
this._setMargin();
|
||||
|
||||
var shouldOpen = $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE);
|
||||
|
||||
if (shouldOpen) {
|
||||
|
|
@ -100,12 +109,6 @@
|
|||
|
||||
_proto._getConfig = function _getConfig(config) {
|
||||
return $.extend({}, Default, config);
|
||||
};
|
||||
|
||||
_proto._setMargin = function _setMargin() {
|
||||
$(Selector.CONTROL_SIDEBAR).css({
|
||||
top: $(Selector.MAIN_HEADER).innerHeight()
|
||||
});
|
||||
} // Static
|
||||
;
|
||||
|
||||
|
|
@ -356,7 +359,9 @@
|
|||
};
|
||||
var Default = {
|
||||
autoCollapseSize: false,
|
||||
screenCollapseSize: 768
|
||||
screenCollapseSize: 768,
|
||||
enableRemember: false,
|
||||
noTransitionAfterReload: true
|
||||
};
|
||||
var Selector = {
|
||||
TOGGLE_BUTTON: '[data-widget="pushmenu"]',
|
||||
|
|
@ -397,12 +402,22 @@
|
|||
|
||||
_proto.show = function show() {
|
||||
$(Selector.BODY).addClass(ClassName.OPEN).removeClass(ClassName.COLLAPSED);
|
||||
|
||||
if (this._options.enableRemember) {
|
||||
localStorage.setItem("remember" + EVENT_KEY, ClassName.OPEN);
|
||||
}
|
||||
|
||||
var shownEvent = $.Event(Event.SHOWN);
|
||||
$(this._element).trigger(shownEvent);
|
||||
};
|
||||
|
||||
_proto.collapse = function collapse() {
|
||||
$(Selector.BODY).removeClass(ClassName.OPEN).addClass(ClassName.COLLAPSED);
|
||||
|
||||
if (this._options.enableRemember) {
|
||||
localStorage.setItem("remember" + EVENT_KEY, ClassName.COLLAPSED);
|
||||
}
|
||||
|
||||
var collapsedEvent = $.Event(Event.COLLAPSED);
|
||||
$(this._element).trigger(collapsedEvent);
|
||||
};
|
||||
|
|
@ -435,12 +450,30 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
_proto.remember = function remember() {
|
||||
if (this._options.enableRemember) {
|
||||
var toggleState = localStorage.getItem("remember" + EVENT_KEY);
|
||||
|
||||
if (toggleState == ClassName.COLLAPSED) {
|
||||
if (this._options.noTransitionAfterReload) {
|
||||
$("body").addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(10).queue(function () {
|
||||
$(this).removeClass('hold-transition');
|
||||
$(this).dequeue();
|
||||
});
|
||||
} else {
|
||||
$("body").addClass(ClassName.COLLAPSED);
|
||||
}
|
||||
}
|
||||
}
|
||||
} // Private
|
||||
;
|
||||
|
||||
_proto._init = function _init() {
|
||||
var _this = this;
|
||||
|
||||
this.remember();
|
||||
this.autoCollapse();
|
||||
$(window).resize(function () {
|
||||
_this.autoCollapse();
|
||||
|
|
@ -585,7 +618,7 @@
|
|||
this.collapse(openTreeview, openMenuLi);
|
||||
}
|
||||
|
||||
treeviewMenu.slideDown(this._config.animationSpeed, function () {
|
||||
treeviewMenu.stop().slideDown(this._config.animationSpeed, function () {
|
||||
parentLi.addClass(ClassName.OPEN);
|
||||
$(_this._element).trigger(expandedEvent);
|
||||
});
|
||||
|
|
@ -595,7 +628,7 @@
|
|||
var _this2 = this;
|
||||
|
||||
var collapsedEvent = $.Event(Event.COLLAPSED);
|
||||
treeviewMenu.slideUp(this._config.animationSpeed, function () {
|
||||
treeviewMenu.stop().slideUp(this._config.animationSpeed, function () {
|
||||
parentLi.removeClass(ClassName.OPEN);
|
||||
$(_this2._element).trigger(collapsedEvent);
|
||||
treeviewMenu.find(Selector.OPEN + " > " + Selector.TREEVIEW_MENU).slideUp();
|
||||
|
|
@ -692,6 +725,9 @@
|
|||
var NAME = 'DirectChat';
|
||||
var DATA_KEY = 'lte.directchat';
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
TOGGLED: "toggled{EVENT_KEY}"
|
||||
};
|
||||
var Selector = {
|
||||
DATA_TOGGLE: '[data-widget="chat-pane-toggle"]',
|
||||
DIRECT_CHAT: '.direct-chat'
|
||||
|
|
@ -715,6 +751,8 @@
|
|||
|
||||
_proto.toggle = function toggle() {
|
||||
$(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN);
|
||||
var toggledEvent = $.Event(Event.TOGGLED);
|
||||
$(this._element).trigger(toggledEvent);
|
||||
} // Static
|
||||
;
|
||||
|
||||
|
|
@ -883,17 +921,17 @@
|
|||
|
||||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE Widget.js
|
||||
* AdminLTE CardWidget.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
var Widget = function ($) {
|
||||
var CardWidget = function ($) {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
var NAME = 'Widget';
|
||||
var DATA_KEY = 'lte.widget';
|
||||
var NAME = 'CardWidget';
|
||||
var DATA_KEY = 'lte.cardwidget';
|
||||
var EVENT_KEY = "." + DATA_KEY;
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
|
|
@ -903,43 +941,48 @@
|
|||
MINIMIZED: "minimized" + EVENT_KEY,
|
||||
REMOVED: "removed" + EVENT_KEY
|
||||
};
|
||||
var ClassName = {
|
||||
CARD: 'card',
|
||||
COLLAPSED: 'collapsed-card',
|
||||
WAS_COLLAPSED: 'was-collapsed',
|
||||
MAXIMIZED: 'maximized-card'
|
||||
};
|
||||
var Selector = {
|
||||
DATA_REMOVE: '[data-widget="remove"]',
|
||||
DATA_COLLAPSE: '[data-widget="collapse"]',
|
||||
DATA_MAXIMIZE: '[data-widget="maximize"]',
|
||||
CARD: '.card',
|
||||
DATA_REMOVE: '[data-card-widget="remove"]',
|
||||
DATA_COLLAPSE: '[data-card-widget="collapse"]',
|
||||
DATA_MAXIMIZE: '[data-card-widget="maximize"]',
|
||||
CARD: "." + ClassName.CARD,
|
||||
CARD_HEADER: '.card-header',
|
||||
CARD_BODY: '.card-body',
|
||||
CARD_FOOTER: '.card-footer',
|
||||
COLLAPSED: '.collapsed-card',
|
||||
COLLAPSE_ICON: '.fa-minus',
|
||||
EXPAND_ICON: '.fa-plus'
|
||||
};
|
||||
var ClassName = {
|
||||
COLLAPSED: 'collapsed-card',
|
||||
WAS_COLLAPSED: 'was-collapsed',
|
||||
MAXIMIZED: 'maximized-card',
|
||||
COLLAPSE_ICON: 'fa-minus',
|
||||
EXPAND_ICON: 'fa-plus',
|
||||
MAXIMIZE_ICON: 'fa-expand',
|
||||
MINIMIZE_ICON: 'fa-compress'
|
||||
COLLAPSED: "." + ClassName.COLLAPSED
|
||||
};
|
||||
var Default = {
|
||||
animationSpeed: 'normal',
|
||||
collapseTrigger: Selector.DATA_COLLAPSE,
|
||||
removeTrigger: Selector.DATA_REMOVE
|
||||
removeTrigger: Selector.DATA_REMOVE,
|
||||
maximizeTrigger: Selector.DATA_MAXIMIZE,
|
||||
collapseIcon: 'fa-minus',
|
||||
expandIcon: 'fa-plus',
|
||||
maximizeIcon: 'fa-expand',
|
||||
minimizeIcon: 'fa-compress'
|
||||
};
|
||||
|
||||
var Widget =
|
||||
var CardWidget =
|
||||
/*#__PURE__*/
|
||||
function () {
|
||||
function Widget(element, settings) {
|
||||
function CardWidget(element, settings) {
|
||||
this._element = element;
|
||||
this._parent = element.parents(Selector.CARD).first();
|
||||
|
||||
if (element.hasClass(ClassName.CARD)) {
|
||||
this._parent = element;
|
||||
}
|
||||
|
||||
this._settings = $.extend({}, Default, settings);
|
||||
}
|
||||
|
||||
var _proto = Widget.prototype;
|
||||
var _proto = CardWidget.prototype;
|
||||
|
||||
_proto.collapse = function collapse() {
|
||||
var _this = this;
|
||||
|
|
@ -948,7 +991,7 @@
|
|||
_this._parent.addClass(ClassName.COLLAPSED);
|
||||
});
|
||||
|
||||
this._element.children(Selector.COLLAPSE_ICON).addClass(ClassName.EXPAND_ICON).removeClass(ClassName.COLLAPSE_ICON);
|
||||
this._element.children(this._settings.collapseTrigger + ' .' + this._settings.collapseIcon).addClass(this._settings.expandIcon).removeClass(this._settings.collapseIcon);
|
||||
|
||||
var collapsed = $.Event(Event.COLLAPSED);
|
||||
|
||||
|
|
@ -962,7 +1005,7 @@
|
|||
_this2._parent.removeClass(ClassName.COLLAPSED);
|
||||
});
|
||||
|
||||
this._element.children(Selector.EXPAND_ICON).addClass(ClassName.COLLAPSE_ICON).removeClass(ClassName.EXPAND_ICON);
|
||||
this._element.children(this._settings.collapseTrigger + ' .' + this._settings.expandIcon).addClass(this._settings.collapseIcon).removeClass(this._settings.expandIcon);
|
||||
|
||||
var expanded = $.Event(Event.EXPANDED);
|
||||
|
||||
|
|
@ -986,46 +1029,59 @@
|
|||
this.collapse();
|
||||
};
|
||||
|
||||
_proto.maximize = function maximize() {
|
||||
this._element.children(this._settings.maximizeTrigger + ' .' + this._settings.maximizeIcon).addClass(this._settings.minimizeIcon).removeClass(this._settings.maximizeIcon);
|
||||
|
||||
this._parent.css({
|
||||
'height': this._parent.height(),
|
||||
'width': this._parent.width(),
|
||||
'transition': 'all .15s'
|
||||
}).delay(150).queue(function () {
|
||||
$(this).addClass(ClassName.MAXIMIZED);
|
||||
$('html').addClass(ClassName.MAXIMIZED);
|
||||
|
||||
if ($(this).hasClass(ClassName.COLLAPSED)) {
|
||||
$(this).addClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
|
||||
var maximized = $.Event(Event.MAXIMIZED);
|
||||
|
||||
this._element.trigger(maximized, this._parent);
|
||||
};
|
||||
|
||||
_proto.minimize = function minimize() {
|
||||
this._element.children(this._settings.maximizeTrigger + ' .' + this._settings.minimizeIcon).addClass(this._settings.maximizeIcon).removeClass(this._settings.minimizeIcon);
|
||||
|
||||
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' + 'width:' + this._parent[0].style.width + ' !important; transition: all .15s;').delay(10).queue(function () {
|
||||
$(this).removeClass(ClassName.MAXIMIZED);
|
||||
$('html').removeClass(ClassName.MAXIMIZED);
|
||||
$(this).css({
|
||||
'height': 'inherit',
|
||||
'width': 'inherit'
|
||||
});
|
||||
|
||||
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
|
||||
$(this).removeClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
|
||||
var MINIMIZED = $.Event(Event.MINIMIZED);
|
||||
|
||||
this._element.trigger(MINIMIZED, this._parent);
|
||||
};
|
||||
|
||||
_proto.toggleMaximize = function toggleMaximize() {
|
||||
var button = this._element.find('i');
|
||||
|
||||
if (this._parent.hasClass(ClassName.MAXIMIZED)) {
|
||||
button.addClass(ClassName.MAXIMIZE_ICON).removeClass(ClassName.MINIMIZE_ICON);
|
||||
|
||||
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' + 'width:' + this._parent[0].style.width + ' !important; transition: all .15s;').delay(100).queue(function () {
|
||||
$(this).removeClass(ClassName.MAXIMIZED);
|
||||
$('html').removeClass(ClassName.MAXIMIZED);
|
||||
$(this).trigger(Event.MINIMIZED);
|
||||
$(this).css({
|
||||
'height': 'inherit',
|
||||
'width': 'inherit'
|
||||
});
|
||||
|
||||
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
|
||||
$(this).removeClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
} else {
|
||||
button.addClass(ClassName.MINIMIZE_ICON).removeClass(ClassName.MAXIMIZE_ICON);
|
||||
|
||||
this._parent.css({
|
||||
'height': this._parent.height(),
|
||||
'width': this._parent.width(),
|
||||
'transition': 'all .15s'
|
||||
}).delay(150).queue(function () {
|
||||
$(this).addClass(ClassName.MAXIMIZED);
|
||||
$('html').addClass(ClassName.MAXIMIZED);
|
||||
$(this).trigger(Event.MAXIMIZED);
|
||||
|
||||
if ($(this).hasClass(ClassName.COLLAPSED)) {
|
||||
$(this).addClass(ClassName.WAS_COLLAPSED);
|
||||
}
|
||||
|
||||
$(this).dequeue();
|
||||
});
|
||||
this.minimize();
|
||||
return;
|
||||
}
|
||||
|
||||
this.maximize();
|
||||
} // Private
|
||||
;
|
||||
|
||||
|
|
@ -1036,30 +1092,31 @@
|
|||
$(this).find(this._settings.collapseTrigger).click(function () {
|
||||
_this3.toggle();
|
||||
});
|
||||
$(this).find(this._settings.maximizeTrigger).click(function () {
|
||||
_this3.toggleMaximize();
|
||||
});
|
||||
$(this).find(this._settings.removeTrigger).click(function () {
|
||||
_this3.remove();
|
||||
});
|
||||
} // Static
|
||||
;
|
||||
|
||||
Widget._jQueryInterface = function _jQueryInterface(config) {
|
||||
return this.each(function () {
|
||||
var data = $(this).data(DATA_KEY);
|
||||
CardWidget._jQueryInterface = function _jQueryInterface(config) {
|
||||
var data = $(this).data(DATA_KEY);
|
||||
|
||||
if (!data) {
|
||||
data = new Widget($(this), data);
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config);
|
||||
}
|
||||
if (!data) {
|
||||
data = new CardWidget($(this), data);
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config);
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|toggleMaximize/)) {
|
||||
data[config]();
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this));
|
||||
}
|
||||
});
|
||||
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|maximize|minimize|toggleMaximize/)) {
|
||||
data[config]();
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this));
|
||||
}
|
||||
};
|
||||
|
||||
return Widget;
|
||||
return CardWidget;
|
||||
}();
|
||||
/**
|
||||
* Data API
|
||||
|
|
@ -1072,45 +1129,208 @@
|
|||
event.preventDefault();
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'toggle');
|
||||
CardWidget._jQueryInterface.call($(this), 'toggle');
|
||||
});
|
||||
$(document).on('click', Selector.DATA_REMOVE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'remove');
|
||||
CardWidget._jQueryInterface.call($(this), 'remove');
|
||||
});
|
||||
$(document).on('click', Selector.DATA_MAXIMIZE, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
Widget._jQueryInterface.call($(this), 'toggleMaximize');
|
||||
CardWidget._jQueryInterface.call($(this), 'toggleMaximize');
|
||||
});
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = Widget._jQueryInterface;
|
||||
$.fn[NAME].Constructor = Widget;
|
||||
$.fn[NAME] = CardWidget._jQueryInterface;
|
||||
$.fn[NAME].Constructor = CardWidget;
|
||||
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT;
|
||||
return Widget._jQueryInterface;
|
||||
return CardWidget._jQueryInterface;
|
||||
};
|
||||
|
||||
return Widget;
|
||||
return CardWidget;
|
||||
}(jQuery);
|
||||
|
||||
/**
|
||||
* --------------------------------------------
|
||||
* AdminLTE CardRefresh.js
|
||||
* License MIT
|
||||
* --------------------------------------------
|
||||
*/
|
||||
var CardRefresh = function ($) {
|
||||
/**
|
||||
* Constants
|
||||
* ====================================================
|
||||
*/
|
||||
var NAME = 'CardRefresh';
|
||||
var DATA_KEY = 'lte.cardrefresh';
|
||||
var EVENT_KEY = "." + DATA_KEY;
|
||||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
var Event = {
|
||||
LOADED: "loaded" + EVENT_KEY,
|
||||
OVERLAY_ADDED: "overlay.added" + EVENT_KEY,
|
||||
OVERLAY_REMOVED: "overlay.removed" + EVENT_KEY
|
||||
};
|
||||
var ClassName = {
|
||||
CARD: 'card'
|
||||
};
|
||||
var Selector = {
|
||||
CARD: "." + ClassName.CARD,
|
||||
DATA_REFRESH: '[data-card-widget="card-refresh"]'
|
||||
};
|
||||
var Default = {
|
||||
source: '',
|
||||
sourceSelector: '',
|
||||
params: {},
|
||||
trigger: Selector.DATA_REFRESH,
|
||||
content: '.card-body',
|
||||
loadInContent: true,
|
||||
loadOnInit: true,
|
||||
responseType: '',
|
||||
overlayTemplate: '<div class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>',
|
||||
onLoadStart: function onLoadStart() {},
|
||||
onLoadDone: function onLoadDone(response) {
|
||||
return response;
|
||||
}
|
||||
};
|
||||
|
||||
var CardRefresh =
|
||||
/*#__PURE__*/
|
||||
function () {
|
||||
function CardRefresh(element, settings) {
|
||||
this._element = element;
|
||||
this._parent = element.parents(Selector.CARD).first();
|
||||
this._settings = $.extend({}, Default, settings);
|
||||
this._overlay = $(this._settings.overlayTemplate);
|
||||
|
||||
if (element.hasClass(ClassName.CARD)) {
|
||||
this._parent = element;
|
||||
}
|
||||
|
||||
if (this._settings.source === '') {
|
||||
throw new Error('Source url was not defined. Please specify a url in your CardRefresh source option.');
|
||||
}
|
||||
|
||||
this._init();
|
||||
|
||||
if (this._settings.loadOnInit) {
|
||||
this.load();
|
||||
}
|
||||
}
|
||||
|
||||
var _proto = CardRefresh.prototype;
|
||||
|
||||
_proto.load = function load() {
|
||||
this._addOverlay();
|
||||
|
||||
this._settings.onLoadStart.call($(this));
|
||||
|
||||
$.get(this._settings.source, this._settings.params, function (response) {
|
||||
if (this._settings.loadInContent) {
|
||||
if (this._settings.sourceSelector != '') {
|
||||
response = $(response).find(this._settings.sourceSelector).html();
|
||||
}
|
||||
|
||||
this._parent.find(this._settings.content).html(response);
|
||||
}
|
||||
|
||||
this._settings.onLoadDone.call($(this), response);
|
||||
|
||||
this._removeOverlay();
|
||||
}.bind(this), this._settings.responseType !== '' && this._settings.responseType);
|
||||
var loadedEvent = $.Event(Event.LOADED);
|
||||
$(this._element).trigger(loadedEvent);
|
||||
};
|
||||
|
||||
_proto._addOverlay = function _addOverlay() {
|
||||
this._parent.append(this._overlay);
|
||||
|
||||
var overlayAddedEvent = $.Event(Event.OVERLAY_ADDED);
|
||||
$(this._element).trigger(overlayAddedEvent);
|
||||
};
|
||||
|
||||
_proto._removeOverlay = function _removeOverlay() {
|
||||
this._parent.find(this._overlay).remove();
|
||||
|
||||
var overlayRemovedEvent = $.Event(Event.OVERLAY_REMOVED);
|
||||
$(this._element).trigger(overlayRemovedEvent);
|
||||
};
|
||||
|
||||
// Private
|
||||
_proto._init = function _init(card) {
|
||||
var _this = this;
|
||||
|
||||
$(this).find(this._settings.trigger).on('click', function () {
|
||||
_this.load();
|
||||
});
|
||||
} // Static
|
||||
;
|
||||
|
||||
CardRefresh._jQueryInterface = function _jQueryInterface(config) {
|
||||
var data = $(this).data(DATA_KEY);
|
||||
var options = $(this).data();
|
||||
|
||||
if (!data) {
|
||||
data = new CardRefresh($(this), options);
|
||||
$(this).data(DATA_KEY, typeof config === 'string' ? data : config);
|
||||
}
|
||||
|
||||
if (typeof config === 'string' && config.match(/load/)) {
|
||||
data[config]();
|
||||
} else if (typeof config === 'object') {
|
||||
data._init($(this));
|
||||
}
|
||||
};
|
||||
|
||||
return CardRefresh;
|
||||
}();
|
||||
/**
|
||||
* Data API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
|
||||
$(document).on('click', Selector.DATA_REFRESH, function (event) {
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
CardRefresh._jQueryInterface.call($(this), 'load');
|
||||
});
|
||||
/**
|
||||
* jQuery API
|
||||
* ====================================================
|
||||
*/
|
||||
|
||||
$.fn[NAME] = CardRefresh._jQueryInterface;
|
||||
$.fn[NAME].Constructor = CardRefresh;
|
||||
|
||||
$.fn[NAME].noConflict = function () {
|
||||
$.fn[NAME] = JQUERY_NO_CONFLICT;
|
||||
return CardRefresh._jQueryInterface;
|
||||
};
|
||||
|
||||
return CardRefresh;
|
||||
}(jQuery);
|
||||
|
||||
exports.CardRefresh = CardRefresh;
|
||||
exports.CardWidget = CardWidget;
|
||||
exports.ControlSidebar = ControlSidebar;
|
||||
exports.DirectChat = DirectChat;
|
||||
exports.Layout = Layout;
|
||||
exports.PushMenu = PushMenu;
|
||||
exports.TodoList = TodoList;
|
||||
exports.Treeview = Treeview;
|
||||
exports.Widget = Widget;
|
||||
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
|
||||
|
|
|
|||
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
|
|
@ -7,6 +7,11 @@ Control sidebar is the right sidebar. It can be used for many purposes and is ex
|
|||
|
||||
The following code should be placed within the `.wrapper` div. I prefer to place it right after the footer.
|
||||
|
||||
##### Control Sidebar Push
|
||||
{: .text-bold .text-dark}
|
||||
By adding the `.control-sidebar-push` to `body`, the sidebar pushes the content away instead of overlaying the content.
|
||||
You can also add `.control-sidebar-push-slide` to `body`, to push the content away with an transition.
|
||||
|
||||
##### Dark Sidebar Markup
|
||||
{: .text-bold .text-dark}
|
||||
```html
|
||||
|
|
|
|||
|
|
@ -15,6 +15,137 @@ title: Main Header Component
|
|||
The main header contains the navbar. Construction of the navbar differs slightly from Bootstrap because it has components that Bootstrap doesn't provide. The navbar can be constructed in two ways. This is an example for the normal navbar and next we will provide an example for the top nav layout with a logo too.
|
||||
|
||||
|
||||
<nav class="navbar navbar-expand navbar-white navbar-light ml-0">
|
||||
<!-- Left navbar links -->
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-widget="pushmenu" href="#"><i class="fas fa-bars"></i></a>
|
||||
</li>
|
||||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="index3.html" class="nav-link">Home</a>
|
||||
</li>
|
||||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="#" class="nav-link">Contact</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Help
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item" href="#">FAQ</a>
|
||||
<a class="dropdown-item" href="#">Support</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Contact</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- SEARCH FORM -->
|
||||
<form class="form-inline ml-3">
|
||||
<div class="input-group input-group-sm">
|
||||
<input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-navbar" type="submit">
|
||||
<i class="fas fa-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- Right navbar links -->
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<!-- Messages Dropdown Menu -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link" data-toggle="dropdown" href="#">
|
||||
<i class="far fa-comments"></i>
|
||||
<span class="badge badge-danger navbar-badge">3</span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="{{'assets/img/user1-128x128.jpg' | relative_url}}" alt="User Avatar" class="img-size-50 mr-3 img-circle">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
Brad Diesel
|
||||
<span class="float-right text-sm text-danger"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">Call me whenever you can...</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="{{'assets/img/user8-128x128.jpg' | relative_url}}" alt="User Avatar" class="img-size-50 img-circle mr-3">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
John Pierce
|
||||
<span class="float-right text-sm text-muted"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">I got your message bro</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="{{'assets/img/user3-128x128.jpg' | relative_url}}" alt="User Avatar" class="img-size-50 img-circle mr-3">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
Nora Silvester
|
||||
<span class="float-right text-sm text-warning"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">The subject goes here</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Notifications Dropdown Menu -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link" data-toggle="dropdown" href="#">
|
||||
<i class="far fa-bell"></i>
|
||||
<span class="badge badge-warning navbar-badge">15</span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
|
||||
<span class="dropdown-header">15 Notifications</span>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-envelope mr-2"></i> 4 new messages
|
||||
<span class="float-right text-muted text-sm">3 mins</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-users mr-2"></i> 8 friend requests
|
||||
<span class="float-right text-muted text-sm">12 hours</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-file mr-2"></i> 3 new reports
|
||||
<span class="float-right text-muted text-sm">2 days</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#"><i
|
||||
class="fas fa-th-large"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
```html
|
||||
<!-- Navbar -->
|
||||
<nav class="main-header navbar navbar-expand navbar-white navbar-light">
|
||||
|
|
@ -29,6 +160,17 @@ The main header contains the navbar. Construction of the navbar differs slightly
|
|||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="#" class="nav-link">Contact</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Help
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item" href="#">FAQ</a>
|
||||
<a class="dropdown-item" href="#">Support</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Contact</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- SEARCH FORM -->
|
||||
|
|
@ -149,6 +291,141 @@ The main header contains the navbar. Construction of the navbar differs slightly
|
|||
|
||||
Top navbar example can be found in this [demo page](https://adminlte.io/themes/dev/AdminLTE/pages/layout/top-nav.html).
|
||||
|
||||
|
||||
<nav class="navbar navbar-expand navbar-light navbar-white">
|
||||
<div class="container">
|
||||
<a href="index3.html" class="navbar-brand">
|
||||
<img src="{{'assets/img/AdminLTELogo.png' | relative_url}}" alt="AdminLTE Logo" class="brand-image img-circle elevation-3"
|
||||
style="opacity: .8">
|
||||
<span class="brand-text font-weight-light">AdminLTE 3</span>
|
||||
</a>
|
||||
<!-- Left navbar links -->
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
</li>
|
||||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="index3.html" class="nav-link">Home</a>
|
||||
</li>
|
||||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="#" class="nav-link">Contact</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Help
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item" href="#">FAQ</a>
|
||||
<a class="dropdown-item" href="#">Support</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Contact</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- SEARCH FORM -->
|
||||
<form class="form-inline ml-3">
|
||||
<div class="input-group input-group-sm">
|
||||
<input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-navbar" type="submit">
|
||||
<i class="fas fa-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<!-- Right navbar links -->
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<!-- Messages Dropdown Menu -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link" data-toggle="dropdown" href="#">
|
||||
<i class="fas fa-comments"></i>
|
||||
<span class="badge badge-danger navbar-badge">3</span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="{{'assets/img/user1-128x128.jpg' | relative_url}}" alt="User Avatar" class="img-size-50 mr-3 img-circle">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
Brad Diesel
|
||||
<span class="float-right text-sm text-danger"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">Call me whenever you can...</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="{{'assets/img/user8-128x128.jpg' | relative_url}}" alt="User Avatar" class="img-size-50 img-circle mr-3">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
John Pierce
|
||||
<span class="float-right text-sm text-muted"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">I got your message bro</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="{{'assets/img/user3-128x128.jpg' | relative_url}}" alt="User Avatar" class="img-size-50 img-circle mr-3">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
Nora Silvester
|
||||
<span class="float-right text-sm text-warning"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">The subject goes here</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Notifications Dropdown Menu -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link" data-toggle="dropdown" href="#">
|
||||
<i class="far fa-bell"></i>
|
||||
<span class="badge badge-warning navbar-badge">15</span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
|
||||
<span class="dropdown-header">15 Notifications</span>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-envelope mr-2"></i> 4 new messages
|
||||
<span class="float-right text-muted text-sm">3 mins</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-users mr-2"></i> 8 friend requests
|
||||
<span class="float-right text-muted text-sm">12 hours</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-file mr-2"></i> 3 new reports
|
||||
<span class="float-right text-muted text-sm">2 days</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#"><i
|
||||
class="fas fa-th-large"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
```html
|
||||
<!-- Navbar -->
|
||||
<nav class="main-header navbar navbar-expand navbar-light navbar-white">
|
||||
|
|
@ -169,6 +446,17 @@ Top navbar example can be found in this [demo page](https://adminlte.io/themes/d
|
|||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="#" class="nav-link">Contact</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Help
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item" href="#">FAQ</a>
|
||||
<a class="dropdown-item" href="#">Support</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Contact</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- SEARCH FORM -->
|
||||
|
|
@ -280,3 +568,8 @@ Top navbar example can be found in this [demo page](https://adminlte.io/themes/d
|
|||
<!-- /.navbar -->
|
||||
```
|
||||
{: .max-height-300}
|
||||
|
||||
|
||||
> ##### Tip!
|
||||
> To get a bigger dropdown menu you can add `.dropdown-menu-lg` or `.dropdown-menu-xl` to `.dropdown-menu`.
|
||||
{: .quote-info}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,165 @@
|
|||
---
|
||||
layout: page
|
||||
title: Ribbons Component
|
||||
---
|
||||
|
||||
The ribbons component is a easy way to display informations above any content. The `.ribbon-warpper` needs to be inside a element with _position:relative;_. In this docs page we place the ribbon always inside `<div class="position-relative p-3 bg-gray" style="height: 180px"></div>` for demo purpose but it can placed inside cards, table rows & many more.
|
||||
|
||||
The ribbon comes in three sizes to display more text or use larger font sizes, default (only `.ribbon-wrapper`), large (`.ribbon-wrapper` with `.ribbon-lg`), extra large (`.ribbon-wrapper` with `.ribbon-xl`).
|
||||
|
||||
##### Example Markup
|
||||
{: .text-bold .text-dark .mt-5}
|
||||
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper">
|
||||
<div class="ribbon bg-primary">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Default <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon</small>
|
||||
</div>
|
||||
|
||||
```html
|
||||
<div class="ribbon-wrapper">
|
||||
<div class="ribbon bg-primary">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
{: .max-height-300}
|
||||
|
||||
##### Ribbon Size Variations
|
||||
{: .text-bold .text-dark .mt-5}
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper">
|
||||
<div class="ribbon bg-primary">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Default <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-lg">
|
||||
<div class="ribbon bg-info">
|
||||
Ribbon Large
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Large <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-secondary">
|
||||
Ribbon Extra Large
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Extra Large <br />
|
||||
<small>.ribbon-wrapper.ribbon-xl .ribbon</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-4" markdown="1">
|
||||
```html
|
||||
<div class="ribbon-wrapper">
|
||||
<div class="ribbon bg-primary">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
</div>
|
||||
<div class="col-sm-4" markdown="1">
|
||||
```html
|
||||
<div class="ribbon-wrapper ribbon-lg">
|
||||
<div class="ribbon bg-info">
|
||||
Ribbon Large
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
</div>
|
||||
<div class="col-sm-4" markdown="1">
|
||||
```html
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-secondary">
|
||||
Ribbon Extra Large
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
</div>
|
||||
</div>
|
||||
|
||||
##### Text Size Variations
|
||||
{: .text-bold .text-dark .mt-5}
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-lg">
|
||||
<div class="ribbon bg-success text-lg">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Large <br /> with Large Text <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon.text-lg</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-warning text-lg">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Extra Large <br /> with Large Text <br />
|
||||
<small>.ribbon-wrapper.ribbon-xl .ribbon.text-lg</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-danger text-xl">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Extra Large <br /> with Extra Large Text <br />
|
||||
<small>.ribbon-wrapper.ribbon-xl .ribbon.text-xl</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-4" markdown="1">
|
||||
```html
|
||||
<div class="ribbon-wrapper ribbon-lg">
|
||||
<div class="ribbon bg-success text-lg">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
</div>
|
||||
<div class="col-sm-4" markdown="1">
|
||||
```html
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-warning text-lg">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
</div>
|
||||
<div class="col-sm-4" markdown="1">
|
||||
```html
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-danger text-xl">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
---
|
||||
layout: page
|
||||
title: Card Refresh Plugin
|
||||
---
|
||||
|
||||
The card refresh plugin provides the functionality for loading ajax content into the card.
|
||||
|
||||
##### Usage
|
||||
This plugin can be activated as a jQuery plugin or using the data api.
|
||||
|
||||
###### Data API
|
||||
{: .text-bold }
|
||||
|
||||
Activate the plugin by adding a button with `data-card-widget="card-refresh"` to the card and provide the required `data-source="/URL-TO-CONTENT"` option. By doing that, the plugin will automatically create a GET request to the provided URL and render the returned response the `.card-body` section of the card. If you need to process the returned response before rendering, you should use the jQuery API, which provides hooks to deal with the response.
|
||||
|
||||
|
||||
|
||||
###### jQuery
|
||||
{: .text-bold }
|
||||
The jQuery API provides more customizable options that allows the developer to pre-process the request before rendering and post-process it after rendering.
|
||||
|
||||
```js
|
||||
("#my-card").refreshBox(options)
|
||||
```
|
||||
|
||||
##### Options
|
||||
{: .mt-4}
|
||||
|
||||
|---
|
||||
| Name | Type | Default | Description
|
||||
|-|-|-|-
|
||||
|
||||
|
||||
source: '',
|
||||
sourceSelector: '',
|
||||
params: {},
|
||||
trigger: Selector.DATA_REFRESH,
|
||||
content: '.card-body',
|
||||
loadInContent: true,
|
||||
loadOnInit: true,
|
||||
responseType: '',
|
||||
overlayTemplate: '<div class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>',
|
||||
onLoadStart: function () {
|
||||
},
|
||||
onLoadDone: function (response) {
|
||||
return response;
|
||||
}
|
||||
|
||||
| source | String | '' | The URL to the source.
|
||||
| sourceSelector | String | '' | A selector to get return only the content of the selector.
|
||||
| params | Object | {} | GET query paramaters (example: {search_term: 'layout'}, which renders to URL/?search_term=layout)
|
||||
| trigger | String | `[data-card-widget="card-refresh"]` | The CSS selector to the refresh button
|
||||
| content | String | `.card-body` | The CSS selector to the target where the content should be rendered. This selector should exist within the card.
|
||||
| loadInContent | Boolean | TRUE | Whether to automatically render the content.
|
||||
| loadOnInit | Boolean | TRUE | Init plugin on page load.
|
||||
| responseType | String | '' | Response type (example: 'json' or 'html')
|
||||
| overlayTemplate | String | TRUE | The HTML template for the ajax spinner
|
||||
| onLoadStart | Function | Anonymous Function | Called before the ajax request is made
|
||||
| onLoadDone | Function | Anonymous Function | Called after the ajax request is made. A `response` parameter is passed to the function that hold the server response.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
##### Events
|
||||
{: .mt-4}
|
||||
|
||||
|---
|
||||
| Event Type | Description
|
||||
|-|-
|
||||
|loaded.lte.cardrefresh | Triggered after a card is refreshed.
|
||||
|overlay.added.lte.cardrefresh | Triggered after the overlay added to the card.
|
||||
|overlay.removed.lte.cardrefresh | Triggered after the overlay removed from the card.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
Example: `$('#my-card [data-card-widget="card-refresh"]').on('loaded.lte.cardrefresh', handleLoadedEvent)`
|
||||
|
||||
|
||||
##### Methods
|
||||
{: .mt-4}
|
||||
|
||||
|---
|
||||
| Method | Description
|
||||
|-|-
|
||||
|load | Reloads the content and runs the `onLoadStart` and `onLoadDone` hooks
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
Example: `$('#my-card-widget').Widget('toggle')`
|
||||
|
|
@ -1,9 +1,9 @@
|
|||
---
|
||||
layout: page
|
||||
title: Widget Plugin
|
||||
title: Card Widget Plugin
|
||||
---
|
||||
|
||||
The widget plugin provides the functionality for collapsing, expanding and removing a card.
|
||||
The card widget plugin provides the functionality for collapsing, expanding and removing a card.
|
||||
|
||||
##### Usage
|
||||
This plugin can be activated as a jQuery plugin or using the data api.
|
||||
|
|
@ -13,7 +13,7 @@ This plugin can be activated as a jQuery plugin or using the data api.
|
|||
|
||||
This plugin provides two data-api attributes. Any element using one of the following attributes should be placed within the `.card-tools` div, which is usually in the card header. For more information about the [card HTML structure]({% link components/cards.md %}), visit the card component documentation
|
||||
|
||||
`data-widget="collapse"`
|
||||
`data-card-widget="collapse"`
|
||||
<br />
|
||||
This attribute, when attached to a button, allows the box to be collapsed/expanded when clicked.
|
||||
<div class="row">
|
||||
|
|
@ -22,7 +22,7 @@ This attribute, when attached to a button, allows the box to be collapsed/expand
|
|||
<div class="card-header">
|
||||
<h3 class="card-title">Collapsible Card Example</h3>
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -37,7 +37,7 @@ This attribute, when attached to a button, allows the box to be collapsed/expand
|
|||
<h3 class="card-title">Collapsible Card Example</h3>
|
||||
<div class="card-tools">
|
||||
<!-- Collapse Button -->
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
</div>
|
||||
|
|
@ -53,7 +53,7 @@ This attribute, when attached to a button, allows the box to be collapsed/expand
|
|||
</div>
|
||||
</div>
|
||||
|
||||
`data-widget="remove"`
|
||||
`data-card-widget="remove"`
|
||||
<br />
|
||||
This attribute, when attached to a button, allows the box to be removed when clicked.
|
||||
<div class="row">
|
||||
|
|
@ -62,7 +62,7 @@ This attribute, when attached to a button, allows the box to be removed when cli
|
|||
<div class="card-header">
|
||||
<h3 class="card-title">Removable Card Example</h3>
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -77,7 +77,7 @@ This attribute, when attached to a button, allows the box to be removed when cli
|
|||
<h3 class="card-title">Removable Card Example</h3>
|
||||
<div class="card-tools">
|
||||
<!-- Remove Button -->
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
</div>
|
||||
|
|
@ -93,7 +93,7 @@ This attribute, when attached to a button, allows the box to be removed when cli
|
|||
</div>
|
||||
</div>
|
||||
|
||||
`data-widget="maximize"`
|
||||
`data-card-widget="maximize"`
|
||||
<br />
|
||||
This attribute, when attached to a button, allows the box to be maximize/minimize when clicked.
|
||||
<div class="row">
|
||||
|
|
@ -102,7 +102,7 @@ This attribute, when attached to a button, allows the box to be maximize/minimiz
|
|||
<div class="card-header">
|
||||
<h3 class="card-title">Maximizable Card Example</h3>
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="maximize"><i class="fas fa-expand"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="maximize"><i class="fas fa-expand"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -117,7 +117,7 @@ This attribute, when attached to a button, allows the box to be maximize/minimiz
|
|||
<h3 class="card-title">Maximizable Card Example</h3>
|
||||
<div class="card-tools">
|
||||
<!-- Maximize Button -->
|
||||
<button type="button" class="btn btn-tool" data-widget="maximize"><i class="fas fa-expand"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="maximize"><i class="fas fa-expand"></i></button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
</div>
|
||||
|
|
@ -136,7 +136,7 @@ This attribute, when attached to a button, allows the box to be maximize/minimiz
|
|||
|
||||
###### jQuery
|
||||
{: .text-bold }
|
||||
To activate any button using jQuery, you must provide the removeTrigger and collapseTrigger options. Otherwise, the plugin will assume the default `data-widget` selectors.
|
||||
To activate any button using jQuery, you must provide the removeTrigger and collapseTrigger options. Otherwise, the plugin will assume the default `data-card-widget` selectors.
|
||||
|
||||
```js
|
||||
$('#my-card').Widget(options)
|
||||
|
|
@ -149,14 +149,15 @@ $('#my-card').Widget(options)
|
|||
| Name | Type | Default | Description
|
||||
|-|-|-|-
|
||||
|animationSpeed | Number | 300 | Speed of slide down/up animation in milliseconds.
|
||||
|collapseTrigger | String | `[data-widget="remove"]` | jQuery selector to the element responsible for collapsing the box.
|
||||
|removeTrigger | String | `[data-widget="collapse"]` | jQuery selector to the element responsible for removing the box.
|
||||
|collapseTrigger | String | `[data-card-widget="remove"]` | jQuery selector to the element responsible for collapsing the box.
|
||||
|removeTrigger | String | `[data-card-widget="collapse"]` | jQuery selector to the element responsible for removing the box.
|
||||
|maximizeTrigger | String | `[data-card-widget="maximize"]` | jQuery selector to the element responsible for maximizing the box.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
> ##### Tip!
|
||||
> You can use any option via the data-attributes like this.
|
||||
> ```html
|
||||
> <button type="button" class="btn btn-tool" data-widget="collapse" data-animation-speed="1000"><i class="fas fa-minus"></i></button>
|
||||
> <button type="button" class="btn btn-tool" data-card-widget="collapse" data-animation-speed="1000"><i class="fas fa-minus"></i></button>
|
||||
> ```
|
||||
{: .quote-info}
|
||||
|
||||
|
|
@ -166,14 +167,14 @@ $('#my-card').Widget(options)
|
|||
|---
|
||||
| Event Type | Description
|
||||
|-|-
|
||||
|expanded.lte.widget | Triggered after a card expanded.
|
||||
|collapsed.lte.widget | Triggered after a card collapsed.
|
||||
|maximized.lte.widget | Triggered after a card maximized.
|
||||
|minimized.lte.widget | Triggered after a card minimized.
|
||||
|removed.lte.widget | Triggered after a card removed.
|
||||
|expanded.lte.cardwidget | Triggered after a card expanded.
|
||||
|collapsed.lte.cardwidget | Triggered after a card collapsed.
|
||||
|maximized.lte.cardwidget | Triggered after a card maximized.
|
||||
|minimized.lte.cardwidget | Triggered after a card minimized.
|
||||
|removed.lte.cardwidget | Triggered after a card removed.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
Example: `$('#my-card').on('expanded.lte.widget', handleExpandedEvent)`
|
||||
Example: `$('#my-card').on('expanded.lte.cardwidget', handleExpandedEvent)`
|
||||
|
||||
|
||||
##### Methods
|
||||
|
|
@ -186,6 +187,8 @@ Example: `$('#my-card').on('expanded.lte.widget', handleExpandedEvent)`
|
|||
|expand | Expands the card
|
||||
|remove | Removes the card
|
||||
|toggle | Toggles the state of the card between expanded and collapsed
|
||||
|maximize | Maximizes the card
|
||||
|minimize | Minimizes the card
|
||||
|toggleMaximize | Toggles the state of the card between maximized and minimized
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
|
|
@ -54,7 +54,8 @@ $("#my-toggle-button").ControlSidebar('toggle');
|
|||
|---
|
||||
| Event Type | Description
|
||||
|-|-
|
||||
| |
|
||||
|expanded.lte.controlsidebar | Triggered after a control sidebar expands.
|
||||
|collapsed.lte.controlsidebar | Triggered after a control sidebar collapses.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
Example: `$('#toggle-button').on('shown.lte.control.sidebar', handleExpandedEvent)`
|
||||
Example: `$('#toggle-button').on('expanded.lte.controlsidebar', handleExpandedEvent)`
|
||||
|
|
|
|||
|
|
@ -33,3 +33,15 @@ $('#chat-pane-toggle').DirectChat('toggle')
|
|||
{: .table .table-bordered .bg-light}
|
||||
|
||||
Example: `$('#chat-pane-toggle').DirectChat('toggle')`
|
||||
|
||||
|
||||
##### Events
|
||||
{: .mt-4}
|
||||
|
||||
|---
|
||||
| Event Type | Description
|
||||
|-|-
|
||||
|toggled.lte.directchat | Triggered after a direct chat contacts pane is toggled.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
Example: `$('#toggle-button').on('toggled.lte.directchat', handleToggledEvent)`
|
||||
|
|
|
|||
|
|
@ -29,6 +29,8 @@ $('.sidebar-toggle-btn').PushMenu(options)
|
|||
|-|-|-|-
|
||||
|autoCollapseSize | Boolean/Number | FALSE | Screen width in pixels to trigger auto collapse sidebar
|
||||
|screenCollapseSize | Number | 768 | Screen width in pixels for small screens.
|
||||
|enableRemember | Boolean | FALSE | Remember sidebar state and set after page refresh.
|
||||
|noTransitionAfterReload | Boolean | TRUE | Hold Transition after page refresh.
|
||||
{: .table .table-bordered .bg-light}
|
||||
|
||||
> ##### Tip!
|
||||
|
|
|
|||
|
|
@ -24,12 +24,27 @@ AdminLTE 3.0 provides a set of options to apply to your main layout. Each one of
|
|||
|
||||
|
||||
- Fixed Sidebar: use the class `.layout-fixed` to get a fixed sidebar.
|
||||
- Fixed Navbar: use the class `.layout-navbar-fixed` to get a navbar navbar.
|
||||
- Fixed Footer: use the class `.layout-footer-fixed` to get a navbar footer.
|
||||
- Fixed Navbar: use the class `.layout-navbar-fixed` to get a fixed navbar.
|
||||
- Fixed Footer: use the class `.layout-footer-fixed` to get a fixed footer.
|
||||
- Collapsed Sidebar: use the class `.sidebar-collapse` to have a collapsed sidebar upon loading.
|
||||
- Boxed Layout: use the class `.layout-boxed` to get a boxed layout that stretches only to 1250px.
|
||||
- Top Navigation: use the class `.layout-top-nav` to remove the sidebar and have your links at the top navbar.
|
||||
|
||||
|
||||
##### Responsive Variations
|
||||
You can also use the following classes for responsive changes with placing
|
||||
- Fixed Navbar:
|
||||
- use the class `.layout-*-navbar-fixed` to get a fixed navbar.
|
||||
- use the class `.layout-*-navbar-not-fixed` to get a not fixed navbar.
|
||||
- Fixed Footer:
|
||||
- use the class `.layout-*-footer-fixed` to get a fixed footer.
|
||||
- use the class `.layout-*-footer-not-fixed` to get a not fixed footer.
|
||||
|
||||
> ##### Tip!
|
||||
> If you want to use anchors with a fixed navbar, you need to add `.anchor` to you hidden anchor, e.g. `<a id="testAnchor" class="anchor"></a>`.
|
||||
{: .quote-info}
|
||||
|
||||
|
||||
#### Color Variations
|
||||
|
||||
AdminLTE 3.0 provides a set of color variations to apply to your sidebar (light & dark) & navbar. You can combine any available color with these class prefixes:
|
||||
|
|
@ -81,3 +96,18 @@ The following colors are available:
|
|||
> You can use these color variations even with `.text-*`, `.bg-*` & much more.
|
||||
{: .quote-info}
|
||||
|
||||
|
||||
##### Custom Range / Switch
|
||||
For custom colored custom-range you can add this classes:
|
||||
- `.custom-range-*`
|
||||
|
||||
For custom colored custom-switch you can add this classes:
|
||||
- `.custom-switch-off-*` (for custom switch off)
|
||||
- `.custom-switch-on-*` (for custom switch on)
|
||||
|
||||
##### Plugin Support
|
||||
You can use the all the colors above with these plugins:
|
||||
- Bootstrap Slider
|
||||
- `.slider-*` (wrapped around the slider)
|
||||
- iCheck-Bootstrap
|
||||
- `.icheck-*`
|
||||
|
|
|
|||
14
index.html
14
index.html
|
|
@ -730,14 +730,14 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span data-toggle="tooltip" title="3 New Messages" class="badge badge-primary">3</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
|
||||
data-widget="chat-pane-toggle">
|
||||
<i class="fas fa-comments"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1077,7 +1077,7 @@
|
|||
</button>
|
||||
<button type="button"
|
||||
class="btn btn-primary btn-sm"
|
||||
data-widget="collapse"
|
||||
data-card-widget="collapse"
|
||||
data-toggle="tooltip"
|
||||
title="Collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
|
|
@ -1121,10 +1121,10 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn bg-info btn-sm" data-widget="collapse">
|
||||
<button type="button" class="btn bg-info btn-sm" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn bg-info btn-sm" data-widget="remove">
|
||||
<button type="button" class="btn bg-info btn-sm" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -1184,10 +1184,10 @@
|
|||
<a href="#" class="dropdown-item">View calendar</a>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-success btn-sm" data-widget="collapse">
|
||||
<button type="button" class="btn btn-success btn-sm" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-success btn-sm" data-widget="remove">
|
||||
<button type="button" class="btn btn-success btn-sm" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
28
index2.html
28
index2.html
|
|
@ -682,7 +682,7 @@
|
|||
<h5 class="card-title">Monthly Recap Report</h5>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<div class="btn-group">
|
||||
|
|
@ -697,7 +697,7 @@
|
|||
<a href="#" class="dropdown-item">Separated link</a>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -821,10 +821,10 @@
|
|||
<h3 class="card-title">Visitors Report</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -872,12 +872,12 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span data-toggle="tooltip" title="3 New Messages" class="badge badge-warning">3</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
|
||||
data-widget="chat-pane-toggle">
|
||||
<i class="fas fa-comments"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1075,9 +1075,9 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span class="badge badge-danger">8 New Members</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1145,10 +1145,10 @@
|
|||
<h3 class="card-title">Latest Orders</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -1286,9 +1286,9 @@
|
|||
<h3 class="card-title">Browser Usage</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1355,10 +1355,10 @@
|
|||
<h3 class="card-title">Recently Added Products</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2527,6 +2527,16 @@
|
|||
"integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==",
|
||||
"dev": true
|
||||
},
|
||||
"@sweetalert2/theme-bootstrap-4": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@sweetalert2/theme-bootstrap-4/-/theme-bootstrap-4-2.1.0.tgz",
|
||||
"integrity": "sha512-Ji33Ixo45EjGrGUX0Z+RqsI0X45r3NW464MigYhA9olUy4uOlwfTkumKpeudrY+tMZYDM2OP0LR9ndHBcyArbw=="
|
||||
},
|
||||
"@ttskch/select2-bootstrap4-theme": {
|
||||
"version": "1.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@ttskch/select2-bootstrap4-theme/-/select2-bootstrap4-theme-1.2.3.tgz",
|
||||
"integrity": "sha512-cVH3yrBBmkNrkqKPvHbt8dzP7NysAQfzJULxXlzkdf7NicoSUWbpjDjDGqMtUIIldDByrf2uC1HKKFRelWunQQ=="
|
||||
},
|
||||
"@types/estree": {
|
||||
"version": "0.0.39",
|
||||
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
|
||||
|
|
@ -4350,6 +4360,16 @@
|
|||
"integrity": "sha1-r6uWJikQp/M8GaV3WCXGnzTjUMo=",
|
||||
"dev": true
|
||||
},
|
||||
"camel-case": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
|
||||
"integrity": "sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0",
|
||||
"upper-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"camelcase": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
|
||||
|
|
@ -4413,6 +4433,32 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"change-case": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/change-case/-/change-case-3.1.0.tgz",
|
||||
"integrity": "sha512-2AZp7uJZbYEzRPsFoa+ijKdvp9zsrnnt6+yFokfwEpeJm0xuJDVoxiRCAaTzyJND8GJkofo2IcKWaUZ/OECVzw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"camel-case": "^3.0.0",
|
||||
"constant-case": "^2.0.0",
|
||||
"dot-case": "^2.1.0",
|
||||
"header-case": "^1.0.0",
|
||||
"is-lower-case": "^1.1.0",
|
||||
"is-upper-case": "^1.1.0",
|
||||
"lower-case": "^1.1.1",
|
||||
"lower-case-first": "^1.0.0",
|
||||
"no-case": "^2.3.2",
|
||||
"param-case": "^2.1.0",
|
||||
"pascal-case": "^2.0.0",
|
||||
"path-case": "^2.1.0",
|
||||
"sentence-case": "^2.1.0",
|
||||
"snake-case": "^2.1.0",
|
||||
"swap-case": "^1.1.0",
|
||||
"title-case": "^2.1.0",
|
||||
"upper-case": "^1.1.1",
|
||||
"upper-case-first": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"chardet": {
|
||||
"version": "0.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chardet/-/chardet-0.4.2.tgz",
|
||||
|
|
@ -4699,6 +4745,16 @@
|
|||
"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
|
||||
"dev": true
|
||||
},
|
||||
"constant-case": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/constant-case/-/constant-case-2.0.0.tgz",
|
||||
"integrity": "sha1-QXV2TTidP6nI7NKRhu1gBSQ7akY=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"snake-case": "^2.1.0",
|
||||
"upper-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"convert-source-map": {
|
||||
"version": "1.6.0",
|
||||
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.6.0.tgz",
|
||||
|
|
@ -4913,6 +4969,103 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"css-node-extract": {
|
||||
"version": "2.1.3",
|
||||
"resolved": "https://registry.npmjs.org/css-node-extract/-/css-node-extract-2.1.3.tgz",
|
||||
"integrity": "sha512-E7CzbC0I4uAs2dI8mPCVe+K37xuja5kjIugOotpwICFL7vzhmFMAPHvS/MF9gFrmv8DDUANsxrgyT/I3OLukcw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"change-case": "^3.0.1",
|
||||
"postcss": "^6.0.14"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
|
||||
"integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-convert": "^1.9.0"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^3.2.1",
|
||||
"escape-string-regexp": "^1.0.5",
|
||||
"supports-color": "^5.3.0"
|
||||
}
|
||||
},
|
||||
"postcss": {
|
||||
"version": "6.0.23",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.23.tgz",
|
||||
"integrity": "sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"chalk": "^2.4.1",
|
||||
"source-map": "^0.6.1",
|
||||
"supports-color": "^5.4.0"
|
||||
}
|
||||
},
|
||||
"source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"css-selector-extract": {
|
||||
"version": "3.3.6",
|
||||
"resolved": "https://registry.npmjs.org/css-selector-extract/-/css-selector-extract-3.3.6.tgz",
|
||||
"integrity": "sha512-bBI8ZJKKyR9iHvxXb4t3E6WTMkis94eINopVg7y2FmmMjLXUVduD7mPEcADi4i9FX4wOypFMFpySX+0keuefxg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"postcss": "^6.0.14"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
|
||||
"integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-convert": "^1.9.0"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^3.2.1",
|
||||
"escape-string-regexp": "^1.0.5",
|
||||
"supports-color": "^5.3.0"
|
||||
}
|
||||
},
|
||||
"postcss": {
|
||||
"version": "6.0.23",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.23.tgz",
|
||||
"integrity": "sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"chalk": "^2.4.1",
|
||||
"source-map": "^0.6.1",
|
||||
"supports-color": "^5.4.0"
|
||||
}
|
||||
},
|
||||
"source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"cssesc": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
|
||||
|
|
@ -5103,6 +5256,12 @@
|
|||
"integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=",
|
||||
"dev": true
|
||||
},
|
||||
"detect-file": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/detect-file/-/detect-file-1.0.0.tgz",
|
||||
"integrity": "sha1-8NZtA2cqglyxtzvbP+YjEMjlUrc=",
|
||||
"dev": true
|
||||
},
|
||||
"dev-ip": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/dev-ip/-/dev-ip-1.0.1.tgz",
|
||||
|
|
@ -5145,6 +5304,15 @@
|
|||
"esutils": "^2.0.2"
|
||||
}
|
||||
},
|
||||
"dot-case": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/dot-case/-/dot-case-2.1.1.tgz",
|
||||
"integrity": "sha1-NNzzf1Co6TwrO8qLt/uRVcfaO+4=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0"
|
||||
}
|
||||
},
|
||||
"dot-prop": {
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
|
||||
|
|
@ -5657,6 +5825,15 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"expand-tilde": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
|
||||
"integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"homedir-polyfill": "^1.0.1"
|
||||
}
|
||||
},
|
||||
"extend": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
|
||||
|
|
@ -6185,6 +6362,18 @@
|
|||
"pinkie-promise": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"findup-sync": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-3.0.0.tgz",
|
||||
"integrity": "sha512-YbffarhcicEhOrm4CtrwdKBdCuz576RLdhJDsIfvNtxUuhdRet1qZcsMjqbePtAseKdAnDyM/IyXbu7PRPRLYg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"detect-file": "^1.0.0",
|
||||
"is-glob": "^4.0.0",
|
||||
"micromatch": "^3.0.4",
|
||||
"resolve-dir": "^1.0.1"
|
||||
}
|
||||
},
|
||||
"flag-icon-css": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/flag-icon-css/-/flag-icon-css-3.3.0.tgz",
|
||||
|
|
@ -6954,6 +7143,30 @@
|
|||
"ini": "^1.3.4"
|
||||
}
|
||||
},
|
||||
"global-modules": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/global-modules/-/global-modules-1.0.0.tgz",
|
||||
"integrity": "sha512-sKzpEkf11GpOFuw0Zzjzmt4B4UZwjOcG757PPvrfhxcLFbq0wpsgpOqxpxtxFiCG4DtG93M6XRVbF2oGdev7bg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"global-prefix": "^1.0.1",
|
||||
"is-windows": "^1.0.1",
|
||||
"resolve-dir": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"global-prefix": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-1.0.2.tgz",
|
||||
"integrity": "sha1-2/dDxsFJklk8ZVVoy2btMsASLr4=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"expand-tilde": "^2.0.2",
|
||||
"homedir-polyfill": "^1.0.1",
|
||||
"ini": "^1.3.4",
|
||||
"is-windows": "^1.0.1",
|
||||
"which": "^1.2.14"
|
||||
}
|
||||
},
|
||||
"globals": {
|
||||
"version": "11.12.0",
|
||||
"resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
|
||||
|
|
@ -7179,6 +7392,25 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"header-case": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/header-case/-/header-case-1.0.1.tgz",
|
||||
"integrity": "sha1-lTWXMZfBRLCWE81l0xfvGZY70C0=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0",
|
||||
"upper-case": "^1.1.3"
|
||||
}
|
||||
},
|
||||
"homedir-polyfill": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz",
|
||||
"integrity": "sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"parse-passwd": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"hosted-git-info": {
|
||||
"version": "2.7.1",
|
||||
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.7.1.tgz",
|
||||
|
|
@ -7581,6 +7813,15 @@
|
|||
"is-path-inside": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"is-lower-case": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/is-lower-case/-/is-lower-case-1.1.3.tgz",
|
||||
"integrity": "sha1-fhR75HaNxGbbO/shzGCzHmrWk5M=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"lower-case": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"is-npm": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
|
||||
|
|
@ -7712,6 +7953,15 @@
|
|||
"integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
|
||||
"dev": true
|
||||
},
|
||||
"is-upper-case": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/is-upper-case/-/is-upper-case-1.1.2.tgz",
|
||||
"integrity": "sha1-jQsfp+eTOh5YSDYA7H2WYcuvdW8=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"upper-case": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"is-utf8": {
|
||||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
|
||||
|
|
@ -8096,6 +8346,21 @@
|
|||
"signal-exit": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"lower-case": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
|
||||
"integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw=",
|
||||
"dev": true
|
||||
},
|
||||
"lower-case-first": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/lower-case-first/-/lower-case-first-1.0.2.tgz",
|
||||
"integrity": "sha1-5dp8JvKacHO+AtUrrJmA5ZIq36E=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"lower-case": "^1.1.2"
|
||||
}
|
||||
},
|
||||
"lowercase-keys": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
|
||||
|
|
@ -8390,12 +8655,6 @@
|
|||
"integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=",
|
||||
"dev": true
|
||||
},
|
||||
"ncp": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ncp/-/ncp-2.0.0.tgz",
|
||||
"integrity": "sha1-GVoh1sRuNh0vsSgbo4uR6d9727M=",
|
||||
"dev": true
|
||||
},
|
||||
"negotiator": {
|
||||
"version": "0.6.2",
|
||||
"resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
|
||||
|
|
@ -8408,6 +8667,15 @@
|
|||
"integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
|
||||
"dev": true
|
||||
},
|
||||
"no-case": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.2.tgz",
|
||||
"integrity": "sha512-rmTZ9kz+f3rCvK2TD1Ue/oZlns7OGoIWP4fc3llxxRXlOkHKoWPPWJOfFYpITabSow43QJbRIoHQXtt10VldyQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"lower-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"node-gyp": {
|
||||
"version": "3.8.0",
|
||||
"resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.8.0.tgz",
|
||||
|
|
@ -8494,6 +8762,46 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"node-sass-magic-importer": {
|
||||
"version": "5.3.2",
|
||||
"resolved": "https://registry.npmjs.org/node-sass-magic-importer/-/node-sass-magic-importer-5.3.2.tgz",
|
||||
"integrity": "sha512-T3wTUdUoXQE3QN+EsyPpUXRI1Gj1lEsrySQ9Kzlzi15QGKi+uRa9fmvkcSy2y3BKgoj//7Mt9+s+7p0poMpg6Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"css-node-extract": "^2.1.3",
|
||||
"css-selector-extract": "^3.3.6",
|
||||
"findup-sync": "^3.0.0",
|
||||
"glob": "^7.1.3",
|
||||
"object-hash": "^1.3.1",
|
||||
"postcss-scss": "^2.0.0",
|
||||
"resolve": "^1.10.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"glob": {
|
||||
"version": "7.1.4",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.4.tgz",
|
||||
"integrity": "sha512-hkLPepehmnKk41pUGm3sYxoFs/umurYfYJCerbXEyFIWcAzvpipAgVkBqqT9RBKMGjnq6kMuyYwha6csxbiM1A==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fs.realpath": "^1.0.0",
|
||||
"inflight": "^1.0.4",
|
||||
"inherits": "2",
|
||||
"minimatch": "^3.0.4",
|
||||
"once": "^1.3.0",
|
||||
"path-is-absolute": "^1.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"node-sass-package-importer": {
|
||||
"version": "5.3.2",
|
||||
"resolved": "https://registry.npmjs.org/node-sass-package-importer/-/node-sass-package-importer-5.3.2.tgz",
|
||||
"integrity": "sha512-PPHzGlwgt3JT8NO/IqBf2HgGB8Ld6OhEZmgJ9UPw20ft2OCTy8RvjRftYwwbEu2L7j4kbuovVisqXZV+XnLw8A==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"node-sass-magic-importer": "^5.3.2"
|
||||
}
|
||||
},
|
||||
"nodemon": {
|
||||
"version": "1.19.1",
|
||||
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-1.19.1.tgz",
|
||||
|
|
@ -9654,6 +9962,12 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"object-hash": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/object-hash/-/object-hash-1.3.1.tgz",
|
||||
"integrity": "sha512-OSuu/pU4ENM9kmREg0BdNrUDIl1heYa4mBZacJc+vVWz4GtAwu7jO8s4AIt2aGRUTqxykpWzI3Oqnsm13tTMDA==",
|
||||
"dev": true
|
||||
},
|
||||
"object-keys": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
|
||||
|
|
@ -9857,6 +10171,15 @@
|
|||
"semver": "^5.1.0"
|
||||
}
|
||||
},
|
||||
"param-case": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
|
||||
"integrity": "sha1-35T9jPZTHs915r75oIWPvHK+Ikc=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0"
|
||||
}
|
||||
},
|
||||
"parse-json": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
|
||||
|
|
@ -9866,6 +10189,12 @@
|
|||
"error-ex": "^1.2.0"
|
||||
}
|
||||
},
|
||||
"parse-passwd": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
|
||||
"integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
|
||||
"dev": true
|
||||
},
|
||||
"parseqs": {
|
||||
"version": "0.0.5",
|
||||
"resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
|
||||
|
|
@ -9890,6 +10219,16 @@
|
|||
"integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
|
||||
"dev": true
|
||||
},
|
||||
"pascal-case": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-2.0.1.tgz",
|
||||
"integrity": "sha1-LVeNNFX2YNpl7KGO+VtODekSdh4=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"camel-case": "^3.0.0",
|
||||
"upper-case-first": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"pascalcase": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz",
|
||||
|
|
@ -9906,6 +10245,15 @@
|
|||
"util": "^0.10.3"
|
||||
}
|
||||
},
|
||||
"path-case": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/path-case/-/path-case-2.1.1.tgz",
|
||||
"integrity": "sha1-lLgDfDctP+KQbkZbtF4l0ibo7qU=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0"
|
||||
}
|
||||
},
|
||||
"path-dirname": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
|
||||
|
|
@ -11293,6 +11641,15 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"postcss-scss": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-2.0.0.tgz",
|
||||
"integrity": "sha512-um9zdGKaDZirMm+kZFKKVsnKPF7zF7qBAtIfTSnZXD1jZ0JNZIxdB6TxQOjCnlSzLRInVl2v3YdBh/M881C4ug==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"postcss": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"postcss-selector-parser": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.2.tgz",
|
||||
|
|
@ -11725,6 +12082,16 @@
|
|||
"path-parse": "^1.0.6"
|
||||
}
|
||||
},
|
||||
"resolve-dir": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-1.0.1.tgz",
|
||||
"integrity": "sha1-eaQGRMNivoLybv/nOcm7U4IEb0M=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"expand-tilde": "^2.0.0",
|
||||
"global-modules": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"resolve-from": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-1.0.1.tgz",
|
||||
|
|
@ -12011,6 +12378,16 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"sentence-case": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-2.1.1.tgz",
|
||||
"integrity": "sha1-H24t2jnBaL+S0T+G1KkYkz9mftQ=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0",
|
||||
"upper-case-first": "^1.1.2"
|
||||
}
|
||||
},
|
||||
"serve-index": {
|
||||
"version": "1.9.1",
|
||||
"resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
|
||||
|
|
@ -12147,6 +12524,15 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"snake-case": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/snake-case/-/snake-case-2.1.0.tgz",
|
||||
"integrity": "sha1-Qb2xtz8w7GagTU4srRt2OH1NbZ8=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0"
|
||||
}
|
||||
},
|
||||
"snapdragon": {
|
||||
"version": "0.8.2",
|
||||
"resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
|
||||
|
|
@ -12674,10 +13060,20 @@
|
|||
"has-flag": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"swap-case": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/swap-case/-/swap-case-1.1.2.tgz",
|
||||
"integrity": "sha1-w5IDpFhzhfrTyFCgvRvK+ggZdOM=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"lower-case": "^1.1.1",
|
||||
"upper-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"sweetalert2": {
|
||||
"version": "8.12.1",
|
||||
"resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-8.12.1.tgz",
|
||||
"integrity": "sha512-C+c/lB95JjePFW9n5cEghKnk3z0sbeOfbt3yzV4QlbBLx+Wh/LzVIb59QTvixHEhvTiSkUMgSY30Uj40hU3MHw=="
|
||||
"version": "8.16.2",
|
||||
"resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-8.16.2.tgz",
|
||||
"integrity": "sha512-x0QMDnRbxETUi28Aiv/ucLCvLKc/vzE03wIqzJ0c6wy2xINJ+tFht3vZ+5QLZAiLHRoA0uPO54oq4+hSqUVHzw=="
|
||||
},
|
||||
"symbol-observable": {
|
||||
"version": "1.0.1",
|
||||
|
|
@ -12852,6 +13248,16 @@
|
|||
"integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8=",
|
||||
"dev": true
|
||||
},
|
||||
"title-case": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/title-case/-/title-case-2.1.1.tgz",
|
||||
"integrity": "sha1-PhJyFtpY0rxb7PE3q5Ha46fNj6o=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"no-case": "^2.2.0",
|
||||
"upper-case": "^1.0.3"
|
||||
}
|
||||
},
|
||||
"tmp": {
|
||||
"version": "0.0.33",
|
||||
"resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
|
||||
|
|
@ -13227,6 +13633,21 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"upper-case": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
|
||||
"integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=",
|
||||
"dev": true
|
||||
},
|
||||
"upper-case-first": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-1.1.2.tgz",
|
||||
"integrity": "sha1-XXm+3P8UQZUY/S7bCgUHybaFkRU=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"upper-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"uri-js": {
|
||||
"version": "4.2.2",
|
||||
"resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.2.2.tgz",
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
"main": "dist/js/adminlte.min.js",
|
||||
"scripts": {
|
||||
"css": "npm-run-all --sequential css-compile css-prefix css-minify",
|
||||
"css-compile": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 build/scss/AdminLTE.scss dist/css/adminlte.css",
|
||||
"css-compile": "node-sass --importer node_modules/node-sass-package-importer/dist/cli.js --output-style expanded --source-map true --source-map-contents true --precision 6 build/scss/AdminLTE.scss dist/css/adminlte.css",
|
||||
"css-prefix": "postcss --config build/config/postcss.config.js --replace \"dist/css/*.css\" \"!dist/css/*.min.css\"",
|
||||
"css-minify": "cleancss --level 1 --source-map --source-map-inline-sources --output dist/css/adminlte.min.css dist/css/adminlte.css",
|
||||
"compile": "npm-run-all --parallel js css",
|
||||
|
|
@ -51,6 +51,8 @@
|
|||
"@fullcalendar/interaction": "^4.2.0",
|
||||
"@fullcalendar/timegrid": "^4.2.0",
|
||||
"@lgaitan/pace-progress": "^1.0.7",
|
||||
"@sweetalert2/theme-bootstrap-4": "^2.1.0",
|
||||
"@ttskch/select2-bootstrap4-theme": "^1.2.3",
|
||||
"bootstrap": "^4.3.1",
|
||||
"bootstrap-colorpicker": "^3.1.2",
|
||||
"bootstrap-slider": "^10.6.1",
|
||||
|
|
@ -79,7 +81,7 @@
|
|||
"select2": "^4.0.7",
|
||||
"sparklines": "^1.2.0",
|
||||
"summernote": "^0.8.12",
|
||||
"sweetalert2": "^8.12.1",
|
||||
"sweetalert2": "^8.16.2",
|
||||
"tempusdominus-bootstrap-4": "^5.1.2",
|
||||
"toastr": "^2.1.4"
|
||||
},
|
||||
|
|
@ -98,14 +100,15 @@
|
|||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"fs-extra": "^5.0.0",
|
||||
"node-sass": "^4.12.0",
|
||||
"node-sass-package-importer": "^5.3.2",
|
||||
"nodemon": "^1.19.1",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"path": "^0.12.7",
|
||||
"postcss-cli": "^5.0.1",
|
||||
"rollup": "^1.16.7",
|
||||
"rollup-plugin-babel": "^4.3.3",
|
||||
"style-loader": "^0.19.1",
|
||||
"set-value": "^3.0.1",
|
||||
"style-loader": "^0.19.1",
|
||||
"terser": "^4.0.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<!-- Ionicons -->
|
||||
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
|
||||
<!-- SweetAlert2 -->
|
||||
<link rel="stylesheet" href="../../plugins/sweetalert2/sweetalert2.min.css">
|
||||
<link rel="stylesheet" href="../../plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css">
|
||||
<!-- Toastr -->
|
||||
<link rel="stylesheet" href="../../plugins/toastr/toastr.min.css">
|
||||
<!-- Theme style -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,806 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>AdminLTE 3 | UI Ribbons</title>
|
||||
<!-- Tell the browser to be responsive to screen width -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<!-- Font Awesome -->
|
||||
<link rel="stylesheet" href="../../plugins/fontawesome-free/css/all.min.css">
|
||||
<!-- Ionicons -->
|
||||
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
|
||||
<!-- Theme style -->
|
||||
<link rel="stylesheet" href="../../dist/css/adminlte.min.css">
|
||||
<!-- Google Font: Source Sans Pro -->
|
||||
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
|
||||
</head>
|
||||
<body class="hold-transition sidebar-mini">
|
||||
<div class="wrapper">
|
||||
<!-- Navbar -->
|
||||
<nav class="main-header navbar navbar-expand navbar-white navbar-light">
|
||||
<!-- Left navbar links -->
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-widget="pushmenu" href="#"><i class="fas fa-bars"></i></a>
|
||||
</li>
|
||||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="../../index3.html" class="nav-link">Home</a>
|
||||
</li>
|
||||
<li class="nav-item d-none d-sm-inline-block">
|
||||
<a href="#" class="nav-link">Contact</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- SEARCH FORM -->
|
||||
<form class="form-inline ml-3">
|
||||
<div class="input-group input-group-sm">
|
||||
<input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-navbar" type="submit">
|
||||
<i class="fas fa-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- Right navbar links -->
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<!-- Messages Dropdown Menu -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link" data-toggle="dropdown" href="#">
|
||||
<i class="far fa-comments"></i>
|
||||
<span class="badge badge-danger navbar-badge">3</span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="../../dist/img/user1-128x128.jpg" alt="User Avatar" class="img-size-50 mr-3 img-circle">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
Brad Diesel
|
||||
<span class="float-right text-sm text-danger"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">Call me whenever you can...</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="../../dist/img/user8-128x128.jpg" alt="User Avatar" class="img-size-50 img-circle mr-3">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
John Pierce
|
||||
<span class="float-right text-sm text-muted"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">I got your message bro</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<!-- Message Start -->
|
||||
<div class="media">
|
||||
<img src="../../dist/img/user3-128x128.jpg" alt="User Avatar" class="img-size-50 img-circle mr-3">
|
||||
<div class="media-body">
|
||||
<h3 class="dropdown-item-title">
|
||||
Nora Silvester
|
||||
<span class="float-right text-sm text-warning"><i class="fas fa-star"></i></span>
|
||||
</h3>
|
||||
<p class="text-sm">The subject goes here</p>
|
||||
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Message End -->
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Notifications Dropdown Menu -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link" data-toggle="dropdown" href="#">
|
||||
<i class="far fa-bell"></i>
|
||||
<span class="badge badge-warning navbar-badge">15</span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
|
||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-envelope mr-2"></i> 4 new messages
|
||||
<span class="float-right text-muted text-sm">3 mins</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-users mr-2"></i> 8 friend requests
|
||||
<span class="float-right text-muted text-sm">12 hours</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="fas fa-file mr-2"></i> 3 new reports
|
||||
<span class="float-right text-muted text-sm">2 days</span>
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#">
|
||||
<i class="fas fa-th-large"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<!-- /.navbar -->
|
||||
|
||||
<!-- Main Sidebar Container -->
|
||||
<aside class="main-sidebar sidebar-dark-primary elevation-4">
|
||||
<!-- Brand Logo -->
|
||||
<a href="../../index3.html" class="brand-link">
|
||||
<img src="../../dist/img/AdminLTELogo.png"
|
||||
alt="AdminLTE Logo"
|
||||
class="brand-image img-circle elevation-3"
|
||||
style="opacity: .8">
|
||||
<span class="brand-text font-weight-light">AdminLTE 3</span>
|
||||
</a>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<!-- Sidebar user (optional) -->
|
||||
<div class="user-panel mt-3 pb-3 mb-3 d-flex">
|
||||
<div class="image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image">
|
||||
</div>
|
||||
<div class="info">
|
||||
<a href="#" class="d-block">Alexander Pierce</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar Menu -->
|
||||
<nav class="mt-2">
|
||||
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
|
||||
<!-- Add icons to the links using the .nav-icon class
|
||||
<br /> with font-awesome or any other icon font library -->
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon fas fa-tachometer-alt"></i>
|
||||
<p>
|
||||
Dashboard
|
||||
<i class="right fas fa-angle-left"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../../index.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Dashboard v1</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../../index2.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Dashboard v2</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../../index3.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Dashboard v3</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../widgets.html" class="nav-link">
|
||||
<i class="nav-icon fas fa-th"></i>
|
||||
<p>
|
||||
Widgets
|
||||
<span class="right badge badge-danger">New</span>
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon fas fa-copy"></i>
|
||||
<p>
|
||||
Layout Options
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
<span class="badge badge-info right">6</span>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../layout/top-nav.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Top Navigation</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../layout/boxed.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Boxed</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Fixed Sidebar</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../layout/fixed-topnav.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Fixed Navbar</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../layout/fixed-footer.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Fixed Footer</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Collapsed Sidebar</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon fas fa-chart-pie"></i>
|
||||
<p>
|
||||
Charts
|
||||
<i class="right fas fa-angle-left"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../charts/chartjs.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>ChartJS</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../charts/flot.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Flot</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../charts/inline.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Inline</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item has-treeview menu-open">
|
||||
<a href="#" class="nav-link active">
|
||||
<i class="nav-icon fas fa-tree"></i>
|
||||
<p>
|
||||
UI Elements
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../UI/general.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>General</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../UI/icons.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Icons</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../UI/buttons.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Buttons</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../UI/sliders.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Sliders</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../UI/modals.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Modals & Alerts</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../UI/navbar.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Navbar & Tabs</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../UI/ribbons.html" class="nav-link active">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Ribbons</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon fas fa-edit"></i>
|
||||
<p>
|
||||
Forms
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../forms/general.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>General Elements</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../forms/advanced.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Advanced Elements</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../forms/editors.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Editors</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon fas fa-table"></i>
|
||||
<p>
|
||||
Tables
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../tables/simple.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Simple Tables</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../tables/data.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>DataTables</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../tables/jsgrid.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>jsGrid</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-header">EXAMPLES</li>
|
||||
<li class="nav-item">
|
||||
<a href="../calendar.html" class="nav-link">
|
||||
<i class="nav-icon far fa-calendar-alt"></i>
|
||||
<p>
|
||||
Calendar
|
||||
<span class="badge badge-info right">2</span>
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon far fa-envelope"></i>
|
||||
<p>
|
||||
Mailbox
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../mailbox/mailbox.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Inbox</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../mailbox/compose.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Compose</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../mailbox/read-mail.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Read</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon fas fa-book"></i>
|
||||
<p>
|
||||
Pages
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../examples/invoice.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Invoice</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/profile.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Profile</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/e_commerce.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>E-commerce</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/projects.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Projects</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/project_add.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Project Add</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/project_edit.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Project Edit</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/project_detail.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Project Detail</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/contacts.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Contacts</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item has-treeview">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon far fa-plus-square"></i>
|
||||
<p>
|
||||
Extras
|
||||
<i class="fas fa-angle-left right"></i>
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="../examples/login.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Login</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/register.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Register</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/lockscreen.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Lockscreen</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/legacy-user-menu.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Legacy User Menu</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/language-menu.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Language Menu</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/404.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Error 404</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/500.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Error 500</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../examples/blank.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Blank Page</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../../starter.html" class="nav-link">
|
||||
<i class="far fa-circle nav-icon"></i>
|
||||
<p>Starter Page</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-header">MISCELLANEOUS</li>
|
||||
<li class="nav-item">
|
||||
<a href="https://adminlte.io/docs/3.0" class="nav-link">
|
||||
<i class="nav-icon fas fa-file"></i>
|
||||
<p>Documentation</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-header">LABELS</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon far fa-circle text-danger"></i>
|
||||
<p class="text">Important</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon far fa-circle text-warning"></i>
|
||||
<p>Warning</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link">
|
||||
<i class="nav-icon far fa-circle text-info"></i>
|
||||
<p>Informational</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<!-- /.sidebar-menu -->
|
||||
</div>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<div class="container-fluid">
|
||||
<div class="row mb-2">
|
||||
<div class="col-sm-6">
|
||||
<h1>Ribbons</h1>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<ol class="breadcrumb float-sm-right">
|
||||
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
||||
<li class="breadcrumb-item active">Ribbons</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.container-fluid -->
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="card card-primary">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Ribbons</h3>
|
||||
</div>
|
||||
<!-- /.card-header -->
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper">
|
||||
<div class="ribbon bg-primary">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Default <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-lg">
|
||||
<div class="ribbon bg-info">
|
||||
Ribbon Large
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Large <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-secondary">
|
||||
Ribbon Extra Large
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Extra Large <br />
|
||||
<small>.ribbon-wrapper.ribbon-xl .ribbon</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-lg">
|
||||
<div class="ribbon bg-success text-lg">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Large <br /> with Large Text <br />
|
||||
<small>.ribbon-wrapper.ribbon-lg .ribbon.text-lg</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-warning text-lg">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Extra Large <br /> with Large Text <br />
|
||||
<small>.ribbon-wrapper.ribbon-xl .ribbon.text-lg</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="position-relative p-3 bg-gray" style="height: 180px">
|
||||
<div class="ribbon-wrapper ribbon-xl">
|
||||
<div class="ribbon bg-danger text-xl">
|
||||
Ribbon
|
||||
</div>
|
||||
</div>
|
||||
Ribbon Extra Large <br /> with Extra Large Text <br />
|
||||
<small>.ribbon-wrapper.ribbon-xl .ribbon.text-xl</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.col -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
</section>
|
||||
<!-- /.content -->
|
||||
</div>
|
||||
<!-- /.content-wrapper -->
|
||||
|
||||
<footer class="main-footer">
|
||||
<div class="float-right d-none d-sm-block">
|
||||
<b>Version</b> 3.0.0-beta.2
|
||||
</div>
|
||||
<strong>Copyright © 2014-2019 <a href="http://adminlte.io">AdminLTE.io</a>.</strong> All rights
|
||||
reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Control sidebar content goes here -->
|
||||
</aside>
|
||||
<!-- /.control-sidebar -->
|
||||
</div>
|
||||
<!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="../../plugins/jquery/jquery.min.js"></script>
|
||||
<!-- Bootstrap 4 -->
|
||||
<script src="../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- FastClick -->
|
||||
<script src="../../plugins/fastclick/fastclick.js"></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/adminlte.min.js"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js"></script>
|
||||
<!-- Ion Slider -->
|
||||
<script src="../../plugins/ion-rangeslider/js/ion.rangeSlider.min.js"></script>
|
||||
<!-- Bootstrap slider -->
|
||||
<script src="../../plugins/bootstrap-slider/bootstrap-slider.min.js"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
/* BOOTSTRAP SLIDER */
|
||||
$('.slider').bootstrapSlider()
|
||||
|
||||
/* ION SLIDER */
|
||||
$('#range_1').ionRangeSlider({
|
||||
min : 0,
|
||||
max : 5000,
|
||||
from : 1000,
|
||||
to : 4000,
|
||||
type : 'double',
|
||||
step : 1,
|
||||
prefix : '$',
|
||||
prettify: false,
|
||||
hasGrid : true
|
||||
})
|
||||
$('#range_2').ionRangeSlider()
|
||||
|
||||
$('#range_5').ionRangeSlider({
|
||||
min : 0,
|
||||
max : 10,
|
||||
type : 'single',
|
||||
step : 0.1,
|
||||
postfix : ' mm',
|
||||
prettify: false,
|
||||
hasGrid : true
|
||||
})
|
||||
$('#range_6').ionRangeSlider({
|
||||
min : -50,
|
||||
max : 50,
|
||||
from : 0,
|
||||
type : 'single',
|
||||
step : 1,
|
||||
postfix : '°',
|
||||
prettify: false,
|
||||
hasGrid : true
|
||||
})
|
||||
|
||||
$('#range_4').ionRangeSlider({
|
||||
type : 'single',
|
||||
step : 100,
|
||||
postfix : ' light years',
|
||||
from : 55000,
|
||||
hideMinMax: true,
|
||||
hideFromTo: false
|
||||
})
|
||||
$('#range_3').ionRangeSlider({
|
||||
type : 'double',
|
||||
postfix : ' miles',
|
||||
step : 10000,
|
||||
from : 25000000,
|
||||
to : 35000000,
|
||||
onChange: function (obj) {
|
||||
var t = ''
|
||||
for (var prop in obj) {
|
||||
t += prop + ': ' + obj[prop] + '\r\n'
|
||||
}
|
||||
$('#result').html(t)
|
||||
},
|
||||
onLoad : function (obj) {
|
||||
//
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -620,9 +620,9 @@
|
|||
<h3 class="card-title">Area Chart</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -640,9 +640,9 @@
|
|||
<h3 class="card-title">Donut Chart</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -658,9 +658,9 @@
|
|||
<h3 class="card-title">Pie Chart</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -679,9 +679,9 @@
|
|||
<h3 class="card-title">Line Chart</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -699,9 +699,9 @@
|
|||
<h3 class="card-title">Bar Chart</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -719,9 +719,9 @@
|
|||
<h3 class="card-title">Stacked Bar Chart</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
|
|||
|
|
@ -654,9 +654,9 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -676,9 +676,9 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -702,10 +702,10 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse">
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -726,9 +726,9 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -626,10 +626,10 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i
|
||||
class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -698,10 +698,10 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i
|
||||
class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -757,10 +757,10 @@
|
|||
</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i
|
||||
class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -620,9 +620,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -632,9 +632,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -647,9 +647,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -620,7 +620,7 @@
|
|||
<h3 class="card-title">General</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -661,7 +661,7 @@
|
|||
<h3 class="card-title">Budget</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -621,9 +621,9 @@
|
|||
<h3 class="card-title">Projects Detail</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -620,7 +620,7 @@
|
|||
<h3 class="card-title">General</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -661,7 +661,7 @@
|
|||
<h3 class="card-title">Budget</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -687,7 +687,7 @@
|
|||
<h3 class="card-title">Files</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -620,9 +620,9 @@
|
|||
<h3 class="card-title">Projects</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@
|
|||
<link rel="stylesheet" href="../../plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
|
||||
<!-- Select2 -->
|
||||
<link rel="stylesheet" href="../../plugins/select2/css/select2.min.css">
|
||||
<link rel="stylesheet" href="../../plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
|
||||
<!-- Bootstrap4 Duallistbox -->
|
||||
<link rel="stylesheet" href="../../plugins/bootstrap4-duallistbox/bootstrap-duallistbox.min.css">
|
||||
<!-- Theme style -->
|
||||
|
|
@ -631,8 +632,8 @@
|
|||
<h3 class="card-title">Select2</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-remove"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-remove"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.card-header -->
|
||||
|
|
@ -713,8 +714,8 @@
|
|||
<h3 class="card-title">Bootstrap Duallistbox</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-remove"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-remove"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.card-header -->
|
||||
|
|
@ -943,18 +944,18 @@
|
|||
<!-- checkbox -->
|
||||
<div class="form-group clearfix">
|
||||
<div class="icheck-primary d-inline">
|
||||
<input type="checkbox" checked>
|
||||
<label>
|
||||
<input type="checkbox" id="checkboxPrimary1" checked>
|
||||
<label for="checkboxPrimary1">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-primary d-inline">
|
||||
<input type="checkbox">
|
||||
<label>
|
||||
<input type="checkbox" id="checkboxPrimary2">
|
||||
<label for="checkboxPrimary2">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-primary d-inline">
|
||||
<input type="checkbox" disabled>
|
||||
<label>
|
||||
<input type="checkbox" id="checkboxPrimary3" disabled>
|
||||
<label for="checkboxPrimary3">
|
||||
Primary checkbox
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -963,18 +964,18 @@
|
|||
<!-- radio -->
|
||||
<div class="form-group clearfix">
|
||||
<div class="icheck-primary d-inline">
|
||||
<input type="radio" name="r1" checked>
|
||||
<label>
|
||||
<input type="radio" id="radioPrimary1" name="r1" checked>
|
||||
<label for="radioPrimary1">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-primary d-inline">
|
||||
<input type="radio" name="r1">
|
||||
<label>
|
||||
<input type="radio" id="radioPrimary2" name="r1">
|
||||
<label for="radioPrimary2">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-primary d-inline">
|
||||
<input type="radio" name="r1" disabled>
|
||||
<label>
|
||||
<input type="radio" id="radioPrimary3" name="r1" disabled>
|
||||
<label for="radioPrimary3">
|
||||
Primary radio
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -985,18 +986,18 @@
|
|||
<!-- checkbox -->
|
||||
<div class="form-group clearfix">
|
||||
<div class="icheck-danger d-inline">
|
||||
<input type="checkbox" checked>
|
||||
<label>
|
||||
<input type="checkbox" checked id="checkboxDanger1">
|
||||
<label for="checkboxDanger1">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-danger d-inline">
|
||||
<input type="checkbox">
|
||||
<label>
|
||||
<input type="checkbox" id="checkboxDanger2">
|
||||
<label for="checkboxDanger2">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-danger d-inline">
|
||||
<input type="checkbox" disabled>
|
||||
<label>
|
||||
<input type="checkbox" disabled id="checkboxDanger3">
|
||||
<label for="checkboxDanger3">
|
||||
Danger checkbox
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -1005,18 +1006,18 @@
|
|||
<!-- radio -->
|
||||
<div class="form-group clearfix">
|
||||
<div class="icheck-danger d-inline">
|
||||
<input type="radio" name="r2" checked>
|
||||
<label>
|
||||
<input type="radio" name="r2" checked id="radioDanger1">
|
||||
<label for="radioDanger1">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-danger d-inline">
|
||||
<input type="radio" name="r2">
|
||||
<label>
|
||||
<input type="radio" name="r2" id="radioDanger2">
|
||||
<label for="radioDanger2">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-danger d-inline">
|
||||
<input type="radio" name="r2" disabled>
|
||||
<label>
|
||||
<input type="radio" name="r2" disabled id="radioDanger3">
|
||||
<label for="radioDanger3">
|
||||
Danger radio
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -1028,18 +1029,18 @@
|
|||
<!-- checkbox -->
|
||||
<div class="form-group clearfix">
|
||||
<div class="icheck-success d-inline">
|
||||
<input type="checkbox" checked>
|
||||
<label>
|
||||
<input type="checkbox" checked id="checkboxSuccess1">
|
||||
<label for="checkboxSuccess1">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-success d-inline">
|
||||
<input type="checkbox">
|
||||
<label>
|
||||
<input type="checkbox" id="checkboxSuccess2">
|
||||
<label for="checkboxSuccess2">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-success d-inline">
|
||||
<input type="checkbox" disabled>
|
||||
<label>
|
||||
<input type="checkbox" disabled id="checkboxSuccess3">
|
||||
<label for="checkboxSuccess3">
|
||||
Success checkbox
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -1048,18 +1049,18 @@
|
|||
<!-- radio -->
|
||||
<div class="form-group clearfix">
|
||||
<div class="icheck-success d-inline">
|
||||
<input type="radio" name="r2" checked>
|
||||
<label>
|
||||
<input type="radio" name="r3" checked id="radioSuccess1">
|
||||
<label for="radioSuccess1">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-success d-inline">
|
||||
<input type="radio" name="r2">
|
||||
<label>
|
||||
<input type="radio" name="r3" id="radioSuccess2">
|
||||
<label for="radioSuccess2">
|
||||
</label>
|
||||
</div>
|
||||
<div class="icheck-success d-inline">
|
||||
<input type="radio" name="r2" disabled>
|
||||
<label>
|
||||
<input type="radio" name="r3" disabled id="radioSuccess3">
|
||||
<label for="radioSuccess3">
|
||||
Success radio
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -1123,7 +1124,9 @@
|
|||
<script>
|
||||
$(function () {
|
||||
//Initialize Select2 Elements
|
||||
$('.select2').select2()
|
||||
$('.select2').select2({
|
||||
theme: 'bootstrap4'
|
||||
})
|
||||
|
||||
//Datemask dd/mm/yyyy
|
||||
$('#datemask').inputmask('dd/mm/yyyy', { 'placeholder': 'dd/mm/yyyy' })
|
||||
|
|
|
|||
|
|
@ -624,10 +624,10 @@
|
|||
</h3>
|
||||
<!-- tools box -->
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool btn-sm" data-widget="collapse" data-toggle="tooltip"
|
||||
<button type="button" class="btn btn-tool btn-sm" data-card-widget="collapse" data-toggle="tooltip"
|
||||
title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool btn-sm" data-widget="remove" data-toggle="tooltip"
|
||||
<button type="button" class="btn btn-tool btn-sm" data-card-widget="remove" data-toggle="tooltip"
|
||||
title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -621,9 +621,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -621,9 +621,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -620,9 +620,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -622,9 +622,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@
|
|||
<!-- Main Sidebar Container -->
|
||||
<aside class="main-sidebar sidebar-dark-primary elevation-4">
|
||||
<!-- Brand Logo -->
|
||||
<a href="../../index3.html" class="brand-link">
|
||||
<a href="../../index3.html" class="brand-link elevation-4">
|
||||
<img src="../../dist/img/AdminLTELogo.png"
|
||||
alt="AdminLTE Logo"
|
||||
class="brand-image img-circle elevation-3"
|
||||
|
|
@ -620,9 +620,9 @@
|
|||
<h3 class="card-title">Title</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
|
||||
<i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
|
||||
<i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -624,7 +624,7 @@
|
|||
<h3 class="card-title">Folders</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -667,7 +667,7 @@
|
|||
<h3 class="card-title">Labels</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -622,7 +622,7 @@
|
|||
<h3 class="card-title">Folders</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -665,7 +665,7 @@
|
|||
<h3 class="card-title">Labels</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -622,7 +622,7 @@
|
|||
<h3 class="card-title">Folders</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -665,7 +665,7 @@
|
|||
<h3 class="card-title">Labels</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -976,7 +976,7 @@
|
|||
<h3 class="card-title">Expandable</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-plus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-plus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -996,7 +996,7 @@
|
|||
<h3 class="card-title">Collapsable</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1016,7 +1016,7 @@
|
|||
<h3 class="card-title">Removable</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1036,7 +1036,7 @@
|
|||
<h3 class="card-title">Maximizable</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="maximize"><i class="fas fa-expand"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="maximize"><i class="fas fa-expand"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1056,13 +1056,36 @@
|
|||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<div class="card card-primary">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Card Refresh</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-card-widget="card-refresh" data-source="/pages/widgets.html" data-source-selector="#card-refresh-content"><i class="fas fa-sync-alt"></i></button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
</div>
|
||||
<!-- /.card-header -->
|
||||
<div class="card-body">
|
||||
The body of the card
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
<div class="d-none" id="card-refresh-content">
|
||||
The body of the card after card refresh
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.col -->
|
||||
<div class="col-md-3">
|
||||
<div class="card card-success">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">All together</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="maximize"><i class="fas fa-expand"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="card-refresh" data-source="/pages/widgets.html" data-source-selector="#card-refresh-content"><i class="fas fa-sync-alt"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="maximize"><i class="fas fa-expand"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
</div>
|
||||
|
|
@ -1076,7 +1099,7 @@
|
|||
</div>
|
||||
<!-- /.col -->
|
||||
<div class="col-md-3">
|
||||
<div class="card card-success">
|
||||
<div class="card card-warning">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Loading state</h3>
|
||||
</div>
|
||||
|
|
@ -1094,7 +1117,7 @@
|
|||
</div>
|
||||
<!-- /.col -->
|
||||
<div class="col-md-3">
|
||||
<div class="card card-warning">
|
||||
<div class="card card-danger">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Loading state (dark)</h3>
|
||||
</div>
|
||||
|
|
@ -1125,7 +1148,7 @@
|
|||
<h3 class="card-title">Primary Outline</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1145,7 +1168,7 @@
|
|||
<h3 class="card-title">Success Outline</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1165,7 +1188,7 @@
|
|||
<h3 class="card-title">Warning Outline</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1202,7 +1225,7 @@
|
|||
<h3 class="card-title">Primary Outline</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1222,7 +1245,7 @@
|
|||
<h3 class="card-title">Success Outline</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1242,7 +1265,7 @@
|
|||
<h3 class="card-title">Warning Outline</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1279,7 +1302,7 @@
|
|||
<h3 class="card-title">Primary</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1299,7 +1322,7 @@
|
|||
<h3 class="card-title">Success</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1319,7 +1342,7 @@
|
|||
<h3 class="card-title">Warning</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1356,7 +1379,7 @@
|
|||
<h3 class="card-title">Primary Gradient</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1376,7 +1399,7 @@
|
|||
<h3 class="card-title">Success Gradient</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1396,7 +1419,7 @@
|
|||
<h3 class="card-title">Warning Gradient</h3>
|
||||
|
||||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -1439,12 +1462,12 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span data-toggle="tooltip" title="3 New Messages" class="badge bg-primary">3</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
|
||||
data-widget="chat-pane-toggle">
|
||||
<i class="fas fa-comments"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1534,12 +1557,12 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span data-toggle="tooltip" title="3 New Messages" class="badge bg-success">3</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
|
||||
data-widget="chat-pane-toggle">
|
||||
<i class="fas fa-comments"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1629,12 +1652,12 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span data-toggle="tooltip" title="3 New Messages" class="badge bg-danger">3</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
|
||||
data-widget="chat-pane-toggle">
|
||||
<i class="fas fa-comments"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1724,12 +1747,12 @@
|
|||
|
||||
<div class="card-tools">
|
||||
<span data-toggle="tooltip" title="3 New Messages" class="badge">3</span>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
|
||||
data-widget="chat-pane-toggle">
|
||||
<i class="fas fa-comments"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1962,9 +1985,9 @@
|
|||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Mark as read">
|
||||
<i class="far fa-circle"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
@ -2039,9 +2062,9 @@
|
|||
<div class="card-tools">
|
||||
<button type="button" class="btn btn-tool" data-toggle="tooltip" title="Mark as read">
|
||||
<i class="far fa-circle"></i></button>
|
||||
<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fas fa-minus"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-tool" data-widget="remove"><i class="fas fa-times"></i>
|
||||
<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- /.card-tools -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,150 @@
|
|||
.select2-container--bootstrap4 .select2-selection--single {
|
||||
height: calc(1.5em + 0.75rem + 2px) !important; }
|
||||
.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
|
||||
color: #757575;
|
||||
line-height: calc(1.5em + 0.75rem); }
|
||||
.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 3px;
|
||||
width: 20px; }
|
||||
.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b {
|
||||
top: 60%;
|
||||
border-color: #343a40 transparent transparent transparent;
|
||||
border-style: solid;
|
||||
border-width: 5px 4px 0 4px;
|
||||
width: 0;
|
||||
height: 0;
|
||||
left: 50%;
|
||||
margin-left: -4px;
|
||||
margin-top: -2px;
|
||||
position: absolute; }
|
||||
.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
|
||||
line-height: calc(1.5em + 0.75rem); }
|
||||
|
||||
.select2-search--dropdown .select2-search__field {
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 0.25rem; }
|
||||
|
||||
.select2-results__message {
|
||||
color: #6c757d; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-selection--multiple {
|
||||
min-height: calc(1.5em + 0.75rem + 2px) !important; }
|
||||
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0 5px;
|
||||
width: 100%; }
|
||||
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
|
||||
color: #343a40;
|
||||
border: 1px solid #bdc6d0;
|
||||
border-radius: 0.2rem;
|
||||
padding: 0;
|
||||
padding-right: 5px;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
margin-top: 0.3em;
|
||||
margin-right: 5px; }
|
||||
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
|
||||
color: #bdc6d0;
|
||||
font-weight: bold;
|
||||
margin-left: 3px;
|
||||
margin-right: 1px;
|
||||
padding-right: 3px;
|
||||
padding-left: 3px;
|
||||
float: left; }
|
||||
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove:hover {
|
||||
color: #343a40; }
|
||||
|
||||
.select2-container {
|
||||
display: block; }
|
||||
.select2-container *:focus {
|
||||
outline: 0; }
|
||||
|
||||
.input-group .select2-container--bootstrap4 {
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex-positive: 1;
|
||||
flex-grow: 1; }
|
||||
|
||||
.input-group-prepend ~ .select2-container--bootstrap4 .select2-selection {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-selection {
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 0.25rem;
|
||||
width: 100%; }
|
||||
|
||||
.select2-container--bootstrap4.select2-container--focus .select2-selection {
|
||||
border-color: #17a2b8;
|
||||
-webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
|
||||
|
||||
.select2-container--bootstrap4.select2-container--focus.select2-container--open .select2-selection {
|
||||
border-bottom: none;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0; }
|
||||
|
||||
.select2-container--bootstrap4.select2-container--disabled .select2-selection, .select2-container--bootstrap4.select2-container--disabled.select2-container--focus .select2-selection {
|
||||
background-color: #e9ecef;
|
||||
cursor: not-allowed;
|
||||
border-color: #ced4da;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none; }
|
||||
|
||||
.select2-container--bootstrap4.select2-container--disabled .select2-search__field, .select2-container--bootstrap4.select2-container--disabled.select2-container--focus .select2-search__field {
|
||||
background-color: transparent; }
|
||||
|
||||
select.is-invalid ~ .select2-container--bootstrap4 .select2-selection,
|
||||
form.was-validated select:invalid ~ .select2-container--bootstrap4 .select2-selection {
|
||||
border-color: #dc3545; }
|
||||
|
||||
select.is-valid ~ .select2-container--bootstrap4 .select2-selection,
|
||||
form.was-validated select:valid ~ .select2-container--bootstrap4 .select2-selection {
|
||||
border-color: #28a745; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-dropdown {
|
||||
border-color: #ced4da;
|
||||
border-top: none;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0; }
|
||||
.select2-container--bootstrap4 .select2-dropdown.select2-dropdown--above {
|
||||
border-top: 1px solid #ced4da;
|
||||
border-top-left-radius: 0.25rem;
|
||||
border-top-right-radius: 0.25rem; }
|
||||
.select2-container--bootstrap4 .select2-dropdown .select2-results__option[aria-selected=true] {
|
||||
background-color: #e9ecef; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-results__option--highlighted,
|
||||
.select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true] {
|
||||
background-color: #007bff;
|
||||
color: #f8f9fa; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-results__option[role=group] {
|
||||
padding: 0; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-results > .select2-results__options {
|
||||
max-height: 15em;
|
||||
overflow-y: auto; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-results__group {
|
||||
padding: 6px;
|
||||
display: list-item;
|
||||
color: #6c757d; }
|
||||
|
||||
.select2-container--bootstrap4 .select2-selection__clear {
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
line-height: 1.15em;
|
||||
padding-left: 0.3em;
|
||||
margin-top: 0.5em;
|
||||
border-radius: 100%;
|
||||
background-color: #6c757d;
|
||||
color: #f8f9fa;
|
||||
float: right;
|
||||
margin-right: 0.3em; }
|
||||
.select2-container--bootstrap4 .select2-selection__clear:hover {
|
||||
background-color: #343a40; }
|
||||
|
|
@ -0,0 +1 @@
|
|||
.select2-container--bootstrap4 .select2-selection--single{height:calc(1.5em + .75rem + 2px)!important}.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder{color:#757575;line-height:calc(1.5em + .75rem)}.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow{position:absolute;top:50%;right:3px;width:20px}.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b{top:60%;border-color:#343a40 transparent transparent;border-style:solid;border-width:5px 4px 0;width:0;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute}.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered{line-height:calc(1.5em + .75rem)}.select2-search--dropdown .select2-search__field{border:1px solid #ced4da;border-radius:.25rem}.select2-results__message{color:#6c757d}.select2-container--bootstrap4 .select2-selection--multiple{min-height:calc(1.5em + .75rem + 2px)!important}.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered{-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:0;padding:0 5px;width:100%}.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice{color:#343a40;border:1px solid #bdc6d0;border-radius:.2rem;padding:0 5px 0 0;cursor:pointer;float:left;margin-top:.3em;margin-right:5px}.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove{color:#bdc6d0;font-weight:700;margin-left:3px;margin-right:1px;padding-right:3px;padding-left:3px;float:left}.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove:hover{color:#343a40}.select2-container{display:block}.select2-container :focus{outline:0}.input-group .select2-container--bootstrap4{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.input-group-prepend~.select2-container--bootstrap4 .select2-selection{border-top-left-radius:0;border-bottom-left-radius:0}.select2-container--bootstrap4 .select2-selection{border:1px solid #ced4da;border-radius:.25rem;width:100%}.select2-container--bootstrap4.select2-container--focus .select2-selection{border-color:#17a2b8;-webkit-box-shadow:0 0 0 .2rem rgba(0,123,255,.25);box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}.select2-container--bootstrap4.select2-container--focus.select2-container--open .select2-selection{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--bootstrap4.select2-container--disabled.select2-container--focus .select2-selection,.select2-container--bootstrap4.select2-container--disabled .select2-selection{background-color:#e9ecef;cursor:not-allowed;border-color:#ced4da;-webkit-box-shadow:none;box-shadow:none}.select2-container--bootstrap4.select2-container--disabled.select2-container--focus .select2-search__field,.select2-container--bootstrap4.select2-container--disabled .select2-search__field{background-color:transparent}form.was-validated select:invalid~.select2-container--bootstrap4 .select2-selection,select.is-invalid~.select2-container--bootstrap4 .select2-selection{border-color:#dc3545}form.was-validated select:valid~.select2-container--bootstrap4 .select2-selection,select.is-valid~.select2-container--bootstrap4 .select2-selection{border-color:#28a745}.select2-container--bootstrap4 .select2-dropdown{border-color:#ced4da;border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-container--bootstrap4 .select2-dropdown.select2-dropdown--above{border-top:1px solid #ced4da;border-top-left-radius:.25rem;border-top-right-radius:.25rem}.select2-container--bootstrap4 .select2-dropdown .select2-results__option[aria-selected=true]{background-color:#e9ecef}.select2-container--bootstrap4 .select2-results__option--highlighted,.select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true]{background-color:#007bff;color:#f8f9fa}.select2-container--bootstrap4 .select2-results__option[role=group]{padding:0}.select2-container--bootstrap4 .select2-results>.select2-results__options{max-height:15em;overflow-y:auto}.select2-container--bootstrap4 .select2-results__group{padding:6px;display:list-item;color:#6c757d}.select2-container--bootstrap4 .select2-selection__clear{width:1.2em;height:1.2em;line-height:1.15em;padding-left:.3em;margin-top:.5em;border-radius:100%;background-color:#6c757d;color:#f8f9fa;float:right;margin-right:.3em}.select2-container--bootstrap4 .select2-selection__clear:hover{background-color:#343a40}
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
# @sweetalert2/theme-bootstrap-4 - Bootstrap 4 Theme for [SweetAlert2](https://github.com/sweetalert2/sweetalert2)
|
||||
|
||||
[](https://www.npmjs.com/package/@sweetalert2/theme-bootstrap-4)
|
||||
|
||||
Installation
|
||||
------------
|
||||
|
||||
```sh
|
||||
npm install --save sweetalert2 @sweetalert2/theme-bootstrap-4
|
||||
```
|
||||
|
||||
Usage
|
||||
-----
|
||||
|
||||
With CSS:
|
||||
|
||||
```html
|
||||
<!-- Include the Bootstrap 4 theme -->
|
||||
<link rel="stylesheet" href="@sweetalert2/theme-bootstrap-4/bootstrap-4.css">
|
||||
|
||||
<script src="sweetalert2/dist/sweetalert2.min.js"></script>
|
||||
```
|
||||
|
||||
With SASS:
|
||||
|
||||
`your-app.js`:
|
||||
```js
|
||||
import Swal from 'sweetalert2/src/sweetalert2.js'
|
||||
```
|
||||
|
||||
`your-app.scss`:
|
||||
```scss
|
||||
@import '~@sweetalert2/theme-bootstrap-4/bootstrap-4.scss';
|
||||
```
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,686 @@
|
|||
@import '~sweetalert2/src/variables';
|
||||
|
||||
// Function
|
||||
@function str-replace($string, $search, $replace: '') {
|
||||
$index: str-index($string, $search);
|
||||
|
||||
@if $index {
|
||||
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
|
||||
}
|
||||
|
||||
@return $string;
|
||||
}
|
||||
|
||||
// Theme Variables
|
||||
// Color
|
||||
$bootstrap-primary: #007bff !default;
|
||||
$bootstrap-success: #28a745 !default;
|
||||
$bootstrap-danger: #dc3545 !default;
|
||||
$bootstrap-warning: #ffc107 !default;
|
||||
$bootstrap-info: #17a2b8 !default;
|
||||
$bootstrap-secondary: #6c757d !default;
|
||||
|
||||
$bootstrap-gray-100: #f8f9fa !default;
|
||||
$bootstrap-gray-200: #e9ecef !default;
|
||||
$bootstrap-gray-300: #dee2e6 !default;
|
||||
$bootstrap-gray-400: #ced4da !default;
|
||||
$bootstrap-gray-500: #adb5bd !default;
|
||||
$bootstrap-gray-600: #6c757d !default;
|
||||
$bootstrap-gray-700: #495057 !default;
|
||||
$bootstrap-gray-800: #343a40 !default;
|
||||
$bootstrap-gray-900: #212529 !default;
|
||||
|
||||
$bootstrap-theme-color-interval: 8% !default;
|
||||
|
||||
// Alert
|
||||
$bootstrap-alert-border-level: -9 !default;
|
||||
$bootstrap-alert-bg-level: -10 !default;
|
||||
$bootstrap-alert-color-level: 6 !default;
|
||||
$bootstrap-alert-border-color: mix($swal2-white, $bootstrap-secondary, abs($bootstrap-alert-border-level) * $bootstrap-theme-color-interval) !default;
|
||||
$bootstrap-alert-background: mix($swal2-white, $bootstrap-secondary, abs($bootstrap-alert-bg-level) * $bootstrap-theme-color-interval) !default;
|
||||
$bootstrap-alert-color: mix($swal2-black, $bootstrap-secondary, abs($bootstrap-alert-color-level) * $bootstrap-theme-color-interval) !default;
|
||||
$bootstrap-alert-padding-y: .75rem !default;
|
||||
$bootstrap-alert-padding-x: 1.25rem !default;
|
||||
$bootstrap-alert-margin-bottom: 1rem !default;
|
||||
$bootstrap-alert-border-radius: .25rem !default;
|
||||
$bootstrap-alert-border-width: 1px !default;
|
||||
$bootstrap-alert-font-size: 1rem !default;
|
||||
|
||||
// Input
|
||||
$bootstrap-input-color: $bootstrap-gray-700 !default;
|
||||
$bootstrap-input-bg: $swal2-white !default;
|
||||
$bootstrap-input-border-color: $bootstrap-gray-300 !default;
|
||||
$bootstrap-input-border-radius: .25rem !default;
|
||||
$bootstrap-input-border-width: 1px !default;
|
||||
$bootstrap-input-padding-y: .375rem !default;
|
||||
$bootstrap-input-padding-x: .75rem !default;
|
||||
$bootstrap-input-line-height: 1.5 !default;
|
||||
$bootstrap-input-height-border: $bootstrap-input-border-width * 2 !default;
|
||||
$bootstrap-input-height: calc(#{$bootstrap-input-line-height * 1em} + #{$bootstrap-input-padding-y * 2} + #{$bootstrap-input-height-border}) !default;
|
||||
|
||||
$bootstrap-input-disabled-color: $swal2-white !default;
|
||||
$bootstrap-input-disabled-bg: $bootstrap-gray-200 !default;
|
||||
|
||||
$bootstrap-input-focus-width: .2rem !default;
|
||||
$bootstrap-input-focus-border: 1px solid lighten($bootstrap-primary, 25%) !default;
|
||||
$bootstrap-input-focus-box-shadow: 0 0 0 $bootstrap-input-focus-width rgba($bootstrap-primary, .25) !default;
|
||||
|
||||
// Button
|
||||
$bootstrap-btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
|
||||
$bootstrap-btn-secondary-focus-box-shadow: 0 0 0 $bootstrap-input-focus-width rgba($bootstrap-secondary, .25) !default;
|
||||
|
||||
// Custom Shared Variables
|
||||
$bootstrap-custom-forms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
|
||||
|
||||
$bootstrap-custom-control-gutter: .5rem !default;
|
||||
$bootstrap-custom-control-indicator-size: 1rem !default;
|
||||
$bootstrap-custom-control-indicator-bg: $swal2-white !default;
|
||||
$bootstrap-custom-control-indicator-bg-size: 50% 50% !default;
|
||||
$bootstrap-custom-control-indicator-border-color: $bootstrap-gray-500 !default;
|
||||
$bootstrap-custom-control-indicator-border-width: $bootstrap-input-border-width !default;
|
||||
$bootstrap-custom-control-indicator-checked-color: $swal2-white !default;
|
||||
$bootstrap-custom-control-indicator-checked-bg: $bootstrap-primary !default;
|
||||
$bootstrap-custom-control-indicator-checked-disabled-bg: rgba($bootstrap-primary, .5) !default;
|
||||
$bootstrap-custom-control-indicator-checked-border-color: $bootstrap-custom-control-indicator-checked-bg !default;
|
||||
|
||||
$bootstrap-custom-control-indicator-active-color: $swal2-white !default;
|
||||
$bootstrap-custom-control-indicator-active-bg: lighten($bootstrap-primary, 35%) !default;
|
||||
$bootstrap-custom-control-indicator-active-box-shadow: none !default;
|
||||
$bootstrap-custom-control-indicator-active-border-color: $bootstrap-custom-control-indicator-active-bg !default;
|
||||
|
||||
$bootstrap-custom-control-indicator-focus-box-shadow: $bootstrap-input-focus-box-shadow !default;
|
||||
$bootstrap-custom-control-indicator-focus-border-color: lighten($bootstrap-primary, 25%) !default;
|
||||
|
||||
// Custom Select
|
||||
$bootstrap-custom-select-bg-size: 8px 10px !default;
|
||||
$bootstrap-custom-select-indicator-color: $bootstrap-gray-800 !default;
|
||||
$bootstrap-custom-select-indicator: str-replace(url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"%3e%3cpath fill="#{$bootstrap-custom-select-indicator-color}" d="M2 0L0 2h4zm0 5L0 3h4z"/%3e%3c/svg%3e'), '#', '%23') !default;
|
||||
$bootstrap-custom-select-background: $bootstrap-custom-select-indicator no-repeat right $bootstrap-input-padding-x center / $bootstrap-custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
|
||||
|
||||
// Custom Radio
|
||||
$bootstrap-custom-radio-indicator-border-radius: 50% !default;
|
||||
$bootstrap-custom-radio-indicator-icon-checked: str-replace(url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="-4 -4 8 8"%3e%3ccircle r="3" fill="#{$bootstrap-custom-control-indicator-checked-color}"/%3e%3c/svg%3e'), '#', '%23') !default;
|
||||
|
||||
// Custom Checkbox
|
||||
$bootstrap-custom-checkbox-indicator-icon-checked: str-replace(url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"%3e%3cpath fill="#{$bootstrap-custom-control-indicator-checked-color}" d="M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z"/%3e%3c/svg%3e'), '#', '%23') !default;
|
||||
|
||||
// Custom Range
|
||||
$bootstrap-custom-range-track-width: 100% !default;
|
||||
$bootstrap-custom-range-track-height: .5rem !default;
|
||||
$bootstrap-custom-range-track-cursor: pointer !default;
|
||||
$bootstrap-custom-range-track-bg: $bootstrap-gray-300 !default;
|
||||
$bootstrap-custom-range-track-border-radius: 1rem !default;
|
||||
$bootstrap-custom-range-track-box-shadow: inset 0 .25rem .25rem rgba($swal2-black, .1) !default;
|
||||
|
||||
$bootstrap-custom-range-thumb-width: 1rem !default;
|
||||
$bootstrap-custom-range-thumb-height: $bootstrap-custom-range-thumb-width !default;
|
||||
$bootstrap-custom-range-thumb-bg: $bootstrap-primary !default;
|
||||
$bootstrap-custom-range-thumb-border: 0 !default;
|
||||
$bootstrap-custom-range-thumb-border-radius: 1rem !default;
|
||||
$bootstrap-custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($swal2-black, .1) !default;
|
||||
$bootstrap-custom-range-thumb-focus-box-shadow: 0 0 0 1px $swal2-white, $bootstrap-input-focus-box-shadow !default;
|
||||
$bootstrap-custom-range-thumb-focus-box-shadow-width: $bootstrap-input-focus-width !default; // For focus box shadow issue in IE/Edge
|
||||
$bootstrap-custom-range-thumb-active-bg: lighten($bootstrap-primary, 35%) !default;
|
||||
$bootstrap-custom-range-thumb-disabled-bg: $bootstrap-gray-500 !default;
|
||||
|
||||
// Toast
|
||||
$bootstrap-toast-max-width: 350px !default;
|
||||
$bootstrap-toast-padding-x: .75rem !default;
|
||||
$bootstrap-toast-padding-y: .25rem !default;
|
||||
$bootstrap-toast-font-size: .875rem !default;
|
||||
$bootstrap-toast-background-color: rgba($swal2-white, .85) !default;
|
||||
$bootstrap-toast-border-width: 1px !default;
|
||||
$bootstrap-toast-border-color: rgba(0, 0, 0, .1) !default;
|
||||
$bootstrap-toast-border-radius: .25rem !default;
|
||||
$bootstrap-toast-box-shadow: 0 .25rem .75rem rgba($swal2-black, .1) !default;
|
||||
|
||||
// override SASS variables here
|
||||
|
||||
// BOX MODEL
|
||||
$swal2-padding: 1rem;
|
||||
$swal2-border-radius: .3rem;
|
||||
|
||||
// BACKDROP
|
||||
$swal2-backdrop: rgba($swal2-black, .5);
|
||||
$swal2-backdrop-transition: background-color .15s;
|
||||
|
||||
// ICONS
|
||||
$swal2-success: $bootstrap-success;
|
||||
$swal2-error: $bootstrap-danger;
|
||||
$swal2-warning: $bootstrap-warning;
|
||||
$swal2-info: $bootstrap-info;
|
||||
$swal2-question: $bootstrap-secondary;
|
||||
|
||||
// INPUT
|
||||
$swal2-input-border: $bootstrap-input-border-width solid $bootstrap-input-border-color;
|
||||
$swal2-input-border-radius: $bootstrap-input-border-radius;
|
||||
$swal2-input-border-focus: none;
|
||||
$swal2-input-box-shadow-focus: none;
|
||||
$swal2-input-font-size: 1rem;
|
||||
$swal2-input-padding: $bootstrap-input-padding-y $bootstrap-input-padding-x;
|
||||
|
||||
// CLOSE BUTTON
|
||||
$swal2-close-button-line-height: 1;
|
||||
$swal2-close-button-color: rgba($swal2-black, .5);
|
||||
$swal2-close-button-font-size: 1.5rem;
|
||||
|
||||
// CLOSE BUTTON:HOVER
|
||||
$swal2-close-button-hover-color: $swal2-black;
|
||||
|
||||
// CONFIRM BUTTON
|
||||
$swal2-confirm-button-background-color: $bootstrap-primary;
|
||||
|
||||
// CANCEL BUTTON
|
||||
$swal2-cancel-button-background-color: $bootstrap-secondary;
|
||||
|
||||
// COMMON VARIABLES FOR CONFIRM AND CANCEL BUTTONS
|
||||
$swal2-button-focus-outline: none;
|
||||
|
||||
// TOASTS
|
||||
$swal2-toast-border: $bootstrap-toast-border-color solid $bootstrap-toast-border-width;
|
||||
$swal2-toast-box-shadow: $bootstrap-toast-box-shadow;
|
||||
$swal2-toast-padding: $bootstrap-toast-padding-x $bootstrap-toast-padding-y;
|
||||
$swal2-toast-title-font-size: $bootstrap-toast-font-size;
|
||||
$swal2-toast-content-font-size: $bootstrap-toast-font-size;
|
||||
$swal2-toast-input-font-size: $bootstrap-toast-font-size;
|
||||
$swal2-toast-validation-font-size: $bootstrap-toast-font-size;
|
||||
$swal2-toast-buttons-font-size: $bootstrap-toast-font-size;
|
||||
|
||||
@import '~sweetalert2/src/sweetalert2';
|
||||
|
||||
.swal2-confirm,
|
||||
.swal2-cancel {
|
||||
transition: $bootstrap-btn-transition;
|
||||
}
|
||||
|
||||
.swal2-popup {
|
||||
padding: 0;
|
||||
border: $bootstrap-input-border-width solid rgba(0, 0, 0, .2);
|
||||
|
||||
&.swal2-toast {
|
||||
padding: .25rem .75rem;
|
||||
font-size: .875rem;
|
||||
|
||||
.swal2-header {
|
||||
padding: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.swal2-title {
|
||||
margin: 0;
|
||||
color: $bootstrap-gray-600;
|
||||
}
|
||||
|
||||
.swal2-content {
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
.swal2-actions {
|
||||
flex-basis: 0 !important;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.swal2-styled {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-header {
|
||||
padding: 1rem;
|
||||
border-bottom: $bootstrap-input-border-width solid $bootstrap-input-border-color;
|
||||
}
|
||||
|
||||
.swal2-title {
|
||||
margin: 0;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.swal2-content {
|
||||
padding: 1rem 1rem 0;
|
||||
}
|
||||
|
||||
.swal2-actions {
|
||||
padding: 0 0 1rem;
|
||||
border-radius: $bootstrap-input-border-radius;
|
||||
}
|
||||
|
||||
.swal2-footer {
|
||||
padding: 1rem;
|
||||
border-top: $bootstrap-input-border-width solid $bootstrap-input-border-color;
|
||||
}
|
||||
|
||||
.swal2-close {
|
||||
height: auto;
|
||||
padding: 1rem 1.2rem 1rem 1rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.swal2-input,
|
||||
.swal2-textarea {
|
||||
height: inherit;
|
||||
padding: $swal2-input-padding;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
line-height: $bootstrap-input-line-height;
|
||||
|
||||
&:focus {
|
||||
border: $bootstrap-input-focus-border;
|
||||
outline: 0;
|
||||
box-shadow: $bootstrap-input-focus-box-shadow;
|
||||
color: $bootstrap-input-color;
|
||||
}
|
||||
|
||||
&.swal2-inputerror {
|
||||
box-shadow: none !important;
|
||||
|
||||
&:focus {
|
||||
border-color: $bootstrap-danger;
|
||||
box-shadow: 0 0 0 $bootstrap-input-focus-width rgba($bootstrap-danger, .25) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-styled {
|
||||
&.swal2-confirm {
|
||||
padding: $swal2-input-padding;
|
||||
border: 1px solid $bootstrap-primary;
|
||||
font-size: 1rem;
|
||||
|
||||
&:hover {
|
||||
border-color: darken($bootstrap-primary, 10%);
|
||||
background-color: darken($bootstrap-primary, 7.5%);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
box-shadow: $bootstrap-input-focus-box-shadow;
|
||||
}
|
||||
|
||||
&:active {
|
||||
border-color: darken($bootstrap-primary, 12.5%);
|
||||
background-color: darken($bootstrap-primary, 10%);
|
||||
|
||||
&:focus {
|
||||
box-shadow: $bootstrap-input-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.swal2-cancel {
|
||||
padding: $swal2-input-padding;
|
||||
border: 1px solid $bootstrap-secondary;
|
||||
font-size: 1rem;
|
||||
|
||||
&:hover {
|
||||
border-color: darken($bootstrap-secondary, 10%);
|
||||
background-color: darken($bootstrap-secondary, 7.5%);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
box-shadow: $bootstrap-btn-secondary-focus-box-shadow;
|
||||
}
|
||||
|
||||
&:active {
|
||||
border-color: darken($bootstrap-secondary, 12.5%);
|
||||
background-color: darken($bootstrap-secondary, 10%);
|
||||
|
||||
&:focus {
|
||||
box-shadow: $bootstrap-btn-secondary-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-select {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: $bootstrap-input-height;
|
||||
padding: .375rem 1.75rem .375rem .75rem;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: $bootstrap-input-border-width solid $bootstrap-input-border-color;
|
||||
border-radius: $bootstrap-input-border-radius;
|
||||
background: $bootstrap-custom-select-background;
|
||||
background-color: $bootstrap-input-bg;
|
||||
color: $bootstrap-input-color;
|
||||
vertical-align: middle;
|
||||
// @include box-shadow($custom-select-box-shadow);
|
||||
appearance: none;
|
||||
|
||||
&:focus {
|
||||
border: $bootstrap-input-focus-border;
|
||||
outline: 0;
|
||||
box-shadow: $bootstrap-input-focus-box-shadow;
|
||||
|
||||
&::-ms-value {
|
||||
background-color: $bootstrap-input-bg;
|
||||
color: $bootstrap-input-color;
|
||||
}
|
||||
}
|
||||
|
||||
&[multiple],
|
||||
&[size]:not([size='1']) {
|
||||
height: auto;
|
||||
padding-right: $bootstrap-input-padding-x;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
background-color: $bootstrap-input-disabled-bg;
|
||||
color: $bootstrap-input-disabled-color;
|
||||
}
|
||||
|
||||
&::-ms-expand {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-radio {
|
||||
label {
|
||||
position: relative;
|
||||
margin-right: 1rem;
|
||||
margin-left: 1.5rem;
|
||||
|
||||
input {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
|
||||
&:checked ~ .swal2-label::before {
|
||||
border-color: $bootstrap-custom-control-indicator-checked-border-color;
|
||||
background: $bootstrap-custom-control-indicator-checked-bg;
|
||||
color: $bootstrap-custom-control-indicator-checked-color;
|
||||
}
|
||||
|
||||
&:focus ~ .swal2-label::before {
|
||||
box-shadow: $bootstrap-custom-control-indicator-focus-box-shadow;
|
||||
}
|
||||
|
||||
&:focus:not(:checked) ~ .swal2-label::before {
|
||||
border-color: $bootstrap-custom-control-indicator-focus-border-color;
|
||||
}
|
||||
|
||||
&:not(:disabled):active ~ .swal2-label::before {
|
||||
border-color: $bootstrap-custom-control-indicator-active-border-color;
|
||||
background-color: $bootstrap-custom-control-indicator-active-bg;
|
||||
color: $bootstrap-custom-control-indicator-active-color;
|
||||
}
|
||||
}
|
||||
|
||||
input:checked ~ .swal2-label::after {
|
||||
background-image: $bootstrap-custom-radio-indicator-icon-checked;
|
||||
}
|
||||
|
||||
input:disabled:checked ~ .swal2-label::before {
|
||||
background-color: $bootstrap-custom-control-indicator-checked-disabled-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-label {
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: ($swal2-input-font-size * $bootstrap-input-line-height - $bootstrap-custom-control-indicator-size) / 6;
|
||||
left: -($bootstrap-custom-control-gutter + $bootstrap-custom-control-indicator-size);
|
||||
width: $bootstrap-custom-control-indicator-size;
|
||||
height: $bootstrap-custom-control-indicator-size;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: $bootstrap-custom-control-indicator-border-color solid $bootstrap-custom-control-indicator-border-width;
|
||||
border-radius: $bootstrap-custom-radio-indicator-border-radius;
|
||||
background-color: $bootstrap-custom-control-indicator-bg;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: ($swal2-input-font-size * $bootstrap-input-line-height - $bootstrap-custom-control-indicator-size) / 6;
|
||||
left: -($bootstrap-custom-control-gutter + $bootstrap-custom-control-indicator-size);
|
||||
width: $bootstrap-custom-control-indicator-size;
|
||||
height: $bootstrap-custom-control-indicator-size;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: transparent solid $bootstrap-custom-control-indicator-border-width;
|
||||
background: no-repeat 50% / #{$bootstrap-custom-control-indicator-bg-size};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-checkbox {
|
||||
margin-right: 1rem;
|
||||
padding-left: 1.5rem;
|
||||
|
||||
input {
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
|
||||
&:checked ~ .swal2-label::before {
|
||||
border-color: $bootstrap-custom-control-indicator-checked-border-color;
|
||||
background: $bootstrap-custom-control-indicator-checked-bg;
|
||||
color: $bootstrap-custom-control-indicator-checked-color;
|
||||
}
|
||||
|
||||
&:focus ~ .swal2-label::before {
|
||||
box-shadow: $bootstrap-custom-control-indicator-focus-box-shadow;
|
||||
}
|
||||
|
||||
&:focus:not(:checked) ~ .swal2-label::before {
|
||||
border-color: $bootstrap-custom-control-indicator-focus-border-color;
|
||||
}
|
||||
|
||||
&:not(:disabled):active ~ .swal2-label::before {
|
||||
border-color: $bootstrap-custom-control-indicator-active-border-color;
|
||||
background-color: $bootstrap-custom-control-indicator-active-bg;
|
||||
color: $bootstrap-custom-control-indicator-active-color;
|
||||
}
|
||||
}
|
||||
|
||||
input:checked ~ .swal2-label::after {
|
||||
background-image: $bootstrap-custom-checkbox-indicator-icon-checked;
|
||||
}
|
||||
|
||||
input:disabled:checked ~ .swal2-label::before {
|
||||
background-color: $bootstrap-custom-control-indicator-checked-disabled-bg;
|
||||
}
|
||||
|
||||
.swal2-label {
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: ($swal2-input-font-size * $bootstrap-input-line-height - $bootstrap-custom-control-indicator-size) / 2;
|
||||
left: -($bootstrap-custom-control-gutter + $bootstrap-custom-control-indicator-size);
|
||||
width: $bootstrap-custom-control-indicator-size;
|
||||
height: $bootstrap-custom-control-indicator-size;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: $bootstrap-custom-control-indicator-border-color solid $bootstrap-custom-control-indicator-border-width;
|
||||
background-color: $bootstrap-custom-control-indicator-bg;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: ($swal2-input-font-size * $bootstrap-input-line-height - $bootstrap-custom-control-indicator-size) / 2;
|
||||
left: -($bootstrap-custom-control-gutter + $bootstrap-custom-control-indicator-size);
|
||||
width: $bootstrap-custom-control-indicator-size;
|
||||
height: $bootstrap-custom-control-indicator-size;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: transparent solid $bootstrap-custom-control-indicator-border-width;
|
||||
background: no-repeat 50% / #{$bootstrap-custom-control-indicator-bg-size};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-range input {
|
||||
width: 100%;
|
||||
height: calc(#{$bootstrap-custom-range-thumb-height} + #{$bootstrap-custom-range-thumb-focus-box-shadow-width * 3});
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
appearance: none;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
|
||||
&::-webkit-slider-thumb {
|
||||
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
|
||||
}
|
||||
|
||||
&::-moz-range-thumb {
|
||||
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
|
||||
}
|
||||
|
||||
&::-ms-thumb {
|
||||
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
&::-moz-focus-outer {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&::-webkit-slider-thumb {
|
||||
width: $bootstrap-custom-range-thumb-width;
|
||||
height: $bootstrap-custom-range-thumb-height;
|
||||
margin-top: ($bootstrap-custom-range-track-height - $bootstrap-custom-range-thumb-height) / 2;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: $bootstrap-custom-range-thumb-border;
|
||||
border-radius: $bootstrap-custom-range-thumb-border-radius;
|
||||
background: $bootstrap-custom-range-thumb-bg;
|
||||
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
|
||||
appearance: none;
|
||||
|
||||
&:active {
|
||||
background: $bootstrap-custom-range-thumb-active-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&::-webkit-slider-runnable-track {
|
||||
width: $bootstrap-custom-range-track-width;
|
||||
height: $bootstrap-custom-range-track-height;
|
||||
border-radius: $bootstrap-custom-range-track-border-radius;
|
||||
border-color: transparent;
|
||||
background-color: $bootstrap-custom-range-track-bg;
|
||||
box-shadow: $bootstrap-custom-range-track-box-shadow;
|
||||
color: transparent;
|
||||
cursor: $bootstrap-custom-range-track-cursor;
|
||||
}
|
||||
|
||||
&::-moz-range-thumb {
|
||||
width: $bootstrap-custom-range-thumb-width;
|
||||
height: $bootstrap-custom-range-thumb-height;
|
||||
margin-top: 1rem;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: $bootstrap-custom-range-thumb-border;
|
||||
border-radius: $bootstrap-custom-range-thumb-border-radius;
|
||||
background: $bootstrap-custom-range-thumb-bg;
|
||||
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
|
||||
appearance: none;
|
||||
|
||||
&:active {
|
||||
background: $bootstrap-custom-range-thumb-active-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&::-moz-range-track {
|
||||
width: $bootstrap-custom-range-track-width;
|
||||
height: $bootstrap-custom-range-track-height;
|
||||
border-radius: $bootstrap-custom-range-track-border-radius;
|
||||
border-color: transparent;
|
||||
background-color: $bootstrap-custom-range-track-bg;
|
||||
box-shadow: $bootstrap-custom-range-track-box-shadow;
|
||||
color: transparent;
|
||||
cursor: $bootstrap-custom-range-track-cursor;
|
||||
}
|
||||
|
||||
&::-ms-thumb {
|
||||
width: $bootstrap-custom-range-thumb-width;
|
||||
height: $bootstrap-custom-range-thumb-height;
|
||||
margin-top: 0;
|
||||
margin-right: $bootstrap-custom-range-thumb-focus-box-shadow-width;
|
||||
margin-left: $bootstrap-custom-range-thumb-focus-box-shadow-width;
|
||||
transition: $bootstrap-custom-forms-transition;
|
||||
border: $bootstrap-custom-range-thumb-border;
|
||||
border-radius: $bootstrap-custom-range-thumb-border-radius;
|
||||
background: $bootstrap-custom-range-thumb-bg;
|
||||
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
|
||||
appearance: none;
|
||||
|
||||
&:active {
|
||||
background: $bootstrap-custom-range-thumb-active-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&::-ms-track {
|
||||
width: $bootstrap-custom-range-track-width;
|
||||
height: $bootstrap-custom-range-track-height;
|
||||
border-width: $bootstrap-custom-range-thumb-height / 2;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
box-shadow: $bootstrap-custom-range-track-box-shadow;
|
||||
color: transparent;
|
||||
cursor: $bootstrap-custom-range-track-cursor;
|
||||
}
|
||||
|
||||
&::-ms-fill-lower {
|
||||
border-radius: $bootstrap-custom-range-track-border-radius;
|
||||
background-color: $bootstrap-custom-range-track-bg;
|
||||
}
|
||||
|
||||
&::-ms-fill-upper {
|
||||
margin-right: 15px;
|
||||
border-radius: $bootstrap-custom-range-track-border-radius;
|
||||
background-color: $bootstrap-custom-range-track-bg;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
&::-webkit-slider-thumb {
|
||||
background-color: $bootstrap-custom-range-thumb-disabled-bg;
|
||||
}
|
||||
|
||||
&::-webkit-slider-runnable-track {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&::-moz-range-thumb {
|
||||
background-color: $bootstrap-custom-range-thumb-disabled-bg;
|
||||
}
|
||||
|
||||
&::-moz-range-track {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&::-ms-thumb {
|
||||
background-color: $bootstrap-custom-range-thumb-disabled-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-validation-message {
|
||||
position: relative;
|
||||
margin-bottom: $bootstrap-alert-margin-bottom;
|
||||
padding: $bootstrap-alert-padding-y $bootstrap-alert-padding-x;
|
||||
border: $bootstrap-alert-border-width solid transparent;
|
||||
border-radius: $bootstrap-alert-border-radius;
|
||||
border-color: $bootstrap-alert-border-color;
|
||||
background: $bootstrap-alert-background;
|
||||
color: $bootstrap-alert-color;
|
||||
font-size: $bootstrap-alert-font-size;
|
||||
|
||||
&::before {
|
||||
background-color: lighten($bootstrap-danger, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-toast {
|
||||
max-width: $bootstrap-toast-max-width;
|
||||
border-radius: $bootstrap-toast-border-radius;
|
||||
background-color: $bootstrap-toast-background-color;
|
||||
}
|
||||
|
||||
//
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
{
|
||||
"_from": "@sweetalert2/theme-bootstrap-4",
|
||||
"_id": "@sweetalert2/theme-bootstrap-4@2.1.0",
|
||||
"_inBundle": false,
|
||||
"_integrity": "sha512-Ji33Ixo45EjGrGUX0Z+RqsI0X45r3NW464MigYhA9olUy4uOlwfTkumKpeudrY+tMZYDM2OP0LR9ndHBcyArbw==",
|
||||
"_location": "/@sweetalert2/theme-bootstrap-4",
|
||||
"_phantomChildren": {},
|
||||
"_requested": {
|
||||
"type": "tag",
|
||||
"registry": true,
|
||||
"raw": "@sweetalert2/theme-bootstrap-4",
|
||||
"name": "@sweetalert2/theme-bootstrap-4",
|
||||
"escapedName": "@sweetalert2%2ftheme-bootstrap-4",
|
||||
"scope": "@sweetalert2",
|
||||
"rawSpec": "",
|
||||
"saveSpec": null,
|
||||
"fetchSpec": "latest"
|
||||
},
|
||||
"_requiredBy": [
|
||||
"#USER",
|
||||
"/"
|
||||
],
|
||||
"_resolved": "https://registry.npmjs.org/@sweetalert2/theme-bootstrap-4/-/theme-bootstrap-4-2.1.0.tgz",
|
||||
"_shasum": "e409b0d043bc1ed1bd47925c7571949b0cdaa3d0",
|
||||
"_spec": "@sweetalert2/theme-bootstrap-4",
|
||||
"_where": "/Users/rejack/Projekte/GitHub/REJack/AdminLTE",
|
||||
"author": "",
|
||||
"bugs": {
|
||||
"url": "https://github.com/sweetalert2/sweetalert2-themes/issues"
|
||||
},
|
||||
"bundleDependencies": false,
|
||||
"deprecated": false,
|
||||
"description": "Bootstrap 4 theme for SweetAlert2",
|
||||
"files": [
|
||||
"*.css",
|
||||
"*.scss"
|
||||
],
|
||||
"homepage": "https://sweetalert2.github.io/",
|
||||
"keywords": [
|
||||
"sweetalert2",
|
||||
"bootstrap-4",
|
||||
"theme",
|
||||
"themes",
|
||||
"theming",
|
||||
"sass"
|
||||
],
|
||||
"license": "MIT",
|
||||
"main": "bootstrap-4.css",
|
||||
"name": "@sweetalert2/theme-bootstrap-4",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/sweetalert2/sweetalert2-themes.git"
|
||||
},
|
||||
"version": "2.1.0"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,61 +1,49 @@
|
|||
@charset "UTF-8";
|
||||
@-webkit-keyframes swal2-show {
|
||||
0% {
|
||||
-webkit-transform: scale(0.7);
|
||||
transform: scale(0.7);
|
||||
transform: scale(0.7);
|
||||
}
|
||||
45% {
|
||||
-webkit-transform: scale(1.05);
|
||||
transform: scale(1.05);
|
||||
transform: scale(1.05);
|
||||
}
|
||||
80% {
|
||||
-webkit-transform: scale(0.95);
|
||||
transform: scale(0.95);
|
||||
transform: scale(0.95);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes swal2-show {
|
||||
0% {
|
||||
-webkit-transform: scale(0.7);
|
||||
transform: scale(0.7);
|
||||
transform: scale(0.7);
|
||||
}
|
||||
45% {
|
||||
-webkit-transform: scale(1.05);
|
||||
transform: scale(1.05);
|
||||
transform: scale(1.05);
|
||||
}
|
||||
80% {
|
||||
-webkit-transform: scale(0.95);
|
||||
transform: scale(0.95);
|
||||
transform: scale(0.95);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes swal2-hide {
|
||||
0% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(0.5);
|
||||
transform: scale(0.5);
|
||||
transform: scale(0.5);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes swal2-hide {
|
||||
0% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(0.5);
|
||||
transform: scale(0.5);
|
||||
transform: scale(0.5);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -159,111 +147,91 @@
|
|||
}
|
||||
@-webkit-keyframes swal2-rotate-success-circular-line {
|
||||
0% {
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
5% {
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
12% {
|
||||
-webkit-transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
}
|
||||
}
|
||||
@keyframes swal2-rotate-success-circular-line {
|
||||
0% {
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
5% {
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
12% {
|
||||
-webkit-transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
transform: rotate(-405deg);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes swal2-animate-error-x-mark {
|
||||
0% {
|
||||
margin-top: 1.625em;
|
||||
-webkit-transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
margin-top: 1.625em;
|
||||
-webkit-transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
opacity: 0;
|
||||
}
|
||||
80% {
|
||||
margin-top: -0.375em;
|
||||
-webkit-transform: scale(1.15);
|
||||
transform: scale(1.15);
|
||||
transform: scale(1.15);
|
||||
}
|
||||
100% {
|
||||
margin-top: 0;
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes swal2-animate-error-x-mark {
|
||||
0% {
|
||||
margin-top: 1.625em;
|
||||
-webkit-transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
margin-top: 1.625em;
|
||||
-webkit-transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
transform: scale(0.4);
|
||||
opacity: 0;
|
||||
}
|
||||
80% {
|
||||
margin-top: -0.375em;
|
||||
-webkit-transform: scale(1.15);
|
||||
transform: scale(1.15);
|
||||
transform: scale(1.15);
|
||||
}
|
||||
100% {
|
||||
margin-top: 0;
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes swal2-animate-error-icon {
|
||||
0% {
|
||||
-webkit-transform: rotateX(100deg);
|
||||
transform: rotateX(100deg);
|
||||
transform: rotateX(100deg);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotateX(0deg);
|
||||
transform: rotateX(0deg);
|
||||
transform: rotateX(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes swal2-animate-error-icon {
|
||||
0% {
|
||||
-webkit-transform: rotateX(100deg);
|
||||
transform: rotateX(100deg);
|
||||
transform: rotateX(100deg);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotateX(0deg);
|
||||
transform: rotateX(0deg);
|
||||
transform: rotateX(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
@ -278,8 +246,7 @@ body.swal2-toast-shown .swal2-container.swal2-top {
|
|||
right: auto;
|
||||
bottom: auto;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
body.swal2-toast-shown .swal2-container.swal2-top-end, body.swal2-toast-shown .swal2-container.swal2-top-right {
|
||||
top: 0;
|
||||
|
|
@ -298,24 +265,21 @@ body.swal2-toast-shown .swal2-container.swal2-center-start, body.swal2-toast-sho
|
|||
right: auto;
|
||||
bottom: auto;
|
||||
left: 0;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
body.swal2-toast-shown .swal2-container.swal2-center {
|
||||
top: 50%;
|
||||
right: auto;
|
||||
bottom: auto;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
body.swal2-toast-shown .swal2-container.swal2-center-end, body.swal2-toast-shown .swal2-container.swal2-center-right {
|
||||
top: 50%;
|
||||
right: 0;
|
||||
bottom: auto;
|
||||
left: auto;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
body.swal2-toast-shown .swal2-container.swal2-bottom-start, body.swal2-toast-shown .swal2-container.swal2-bottom-left {
|
||||
top: auto;
|
||||
|
|
@ -328,8 +292,7 @@ body.swal2-toast-shown .swal2-container.swal2-bottom {
|
|||
right: auto;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
body.swal2-toast-shown .swal2-container.swal2-bottom-end, body.swal2-toast-shown .swal2-container.swal2-bottom-right {
|
||||
top: auto;
|
||||
|
|
@ -424,6 +387,7 @@ body.swal2-toast-column .swal2-toast .swal2-validation-message {
|
|||
}
|
||||
.swal2-popup.swal2-toast .swal2-actions {
|
||||
flex-basis: auto !important;
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin: 0 0.3125em;
|
||||
}
|
||||
|
|
@ -442,24 +406,20 @@ body.swal2-toast-column .swal2-toast .swal2-validation-message {
|
|||
position: absolute;
|
||||
width: 1.6em;
|
||||
height: 3em;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-radius: 50%;
|
||||
}
|
||||
.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=left] {
|
||||
top: -0.8em;
|
||||
left: -0.5em;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
-webkit-transform-origin: 2em 2em;
|
||||
transform-origin: 2em 2em;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: 2em 2em;
|
||||
border-radius: 4em 0 0 4em;
|
||||
}
|
||||
.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=right] {
|
||||
top: -0.25em;
|
||||
left: 0.9375em;
|
||||
-webkit-transform-origin: 0 1.5em;
|
||||
transform-origin: 0 1.5em;
|
||||
transform-origin: 0 1.5em;
|
||||
border-radius: 0 4em 4em 0;
|
||||
}
|
||||
.swal2-popup.swal2-toast .swal2-success .swal2-success-ring {
|
||||
|
|
@ -504,52 +464,42 @@ body.swal2-toast-column .swal2-toast .swal2-validation-message {
|
|||
|
||||
@-webkit-keyframes swal2-toast-show {
|
||||
0% {
|
||||
-webkit-transform: translateY(-0.625em) rotateZ(2deg);
|
||||
transform: translateY(-0.625em) rotateZ(2deg);
|
||||
transform: translateY(-0.625em) rotateZ(2deg);
|
||||
}
|
||||
33% {
|
||||
-webkit-transform: translateY(0) rotateZ(-2deg);
|
||||
transform: translateY(0) rotateZ(-2deg);
|
||||
transform: translateY(0) rotateZ(-2deg);
|
||||
}
|
||||
66% {
|
||||
-webkit-transform: translateY(0.3125em) rotateZ(2deg);
|
||||
transform: translateY(0.3125em) rotateZ(2deg);
|
||||
transform: translateY(0.3125em) rotateZ(2deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translateY(0) rotateZ(0);
|
||||
transform: translateY(0) rotateZ(0);
|
||||
transform: translateY(0) rotateZ(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes swal2-toast-show {
|
||||
0% {
|
||||
-webkit-transform: translateY(-0.625em) rotateZ(2deg);
|
||||
transform: translateY(-0.625em) rotateZ(2deg);
|
||||
transform: translateY(-0.625em) rotateZ(2deg);
|
||||
}
|
||||
33% {
|
||||
-webkit-transform: translateY(0) rotateZ(-2deg);
|
||||
transform: translateY(0) rotateZ(-2deg);
|
||||
transform: translateY(0) rotateZ(-2deg);
|
||||
}
|
||||
66% {
|
||||
-webkit-transform: translateY(0.3125em) rotateZ(2deg);
|
||||
transform: translateY(0.3125em) rotateZ(2deg);
|
||||
transform: translateY(0.3125em) rotateZ(2deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translateY(0) rotateZ(0);
|
||||
transform: translateY(0) rotateZ(0);
|
||||
transform: translateY(0) rotateZ(0deg);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes swal2-toast-hide {
|
||||
100% {
|
||||
-webkit-transform: rotateZ(1deg);
|
||||
transform: rotateZ(1deg);
|
||||
transform: rotateZ(1deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes swal2-toast-hide {
|
||||
100% {
|
||||
-webkit-transform: rotateZ(1deg);
|
||||
transform: rotateZ(1deg);
|
||||
transform: rotateZ(1deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -671,8 +621,7 @@ body.swal2-no-backdrop .swal2-shown > .swal2-modal {
|
|||
body.swal2-no-backdrop .swal2-shown.swal2-top {
|
||||
top: 0;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
body.swal2-no-backdrop .swal2-shown.swal2-top-start, body.swal2-no-backdrop .swal2-shown.swal2-top-left {
|
||||
top: 0;
|
||||
|
|
@ -685,26 +634,22 @@ body.swal2-no-backdrop .swal2-shown.swal2-top-end, body.swal2-no-backdrop .swal2
|
|||
body.swal2-no-backdrop .swal2-shown.swal2-center {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
body.swal2-no-backdrop .swal2-shown.swal2-center-start, body.swal2-no-backdrop .swal2-shown.swal2-center-left {
|
||||
top: 50%;
|
||||
left: 0;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
body.swal2-no-backdrop .swal2-shown.swal2-center-end, body.swal2-no-backdrop .swal2-shown.swal2-center-right {
|
||||
top: 50%;
|
||||
right: 0;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
body.swal2-no-backdrop .swal2-shown.swal2-bottom {
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
body.swal2-no-backdrop .swal2-shown.swal2-bottom-start, body.swal2-no-backdrop .swal2-shown.swal2-bottom-left {
|
||||
bottom: 0;
|
||||
|
|
@ -855,6 +800,7 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
}
|
||||
|
||||
.swal2-actions {
|
||||
display: flex;
|
||||
z-index: 1;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
|
|
@ -978,8 +924,7 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
cursor: pointer;
|
||||
}
|
||||
.swal2-close:hover {
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
transform: none;
|
||||
background: transparent;
|
||||
color: #f27474;
|
||||
}
|
||||
|
|
@ -1000,13 +945,10 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
padding: 0;
|
||||
color: #545454;
|
||||
font-size: 1.125em;
|
||||
font-weight: 300;
|
||||
font-weight: normal;
|
||||
line-height: normal;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
#swal2-content {
|
||||
text-align: center;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.swal2-input,
|
||||
|
|
@ -1193,6 +1135,7 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
zoom: normal;
|
||||
border: 0.25em solid transparent;
|
||||
border-radius: 50%;
|
||||
font-family: inherit;
|
||||
line-height: 5em;
|
||||
cursor: default;
|
||||
-webkit-user-select: none;
|
||||
|
|
@ -1224,13 +1167,11 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
}
|
||||
.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left] {
|
||||
left: 1.0625em;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right] {
|
||||
right: 1em;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.swal2-icon.swal2-warning {
|
||||
border-color: #facea8;
|
||||
|
|
@ -1263,26 +1204,21 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
position: absolute;
|
||||
width: 3.75em;
|
||||
height: 7.5em;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-radius: 50%;
|
||||
}
|
||||
.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=left] {
|
||||
top: -0.4375em;
|
||||
left: -2.0635em;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
-webkit-transform-origin: 3.75em 3.75em;
|
||||
transform-origin: 3.75em 3.75em;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: 3.75em 3.75em;
|
||||
border-radius: 7.5em 0 0 7.5em;
|
||||
}
|
||||
.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=right] {
|
||||
top: -0.6875em;
|
||||
left: 1.875em;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
-webkit-transform-origin: 0 3.75em;
|
||||
transform-origin: 0 3.75em;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: 0 3.75em;
|
||||
border-radius: 0 7.5em 7.5em 0;
|
||||
}
|
||||
.swal2-icon.swal2-success .swal2-success-ring {
|
||||
|
|
@ -1303,8 +1239,7 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
left: 1.625em;
|
||||
width: 0.4375em;
|
||||
height: 5.625em;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.swal2-icon.swal2-success [class^=swal2-success-line] {
|
||||
display: block;
|
||||
|
|
@ -1318,15 +1253,13 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
top: 2.875em;
|
||||
left: 0.875em;
|
||||
width: 1.5625em;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.swal2-icon.swal2-success [class^=swal2-success-line][class$=long] {
|
||||
top: 2.375em;
|
||||
right: 0.5em;
|
||||
width: 2.9375em;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
.swal2-progress-steps {
|
||||
|
|
@ -1419,23 +1352,19 @@ body.swal2-no-backdrop .swal2-shown.swal2-bottom-end, body.swal2-no-backdrop .sw
|
|||
|
||||
@-webkit-keyframes swal2-rotate-loading {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes swal2-rotate-loading {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@media print {
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue