diff --git a/fonts/boxicons.scss b/fonts/boxicons.scss deleted file mode 100644 index 453d35b90c609169cf0a9fbb4ef8d584248b649c..0000000000000000000000000000000000000000 --- a/fonts/boxicons.scss +++ /dev/null @@ -1,23 +0,0 @@ -$boxicons-font-path: 'boxicons'; -$boxicons-font-size-base: 16px; - -@import '../node_modules/boxicons/css/boxicons'; - -.bx { - vertical-align: middle; - font-size: 1.15rem; - line-height: 1; -} -// Override font path -@font-face { - font-family: 'boxicons'; - font-weight: normal; - font-style: normal; - - src: url('../fonts/#{$boxicons-font-path}/boxicons.eot'); - src: url('../fonts/#{$boxicons-font-path}/boxicons.eot') format('embedded-opentype'), - url('../fonts/#{$boxicons-font-path}/boxicons.woff2') format('woff2'), - url('../fonts/#{$boxicons-font-path}/boxicons.woff') format('woff'), - url('../fonts/#{$boxicons-font-path}/boxicons.ttf') format('truetype'), - url('../fonts/#{$boxicons-font-path}/boxicons.svg?#boxicons') format('svg'); -} diff --git a/html/index.html b/html/index.html deleted file mode 100644 index 0327b088e8a92fb445bfc04a41cc223c3b9a2cc5..0000000000000000000000000000000000000000 --- a/html/index.html +++ /dev/null @@ -1,1190 +0,0 @@ - - - - - - - - - - Dashboard - Analytics | Sneat - Bootstrap 5 HTML Admin Template - Pro - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
- - - - - - -
- - - - - - - -
- - -
-
-
-
-
-
-
-
Congratulations John! 🎉
-

- You have done 72% more sales today. Check your new badge in - your profile. -

- - View Badges -
-
-
-
- View Badge User -
-
-
-
-
-
-
-
-
-
-
-
- chart success -
-
- -
- View More - Delete -
-
-
- Profit -

$12,628

- +72.80% -
-
-
-
-
-
-
-
- Credit Card -
-
- -
- View More - Delete -
-
-
- Sales -

$4,679

- +28.42% -
-
-
-
-
- -
-
-
-
-
Total Revenue
-
-
-
-
-
-
- -
- 2021 - 2020 - 2019 -
-
-
-
-
-
62% Company Growth
- -
-
-
- -
-
- 2022 -
$32.5k
-
-
-
-
- -
-
- 2021 -
$41.2k
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
- Credit Card -
-
- -
- View More - Delete -
-
-
- Payments -

$2,456

- -14.82% -
-
-
-
-
-
-
-
- Credit Card -
-
- -
- View More - Delete -
-
-
- Transactions -

$14,857

- +28.14% -
-
-
- -
-
-
-
-
-
-
Profile Report
- Year 2021 -
-
- 68.2% -

$84,686k

-
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
Order Statistics
- 42.82k Total Sales -
-
- -
- Select All - Refresh - Share -
-
-
-
-
-
-

8,258

- Total Orders -
-
-
-
    -
  • -
    - -
    -
    -
    -
    Electronic
    - Mobile, Earbuds, TV -
    -
    - 82.5k -
    -
    -
    • -
  • -
    - -
    -
    -
    -
    Fashion
    - T-shirt, Jeans, Shoes -
    -
    - 23.8k -
    -
    -
    • -
  • -
    - -
    -
    -
    -
    Decor
    - Fine Art, Dining -
    -
    - 849k -
    -
    -
    • -
  • -
    - -
    -
    -
    -
    Sports
    - Football, Cricket Kit -
    -
    - 99 -
    -
    -
    • -
-
-
-
- - - -
-
-
-
    -
  • - -
    • -
  • - -
    • -
  • - -
    • -
-
-
-
- -
-
-
-
- - - -
-
-
-
Transactions
-
- -
- Last 28 Days - Last Month - Last Year -
-
-
-
-
    -
  • -
    - User -
    -
    -
    - Paypal -
    Send money
    -
    -
    -
    +82.6
    - USD -
    -
    -
    • -
  • -
    - User -
    -
    -
    - Wallet -
    Mac'D
    -
    -
    -
    +270.69
    - USD -
    -
    -
    • -
  • -
    - User -
    -
    -
    - Transfer -
    Refund
    -
    -
    -
    +637.91
    - USD -
    -
    -
    • -
  • -
    - User -
    -
    -
    - Credit Card -
    Ordered Food
    -
    -
    -
    -838.71
    - USD -
    -
    -
    • -
  • -
    - User -
    -
    -
    - Wallet -
    Starbucks
    -
    -
    -
    +203.33
    - USD -
    -
    -
    • -
  • -
    - User -
    -
    -
    - Mastercard -
    Ordered Food
    -
    -
    -
    -92.45
    - USD -
    -
    -
    • -
-
-
-
- -
-
- - - - - - -
-
- -
- -
- - -
-
- - -
- Upgrade to Pro -
- - - - - - - - - - - - - - - - - - - - - - - - diff --git a/js/bootstrap.js b/js/bootstrap.js deleted file mode 100644 index 7f3ced3e02d0e23649787bc357866439b3484d61..0000000000000000000000000000000000000000 --- a/js/bootstrap.js +++ /dev/null @@ -1,29 +0,0 @@ -import * as bootstrap from 'bootstrap' - -// Extend Tooltip to add color options -bootstrap.Tooltip.prototype.show = (original => { - return function addTooltipColor() { - if (this._config.toggle === 'tooltip') { - if (this._element.getAttribute('data-color')) { - const str = `tooltip-${this._element.getAttribute('data-color')}` - this.getTipElement().classList.add(str) - } - } - original.apply(this) - } -})(bootstrap.Tooltip.prototype.show) - -// Extend Popover to add color options -bootstrap.Popover.prototype.show = (original => { - return function addPopoverColor() { - if (this._config.toggle === 'popover') { - if (this._element.getAttribute('data-color')) { - const str = `popover-${this._element.getAttribute('data-color')}` - this.getTipElement().classList.add(str) - } - } - original.apply(this) - } -})(bootstrap.Popover.prototype.show) - -export { bootstrap } diff --git a/js/helpers.js b/js/helpers.js deleted file mode 100644 index 94f821c257165c1122c5900de33fea211059d0a6..0000000000000000000000000000000000000000 --- a/js/helpers.js +++ /dev/null @@ -1,850 +0,0 @@ -// Constants -const TRANS_EVENTS = ['transitionend', 'webkitTransitionEnd', 'oTransitionEnd'] -const TRANS_PROPERTIES = ['transition', 'MozTransition', 'webkitTransition', 'WebkitTransition', 'OTransition'] -const INLINE_STYLES = ` -.layout-menu-fixed .layout-navbar-full .layout-menu, -.layout-page { - padding-top: {navbarHeight}px !important; -} -.content-wrapper { - padding-bottom: {footerHeight}px !important; -}` - -// Guard -function requiredParam(name) { - throw new Error(`Parameter required${name ? `: \`${name}\`` : ''}`) -} - -const Helpers = { - // Root Element - ROOT_EL: typeof window !== 'undefined' ? document.documentElement : null, - - // Large screens breakpoint - LAYOUT_BREAKPOINT: 1200, - - // Resize delay in milliseconds - RESIZE_DELAY: 200, - - menuPsScroll: null, - - mainMenu: null, - - // Internal variables - _curStyle: null, - _styleEl: null, - _resizeTimeout: null, - _resizeCallback: null, - _transitionCallback: null, - _transitionCallbackTimeout: null, - _listeners: [], - _initialized: false, - _autoUpdate: false, - _lastWindowHeight: 0, - - // ******************************************************************************* - // * Utilities - - // --- - // Scroll To Active Menu Item - _scrollToActive(animate = false, duration = 500) { - const layoutMenu = this.getLayoutMenu() - - if (!layoutMenu) return - - let activeEl = layoutMenu.querySelector('li.menu-item.active:not(.open)') - - if (activeEl) { - // t = current time - // b = start value - // c = change in value - // d = duration - const easeInOutQuad = (t, b, c, d) => { - t /= d / 2 - if (t < 1) return (c / 2) * t * t + b - t -= 1 - return (-c / 2) * (t * (t - 2) - 1) + b - } - - const element = this.getLayoutMenu().querySelector('.menu-inner') - - if (typeof activeEl === 'string') { - activeEl = document.querySelector(activeEl) - } - if (typeof activeEl !== 'number') { - activeEl = activeEl.getBoundingClientRect().top + element.scrollTop - } - - // If active element's top position is less than 2/3 (66%) of menu height than do not scroll - if (activeEl < parseInt((element.clientHeight * 2) / 3, 10)) return - - const start = element.scrollTop - const change = activeEl - start - parseInt(element.clientHeight / 2, 10) - const startDate = +new Date() - - if (animate === true) { - const animateScroll = () => { - const currentDate = +new Date() - const currentTime = currentDate - startDate - const val = easeInOutQuad(currentTime, start, change, duration) - element.scrollTop = val - if (currentTime < duration) { - requestAnimationFrame(animateScroll) - } else { - element.scrollTop = change - } - } - animateScroll() - } else { - element.scrollTop = change - } - } - }, - - // --- - // Add classes - _addClass(cls, el = this.ROOT_EL) { - if (el.length !== undefined) { - // Add classes to multiple elements - el.forEach(e => { - cls.split(' ').forEach(c => e.classList.add(c)) - }) - } else { - // Add classes to single element - cls.split(' ').forEach(c => el.classList.add(c)) - } - }, - - // --- - // Remove classes - _removeClass(cls, el = this.ROOT_EL) { - if (el.length !== undefined) { - // Remove classes to multiple elements - el.forEach(e => { - cls.split(' ').forEach(c => e.classList.remove(c)) - }) - } else { - // Remove classes to single element - cls.split(' ').forEach(c => el.classList.remove(c)) - } - }, - - // Toggle classes - _toggleClass(el = this.ROOT_EL, cls1, cls2) { - if (el.classList.contains(cls1)) { - el.classList.replace(cls1, cls2) - } else { - el.classList.replace(cls2, cls1) - } - }, - - // --- - // Has class - _hasClass(cls, el = this.ROOT_EL) { - let result = false - - cls.split(' ').forEach(c => { - if (el.classList.contains(c)) result = true - }) - - return result - }, - - _findParent(el, cls) { - if ((el && el.tagName.toUpperCase() === 'BODY') || el.tagName.toUpperCase() === 'HTML') return null - el = el.parentNode - while (el && el.tagName.toUpperCase() !== 'BODY' && !el.classList.contains(cls)) { - el = el.parentNode - } - el = el && el.tagName.toUpperCase() !== 'BODY' ? el : null - return el - }, - - // --- - // Trigger window event - _triggerWindowEvent(name) { - if (typeof window === 'undefined') return - - if (document.createEvent) { - let event - - if (typeof Event === 'function') { - event = new Event(name) - } else { - event = document.createEvent('Event') - event.initEvent(name, false, true) - } - - window.dispatchEvent(event) - } else { - window.fireEvent(`on${name}`, document.createEventObject()) - } - }, - - // --- - // Trigger event - _triggerEvent(name) { - this._triggerWindowEvent(`layout${name}`) - - this._listeners.filter(listener => listener.event === name).forEach(listener => listener.callback.call(null)) - }, - - // --- - // Update style - _updateInlineStyle(navbarHeight = 0, footerHeight = 0) { - if (!this._styleEl) { - this._styleEl = document.createElement('style') - this._styleEl.type = 'text/css' - document.head.appendChild(this._styleEl) - } - - const newStyle = INLINE_STYLES.replace(/\{navbarHeight\}/gi, navbarHeight).replace( - /\{footerHeight\}/gi, - footerHeight - ) - - if (this._curStyle !== newStyle) { - this._curStyle = newStyle - this._styleEl.textContent = newStyle - } - }, - - // --- - // Remove style - _removeInlineStyle() { - if (this._styleEl) document.head.removeChild(this._styleEl) - this._styleEl = null - this._curStyle = null - }, - - // --- - // Redraw layout menu (Safari bugfix) - _redrawLayoutMenu() { - const layoutMenu = this.getLayoutMenu() - - if (layoutMenu && layoutMenu.querySelector('.menu')) { - const inner = layoutMenu.querySelector('.menu-inner') - const { scrollTop } = inner - const pageScrollTop = document.documentElement.scrollTop - - layoutMenu.style.display = 'none' - // layoutMenu.offsetHeight - layoutMenu.style.display = '' - inner.scrollTop = scrollTop - document.documentElement.scrollTop = pageScrollTop - - return true - } - - return false - }, - - // --- - // Check for transition support - _supportsTransitionEnd() { - if (window.QUnit) return false - - const el = document.body || document.documentElement - - if (!el) return false - - let result = false - TRANS_PROPERTIES.forEach(evnt => { - if (typeof el.style[evnt] !== 'undefined') result = true - }) - - return result - }, - - // --- - // Calculate current navbar height - _getNavbarHeight() { - const layoutNavbar = this.getLayoutNavbar() - - if (!layoutNavbar) return 0 - if (!this.isSmallScreen()) return layoutNavbar.getBoundingClientRect().height - - // Needs some logic to get navbar height on small screens - - const clonedEl = layoutNavbar.cloneNode(true) - clonedEl.id = null - clonedEl.style.visibility = 'hidden' - clonedEl.style.position = 'absolute' - - Array.prototype.slice.call(clonedEl.querySelectorAll('.collapse.show')).forEach(el => this._removeClass('show', el)) - - layoutNavbar.parentNode.insertBefore(clonedEl, layoutNavbar) - - const navbarHeight = clonedEl.getBoundingClientRect().height - - clonedEl.parentNode.removeChild(clonedEl) - - return navbarHeight - }, - - // --- - // Get current footer height - _getFooterHeight() { - const layoutFooter = this.getLayoutFooter() - - if (!layoutFooter) return 0 - - return layoutFooter.getBoundingClientRect().height - }, - - // --- - // Get animation duration of element - _getAnimationDuration(el) { - const duration = window.getComputedStyle(el).transitionDuration - - return parseFloat(duration) * (duration.indexOf('ms') !== -1 ? 1 : 1000) - }, - - // --- - // Set menu hover state - _setMenuHoverState(hovered) { - this[hovered ? '_addClass' : '_removeClass']('layout-menu-hover') - }, - - // --- - // Toggle collapsed - _setCollapsed(collapsed) { - if (this.isSmallScreen()) { - if (collapsed) { - this._removeClass('layout-menu-expanded') - } else { - setTimeout( - () => { - this._addClass('layout-menu-expanded') - }, - this._redrawLayoutMenu() ? 5 : 0 - ) - } - } - }, - - // --- - // Add layout sivenav toggle animationEnd event - _bindLayoutAnimationEndEvent(modifier, cb) { - const menu = this.getMenu() - const duration = menu ? this._getAnimationDuration(menu) + 50 : 0 - - if (!duration) { - modifier.call(this) - cb.call(this) - return - } - - this._transitionCallback = e => { - if (e.target !== menu) return - this._unbindLayoutAnimationEndEvent() - cb.call(this) - } - - TRANS_EVENTS.forEach(e => { - menu.addEventListener(e, this._transitionCallback, false) - }) - - modifier.call(this) - - this._transitionCallbackTimeout = setTimeout(() => { - this._transitionCallback.call(this, { target: menu }) - }, duration) - }, - - // --- - // Remove layout sivenav toggle animationEnd event - _unbindLayoutAnimationEndEvent() { - const menu = this.getMenu() - - if (this._transitionCallbackTimeout) { - clearTimeout(this._transitionCallbackTimeout) - this._transitionCallbackTimeout = null - } - - if (menu && this._transitionCallback) { - TRANS_EVENTS.forEach(e => { - menu.removeEventListener(e, this._transitionCallback, false) - }) - } - - if (this._transitionCallback) { - this._transitionCallback = null - } - }, - - // --- - // Bind delayed window resize event - _bindWindowResizeEvent() { - this._unbindWindowResizeEvent() - - const cb = () => { - if (this._resizeTimeout) { - clearTimeout(this._resizeTimeout) - this._resizeTimeout = null - } - this._triggerEvent('resize') - } - - this._resizeCallback = () => { - if (this._resizeTimeout) clearTimeout(this._resizeTimeout) - this._resizeTimeout = setTimeout(cb, this.RESIZE_DELAY) - } - - window.addEventListener('resize', this._resizeCallback, false) - }, - - // --- - // Unbind delayed window resize event - _unbindWindowResizeEvent() { - if (this._resizeTimeout) { - clearTimeout(this._resizeTimeout) - this._resizeTimeout = null - } - - if (this._resizeCallback) { - window.removeEventListener('resize', this._resizeCallback, false) - this._resizeCallback = null - } - }, - - _bindMenuMouseEvents() { - if (this._menuMouseEnter && this._menuMouseLeave && this._windowTouchStart) return - - const layoutMenu = this.getLayoutMenu() - if (!layoutMenu) return this._unbindMenuMouseEvents() - - if (!this._menuMouseEnter) { - this._menuMouseEnter = () => { - if (this.isSmallScreen() || this._hasClass('layout-transitioning')) { - return this._setMenuHoverState(false) - } - - return this._setMenuHoverState(false) - } - layoutMenu.addEventListener('mouseenter', this._menuMouseEnter, false) - layoutMenu.addEventListener('touchstart', this._menuMouseEnter, false) - } - - if (!this._menuMouseLeave) { - this._menuMouseLeave = () => { - this._setMenuHoverState(false) - } - layoutMenu.addEventListener('mouseleave', this._menuMouseLeave, false) - } - - if (!this._windowTouchStart) { - this._windowTouchStart = e => { - if (!e || !e.target || !this._findParent(e.target, '.layout-menu')) { - this._setMenuHoverState(false) - } - } - window.addEventListener('touchstart', this._windowTouchStart, true) - } - }, - - _unbindMenuMouseEvents() { - if (!this._menuMouseEnter && !this._menuMouseLeave && !this._windowTouchStart) return - - const layoutMenu = this.getLayoutMenu() - - if (this._menuMouseEnter) { - if (layoutMenu) { - layoutMenu.removeEventListener('mouseenter', this._menuMouseEnter, false) - layoutMenu.removeEventListener('touchstart', this._menuMouseEnter, false) - } - this._menuMouseEnter = null - } - - if (this._menuMouseLeave) { - if (layoutMenu) { - layoutMenu.removeEventListener('mouseleave', this._menuMouseLeave, false) - } - this._menuMouseLeave = null - } - - if (this._windowTouchStart) { - if (layoutMenu) { - window.addEventListener('touchstart', this._windowTouchStart, true) - } - this._windowTouchStart = null - } - - this._setMenuHoverState(false) - }, - - // ******************************************************************************* - // * Methods - - scrollToActive(animate = false) { - this._scrollToActive(animate) - }, - - // --- - // Collapse / expand layout - setCollapsed(collapsed = requiredParam('collapsed'), animate = true) { - const layoutMenu = this.getLayoutMenu() - - if (!layoutMenu) return - - this._unbindLayoutAnimationEndEvent() - - if (animate && this._supportsTransitionEnd()) { - this._addClass('layout-transitioning') - if (collapsed) this._setMenuHoverState(false) - - this._bindLayoutAnimationEndEvent( - () => { - // Collapse / Expand - if (this.isSmallScreen) this._setCollapsed(collapsed) - }, - () => { - this._removeClass('layout-transitioning') - this._triggerWindowEvent('resize') - this._triggerEvent('toggle') - this._setMenuHoverState(false) - } - ) - } else { - this._addClass('layout-no-transition') - if (collapsed) this._setMenuHoverState(false) - - // Collapse / Expand - this._setCollapsed(collapsed) - - setTimeout(() => { - this._removeClass('layout-no-transition') - this._triggerWindowEvent('resize') - this._triggerEvent('toggle') - this._setMenuHoverState(false) - }, 1) - } - }, - - // --- - // Toggle layout - toggleCollapsed(animate = true) { - this.setCollapsed(!this.isCollapsed(), animate) - }, - - // --- - // Set layout positioning - setPosition(fixed = requiredParam('fixed'), offcanvas = requiredParam('offcanvas')) { - this._removeClass('layout-menu-offcanvas layout-menu-fixed layout-menu-fixed-offcanvas') - - if (!fixed && offcanvas) { - this._addClass('layout-menu-offcanvas') - } else if (fixed && !offcanvas) { - this._addClass('layout-menu-fixed') - this._redrawLayoutMenu() - } else if (fixed && offcanvas) { - this._addClass('layout-menu-fixed-offcanvas') - this._redrawLayoutMenu() - } - - this.update() - }, - - // ******************************************************************************* - // * Getters - - getLayoutMenu() { - return document.querySelector('.layout-menu') - }, - - getMenu() { - const layoutMenu = this.getLayoutMenu() - - if (!layoutMenu) return null - - return !this._hasClass('menu', layoutMenu) ? layoutMenu.querySelector('.menu') : layoutMenu - }, - - getLayoutNavbar() { - return document.querySelector('.layout-navbar') - }, - - getLayoutFooter() { - return document.querySelector('.content-footer') - }, - - // ******************************************************************************* - // * Update - - update() { - if ( - (this.getLayoutNavbar() && - ((!this.isSmallScreen() && this.isLayoutNavbarFull() && this.isFixed()) || this.isNavbarFixed())) || - (this.getLayoutFooter() && this.isFooterFixed()) - ) { - this._updateInlineStyle(this._getNavbarHeight(), this._getFooterHeight()) - } - - this._bindMenuMouseEvents() - }, - - setAutoUpdate(enable = requiredParam('enable')) { - if (enable && !this._autoUpdate) { - this.on('resize.Helpers:autoUpdate', () => this.update()) - this._autoUpdate = true - } else if (!enable && this._autoUpdate) { - this.off('resize.Helpers:autoUpdate') - this._autoUpdate = false - } - }, - - // ******************************************************************************* - // * Tests - - isRtl() { - return ( - document.querySelector('body').getAttribute('dir') === 'rtl' || - document.querySelector('html').getAttribute('dir') === 'rtl' - ) - }, - - isMobileDevice() { - return typeof window.orientation !== 'undefined' || navigator.userAgent.indexOf('IEMobile') !== -1 - }, - - isSmallScreen() { - return ( - (window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth) < this.LAYOUT_BREAKPOINT - ) - }, - - isLayoutNavbarFull() { - return !!document.querySelector('.layout-wrapper.layout-navbar-full') - }, - - isCollapsed() { - if (this.isSmallScreen()) { - return !this._hasClass('layout-menu-expanded') - } - return this._hasClass('layout-menu-collapsed') - }, - - isFixed() { - return this._hasClass('layout-menu-fixed layout-menu-fixed-offcanvas') - }, - - isNavbarFixed() { - return ( - this._hasClass('layout-navbar-fixed') || (!this.isSmallScreen() && this.isFixed() && this.isLayoutNavbarFull()) - ) - }, - - isFooterFixed() { - return this._hasClass('layout-footer-fixed') - }, - - isLightStyle() { - return document.documentElement.classList.contains('light-style') - }, - - // ******************************************************************************* - // * Events - - on(event = requiredParam('event'), callback = requiredParam('callback')) { - const [_event] = event.split('.') - let [, ...namespace] = event.split('.') - // let [_event, ...namespace] = event.split('.') - namespace = namespace.join('.') || null - - this._listeners.push({ event: _event, namespace, callback }) - }, - - off(event = requiredParam('event')) { - const [_event] = event.split('.') - let [, ...namespace] = event.split('.') - namespace = namespace.join('.') || null - - this._listeners - .filter(listener => listener.event === _event && listener.namespace === namespace) - .forEach(listener => this._listeners.splice(this._listeners.indexOf(listener), 1)) - }, - - // ******************************************************************************* - // * Life cycle - - init() { - if (this._initialized) return - this._initialized = true - - // Initialize `style` element - this._updateInlineStyle(0) - - // Bind window resize event - this._bindWindowResizeEvent() - - // Bind init event - this.off('init._Helpers') - this.on('init._Helpers', () => { - this.off('resize._Helpers:redrawMenu') - this.on('resize._Helpers:redrawMenu', () => { - // eslint-disable-next-line no-unused-expressions - this.isSmallScreen() && !this.isCollapsed() && this._redrawLayoutMenu() - }) - - // Force repaint in IE 10 - if (typeof document.documentMode === 'number' && document.documentMode < 11) { - this.off('resize._Helpers:ie10RepaintBody') - this.on('resize._Helpers:ie10RepaintBody', () => { - if (this.isFixed()) return - const { scrollTop } = document.documentElement - document.body.style.display = 'none' - // document.body.offsetHeight - document.body.style.display = 'block' - document.documentElement.scrollTop = scrollTop - }) - } - }) - - this._triggerEvent('init') - }, - - destroy() { - if (!this._initialized) return - this._initialized = false - - this._removeClass('layout-transitioning') - this._removeInlineStyle() - this._unbindLayoutAnimationEndEvent() - this._unbindWindowResizeEvent() - this._unbindMenuMouseEvents() - this.setAutoUpdate(false) - - this.off('init._Helpers') - - // Remove all listeners except `init` - this._listeners - .filter(listener => listener.event !== 'init') - .forEach(listener => this._listeners.splice(this._listeners.indexOf(listener), 1)) - }, - - // --- - // Init Password Toggle - initPasswordToggle() { - const toggler = document.querySelectorAll('.form-password-toggle i') - if (typeof toggler !== 'undefined' && toggler !== null) { - toggler.forEach(el => { - el.addEventListener('click', e => { - e.preventDefault() - const formPasswordToggle = el.closest('.form-password-toggle') - const formPasswordToggleIcon = formPasswordToggle.querySelector('i') - const formPasswordToggleInput = formPasswordToggle.querySelector('input') - - if (formPasswordToggleInput.getAttribute('type') === 'text') { - formPasswordToggleInput.setAttribute('type', 'password') - formPasswordToggleIcon.classList.replace('bx-show', 'bx-hide') - } else if (formPasswordToggleInput.getAttribute('type') === 'password') { - formPasswordToggleInput.setAttribute('type', 'text') - formPasswordToggleIcon.classList.replace('bx-hide', 'bx-show') - } - }) - }) - } - }, - - // --- - // Init Speech To Text - initSpeechToText() { - const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition - const speechToText = document.querySelectorAll('.speech-to-text') - if (SpeechRecognition !== undefined && SpeechRecognition !== null) { - if (typeof speechToText !== 'undefined' && speechToText !== null) { - const recognition = new SpeechRecognition() - const toggler = document.querySelectorAll('.speech-to-text i') - toggler.forEach(el => { - let listening = false - el.addEventListener('click', () => { - el.closest('.input-group').querySelector('.form-control').focus() - recognition.onspeechstart = () => { - listening = true - } - if (listening === false) { - recognition.start() - } - recognition.onerror = () => { - listening = false - } - recognition.onresult = event => { - el.closest('.input-group').querySelector('.form-control').value = event.results[0][0].transcript - } - recognition.onspeechend = () => { - listening = false - recognition.stop() - } - }) - }) - } - } - }, - - // Ajax Call Promise - ajaxCall(url) { - return new Promise((resolve, reject) => { - const req = new XMLHttpRequest() - req.open('GET', url) - req.onload = () => (req.status === 200 ? resolve(req.response) : reject(Error(req.statusText))) - req.onerror = e => reject(Error(`Network Error: ${e}`)) - req.send() - }) - }, - - // --- - // SidebarToggle (Used in Apps) - initSidebarToggle() { - const sidebarToggler = document.querySelectorAll('[data-bs-toggle="sidebar"]') - - sidebarToggler.forEach(el => { - el.addEventListener('click', () => { - const target = el.getAttribute('data-target') - const overlay = el.getAttribute('data-overlay') - const appOverlay = document.querySelectorAll('.app-overlay') - const targetEl = document.querySelectorAll(target) - - targetEl.forEach(tel => { - tel.classList.toggle('show') - if ( - typeof overlay !== 'undefined' && - overlay !== null && - overlay !== false && - typeof appOverlay !== 'undefined' - ) { - if (tel.classList.contains('show')) { - appOverlay[0].classList.add('show') - } else { - appOverlay[0].classList.remove('show') - } - appOverlay[0].addEventListener('click', e => { - e.currentTarget.classList.remove('show') - tel.classList.remove('show') - }) - } - }) - }) - }) - } -} - -// ******************************************************************************* -// * Initialization - -if (typeof window !== 'undefined') { - Helpers.init() - - if (Helpers.isMobileDevice() && window.chrome) { - document.documentElement.classList.add('layout-menu-100vh') - } - - // Update layout after page load - if (document.readyState === 'complete') Helpers.update() - else - document.addEventListener('DOMContentLoaded', function onContentLoaded() { - Helpers.update() - document.removeEventListener('DOMContentLoaded', onContentLoaded) - }) -} - -// --- -export { Helpers } diff --git a/js/menu.js b/js/menu.js deleted file mode 100644 index 5537b2b7b7c80441d6e6ccbb93ed21461c03907e..0000000000000000000000000000000000000000 --- a/js/menu.js +++ /dev/null @@ -1,589 +0,0 @@ -const TRANSITION_EVENTS = ['transitionend', 'webkitTransitionEnd', 'oTransitionEnd'] -// const TRANSITION_PROPERTIES = ['transition', 'MozTransition', 'webkitTransition', 'WebkitTransition', 'OTransition'] - -class Menu { - constructor(el, config = {}, _PS = null) { - this._el = el - this._animate = config.animate !== false - this._accordion = config.accordion !== false - this._closeChildren = Boolean(config.closeChildren) - - this._onOpen = config.onOpen || (() => {}) - this._onOpened = config.onOpened || (() => {}) - this._onClose = config.onClose || (() => {}) - this._onClosed = config.onClosed || (() => {}) - - this._psScroll = null - this._topParent = null - this._menuBgClass = null - - el.classList.add('menu') - el.classList[this._animate ? 'remove' : 'add']('menu-no-animation') // check - - el.classList.add('menu-vertical') - - const PerfectScrollbarLib = _PS || window.PerfectScrollbar - - if (PerfectScrollbarLib) { - this._scrollbar = new PerfectScrollbarLib(el.querySelector('.menu-inner'), { - suppressScrollX: true, - wheelPropagation: !Menu._hasClass('layout-menu-fixed layout-menu-fixed-offcanvas') - }) - - window.Helpers.menuPsScroll = this._scrollbar - } else { - el.querySelector('.menu-inner').classList.add('overflow-auto') - } - - // Add data attribute for bg color class of menu - const menuClassList = el.classList - - for (let i = 0; i < menuClassList.length; i++) { - if (menuClassList[i].startsWith('bg-')) { - this._menuBgClass = menuClassList[i] - } - } - el.setAttribute('data-bg-class', this._menuBgClass) - - this._bindEvents() - - // Link menu instance to element - el.menuInstance = this - } - - _bindEvents() { - // Click Event - this._evntElClick = e => { - // Find top parent element - if (e.target.closest('ul') && e.target.closest('ul').classList.contains('menu-inner')) { - const menuItem = Menu._findParent(e.target, 'menu-item', false) - - // eslint-disable-next-line prefer-destructuring - if (menuItem) this._topParent = menuItem.childNodes[0] - } - - const toggleLink = e.target.classList.contains('menu-toggle') - ? e.target - : Menu._findParent(e.target, 'menu-toggle', false) - - if (toggleLink) { - e.preventDefault() - - if (toggleLink.getAttribute('data-hover') !== 'true') { - this.toggle(toggleLink) - } - } - } - if (window.Helpers.isMobileDevice) this._el.addEventListener('click', this._evntElClick) - - this._evntWindowResize = () => { - this.update() - if (this._lastWidth !== window.innerWidth) { - this._lastWidth = window.innerWidth - this.update() - } - - const horizontalMenuTemplate = document.querySelector("[data-template^='horizontal-menu']") - if (!this._horizontal && !horizontalMenuTemplate) this.manageScroll() - } - window.addEventListener('resize', this._evntWindowResize) - } - - static childOf(/* child node */ c, /* parent node */ p) { - // returns boolean - if (c.parentNode) { - while ((c = c.parentNode) && c !== p); - return !!c - } - return false - } - - _unbindEvents() { - if (this._evntElClick) { - this._el.removeEventListener('click', this._evntElClick) - this._evntElClick = null - } - - if (this._evntElMouseOver) { - this._el.removeEventListener('mouseover', this._evntElMouseOver) - this._evntElMouseOver = null - } - - if (this._evntElMouseOut) { - this._el.removeEventListener('mouseout', this._evntElMouseOut) - this._evntElMouseOut = null - } - - if (this._evntWindowResize) { - window.removeEventListener('resize', this._evntWindowResize) - this._evntWindowResize = null - } - - if (this._evntBodyClick) { - document.body.removeEventListener('click', this._evntBodyClick) - this._evntBodyClick = null - } - - if (this._evntInnerMousemove) { - this._inner.removeEventListener('mousemove', this._evntInnerMousemove) - this._evntInnerMousemove = null - } - - if (this._evntInnerMouseleave) { - this._inner.removeEventListener('mouseleave', this._evntInnerMouseleave) - this._evntInnerMouseleave = null - } - } - - static _isRoot(item) { - return !Menu._findParent(item, 'menu-item', false) - } - - static _findParent(el, cls, throwError = true) { - if (el.tagName.toUpperCase() === 'BODY') return null - el = el.parentNode - while (el.tagName.toUpperCase() !== 'BODY' && !el.classList.contains(cls)) { - el = el.parentNode - } - - el = el.tagName.toUpperCase() !== 'BODY' ? el : null - - if (!el && throwError) throw new Error(`Cannot find \`.${cls}\` parent element`) - - return el - } - - static _findChild(el, cls) { - const items = el.childNodes - const found = [] - - for (let i = 0, l = items.length; i < l; i++) { - if (items[i].classList) { - let passed = 0 - - for (let j = 0; j < cls.length; j++) { - if (items[i].classList.contains(cls[j])) passed += 1 - } - - if (cls.length === passed) found.push(items[i]) - } - } - - return found - } - - static _findMenu(item) { - let curEl = item.childNodes[0] - let menu = null - - while (curEl && !menu) { - if (curEl.classList && curEl.classList.contains('menu-sub')) menu = curEl - curEl = curEl.nextSibling - } - - if (!menu) throw new Error('Cannot find `.menu-sub` element for the current `.menu-toggle`') - - return menu - } - - // Has class - static _hasClass(cls, el = window.Helpers.ROOT_EL) { - let result = false - - cls.split(' ').forEach(c => { - if (el.classList.contains(c)) result = true - }) - - return result - } - - open(el, closeChildren = this._closeChildren) { - const item = this._findUnopenedParent(Menu._getItem(el, true), closeChildren) - - if (!item) return - - const toggleLink = Menu._getLink(item, true) - - Menu._promisify(this._onOpen, this, item, toggleLink, Menu._findMenu(item)) - .then(() => { - if (!this._horizontal || !Menu._isRoot(item)) { - if (this._animate && !this._horizontal) { - window.requestAnimationFrame(() => this._toggleAnimation(true, item, false)) - if (this._accordion) this._closeOther(item, closeChildren) - } else if (this._animate) { - // eslint-disable-next-line no-unused-expressions - this._onOpened && this._onOpened(this, item, toggleLink, Menu._findMenu(item)) - } else { - item.classList.add('open') - // eslint-disable-next-line no-unused-expressions - this._onOpened && this._onOpened(this, item, toggleLink, Menu._findMenu(item)) - if (this._accordion) this._closeOther(item, closeChildren) - } - } else { - // eslint-disable-next-line no-unused-expressions - this._onOpened && this._onOpened(this, item, toggleLink, Menu._findMenu(item)) - } - }) - .catch(() => {}) - } - - close(el, closeChildren = this._closeChildren, _autoClose = false) { - const item = Menu._getItem(el, true) - const toggleLink = Menu._getLink(el, true) - - if (!item.classList.contains('open') || item.classList.contains('disabled')) return - - Menu._promisify(this._onClose, this, item, toggleLink, Menu._findMenu(item), _autoClose) - .then(() => { - if (!this._horizontal || !Menu._isRoot(item)) { - if (this._animate && !this._horizontal) { - window.requestAnimationFrame(() => this._toggleAnimation(false, item, closeChildren)) - } else { - item.classList.remove('open') - - if (closeChildren) { - const opened = item.querySelectorAll('.menu-item.open') - for (let i = 0, l = opened.length; i < l; i++) opened[i].classList.remove('open') - } - - // eslint-disable-next-line no-unused-expressions - this._onClosed && this._onClosed(this, item, toggleLink, Menu._findMenu(item)) - } - } else { - // eslint-disable-next-line no-unused-expressions - this._onClosed && this._onClosed(this, item, toggleLink, Menu._findMenu(item)) - } - }) - .catch(() => {}) - } - - _closeOther(item, closeChildren) { - const opened = Menu._findChild(item.parentNode, ['menu-item', 'open']) - - for (let i = 0, l = opened.length; i < l; i++) { - if (opened[i] !== item) this.close(opened[i], closeChildren) - } - } - - toggle(el, closeChildren = this._closeChildren) { - const item = Menu._getItem(el, true) - // const toggleLink = Menu._getLink(el, true) - - if (item.classList.contains('open')) this.close(item, closeChildren) - else this.open(item, closeChildren) - } - - static _getItem(el, toggle) { - let item = null - const selector = toggle ? 'menu-toggle' : 'menu-link' - - if (el.classList.contains('menu-item')) { - if (Menu._findChild(el, [selector]).length) item = el - } else if (el.classList.contains(selector)) { - item = el.parentNode.classList.contains('menu-item') ? el.parentNode : null - } - - if (!item) { - throw new Error(`${toggle ? 'Toggable ' : ''}\`.menu-item\` element not found.`) - } - - return item - } - - static _getLink(el, toggle) { - let found = [] - const selector = toggle ? 'menu-toggle' : 'menu-link' - - if (el.classList.contains(selector)) found = [el] - else if (el.classList.contains('menu-item')) found = Menu._findChild(el, [selector]) - - if (!found.length) throw new Error(`\`${selector}\` element not found.`) - - return found[0] - } - - _findUnopenedParent(item, closeChildren) { - let tree = [] - let parentItem = null - - while (item) { - if (item.classList.contains('disabled')) { - parentItem = null - tree = [] - } else { - if (!item.classList.contains('open')) parentItem = item - tree.push(item) - } - - item = Menu._findParent(item, 'menu-item', false) - } - - if (!parentItem) return null - if (tree.length === 1) return parentItem - - tree = tree.slice(0, tree.indexOf(parentItem)) - - for (let i = 0, l = tree.length; i < l; i++) { - tree[i].classList.add('open') - - if (this._accordion) { - const openedItems = Menu._findChild(tree[i].parentNode, ['menu-item', 'open']) - - for (let j = 0, k = openedItems.length; j < k; j++) { - if (openedItems[j] !== tree[i]) { - openedItems[j].classList.remove('open') - - if (closeChildren) { - const openedChildren = openedItems[j].querySelectorAll('.menu-item.open') - for (let x = 0, z = openedChildren.length; x < z; x++) { - openedChildren[x].classList.remove('open') - } - } - } - } - } - } - - return parentItem - } - - _toggleAnimation(open, item, closeChildren) { - const toggleLink = Menu._getLink(item, true) - const menu = Menu._findMenu(item) - - Menu._unbindAnimationEndEvent(item) - - const linkHeight = Math.round(toggleLink.getBoundingClientRect().height) - - item.style.overflow = 'hidden' - - const clearItemStyle = () => { - item.classList.remove('menu-item-animating') - item.classList.remove('menu-item-closing') - item.style.overflow = null - item.style.height = null - - this.update() - } - - if (open) { - item.style.height = `${linkHeight}px` - item.classList.add('menu-item-animating') - item.classList.add('open') - - Menu._bindAnimationEndEvent(item, () => { - clearItemStyle() - this._onOpened(this, item, toggleLink, menu) - }) - - setTimeout(() => { - item.style.height = `${linkHeight + Math.round(menu.getBoundingClientRect().height)}px` - }, 50) - } else { - item.style.height = `${linkHeight + Math.round(menu.getBoundingClientRect().height)}px` - item.classList.add('menu-item-animating') - item.classList.add('menu-item-closing') - - Menu._bindAnimationEndEvent(item, () => { - item.classList.remove('open') - clearItemStyle() - - if (closeChildren) { - const opened = item.querySelectorAll('.menu-item.open') - for (let i = 0, l = opened.length; i < l; i++) opened[i].classList.remove('open') - } - - this._onClosed(this, item, toggleLink, menu) - }) - - setTimeout(() => { - item.style.height = `${linkHeight}px` - }, 50) - } - } - - static _bindAnimationEndEvent(el, handler) { - const cb = e => { - if (e.target !== el) return - Menu._unbindAnimationEndEvent(el) - handler(e) - } - - let duration = window.getComputedStyle(el).transitionDuration - duration = parseFloat(duration) * (duration.indexOf('ms') !== -1 ? 1 : 1000) - - el._menuAnimationEndEventCb = cb - TRANSITION_EVENTS.forEach(ev => el.addEventListener(ev, el._menuAnimationEndEventCb, false)) - - el._menuAnimationEndEventTimeout = setTimeout(() => { - cb({ target: el }) - }, duration + 50) - } - - _getItemOffset(item) { - let curItem = this._inner.childNodes[0] - let left = 0 - - while (curItem !== item) { - if (curItem.tagName) { - left += Math.round(curItem.getBoundingClientRect().width) - } - - curItem = curItem.nextSibling - } - - return left - } - - static _promisify(fn, ...args) { - const result = fn(...args) - if (result instanceof Promise) { - return result - } - if (result === false) { - return Promise.reject() - } - return Promise.resolve() - } - - get _innerWidth() { - const items = this._inner.childNodes - let width = 0 - - for (let i = 0, l = items.length; i < l; i++) { - if (items[i].tagName) { - width += Math.round(items[i].getBoundingClientRect().width) - } - } - - return width - } - - get _innerPosition() { - return parseInt(this._inner.style[this._rtl ? 'marginRight' : 'marginLeft'] || '0px', 10) - } - - set _innerPosition(value) { - this._inner.style[this._rtl ? 'marginRight' : 'marginLeft'] = `${value}px` - return value - } - - static _unbindAnimationEndEvent(el) { - const cb = el._menuAnimationEndEventCb - - if (el._menuAnimationEndEventTimeout) { - clearTimeout(el._menuAnimationEndEventTimeout) - el._menuAnimationEndEventTimeout = null - } - - if (!cb) return - - TRANSITION_EVENTS.forEach(ev => el.removeEventListener(ev, cb, false)) - el._menuAnimationEndEventCb = null - } - - closeAll(closeChildren = this._closeChildren) { - const opened = this._el.querySelectorAll('.menu-inner > .menu-item.open') - - for (let i = 0, l = opened.length; i < l; i++) this.close(opened[i], closeChildren) - } - - static setDisabled(el, disabled) { - Menu._getItem(el, false).classList[disabled ? 'add' : 'remove']('disabled') - } - - static isActive(el) { - return Menu._getItem(el, false).classList.contains('active') - } - - static isOpened(el) { - return Menu._getItem(el, false).classList.contains('open') - } - - static isDisabled(el) { - return Menu._getItem(el, false).classList.contains('disabled') - } - - update() { - if (this._scrollbar) { - this._scrollbar.update() - } - } - - manageScroll() { - const { PerfectScrollbar } = window - const menuInner = document.querySelector('.menu-inner') - - if (window.innerWidth < window.Helpers.LAYOUT_BREAKPOINT) { - if (this._scrollbar !== null) { - // window.Helpers.menuPsScroll.destroy() - this._scrollbar.destroy() - this._scrollbar = null - } - menuInner.classList.add('overflow-auto') - } else { - if (this._scrollbar === null) { - const menuScroll = new PerfectScrollbar(document.querySelector('.menu-inner'), { - suppressScrollX: true, - wheelPropagation: false - }) - this._scrollbar = menuScroll - } - menuInner.classList.remove('overflow-auto') - } - } - - destroy() { - if (!this._el) return - - this._unbindEvents() - - const items = this._el.querySelectorAll('.menu-item') - for (let i = 0, l = items.length; i < l; i++) { - Menu._unbindAnimationEndEvent(items[i]) - items[i].classList.remove('menu-item-animating') - items[i].classList.remove('open') - items[i].style.overflow = null - items[i].style.height = null - } - - const menus = this._el.querySelectorAll('.menu-menu') - for (let i2 = 0, l2 = menus.length; i2 < l2; i2++) { - menus[i2].style.marginRight = null - menus[i2].style.marginLeft = null - } - - this._el.classList.remove('menu-no-animation') - - if (this._wrapper) { - this._prevBtn.parentNode.removeChild(this._prevBtn) - this._nextBtn.parentNode.removeChild(this._nextBtn) - this._wrapper.parentNode.insertBefore(this._inner, this._wrapper) - this._wrapper.parentNode.removeChild(this._wrapper) - this._inner.style.marginLeft = null - this._inner.style.marginRight = null - } - - this._el.menuInstance = null - delete this._el.menuInstance - - this._el = null - this._animate = null - this._accordion = null - this._closeChildren = null - this._onOpen = null - this._onOpened = null - this._onClose = null - this._onClosed = null - if (this._scrollbar) { - this._scrollbar.destroy() - this._scrollbar = null - } - this._inner = null - this._prevBtn = null - this._wrapper = null - this._nextBtn = null - } -} - -export { Menu } diff --git a/scss/_bootstrap-extended.scss b/scss/_bootstrap-extended.scss deleted file mode 100644 index b9b22a2d00cded21a90d36f693b1bd37940a8205..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended.scss +++ /dev/null @@ -1,39 +0,0 @@ -@import '_bootstrap-extended/include'; - -// Import bootstrap extended scss -@import '_bootstrap-extended/root'; -@import '_bootstrap-extended/reboot'; -@import '_bootstrap-extended/type'; -@import '_bootstrap-extended/utilities'; -@import '_bootstrap-extended/tables'; -@import '_bootstrap-extended/buttons'; -@import '_bootstrap-extended/button-group'; -@import '_bootstrap-extended/badge'; -@import '_bootstrap-extended/dropdown'; -@import '_bootstrap-extended/nav'; -@import '_bootstrap-extended/pagination'; -@import '_bootstrap-extended/alert'; -@import '_bootstrap-extended/tooltip'; -@import '_bootstrap-extended/popover'; -@import '_bootstrap-extended/forms'; -@import '_bootstrap-extended/modal'; -@import '_bootstrap-extended/progress'; -@import '_bootstrap-extended/breadcrumb'; -@import '_bootstrap-extended/list-group'; -@import '_bootstrap-extended/navbar'; -@import '_bootstrap-extended/card'; -@import '_bootstrap-extended/accordion'; -@import '_bootstrap-extended/close'; -@import '_bootstrap-extended/toasts'; -@import '_bootstrap-extended/carousel'; -@import '_bootstrap-extended/spinners'; -@import '_bootstrap-extended/offcanvas'; - -// Common Utilities -@import '../node_modules/bootstrap/scss/utilities/api'; - -// LTR Utilities -@include ltr-only { - @import '_bootstrap-extended/utilities-ltr'; - @import '../node_modules/bootstrap/scss/utilities/api'; -} diff --git a/scss/_bootstrap-extended/_accordion.scss b/scss/_bootstrap-extended/_accordion.scss deleted file mode 100644 index de06f4ec3bfac3e3fcf5a72a173c73e23f6582e1..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_accordion.scss +++ /dev/null @@ -1,56 +0,0 @@ -// Accordions -// ******************************************************************************* - -.accordion-header + .accordion-collapse .accordion-body { - padding-top: 0; -} - -.accordion { - // accordion without icon - &.accordion-without-arrow { - .accordion-button::after { - background-image: none !important; - } - } - // Active accordion box shadow - .accordion-item.active { - box-shadow: $floating-component-shadow; - } -} - -// added box shadow -.card.accordion-item { - box-shadow: $box-shadow-sm; -} - -.accordion-button.collapsed:focus { - box-shadow: none; -} -.accordion-button { - box-shadow: none; -} - -.accordion-header { - line-height: 1.54; -} - -.accordion-item { - &:not(:first-of-type) { - border-top: $accordion-border-width solid $accordion-border-color; - } -} - -// Accordion border radius -.accordion-button { - font-weight: inherit; - @include border-top-radius($accordion-border-radius); - &.collapsed { - @include border-radius($accordion-border-radius); - } -} - -// Default card styles of accordion -.accordion > .card:not(:last-of-type) { - border-radius: $accordion-border-radius !important; - margin-bottom: 0.6875rem; -} diff --git a/scss/_bootstrap-extended/_alert.scss b/scss/_bootstrap-extended/_alert.scss deleted file mode 100644 index e3e60e56d0ec8e52a93b766acbd9da7ecef8930c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_alert.scss +++ /dev/null @@ -1,9 +0,0 @@ -// Alerts -// ******************************************************************************* - -// Alert mixins -@each $state, $value in $theme-colors { - @if $state != primary and $state != light { - @include template-alert-variant('.alert-#{$state}', $value); - } -} diff --git a/scss/_bootstrap-extended/_badge.scss b/scss/_bootstrap-extended/_badge.scss deleted file mode 100644 index 9c18c1b14934315355fdf322f2f78fe86bdb87c0..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_badge.scss +++ /dev/null @@ -1,18 +0,0 @@ -// Badges -// ******************************************************************************* -.badge { - text-transform: uppercase; - line-height: $badge-line-height; -} - -// Badge Center Style - -.badge-center { - display: inline-flex; - justify-content: center; - align-items: center; - @include badge-size($badge-height, $badge-width, $badge-font-size); - i { - font-size: 0.8rem; - } -} diff --git a/scss/_bootstrap-extended/_breadcrumb.scss b/scss/_bootstrap-extended/_breadcrumb.scss deleted file mode 100644 index adbea4065bda6f964ef44b72ad8203c66fe09354..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_breadcrumb.scss +++ /dev/null @@ -1,47 +0,0 @@ -// Breadcrumbs -// ******************************************************************************* - -.breadcrumb-item, -.breadcrumb-item a { - color: $breadcrumb-color; - - &:hover, - &:focus { - color: $breadcrumb-active-color; - } - - &.active { - font-weight: $font-weight-semibold; - &::before { - font-weight: $font-weight-normal; - } - } -} - -.breadcrumb-item.active a { - &, - &:hover, - &:focus, - &:active { - color: inherit; - } -} - -// Breadcrumb divider styles -.breadcrumb-style1, -.breadcrumb-style2 { - .breadcrumb-item + .breadcrumb-item::before { - font-family: boxicons; - vertical-align: middle; - } -} -.breadcrumb-style1 .breadcrumb-item + .breadcrumb-item::before { - content: '\ecb3'; - font-size: 1.125rem; - line-height: 1.4; -} -.breadcrumb-style2 .breadcrumb-item + .breadcrumb-item::before { - content: '\ee4a'; - font-size: $font-size-lg; - line-height: 1.35rem; -} diff --git a/scss/_bootstrap-extended/_button-group.scss b/scss/_bootstrap-extended/_button-group.scss deleted file mode 100644 index a084e3d596d57681e20fa7afd9bda580165d2d43..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_button-group.scss +++ /dev/null @@ -1,59 +0,0 @@ -// Button groups -// ******************************************************************************* - -// * Split button -// ******************************************************************************* - -.dropdown-toggle-split, -.btn-lg + .dropdown-toggle-split, -.btn-group-lg > .btn + .dropdown-toggle-split, -.input-group-lg .btn + .dropdown-toggle-split, -.btn-xl + .dropdown-toggle-split, -.btn-group-xl > .btn + .dropdown-toggle-split { - padding-right: 0.7em; - padding-left: 0.7em; -} - -.btn-sm + .dropdown-toggle-split, -.btn-group-sm > .btn + .dropdown-toggle-split, -.input-group-sm .btn + .dropdown-toggle-split { - padding-right: 0.6em; - padding-left: 0.6em; -} - -.btn-xs + .dropdown-toggle-split, -.btn-group-xs > .btn + .dropdown-toggle-split { - padding-right: 0.5em; - padding-left: 0.5em; -} - -// * Sizing -// ******************************************************************************* - -.btn-group-xs > .btn { - @extend .btn-xs; -} - -.btn-group-xl > .btn { - @extend .btn-xl; -} - -// Button groups border - -.btn-group > .btn-group:first-child > .btn:not([class*='btn-outline-']):first-child, -.input-group > .btn:not([class*='btn-outline-']):first-child, -:not(.btn-group):not(.input-group) > .btn-group > .btn:not([class*='btn-outline-']):first-child, -.input-group > .btn-group:first-child > .btn:not([class*='btn-outline-']):first-child { - @include ltr-style { - border-left-color: transparent; - } -} - -.btn-group > .btn-group:last-child > .btn:not([class*='btn-outline-']):last-of-type, -.input-group > .btn:not([class*='btn-outline-']):last-of-type, -:not(.btn-group):not(.input-group) > .btn-group > .btn:not([class*='btn-outline-']):last-of-type, -.input-group > .btn-group:last-child > .btn:not([class*='btn-outline-']):last-of-type { - @include ltr-style { - border-right-color: transparent; - } -} diff --git a/scss/_bootstrap-extended/_buttons.scss b/scss/_bootstrap-extended/_buttons.scss deleted file mode 100644 index fe6eb41b46ed3c487a104e6ac68fd5e74dfdde42..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_buttons.scss +++ /dev/null @@ -1,111 +0,0 @@ -// Buttons -// ******************************************************************************* - -.btn { - cursor: pointer; - &.disabled, - &:disabled { - cursor: default; - } -} - -// Badge within button -.btn .badge { - @include transition($btn-transition); -} - -label.btn { - margin-bottom: 0; -} - -// Button Sizes - -.btn-xl { - @include button-size($btn-padding-y-xl, $btn-padding-x-xl, $btn-font-size-xl, $btn-border-radius-xl); -} - -.btn-xs { - @include button-size($btn-padding-y-xs, $btn-padding-x-xs, $btn-font-size-xs, $btn-border-radius-xs); -} - -// Buttons Variant - -@each $color, $value in $theme-colors { - @if $color != primary { - @include template-button-variant('.btn-#{$color}', $value); - @include template-button-outline-variant('.btn-outline-#{$color}', $value); - } -} - -// Icon button - -.btn-icon { - $btn-icon-size: ($btn-font-size * $btn-line-height) + ($btn-padding-y * 2); - $btn-icon-size-xl: ($btn-font-size-xl * $btn-line-height-xl) + ($btn-padding-y-xl * 2); - $btn-icon-size-lg: ($btn-font-size-lg * $btn-line-height-lg) + ($btn-padding-y-lg * 2); - $btn-icon-size-sm: ($btn-font-size-sm * $btn-line-height-sm) + ($btn-padding-y-sm * 2); - $btn-icon-size-xs: ($btn-font-size-xs * $btn-line-height-xs) + ($btn-padding-y-xs * 2); - $borders-width: $btn-border-width * 2; - - padding: 0; - width: calc(#{$btn-icon-size} + #{$borders-width}); - height: calc(#{$btn-icon-size} + #{$borders-width}); - display: inline-flex; - flex-shrink: 0; - justify-content: center; - align-items: center; - - &.btn-xl { - width: calc(#{$btn-icon-size-xl} + #{$borders-width}); - height: calc(#{$btn-icon-size-xl} + #{$borders-width}); - > span { - font-size: $btn-font-size-xl; - } - } - - &.btn-lg { - width: calc(#{$btn-icon-size-lg} + #{$borders-width}); - height: calc(#{$btn-icon-size-lg} + #{$borders-width}); - font-size: $btn-font-size-lg; - } - - &.btn-sm { - width: calc(#{$btn-icon-size-sm} + #{$borders-width}); - height: calc(#{$btn-icon-size-sm} + #{$borders-width}); - font-size: $btn-font-size-sm; - } - - &.btn-xs { - width: calc(#{$btn-icon-size-xs} + #{$borders-width}); - height: calc(#{$btn-icon-size-xs} + #{$borders-width}); - font-size: $btn-font-size-xs; - } -} - -// Without border - -.btn.borderless { - &:not(.active):not(:active):not(:hover):not(:focus), - :not(.show) > &.dropdown-toggle:not(:hover):not(:focus) { - border-color: transparent; - box-shadow: none; - } -} - -// Link buttons -.btn.btn-link { - font-size: inherit; -} - -.btn-pinned { - position: absolute; - top: 0.75rem; - @include ltr-style { - right: 0.75rem; - } -} - -// Button focus -button:focus { - outline: none; -} diff --git a/scss/_bootstrap-extended/_card.scss b/scss/_bootstrap-extended/_card.scss deleted file mode 100644 index 7cb0f950f76208bd2c58bbcac3abe9388cededd9..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_card.scss +++ /dev/null @@ -1,185 +0,0 @@ -// Cards -// ******************************************************************************* - -.card { - background-clip: padding-box; - box-shadow: $card-box-shadow; - .card-link { - display: inline-block; - } - // ! FIX: to remove padding top from first card-body if used with card-header - .card-header + .card-body, - .card-header + .card-content > .card-body:first-of-type { - padding-top: 0; - } -} - -// Card action -.card-action { - // Expand card(fullscreen) - &.card-fullscreen { - display: block; - z-index: 9999; - position: fixed; - width: 100% !important; - height: 100% !important; - top: 0; - right: 0; - left: 0; - bottom: 0; - overflow: auto; - border: none; - border-radius: 0; - } - // Alert - .card-alert { - position: absolute; - width: 100%; - z-index: 999; - .alert { - border-bottom-right-radius: 0px; - border-bottom-left-radius: 0px; - } - } - // Collapsed - .card-header { - &.collapsed { - border-bottom: 0; - } - } - - // Card header - .card-header { - display: flex; - line-height: $component-line-height; - .card-action-title { - flex-grow: 1; - margin-right: 0.5rem; - } - .card-action-element { - flex-shrink: 0; - background-color: inherit; - top: 1rem; - right: 1.5rem; - color: $body-color; - a { - color: $body-color; - .collapse-icon::after { - margin-top: -0.15rem; - } - } - } - } - // Block UI loader - .blockUI { - .sk-fold { - margin: 0 auto; - } - h5 { - color: $body-color; - margin: 1rem 0 0 0; - } - } -} - -// Card inner borders -.card-header, -.card-footer { - border-color: $card-inner-border-color; -} -.card hr { - color: $card-inner-border-color; -} - -.card .row-bordered > [class*=' col '], -.card .row-bordered > [class^='col '], -.card .row-bordered > [class*=' col-'], -.card .row-bordered > [class^='col-'], -.card .row-bordered > [class='col'] { - .card .row-bordered > [class$=' col'], - &::before, - &::after { - border-color: $card-inner-border-color; - } -} - -//Card header elements -.card-header.header-elements, -.card-title.header-elements { - display: flex; - width: 100%; - align-items: center; - flex-wrap: wrap; -} - -.card-header { - &.card-header-elements { - padding-top: $card-spacer-y * 0.5; - padding-bottom: $card-spacer-y * 0.5; - } - .card-header-elements { - padding-top: 0.25rem; - padding-bottom: 0.25rem; - } -} - -.card-header-elements, -.card-title-elements { - display: flex; - flex-wrap: wrap; - align-items: center; - & + &, - > * + * { - margin-left: 0.25rem; - } -} - -// * Horizontal card radius issue fix -.card-img-left { - @include border-start-radius($card-inner-border-radius); - @include border-end-radius(0); - @include media-breakpoint-down(md) { - @include border-top-radius($card-inner-border-radius); - @include border-bottom-radius(0); - } -} - -.card-img-right { - @include border-end-radius($card-inner-border-radius); - @include border-start-radius(0); - @include media-breakpoint-down(md) { - @include border-bottom-radius($card-inner-border-radius); - @include border-top-radius(0); - } -} - -// List groups -// ******************************************************************************* - -.card > .list-group .list-group-item { - padding-left: $card-spacer-x; - padding-right: $card-spacer-x; -} - -// Card Statistics specific separator -// ******************************************************************************* -.card { - .card-separator { - @include ltr-style { - border-right: $border-width solid $card-border-color; - } - } -} - -@include media-breakpoint-down(md) { - .card { - .card-separator { - border-bottom: $border-width solid $card-border-color; - padding-bottom: $card-spacer-y; - - @include ltr-style { - border-right-width: 0 !important; - } - } - } -} diff --git a/scss/_bootstrap-extended/_carousel.scss b/scss/_bootstrap-extended/_carousel.scss deleted file mode 100644 index b3cb8914e2682268b60ccfacf9e78d5366115b72..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_carousel.scss +++ /dev/null @@ -1,42 +0,0 @@ -// Carousel -// ******************************************************************************* - -// -.carousel { - .carousel-item.active, - .carousel-item.carousel-item-start { - h1, - .h1, - h2, - .h2, - h3, - .h3, - h4, - .h4, - h5, - .h5, - h6, - .h6 { - color: $carousel-caption-color; - } - } -} -.carousel.carousel-dark { - .carousel-item.active, - .carousel-item.carousel-item-start { - h1, - .h1, - h2, - .h2, - h3, - .h3, - h4, - .h4, - h5, - .h5, - h6, - .h6 { - color: $carousel-dark-caption-color; - } - } -} diff --git a/scss/_bootstrap-extended/_close.scss b/scss/_bootstrap-extended/_close.scss deleted file mode 100644 index a596c63f73fa6267ecab20a749fba8f4fd289240..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_close.scss +++ /dev/null @@ -1,6 +0,0 @@ -// Close buttons -// ******************************************************************************* - -.close:focus { - outline: 0; -} diff --git a/scss/_bootstrap-extended/_dropdown.scss b/scss/_bootstrap-extended/_dropdown.scss deleted file mode 100644 index 129f79c0f8debd3e0e71a217d3247f3401324dbe..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_dropdown.scss +++ /dev/null @@ -1,66 +0,0 @@ -// Dropdowns -// ***************************************************************** - -// On hover outline -[data-trigger='hover'] { - outline: 0; -} - -.dropdown-menu { - margin: $dropdown-spacer 0; - box-shadow: $dropdown-box-shadow; - // Animations - animation: dropdownAnimation 0.1s; - - // Mega dropdown inside the dropdown menu - .mega-dropdown > & { - left: 0 !important; - right: 0 !important; - } - - // Badge within dropdown menu - .badge[class^='float-'], - .badge[class*=' float-'] { - position: relative; - top: 0.071em; - } -} -// Dropdown item line height -.dropdown-item { - line-height: $dropdown-link-line-height; -} - -// Hidden dropdown toggle arrow -.dropdown-toggle.hide-arrow, -.dropdown-toggle-hide-arrow > .dropdown-toggle { - &::before, - &::after { - display: none; - } -} - -// Dropdown caret icon - -@if $enable-caret { - // Dropdown arrow - .dropdown-toggle::after { - @include caret-down; - } - // Dropend arrow - .dropend .dropdown-toggle::after { - @include caret-right; - } - // Dropstart arrow - .dropstart .dropdown-toggle::before { - @include caret-left; - } - // Dropup arrow - .dropup .dropdown-toggle::after { - @include caret-up; - } - - .dropstart .dropdown-toggle::before, - .dropend .dropdown-toggle::after { - vertical-align: $caret-vertical-align; - } -} diff --git a/scss/_bootstrap-extended/_forms.scss b/scss/_bootstrap-extended/_forms.scss deleted file mode 100644 index e497bedfd4496355729aca7dd78993388a2297e2..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_forms.scss +++ /dev/null @@ -1,10 +0,0 @@ -// Forms -// ***************************************************************** - -@import 'forms/labels'; -@import 'forms/form-control'; -@import 'forms/form-select'; -@import 'forms/form-range'; -@import 'forms/input-group'; -@import 'forms/floating-labels'; -@import 'forms/validation'; diff --git a/scss/_bootstrap-extended/_functions.scss b/scss/_bootstrap-extended/_functions.scss deleted file mode 100644 index 6fa747c8a549d097a1bb191d25a3e3f3c7f5bce7..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_functions.scss +++ /dev/null @@ -1,147 +0,0 @@ -// Functions -// ******************************************************************************* - -// Lists -// ******************************************************************************* -@function slice-list($list, $start: 1, $end: length($list)) { - $result: null; - - @if type-of($start) != number or type-of($end) != number { - @warn "Either $start or $end are not a number for `slice`."; - } @else if $start > $end { - @warn "The start index has to be lesser than or equals to the end index for `slice`."; - } @else if $start < 1 or $end < 1 { - @warn "List indexes must be non-zero integers for `slice`."; - } @else if $start > length($list) { - @warn "List index is #{$start} but list is only #{length($list)} item long for `slice`."; - } @else if $end > length($list) { - @warn "List index is #{$end} but list is only #{length($list)} item long for `slice`."; - } @else { - $result: (); - - @for $i from $start through $end { - $result: append($result, nth($list, $i)); - } - } - - @return $result; -} - -// * Units -// ******************************************************************************* - -// Remove the unit of a length -@function strip-unit($number) { - @if type-of($number) == 'number' and not unitless($number) { - @return divide($number, ($number * 0 + 1)); - } - - @return $number; -} - -// Convert size px to rem -@function px-to-rem($value) { - // Assumes the browser default font size = `16px` - @return (divide(strip-unit($value), 16)) * 1rem; -} - -// Convert size rem to px -@function rem-to-px($value) { - // Assumes the browser default font size = `16px` - @return (strip-unit($value) * 16) * 1px; -} - -// * Colors -// ******************************************************************************* - -// ? Override shade, tint and shift function with custom background color option i.e $card-bg to make it similar like design -// Shade a color: mix a color with background/white -@function tint-color($color, $weight, $background: null) { - $background: if($background, $background, white); - @return mix($background, $color, $weight); -} - -// Shade a color: mix a color with background/black -@function shade-color($color, $weight, $background: null) { - $background: if($background, $background, black); - @return mix($background, $color, $weight); -} - -// Shade the color if the weight is positive, else tint it -@function shift-color($color, $weight, $background: null) { - @return if($weight > 0, shade-color($color, $weight, $background), tint-color($color, -$weight)); -} - -//RGBA to HEX -@function rgba-to-hex($color, $background: #fff) { - @if $color and alpha($color) != 1 { - $percent: alpha($color) * 100%; - $opaque: opacify($color, 1); - - @return mix($opaque, $background, $percent); - } @else { - @return $color; - } -} - -// Calculating Color Contrast -@function contrast-value($color) { - @if $color == transparent { - @return $body-color; - } @else if alpha($color) != 1 { - $color: rgba-to-hex($color); - } - - $r: red($color); - $g: green($color); - $b: blue($color); - - @return divide((($r * 299) + ($g * 587) + ($b * 114)), 1000); -} - -// * Utilities -// ******************************************************************************* - -// Return Nav opacity, contrast-percent, contrast-percent-inverted, bg, color, active-color, disabled-color, muted-color, border -@function get-navbar-prop($bg, $active-color: null, $inactive-color: null, $border: null) { - $bg: rgba-to-hex($bg); - - $active-color: rgba-to-hex($active-color); - $active-color: if($active-color, $active-color, color-contrast($bg)); - - $contrast-percent: divide(contrast-value($bg), 255); - $contrast-percent-inverted: 1 - $contrast-percent; - - $opacity: if($active-color == #fff, 0.6 + (0.4 * $contrast-percent), 0.6 + (0.4 * (1 - $contrast-percent))); - - $color: if( - $inactive-color, - rgba-to-hex($inactive-color, $bg), - rgba-to-hex(rgba($active-color, if($contrast-percent < 0.25, $opacity + 0.2, $opacity)), $bg) - ); - $disabled-color: rgba-to-hex(rgba($color, 0.6), $bg); - $muted-color: rgba-to-hex(rgba($color, 0.75), $bg); - $border: if( - $border, - $border, - if( - $contrast-percent > 0.75, - rgba($active-color, divide($opacity, 8)), - if($contrast-percent < 0.25, rgba($active-color, 0.06), rgba($active-color, 0.15)) - ) - ); - - @return ( - // Metadata - opacity: $opacity, - contrast-percent: $contrast-percent, - contrast-percent-inverted: $contrast-percent-inverted, - // Colors - bg: $bg, - color: $color, - active-color: $active-color, - disabled-color: $disabled-color, - muted-color: $muted-color, - border: $border - ); -} diff --git a/scss/_bootstrap-extended/_include.scss b/scss/_bootstrap-extended/_include.scss deleted file mode 100644 index df909c2b4c901898deffed3957a8cec964608226..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_include.scss +++ /dev/null @@ -1,12 +0,0 @@ -//Functions -@import '../../node_modules/bootstrap/scss/functions'; // Bootstrap core functions -@import 'functions'; // Bootstrap extended functions - -//Variables -@import '../_custom-variables/bootstrap-extended'; // Bootstrap extended custom variable (for customization purpose) -@import 'variables'; // Bootstrap extended variable -@import '../../node_modules/bootstrap/scss/variables'; // Bootstrap core variable - -//Mixins -@import '../../node_modules/bootstrap/scss/mixins'; // Bootstrap core mixins -@import 'mixins'; // Bootstrap extended mixins diff --git a/scss/_bootstrap-extended/_list-group.scss b/scss/_bootstrap-extended/_list-group.scss deleted file mode 100644 index f95f400a1f8f75cfe6e5f07b10593758b14b3170..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_list-group.scss +++ /dev/null @@ -1,58 +0,0 @@ -// List groups -// ******************************************************************************* - -// List Group Mixin -@each $color, $value in $theme-colors { - @if $color != primary and $color != light { - @include template-list-group-item-variant('.list-group-item-#{$color}', $value); - } -} - -.list-group { - // Timeline CSS - &.list-group-timeline { - position: relative; - &:before { - background-color: $border-color; - position: absolute; - content: ''; - width: 1px; - height: 100%; - top: 0; - bottom: 0; - left: 0.2rem; - } - .list-group-item { - border: none; - padding-left: 1.25rem; - &:before { - position: absolute; - display: block; - content: ''; - width: 7px; - height: 7px; - left: 0; - top: 50%; - margin-top: -3.5px; - border-radius: 100%; - } - } - } - - .list-group-item.active { - h1, - .h1, - h2, - .h2, - h3, - .h3, - h4, - .h4, - h5, - .h5, - h6, - .h6 { - color: $list-group-active-color; - } - } -} diff --git a/scss/_bootstrap-extended/_mixins.scss b/scss/_bootstrap-extended/_mixins.scss deleted file mode 100644 index b96cc3e884a6a6f4295856eeca5d128b23bfeb80..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_mixins.scss +++ /dev/null @@ -1,16 +0,0 @@ -// Mixins -// -// Template mixins (custom and overrides) -@import 'mixins/alert'; -@import 'mixins/badge'; -@import 'mixins/buttons'; -@import 'mixins/list-group'; -@import 'mixins/navs'; -@import 'mixins/pagination'; -@import 'mixins/progress'; -@import 'mixins/toasts'; -@import 'mixins/caret'; -@import 'mixins/dropdown'; -@import 'mixins/forms'; -@import 'mixins/table-variants'; -@import 'mixins/misc'; // layout, text directions & colors diff --git a/scss/_bootstrap-extended/_modal.scss b/scss/_bootstrap-extended/_modal.scss deleted file mode 100644 index 1eba7d56634675887ce6c6a5222910ed43df88fc..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_modal.scss +++ /dev/null @@ -1,110 +0,0 @@ -// Modals -// ******************************************************************************* - -// Modal Shadow -.modal-content { - box-shadow: $modal-content-box-shadow-xs; -} - -// Modal Header close btn style -.modal { - .btn-close { - background-color: $white; - border-radius: $border-radius-lg; - opacity: 1; - padding: 0.635rem; - box-shadow: $box-shadow-sm; - transition: all 0.23s ease 0.1s; - - @include ltr-style { - transform: translate(23px, -25px); - } - - // For hover effect of close btn - &:hover, - &:focus, - &:active { - opacity: 1; - outline: none; - - @include ltr-style { - transform: translate(20px, -20px); - } - } - } - .modal-header { - .btn-close { - margin-top: -1.25rem; - } - } -} - -// modal footer -.modal-footer { - padding: $modal-footer-padding; -} - -// ! remove close button animation & shadow for .modal-dialog-scrollable, .modal-fullscreen, .modal-top modal -.modal-dialog-scrollable, -.modal-fullscreen, -.modal-top { - .btn-close { - box-shadow: none; - @include ltr-style { - transform: translate(0, 0) !important; - } - - &:hover { - @include ltr-style { - transform: translate(0, 0) !important; - } - } - } -} - -// Top modals -// ******************************************************************************* - -.modal-top { - .modal-dialog { - margin-top: 0; - } - - .modal-content { - @include border-top-radius(0); - } -} - -// Responsive -// ******************************************************************************* - -@include media-breakpoint-down(lg) { - .modal-onboarding .onboarding-horizontal { - flex-direction: column; - } -} -@include media-breakpoint-down(md) { - .modal { - .modal-dialog:not(.modal-fullscreen) { - padding: 0 0.75rem; - padding-left: 0.75rem !important; - } - .carousel-control-prev, - .carousel-control-next { - display: none; - } - } -} -@include media-breakpoint-up(sm) { - .modal-content { - box-shadow: $modal-content-box-shadow-sm-up; - } - .modal-sm .modal-dialog { - max-width: $modal-sm; - } -} -@include media-breakpoint-up(xl) { - .modal-xl .modal-dialog { - max-width: $modal-xl; - } -} diff --git a/scss/_bootstrap-extended/_nav.scss b/scss/_bootstrap-extended/_nav.scss deleted file mode 100644 index 873988cada716a9465e95f74b9d01b7bf6adb2f7..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_nav.scss +++ /dev/null @@ -1,313 +0,0 @@ -// Nav -// ******************************************************************************* - -.nav .nav-item, -.nav .nav-link, -.tab-pane, -.tab-pane .card-body { - outline: none !important; -} - -.nav-tabs { - .nav-item { - .nav-link { - color: $nav-tabs-btn-color; - border: 0; - border-radius: 0; - &:hover, - &:focus { - color: $nav-tabs-btn-color; - } - &:not(.active) { - background-color: $nav-tabs-btn-bg; - } - &.disabled { - color: $nav-link-disabled-color; - } - } - } -} - -// Tab and pills style -.nav-tabs, -.nav-pills { - &:not(.nav-fill):not(.nav-justified) .nav-link { - width: 100%; - } -} - -.nav-pills .nav-link { - &:not(.active, .disabled) { - color: $headings-color; - } -} - -.tab-content { - padding: $card-spacer-y; - border-radius: $border-radius; -} - -// For scrollable navs/tabs/pills -.nav-scrollable { - display: -webkit-inline-box; - display: -moz-inline-box; - width: 100%; - overflow-y: auto; - flex-wrap: nowrap; -} - -// Tab link -.nav-tabs .nav-link { - background-clip: padding-box; - &.active { - border-bottom-color: $nav-tabs-link-active-bg; - &:hover, - &:focus { - border-bottom-color: $nav-tabs-link-active-bg; - } - } - &:hover, - &:focus { - border-bottom-color: transparent; - } -} - -// Sizing -// ******************************************************************************* - -.nav-sm { - @include template-nav-size($nav-link-padding-y-sm, $nav-link-padding-x-sm, $font-size-sm, $nav-link-line-height-sm); -} -.nav-lg { - @include template-nav-size($nav-link-padding-y-lg, $nav-link-padding-x-lg, $font-size-lg, $nav-link-line-height-lg); -} - -// Top, Right, Bottom & Left Tabbed panels -// ******************************************************************************* - -.nav-align-top, -.nav-align-right, -.nav-align-bottom, -.nav-align-left { - display: flex; - - > .nav, - > div > .nav { - border: 0; - z-index: 1; - position: relative; - } - - > .nav .nav-link, - > div > .nav .nav-link { - &:hover, - &:focus { - isolation: auto; - } - } - - .row-bordered > [class^='col-'], - .row-bordered > [class*=' col-'], - .row-bordered > [class^='col '], - .row-bordered > [class*=' col '], - .row-bordered > [class$=' col'], - .row-bordered > [class='col'] { - &::before, - &::after { - border-color: $card-inner-border-color; - } - } -} - -.nav-align-right, -.nav-align-left { - align-items: stretch; - - > .nav, - > div > .nav { - flex-grow: 0; - flex-direction: column; - } - - > .tab-content { - flex-grow: 1; - } -} - -// Top tabs -.nav-align-top { - flex-direction: column; - .nav-tabs { - ~ .tab-content { - z-index: 1; - box-shadow: 0px 6px 7px -1px rgba($black, 0.12); - } - .nav-item { - @include ltr-style { - &:first-child .nav-link { - border-top-left-radius: $border-radius; - } - &:last-child .nav-link { - border-top-right-radius: $border-radius; - } - &:not(:first-child) .nav-link { - border-left: 1px solid $nav-tabs-border-color; - } - } - } - .nav-link { - &.active { - box-shadow: $card-box-shadow; - } - } - } -} - -// Right tabs -.nav-align-right { - flex-direction: row-reverse; - - > .nav .nav-item, - > div > .nav .nav-item { - margin-left: -1px; - margin-bottom: 0; - } - .nav-link { - text-align: right; - } - - .nav-tabs { - ~ .tab-content { - box-shadow: $card-box-shadow; - } - .nav-item { - &:not(:first-child) .nav-link { - border-top: 1px solid $nav-tabs-border-color; - } - @include ltr-style { - &:first-child .nav-link { - border-top-right-radius: $border-radius; - } - &:last-child .nav-link { - border-bottom-right-radius: $border-radius; - } - } - } - .nav-link { - &.active { - @include ltr-style { - box-shadow: 5px 4px 6px 0 rgba($black, 0.12); - } - } - } - } -} - -// Bottom tabs -.nav-align-bottom { - flex-direction: column-reverse; - - > .nav .nav-item, - > div > .nav .nav-item { - margin-bottom: 0; - margin-top: -1px; - } - - .nav-tabs { - ~ .tab-content { - box-shadow: $card-box-shadow; - } - .nav-item { - @include ltr-style { - &:first-child .nav-link { - border-bottom-left-radius: $border-radius; - } - &:last-child .nav-link { - border-bottom-right-radius: $border-radius; - } - &:not(:first-child) .nav-link { - border-left: 1px solid $nav-tabs-border-color; - } - } - } - .nav-link { - &.active { - box-shadow: 0 4px 6px 0 rgba($black, 0.12); - } - } - } -} - -// Left tabs -.nav-align-left { - > .nav .nav-item, - > div > .nav .nav-item { - margin-right: -1px; - margin-bottom: 0; - } - .nav-link { - text-align: left; - } - .nav-tabs { - ~ .tab-content { - box-shadow: $card-box-shadow; - } - .nav-item { - &:not(:first-child) .nav-link { - border-top: 1px solid $nav-tabs-border-color; - } - @include ltr-style { - &:first-child .nav-link { - border-top-left-radius: $border-radius; - } - &:last-child .nav-link { - border-bottom-left-radius: $border-radius; - } - } - } - .nav-link { - &.active { - @include ltr-style { - box-shadow: -5px 2px 6px 0 rgba($black, 0.12); - } - } - } - } -} - -// Tab content -.nav-align-top > .tab-content, -.nav-align-right > .tab-content, -.nav-align-bottom > .tab-content, -.nav-align-left > .tab-content { - flex-shrink: 1; - border: $card-border-width solid $border-color; - box-shadow: $card-box-shadow; - background-clip: padding-box; - background: $nav-tabs-link-active-bg; -} - -.nav-align-top :not(.nav-pills) ~ .tab-content { - @include border-radius(0 0 $border-radius $border-radius); -} -.nav-align-top .nav-tabs:not(.nav-fill) ~ .tab-content { - @include ltr-style { - @include border-top-end-radius($border-radius); - } -} - -.nav-align-right :not(.nav-pills) ~ .tab-content { - @include border-radius($border-radius 0 0 $border-radius); -} - -.nav-align-bottom :not(.nav-pills) ~ .tab-content { - @include border-radius($border-radius $border-radius 0 0); -} - -.nav-align-left :not(.nav-pills) ~ .tab-content { - @include border-radius(0 $border-radius $border-radius 0); -} - -.nav-align-left > .tab-content { - @include border-radius(0 $border-radius $border-radius $border-radius); -} diff --git a/scss/_bootstrap-extended/_navbar.scss b/scss/_bootstrap-extended/_navbar.scss deleted file mode 100644 index 66f27895fde3514f7ead498ec0b6584c66c67436..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_navbar.scss +++ /dev/null @@ -1,58 +0,0 @@ -// Navbar -// ******************************************************************************* - -.navbar { - z-index: 2; - // ! Fix: navbar dropdown focus outline - .dropdown:focus, - .dropdown-toggle:focus { - outline: 0; - } - .navbar-toggler { - border: none; - } - .navbar-toggler:focus { - box-shadow: none; - } -} - -.fixed-top { - z-index: $zindex-fixed; -} - -.navbar.navbar-light { - color: $navbar-light-color; -} - -.navbar-light .navbar-nav .nav-link.disabled { - color: $navbar-light-disabled-color !important; -} - -.navbar.navbar-dark { - color: $navbar-dark-color; -} - -.navbar-dark .navbar-nav .nav-link.disabled { - color: $navbar-dark-disabled-color !important; -} - -// IE fix -.navbar-collapse, -.navbar-brand, -.navbar-text { - flex-shrink: 1; -} - -// Icons -// .navbar-icon { -// font-size: 130%; -// } - -// Rulers -.navbar-dark hr { - border-color: rgba(255, 255, 255, 0.1); -} - -.navbar-light hr { - border-color: $gray-100; -} diff --git a/scss/_bootstrap-extended/_offcanvas.scss b/scss/_bootstrap-extended/_offcanvas.scss deleted file mode 100644 index e0dd0162fa725ca56cd7376316221557d4443426..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_offcanvas.scss +++ /dev/null @@ -1,10 +0,0 @@ -// Offcanvas -// ******************************************************************************* - -.offcanvas-header { - padding-bottom: $offcanvas-padding-y / 2; -} - -.offcanvas-body { - padding-top: $offcanvas-padding-y / 2; -} diff --git a/scss/_bootstrap-extended/_pagination.scss b/scss/_bootstrap-extended/_pagination.scss deleted file mode 100644 index e9113d99bbe1dfb747738aaf39900a9d39d00c39..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_pagination.scss +++ /dev/null @@ -1,92 +0,0 @@ -// Pagination -// ******************************************************************************* - -// Pagination next, prev, first & last css padding -.page-item { - &.first, - &.last, - &.next, - &.prev, - &.previous { - .page-link { - padding-top: $pagination-padding-y - 0.125rem; - padding-bottom: $pagination-padding-y - 0.125rem; - } - } - &.disabled { - .page-link { - border-color: $pagination-border-color; - } - } - &.active { - .page-link { - margin: 0 0.1rem 0 0.3rem; - } - } -} - -// Pagination basic style -.page-link, -.page-link > a { - @include border-radius($border-radius); - - line-height: $pagination-line-height; - text-align: center; - min-width: calc( - #{'#{($font-size-base * $pagination-line-height) + ($pagination-padding-y * 2)} + #{$pagination-border-width * 2}'} - ); - - &:focus { - color: $pagination-hover-color; - } -} - -.page-link.btn-primary { - box-shadow: none !important; -} - -// Sizing -// ******************************************************************************* - -// Pagination Large -.pagination-lg .page-link, -.pagination-lg > li > a:not(.page-link) { - min-width: calc( - #{'#{($font-size-lg * $pagination-line-height) + ($pagination-padding-y-lg * 2)} + #{$pagination-border-width * 2}'} - ); -} -.pagination-lg > .page-item { - &.first, - &.last, - &.next, - &.prev, - &.previous { - .page-link { - padding-top: $pagination-padding-y-lg - 0.0845rem; - padding-bottom: $pagination-padding-y-lg - 0.0845rem; - } - } -} - -// Pagination Small -.pagination-sm .page-link, -.pagination-sm > li > a:not(.page-link) { - min-width: calc( - #{'#{($font-size-sm * $pagination-line-height) + ($pagination-padding-y-sm * 2)} + #{$pagination-border-width * 2}'} - ); - .tf-icon { - font-size: $font-size-base; - } -} -.pagination-sm > .page-item { - &.first, - &.last, - &.next, - &.prev, - &.previous { - .page-link { - padding-top: $pagination-padding-y-sm - 0.075rem; - padding-bottom: $pagination-padding-y-sm - 0.075rem; - } - } -} diff --git a/scss/_bootstrap-extended/_popover.scss b/scss/_bootstrap-extended/_popover.scss deleted file mode 100644 index 0789ad8e8787ffbd1da23ecd1825a63ac675661c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_popover.scss +++ /dev/null @@ -1,29 +0,0 @@ -// Popovers -// ******************************************************************************* - -.modal-open .popover { - z-index: $zindex-modal + 1; -} - -.popover { - box-shadow: $popover-box-shadow; - - .popover-arrow { - z-index: 1; - } - &.bs-popover-bottom > .popover-arrow { - &::after { - border-bottom-color: if(not $dark-style, rgba-to-hex($popover-header-bg), $popover-header-bg); - top: 2px; - } - &:before { - top: 1px; - } - } -} - -// popover header font size override -.popover-header { - padding: $popover-header-padding-x $popover-header-padding-x $popover-header-padding-y; - @include font-size($popover-header-font-size); -} diff --git a/scss/_bootstrap-extended/_progress.scss b/scss/_bootstrap-extended/_progress.scss deleted file mode 100644 index 78de6beb8660fe7ad47457190f85bd8e113bb264..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_progress.scss +++ /dev/null @@ -1,31 +0,0 @@ -// Progress -// ******************************************************************************* - -.progress { - overflow: initial; //revet the default style for box-shadow -} - -// Progress Shadow Variant -@each $color, $value in $theme-colors { - @if $color != primary { - @include template-progress-bar-shadow-variant('.bg-#{$color}', $value); - } -} - -@include ltr-only { - .progress-bar-striped { - @include gradient-striped(rgba($white, 0.07), 45deg); - } - - .progress { - // border radius for first and last child - .progress-bar:last-child { - border-top-right-radius: $progress-border-radius; - border-bottom-right-radius: $progress-border-radius; - } - .progress-bar:first-child { - border-top-left-radius: $progress-border-radius; - border-bottom-left-radius: $progress-border-radius; - } - } -} diff --git a/scss/_bootstrap-extended/_reboot.scss b/scss/_bootstrap-extended/_reboot.scss deleted file mode 100644 index 0445e0e7b44f134840101442c096e1030949c74a..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_reboot.scss +++ /dev/null @@ -1,32 +0,0 @@ -// Reboot -// - -b, -strong { - font-weight: $font-weight-bold; -} - -a:not([href]) { - color: inherit; - text-decoration: none; - - &:hover { - color: inherit; - text-decoration: none; - } -} - -//! Fix: Autofill input bg and text color issue on different OS and browsers -input:-webkit-autofill, -input:-webkit-autofill:hover, -input:-webkit-autofill:focus, -textarea:-webkit-autofill, -textarea:-webkit-autofill:hover, -textarea:-webkit-autofill:focus, -select:-webkit-autofill, -select:-webkit-autofill:hover, -select:-webkit-autofill:focus, -input:-internal-autofill-selected { - background-clip: text !important; - -webkit-background-clip: text !important; -} diff --git a/scss/_bootstrap-extended/_root.scss b/scss/_bootstrap-extended/_root.scss deleted file mode 100644 index 4bbd2bdaf4a72037958c9ac77e17010aa2c16407..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_root.scss +++ /dev/null @@ -1,4 +0,0 @@ -// The color-scheme CSS property https://web.dev/color-scheme/ -:root { - color-scheme: #{$color-scheme}; -} diff --git a/scss/_bootstrap-extended/_spinners.scss b/scss/_bootstrap-extended/_spinners.scss deleted file mode 100644 index df9c4beb017b1b39d16ee4a1abac326fafe58a56..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_spinners.scss +++ /dev/null @@ -1,21 +0,0 @@ -// Spinners -// - -//Large size -.spinner-border-lg { - width: $spinner-width-lg; - height: $spinner-height-lg; - border-width: $spinner-border-width-lg; -} - -.spinner-grow-lg { - width: $spinner-width-lg; - height: $spinner-height-lg; - border-width: $spinner-border-width-lg; -} - -@include keyframes('spinner-border-rtl') { - to { - transform: rotate(-360deg); - } -} diff --git a/scss/_bootstrap-extended/_tables.scss b/scss/_bootstrap-extended/_tables.scss deleted file mode 100644 index 2012344b448da22bfb7339916e032204df79c49d..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_tables.scss +++ /dev/null @@ -1,81 +0,0 @@ -// Tables -// ********************************************************************************/ - -@each $color, $value in $table-variants { - @if $color != primary { - @include template-table-variant($color, $value); - } -} - -// Style for table inside card -.card { - .table { - margin-bottom: 0; - } -} -@supports (-moz-appearance: none) { - .table { - .dropdown-menu.show { - display: inline-table; - } - } -} -// Table heading style -.table { - th { - text-transform: uppercase; - font-size: 0.75rem; - letter-spacing: 1px; - } - &:not(.table-dark) th { - color: $headings-color; - } -} - -.table-border-bottom-0 { - tr:last-child { - td, - th { - border-bottom-width: 0; - } - } -} - -// Dark Table icon button -.table.table-dark .btn.btn-icon { - color: $table-border-color; -} -// .table { -// .btn-group { -// display: block; -// } -// } - -// Flush spacing of left from first column ans right from last column -.table.table-flush-spacing { - thead, - tbody { - tr > td:first-child { - padding-left: 0; - } - tr > td:last-child { - padding-right: 0; - } - } -} - -// * Table inside card -// ******************************************************************************* - -// .card, -.nav-align-top, -.nav-align-right, -.nav-align-bottom, -.nav-align-left { - .table:not(.table-dark), - .table:not(.table-dark) thead:not(.table-dark) th, - .table:not(.table-dark) tfoot:not(.table-dark) th, - .table:not(.table-dark) td { - border-color: $border-inner-color; - } -} diff --git a/scss/_bootstrap-extended/_toasts.scss b/scss/_bootstrap-extended/_toasts.scss deleted file mode 100644 index 183b61c4e6ac7ae26f80285f5ef82c92fcb26ad7..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_toasts.scss +++ /dev/null @@ -1,58 +0,0 @@ -// Toasts -// ******************************************************************************* - -// Toast Mixin -@each $color, $value in $theme-colors { - @if $color != primary { - @include template-toast-variant('.bg-#{$color}', $value); - } -} - -.bs-toast[class^='bg-'], -.bs-toast[class*=' bg-'] { - border: none; -} - -.toast.bs-toast { - background-color: rgba($toast-background-color, $toast-bg-factor); - z-index: $zindex-toast; - .toast-header { - padding-bottom: 0.5rem; - position: relative; - .btn-close { - position: absolute; - top: -8px; - border-radius: $border-radius; - padding: 0.45rem; - background-size: $toast-btn-close-size; - transition: all 0.23s ease 0.1s; - background-color: $toast-background-color; - box-shadow: $box-shadow-sm; - @include ltr-style { - right: 2px; - } - - // For hover effect of close btn - &:hover, - &:focus, - &:active { - opacity: 1; - outline: none; - } - } - } - .toast-header ~ .toast-body { - padding-top: 0; - } -} - -// Bootstrap Toasts Example -.toast-ex { - position: fixed; - top: 4.1rem; - right: 2.5rem; -} -// Placement Toast example -.toast-placement-ex { - position: fixed; -} diff --git a/scss/_bootstrap-extended/_tooltip.scss b/scss/_bootstrap-extended/_tooltip.scss deleted file mode 100644 index 8fbd43920c7283dd90ee9e62ca13e411699f900c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_tooltip.scss +++ /dev/null @@ -1,11 +0,0 @@ -// Tooltips -// ******************************************************************************* - -// Open modal tooltip z-index -.modal-open .tooltip { - z-index: $zindex-modal + 2; -} - -.tooltip-inner { - box-shadow: $tooltip-box-shadow; -} diff --git a/scss/_bootstrap-extended/_type.scss b/scss/_bootstrap-extended/_type.scss deleted file mode 100644 index 6bebc7738928724343163cf9aeb28e3050a76ede..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_type.scss +++ /dev/null @@ -1,2 +0,0 @@ -// Type -// diff --git a/scss/_bootstrap-extended/_utilities-ltr.scss b/scss/_bootstrap-extended/_utilities-ltr.scss deleted file mode 100644 index 3387292dba51f5f0bfd165b48270382363afe95b..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_utilities-ltr.scss +++ /dev/null @@ -1,283 +0,0 @@ -// stylelint-disable indentation - -// Utilities - -// stylelint-disable-next-line scss/dollar-variable-default -$utilities: map-merge( - $utilities, - ( - 'align': null, - 'overflow': null, - 'display': null, - 'shadow': null, - 'position': null, - 'top': null, - 'bottom': null, - 'border': null, - 'border-top': null, - 'border-bottom': null, - 'border-color': null, - 'border-width': null, - 'width': null, - 'max-width': null, - 'viewport-width': null, - 'min-viewport-width': null, - 'height': null, - 'max-height': null, - 'viewport-height': null, - 'min-viewport-height': null, - 'flex': null, - 'flex-direction': null, - 'flex-grow': null, - 'flex-shrink': null, - 'flex-wrap': null, - 'gap': null, - 'justify-content': null, - 'align-items': null, - 'align-content': null, - 'align-self': null, - 'order': null, - 'margin': null, - 'margin-x': null, - 'margin-y': null, - 'margin-top': null, - 'margin-bottom': null, - 'negative-margin': null, - 'negative-margin-x': null, - 'negative-margin-y': null, - 'negative-margin-top': null, - 'negative-margin-bottom': null, - 'padding': null, - 'padding-x': null, - 'padding-y': null, - 'padding-top': null, - 'padding-bottom': null, - 'font-family': null, - 'font-size': null, - 'font-style': null, - 'font-weight': null, - 'line-height': null, - 'text-decoration': null, - 'text-transform': null, - 'white-space': null, - 'word-wrap': null, - 'color': null, - 'background-color': null, - 'transparent': null, - 'gradient': null, - 'user-select': null, - 'pointer-events': null, - 'rounded': null, - 'rounded-top': null, - 'rounded-bottom': null, - 'visibility': null, - 'opacity': null, - 'flex-basis': null, - 'cursor': null, - // scss-docs-start utils-float - 'float': - ( - responsive: true, - property: float, - values: ( - start: left, - end: right, - none: none - ) - ), - // scss-docs-end utils-float - // scss-docs-start utils-position - 'end': - ( - property: right, - class: end, - values: $position-values - ), - 'start': ( - property: left, - class: start, - values: $position-values - ), - 'translate-middle': ( - property: transform, - class: translate-middle, - values: ( - null: translate(-50%, -50%), - x: translateX(-50%), - y: translateY(-50%) - ) - ), - // scss-docs-end utils-position - // scss-docs-start utils-borders - 'border-end': - ( - property: border-right, - class: border-end, - values: ( - null: $border-width solid $border-color, - 0: 0 - ) - ), - 'border-start': ( - property: border-left, - class: border-start, - values: ( - null: $border-width solid $border-color, - 0: 0 - ) - ), - // scss-docs-end utils-borders - // scss-docs-start utils-text - 'text-align': - ( - responsive: true, - property: text-align, - class: text, - values: ( - start: left, - end: right, - center: center - ) - ), - // scss-docs-end utils-text - // scss-docs-start utils-border-radius - 'rounded-end': - ( - property: border-top-right-radius border-bottom-right-radius, - class: rounded-end, - values: ( - null: $border-radius - ) - ), - 'rounded-start': ( - property: border-bottom-left-radius border-top-left-radius, - class: rounded-start, - values: ( - null: $border-radius - ) - ), - 'rounded-start-top': ( - property: border-top-left-radius, - class: rounded-start-top, - values: ( - null: $border-radius - ) - ), - 'rounded-start-bottom': ( - property: border-bottom-left-radius, - class: rounded-start-bottom, - values: ( - null: $border-radius - ) - ), - 'rounded-end-top': ( - property: border-top-right-radius, - class: rounded-end-top, - values: ( - null: $border-radius - ) - ), - 'rounded-end-bottom': ( - property: border-bottom-right-radius, - class: rounded-end-bottom, - values: ( - null: $border-radius - ) - ), - // scss-docs-end utils-border-radius - // Margin utilities - // scss-docs-start utils-spacing - 'margin-end': - ( - responsive: true, - property: margin-right, - class: me, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - 'margin-start': ( - responsive: true, - property: margin-left, - class: ms, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - // Negative margin utilities - 'negative-margin-end': - ( - responsive: true, - property: margin-right, - class: me, - values: $negative-spacers - ), - 'negative-margin-start': ( - responsive: true, - property: margin-left, - class: ms, - values: $negative-spacers - ), - // Padding utilities - 'padding-end': - ( - responsive: true, - property: padding-right, - class: pe, - values: $spacers - ), - 'padding-start': ( - responsive: true, - property: padding-left, - class: ps, - values: $spacers - ), - // scss-docs-end utils-spacing - // Custom Utilities - // ******************************************************************************* - // scss-docs-start utils-rotate - 'rotate': - ( - property: transform, - class: rotate, - values: ( - 0: rotate(0deg), - 90: rotate(90deg), - 180: rotate(180deg), - 270: rotate(270deg), - n90: rotate(-90deg), - n180: rotate(-180deg), - n270: rotate(-270deg) - ) - ), - // scss-docs-end utils-rotate - // scss-docs-start utils-scaleX - 'scaleX': - ( - property: transform, - class: scaleX, - values: ( - n1: scaleX(-1) - ) - ), - // scss-docs-end utils-scaleX - // scss-docs-start utils-scaleY - 'scaleY': - ( - property: transform, - class: scaleY, - values: ( - n1: scaleY(-1) - ) - ) - // scss-docs-end utils-scaleY - ) -); diff --git a/scss/_bootstrap-extended/_utilities.scss b/scss/_bootstrap-extended/_utilities.scss deleted file mode 100644 index d4c87d1eeecd8b0a048af0bb069a559c64f20b06..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_utilities.scss +++ /dev/null @@ -1,881 +0,0 @@ -// Utilities -// ******************************************************************************* -// stylelint-disable indentation - -// Utilities - -$utilities: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$utilities: map-merge( - ( - // scss-docs-start utils-vertical-align - 'align': - ( - property: vertical-align, - class: align, - values: baseline top middle bottom text-bottom text-top - ), - // scss-docs-end utils-vertical-align - // scss-docs-start utils-overflow - 'overflow': - ( - property: overflow, - values: auto hidden visible scroll - ), - // scss-docs-end utils-overflow - // scss-docs-start utils-display - 'display': - ( - responsive: true, - print: true, - property: display, - class: d, - values: inline inline-block block grid table table-row table-cell flex inline-flex none - ), - // scss-docs-end utils-display - // scss-docs-start utils-shadow - 'shadow': - ( - property: box-shadow, - class: shadow, - values: ( - null: $box-shadow, - sm: $box-shadow-sm, - lg: $box-shadow-lg, - none: none - ) - ), - // scss-docs-end utils-shadow - // scss-docs-start utils-position - 'position': - ( - property: position, - values: static relative absolute fixed sticky - ), - 'top': ( - property: top, - values: $position-values - ), - 'bottom': ( - property: bottom, - values: $position-values - ), - // scss-docs-end utils-position - // scss-docs-start utils-zindex - 'zindex': - ( - property: z-index, - class: zindex, - values: ( - 1: 1, - 2: 2, - 3: 3, - 4: 4, - 5: 5 - ) - ), - // scss-docs-end utils-zindex - // scss-docs-start utils-borders - 'border': - ( - property: border, - values: ( - null: $border-width solid $border-color, - 0: 0 - ) - ), - 'border-top': ( - property: border-top, - values: ( - null: $border-width solid $border-color, - 0: 0 - ) - ), - 'border-bottom': ( - property: border-bottom, - values: ( - null: $border-width solid $border-color, - 0: 0 - ) - ), - 'border-color': ( - property: border-color, - class: border, - values: - map-merge( - $theme-colors, - ( - 'white': $white, - 'light': $gray-100, - // (C) - 'transparent': transparent // (C) - ) - ) - ), - 'border-width': ( - property: border-width, - class: border, - values: $border-widths - ), - // scss-docs-end utils-borders - // Sizing utilities - // scss-docs-start utils-sizing - 'width': - ( - property: width, - class: w, - values: - map-merge( - $sizes-px, - ( - 25: 25%, - 50: 50%, - 75: 75%, - 100: 100%, - auto: auto - ) - ) - ), - 'max-width': ( - property: max-width, - class: mw, - values: ( - 100: 100% - ) - ), - 'viewport-width': ( - property: width, - class: vw, - values: ( - 100: 100vw - ) - ), - 'min-viewport-width': ( - property: min-width, - class: min-vw, - values: ( - 100: 100vw - ) - ), - 'height': ( - property: height, - class: h, - values: - map-merge( - $sizes-px, - ( - 25: 25%, - 50: 50%, - 75: 75%, - 100: 100%, - auto: auto - ) - ) - ), - 'max-height': ( - property: max-height, - class: mh, - values: ( - 100: 100% - ) - ), - 'viewport-height': ( - property: height, - class: vh, - values: ( - 100: 100vh - ) - ), - 'min-viewport-height': ( - property: min-height, - class: min-vh, - values: ( - 100: 100vh - ) - ), - // scss-docs-end utils-sizing - // Flex utilities - // scss-docs-start utils-flex - 'flex': - ( - responsive: true, - property: flex, - values: ( - fill: 1 1 auto - ) - ), - 'flex-direction': ( - responsive: true, - property: flex-direction, - class: flex, - values: row column row-reverse column-reverse - ), - 'flex-grow': ( - responsive: true, - property: flex-grow, - class: flex, - values: ( - grow-0: 0, - grow-1: 1 - ) - ), - 'flex-shrink': ( - responsive: true, - property: flex-shrink, - class: flex, - values: ( - shrink-0: 0, - shrink-1: 1 - ) - ), - 'flex-wrap': ( - responsive: true, - property: flex-wrap, - class: flex, - values: wrap nowrap wrap-reverse - ), - 'gap': ( - responsive: true, - property: gap, - class: gap, - values: $spacers - ), - 'justify-content': ( - responsive: true, - property: justify-content, - values: ( - start: flex-start, - end: flex-end, - center: center, - between: space-between, - around: space-around, - evenly: space-evenly - ) - ), - 'align-items': ( - responsive: true, - property: align-items, - values: ( - start: flex-start, - end: flex-end, - center: center, - baseline: baseline, - stretch: stretch - ) - ), - 'align-content': ( - responsive: true, - property: align-content, - values: ( - start: flex-start, - end: flex-end, - center: center, - between: space-between, - around: space-around, - stretch: stretch - ) - ), - 'align-self': ( - responsive: true, - property: align-self, - values: ( - auto: auto, - start: flex-start, - end: flex-end, - center: center, - baseline: baseline, - stretch: stretch - ) - ), - 'order': ( - responsive: true, - property: order, - values: ( - first: -1, - 0: 0, - 1: 1, - 2: 2, - 3: 3, - 4: 4, - 5: 5, - last: 6 - ) - ), - // scss-docs-end utils-flex - // Margin utilities - // scss-docs-start utils-spacing - 'margin': - ( - responsive: true, - property: margin, - class: m, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - 'margin-x': ( - responsive: true, - property: margin-right margin-left, - class: mx, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - 'margin-y': ( - responsive: true, - property: margin-top margin-bottom, - class: my, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - 'margin-top': ( - responsive: true, - property: margin-top, - class: mt, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - 'margin-bottom': ( - responsive: true, - property: margin-bottom, - class: mb, - values: - map-merge( - $spacers, - ( - auto: auto - ) - ) - ), - // Negative margin utilities - 'negative-margin': - ( - responsive: true, - property: margin, - class: m, - values: $negative-spacers - ), - 'negative-margin-x': ( - responsive: true, - property: margin-right margin-left, - class: mx, - values: $negative-spacers - ), - 'negative-margin-y': ( - responsive: true, - property: margin-top margin-bottom, - class: my, - values: $negative-spacers - ), - 'negative-margin-top': ( - responsive: true, - property: margin-top, - class: mt, - values: $negative-spacers - ), - 'negative-margin-bottom': ( - responsive: true, - property: margin-bottom, - class: mb, - values: $negative-spacers - ), - // Padding utilities - 'padding': - ( - responsive: true, - property: padding, - class: p, - values: $spacers - ), - 'padding-x': ( - responsive: true, - property: padding-right padding-left, - class: px, - values: $spacers - ), - 'padding-y': ( - responsive: true, - property: padding-top padding-bottom, - class: py, - values: $spacers - ), - 'padding-top': ( - responsive: true, - property: padding-top, - class: pt, - values: $spacers - ), - 'padding-bottom': ( - responsive: true, - property: padding-bottom, - class: pb, - values: $spacers - ), - // scss-docs-end utils-spacing - // Text - // scss-docs-start utils-text - 'font-family': - ( - property: font-family, - class: font, - values: ( - monospace: var(--#{$variable-prefix}font-monospace) - ) - ), - 'font-size': ( - rfs: true, - property: font-size, - class: fs, - values: - map-merge( - $font-sizes, - ( - tiny: $tiny-font-size, - //(C) - big: $big-font-size, - //(C) - large: $large-font-size, - //(C) - xlarge: $xlarge-font-size//(C) - ) - ) - ), - 'font-style': ( - property: font-style, - class: fst, - values: italic normal - ), - 'font-weight': ( - property: font-weight, - class: fw, - values: ( - light: $font-weight-light, - lighter: $font-weight-lighter, - normal: $font-weight-normal, - bold: $font-weight-bold, - semibold: $font-weight-semibold, - //(C) - bolder: $font-weight-bolder - ) - ), - 'line-height': ( - property: line-height, - class: lh, - values: ( - 1: 1, - inherit: inherit, - //(C) - sm: $line-height-sm, - base: $line-height-base, - lg: $line-height-lg - ) - ), - 'text-decoration': ( - property: text-decoration, - values: none underline line-through - ), - 'text-transform': ( - property: text-transform, - class: text, - values: none lowercase uppercase capitalize - ), - 'white-space': ( - property: white-space, - class: text, - values: ( - wrap: normal, - nowrap: nowrap - ) - ), - 'word-wrap': ( - property: word-wrap word-break, - class: text, - values: ( - break: break-word - ), - rtl: false - ), - // scss-docs-end utils-text - // scss-docs-start utils-color - 'color': - ( - property: color, - class: text, - local-vars: ( - 'text-opacity': 1 - ), - values: - map-merge( - $utilities-text-colors, - ( - 'white': $white, - 'body': $body-color, - 'muted': $text-muted, - 'black-50': rgba($black, 0.5), - // deprecated - 'white-50': rgba($white, 0.5), - // deprecated - 'light': $text-light, - // (c) - 'reset': inherit - ) - ) - ), - // scss-docs-end utils-color - // scss-docs-start utils-bg-color - 'background-color': - ( - property: background-color, - class: bg, - local-vars: ( - 'bg-opacity': 1 - ), - values: - map-merge( - $utilities-bg-colors, - ( - 'body': $body-bg, - 'white': $white, - 'transparent': transparent, - 'lighter': $gray-50, - //(C) - 'lightest': $gray-25, - //(C) - ) - ) - ), - // scss-docs-end utils-bg-color - 'gradient': - ( - property: background-image, - class: bg, - values: ( - gradient: var(--#{$variable-prefix}gradient) - ) - ), - // scss-docs-start utils-interaction - 'user-select': - ( - property: user-select, - values: all auto none - ), - 'pointer-events': ( - property: pointer-events, - class: pe, - values: none auto - ), - // scss-docs-end utils-interaction - // scss-docs-start utils-border-radius - 'rounded': - ( - property: border-radius, - class: rounded, - values: ( - null: $border-radius, - 0: 0, - 1: $border-radius-sm, - 2: $border-radius, - 3: $border-radius-lg, - circle: 50%, - pill: $border-radius-pill - ) - ), - 'rounded-top': ( - property: border-top-left-radius border-top-right-radius, - class: rounded-top, - values: ( - null: $border-radius - ) - ), - 'rounded-bottom': ( - property: border-bottom-right-radius border-bottom-left-radius, - class: rounded-bottom, - values: ( - null: $border-radius - ) - ), - // scss-docs-end utils-border-radius - // scss-docs-start utils-visibility - 'visibility': - ( - property: visibility, - class: null, - values: ( - visible: visible, - invisible: hidden - ) - ), - // scss-docs-end utils-visibility - // Custom Utilities - // ******************************************************************************* - // scss-docs-start utils-flex-basis - 'cursor': - ( - property: cursor, - class: cursor, - values: pointer move grab - ), - // scss-docs-end utils-flex-basis - ), - $utilities -); - -// Borders -// ******************************************************************************* - -// Bordered rows -.row-bordered { - overflow: hidden; - - > .col, - > [class^='col-'], - > [class*=' col-'], - > [class^='col '], - > [class*=' col '], - > [class$=' col'], - > [class='col'] { - position: relative; - padding-top: 1px; - - &::before { - content: ''; - position: absolute; - right: 0; - bottom: -1px; - left: 0; - display: block; - height: 0; - border-top: 1px solid $bordered-row-border-color; - } - - &::after { - content: ''; - position: absolute; - top: 0; - bottom: 0; - left: -1px; - display: block; - width: 0; - border-left: 1px solid $bordered-row-border-color; - } - } - - &.row-border-light { - > .col, - > [class^='col-'], - > [class*=' col-'], - > [class^='col '], - > [class*=' col '], - > [class$=' col'], - > [class='col'] { - &::before, - &::after { - border-color: $gray-100; - } - } - } -} - -// Color -// ******************************************************************************* - -// Bg Label variant (Not able to include this in utils due to custom style) -@each $color, $value in $theme-colors { - @if $color != primary { - @include bg-label-variant('.bg-label-#{$color}', $value); - @include border-label-variant('.border-label-#{$color}', $value); - @include border-light-variant('.border-light-#{$color}', $value); - } -} - -// ! FIX: .bg-dark & .bg-label-dark color in dark mode -@if $dark-style { - @include border-label-variant('.border-label-dark', $light); -} - -// Anchor hover/focus bg colors -a.bg-dark { - &:hover, - &:focus { - background-color: $gray-900 !important; - } -} - -a.bg-light { - &:hover, - &:focus { - background-color: $gray-200 !important; - } -} - -a.bg-lighter { - &:hover, - &:focus { - background-color: $gray-100 !important; - } -} - -a.bg-lightest { - &:hover, - &:focus { - background-color: $gray-50 !important; - } -} - -.text-muted[href] { - &:hover, - &:focus { - color: $text-muted-hover !important; - } -} - -.text-light { - color: $text-light !important; - - &[href] { - &:hover, - &:focus { - color: $text-muted-hover !important; - } - } -} - -.text-lighter { - color: $text-lighter !important; - - &[href] { - &:hover, - &:focus { - color: $text-muted-hover !important; - } - } -} - -.text-lightest { - color: $text-lightest !important; - - &[href] { - &:hover, - &:focus { - color: $text-muted-hover !important; - } - } -} - -// Invertible colors - -.invert-text-white { - color: if(not $dark-style, $white, $body-bg) !important; -} -.invert-text-white[href]:hover { - &:hover, - &:focus { - color: if(not $dark-style, $white, $body-bg) !important; - } -} - -.invert-text-dark { - color: if(not $dark-style, $black, $white) !important; -} -.invert-text-dark[href]:hover { - &:hover, - &:focus { - color: if(not $dark-style, $black, $white) !important; - } -} - -.invert-bg-white { - background-color: if(not $dark-style, $white, $body-bg) !important; -} -a.invert-bg-white { - &:hover, - &:focus { - background-color: if(not $dark-style, $white, $body-bg) !important; - } -} - -.invert-bg-dark { - background-color: if(not $dark-style, $gray-900, $white) !important; -} -a.invert-bg-dark { - &:hover, - &:focus { - background-color: if(not $dark-style, $gray-900, $white) !important; - } -} - -.invert-border-dark { - border-color: if(not $dark-style, $dark, $white) !important; -} - -.invert-border-white { - border-color: if(not $dark-style, $white, $body-bg) !important; -} - -// Misc -// ******************************************************************************* - -// Layout containers -.container-p-x { - padding-right: $container-padding-x-sm !important; - padding-left: $container-padding-x-sm !important; - - @include media-breakpoint-up(lg) { - padding-right: $container-padding-x !important; - padding-left: $container-padding-x !important; - } -} - -.container-m-nx { - margin-right: -$container-padding-x-sm !important; - margin-left: -$container-padding-x-sm !important; - - @include media-breakpoint-up(lg) { - margin-right: -$container-padding-x !important; - margin-left: -$container-padding-x !important; - } -} - -.container-p-y { - &:not([class^='pt-']):not([class*=' pt-']) { - padding-top: $container-padding-y !important; - } - - &:not([class^='pb-']):not([class*=' pb-']) { - padding-bottom: $container-padding-y !important; - } -} - -.container-m-ny { - &:not([class^='mt-']):not([class*=' mt-']) { - margin-top: -$container-padding-y !important; - } - - &:not([class^='mb-']):not([class*=' mb-']) { - margin-bottom: -$container-padding-y !important; - } -} - -// Table cell -.cell-fit { - width: 0.1%; - white-space: nowrap; -} diff --git a/scss/_bootstrap-extended/_variables.scss b/scss/_bootstrap-extended/_variables.scss deleted file mode 100644 index cc46e57aa0a6b857f8472fe4ab30653c101570b3..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/_variables.scss +++ /dev/null @@ -1,885 +0,0 @@ -// Variables -// -// Variables should follow the `$component-state-property-size` formula for -// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. -// -// ? To change the layout colors you just need to change the $black and $body-bg colors and rest (border, card, font colors and etc...) will be adjust automatically. -// ? Use https://noeldelgado.github.io/shadowlord/ to select proper 💄 Color tints and shade for $black and $body-bg color. -// ? color-variables and theme-color-variables (branding colors) can be choose as per your preferences. We suggest you to use https://colors.eva.design/ -// ! Light style use $black to generate the $gray shades. -// (C) Custom variables for extended components of bootstrap only - -// * Color system -// ******************************************************************************* - -// scss-docs-start gray-color-variables -$white: #fff !default; -$black: #435971 !default; -$gray-25: rgba($black, 0.025) !default; // (C) -$gray-50: rgba($black, 0.05) !default; // (C) -$gray-100: rgba($black, 0.1) !default; -$gray-200: rgba($black, 0.2) !default; -$gray-300: rgba($black, 0.3) !default; -$gray-400: rgba($black, 0.4) !default; -$gray-500: rgba($black, 0.5) !default; -$gray-600: rgba($black, 0.6) !default; -$gray-700: rgba($black, 0.7) !default; -$gray-800: rgba($black, 0.8) !default; -$gray-900: rgba($black, 0.9) !default; -// scss-docs-end gray-color-variables - -// scss-docs-start gray-colors-map -$grays: ( - '25': $gray-25, - '50': $gray-50 -) !default; -// scss-docs-end gray-colors-map - -// scss-docs-start color-variables -$blue: #007bff !default; -$indigo: #6610f2 !default; -$purple: #696cff !default; -$pink: #e83e8c !default; -$red: #ff3e1d !default; -$orange: #fd7e14 !default; -$yellow: #ffab00 !default; -$green: #71dd37 !default; -$teal: #20c997 !default; -$cyan: #03c3ec !default; -// scss-docs-end color-variables - -// scss-docs-start theme-color-variables -$primary: $purple !default; -$secondary: #8592a3 !default; -$success: $green !default; -$info: $cyan !default; -$warning: $yellow !default; -$danger: $red !default; -$light: #fcfdfd !default; -$dark: #233446 !default; -$gray: $gray-100 !default; // (C) -// scss-docs-end theme-color-variables - -// scss-docs-start theme-colors-map -$theme-colors: ( - 'primary': $primary, - 'secondary': $secondary, - 'success': $success, - 'info': $info, - 'warning': $warning, - 'danger': $danger, - 'light': $light, - 'dark': $dark, - 'gray': $gray -) !default; -// scss-docs-end theme-colors-map - -$color-scheme: 'light' !default; // (C) -// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. -// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast -$min-contrast-ratio: 1.7 !default; - -// * Options -// ******************************************************************************* - -$enable-negative-margins: true !default; -$enable-validation-icons: false !default; - -// Prefix for :root CSS variables -$variable-prefix: bs- !default; - -// * Spacing -// ******************************************************************************* - -$spacer: 1rem !default; - -$sizes-px: ( - px-20: 20px, - px-30: 30px, - px-40: 40px, - px-50: 50px, - px-75: 75px, - px-100: 100px, - px-150: 150px, - px-200: 200px, - px-250: 250px, - px-300: 300px, - px-350: 350px, - px-400: 400px, - px-500: 500px, - px-600: 600px, - px-700: 700px, - px-800: 800px, - auto: auto -) !default; // (C) - -$rgba-to-hex-bg: #fff !default; // (C) -$rgba-to-hex-bg-inverted: #000 !default; // (C) - -// * Body -// ******************************************************************************* - -$body-bg: #f5f5f9 !default; -$body-color: rgba-to-hex($gray-800, $rgba-to-hex-bg) !default; - -// * Links -// ******************************************************************************* - -$link-color: $primary !default; -$link-decoration: none !default; -$link-shade-percentage: 10% !default; -$link-hover-color: shift-color($link-color, $link-shade-percentage) !default; -$link-hover-decoration: null !default; - -// * Grid -// ******************************************************************************* - -// Grid containers - -// scss-docs-start container-max-widths -$container-max-widths: ( - sm: 540px, - md: 720px, - lg: 960px, - xl: 1140px, - xxl: 1440px // Custom xxl size -) !default; -// scss-docs-end container-max-widths - -$grid-gutter-width: 1.625rem !default; -$container-padding-x: 1.625rem !default; // (C) -$container-padding-x-sm: 1rem !default; // (C) -$container-padding-y: 1.625rem !default; // (C) - -// * Components -// ******************************************************************************* - -// scss-docs-start border-variables -$border-width: 1px !default; -$border-color: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default; -$border-inner-color: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default; // (C) -// scss-docs-end border-variables - -// scss-docs-start border-radius-variables -$border-radius: 0.375rem !default; -$border-radius-xl: 0.625rem !default; // (C) -$border-radius-lg: 0.5rem !default; -$border-radius-sm: 0.25rem !default; -$border-radius-xs: 0.125rem !default; // (C) - -$border-shade-amount: 25% !default; // (C) -$border-tint-amount: 60% !default; // (C) -// scss-docs-end border-radius-variables - -// scss-docs-start box-shadow-variables -$box-shadow: 0 0.25rem 1rem rgba(rgba-to-hex($gray-500, $rgba-to-hex-bg), 0.45) !default; -$box-shadow-sm: 0 0.125rem 0.25rem rgba(rgba-to-hex($gray-500, $rgba-to-hex-bg), 0.4) !default; -$box-shadow-lg: 0 0.625rem 1.25rem rgba(rgba-to-hex($gray-500, $rgba-to-hex-bg), 0.5) !default; -// scss-docs-end box-shadow-variables - -$component-active-color: $white !default; -$component-active-bg: rgba($primary, 0.08) !default; - -$component-line-height: 1.54 !default; // (C) -$component-focus-shadow-width: 2px !default; // (C) - -$floating-component-border-color: transparent !default; // (C) -$floating-component-shadow: $box-shadow !default; // (C) - -$hr-color: $border-color !default; -$hr-opacity: 1 !default; -$bordered-row-border-color: $hr-color !default; // (C) - -// scss-docs-start caret-variables -$caret-width: 0.42em !default; -$caret-vertical-align: middle !default; -$caret-spacing: 0.5em !default; -// scss-docs-end caret-variables - -// * Typography -// ******************************************************************************* - -// scss-docs-start font-variables -$font-family-sans-serif: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Oxygen', 'Ubuntu', 'Cantarell', - 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif !default; -$font-family-serif: Georgia, 'Times New Roman', serif !default; // (C) -$font-family-monospace: 'SFMono-Regular', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !default; -// stylelint-enable value-keyword-case -$font-family-base: var(--#{$variable-prefix}font-sans-serif) !default; -$font-family-code: var(--#{$variable-prefix}font-monospace) !default; - -// $font-size-root effects the value of `rem`, which is used for as well font sizes, paddings and margins -// $font-size-base effects the font size of the body text -$font-size-root: 16px !default; -$font-size-base: 0.9375rem !default; // Assumes the browser default, typically `15px/16px` -$font-size-xl: 1.25rem !default; // (C) -$font-size-lg: 1rem !default; -$font-size-sm: 0.75rem !default; -$font-size-xs: $font-size-sm !default; // (C) - -$font-weight-semibold: 600 !default; // (C) -$font-weight-bolder: 900 !default; -$font-weight-lighter: 100 !default; - -$line-height-base: 1.53 !default; -$line-height-xl: 1.5 !default; // (C) -$line-height-lg: 1.5 !default; -$line-height-sm: 1.5 !default; -$line-height-xs: 1.5 !default; // (C) - -$h1-font-size: 2.375rem !default; -$h2-font-size: 2rem !default; -$h3-font-size: 1.625rem !default; -$h4-font-size: 1.375rem !default; -$h5-font-size: 1.125rem !default; -$h6-font-size: $font-size-base !default; -// scss-docs-end font-variables - -// scss-docs-start headings-variables -$headings-margin-bottom: $spacer !default; -$headings-font-weight: 500 !default; -$headings-line-height: 1.1 !default; -$headings-color: rgba-to-hex($gray-900, $rgba-to-hex-bg) !default; -// scss-docs-end headings-variables - -// scss-docs-start display-headings -$display-font-sizes: ( - 1: 4rem, - 2: 3.5rem, - 3: 3rem, - 4: 2.5rem, - 5: 2rem, - 6: 1.5rem -) !default; - -$display-font-weight: 500 !default; -// scss-docs-end display-headings - -// scss-docs-start type-variables -$lead-font-size: $font-size-base * 1.125 !default; -$blockquote-font-size: $font-size-base * 1.125 !default; -$lead-font-weight: 400 !default; -// scss-docs-end type-variables - -// scss-docs-start type-variables -$tiny-font-size: 70% !default; // (C) -$small-font-size: 85% !default; -$big-font-size: 112% !default; // (C) -$large-font-size: 150% !default; // (C) -$xlarge-font-size: 170% !default; // (C) - -$text-muted: rgba-to-hex($gray-500, $rgba-to-hex-bg) !default; -$text-muted-hover: rgba-to-hex($gray-600, $rgba-to-hex-bg) !default; // (C) - -$text-light: rgba-to-hex($gray-400, $rgba-to-hex-bg) !default; // (C) -$text-lighter: rgba-to-hex($gray-300, $rgba-to-hex-bg) !default; // (C) -$text-lightest: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default; // (C) -// scss-docs-end type-variables - -// * Z-index master list -// ******************************************************************************* - -$zindex-menu-fixed: 1080 !default; -$zindex-modal: 1090 !default; -$zindex-modal-backdrop: $zindex-modal - 1 !default; -// $zindex-modal-top: 1090 !default; // (C) -$zindex-offcanvas: 1090 !default; -$zindex-offcanvas-backdrop: $zindex-offcanvas - 1 !default; -$zindex-layout-mobile: 1100 !default; // (C) -$zindex-popover: 1091 !default; -$zindex-toast: 1095 !default; // (C) -$zindex-tooltip: 1099 !default; -$zindex-notification: 999999 !default; // (C) - -// * Tables -// ******************************************************************************* - -// scss-docs-start table-variables -$table-cell-padding-y: 0.625rem !default; -$table-cell-padding-x: 1.25rem !default; -$table-cell-padding-y-sm: 0.3125rem !default; -$table-cell-padding-x-sm: 0.625rem !default; - -$table-cell-vertical-align: middle !default; - -$table-th-font-weight: $font-weight-semibold !default; - -$table-striped-bg-factor: 0.03 !default; -$table-striped-bg: rgba-to-hex(rgba($black, $table-striped-bg-factor), $rgba-to-hex-bg) !default; - -$table-hover-bg-factor: 0.06 !default; -$table-hover-bg: rgba($black, $table-hover-bg-factor) !default; - -$table-border-color: $border-color !default; - -$table-group-separator-color: $table-border-color !default; - -// * Buttons + Forms -// ******************************************************************************* - -$input-btn-padding-y: 0.4375rem !default; -$input-btn-padding-x: 1.25rem !default; -$input-btn-font-size: $font-size-base !default; -$input-btn-line-height: $line-height-base !default; - -$input-btn-focus-width: 0.05rem !default; -$input-btn-focus-color-opacity: 0.1 !default; -$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default; -$input-btn-focus-blur: 0.25rem !default; -$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default; - -$input-btn-padding-y-xs: 0 !default; // (C) -$input-btn-padding-x-xs: 0.5rem !default; // (C) -$input-btn-font-size-xs: $font-size-xs !default; // (C) -$input-btn-line-height-xs: $line-height-xs !default; // (C) - -$input-btn-padding-y-sm: 0.25rem !default; -$input-btn-padding-x-sm: 0.6875rem !default; -$input-btn-font-size-sm: $font-size-sm !default; -$input-btn-line-height-sm: $line-height-sm !default; - -$input-btn-padding-y-lg: 0.75rem !default; -$input-btn-padding-x-lg: 1.5rem !default; -$input-btn-font-size-lg: $font-size-lg !default; -$input-btn-line-height-lg: $line-height-lg !default; - -$input-btn-padding-y-xl: 0.875rem !default; // (C) -$input-btn-padding-x-xl: 2.125rem !default; // (C) -$input-btn-font-size-xl: $font-size-xl !default; // (C) -$input-btn-line-height-xl: $line-height-xl !default; // (C) - -// * Buttons -// ******************************************************************************* - -$btn-padding-y-xs: $input-btn-padding-y-xs !default; // (C) -$btn-padding-x-xs: $input-btn-padding-x-xs !default; // (C) -$btn-font-size-xs: $input-btn-font-size-xs !default; // (C) - -$btn-padding-y-xl: $input-btn-padding-y-xl !default; // (C) -$btn-padding-x-xl: $input-btn-padding-x-xl !default; // (C) -$btn-font-size-xl: $input-btn-font-size-xl !default; // (C) - -$btn-line-height-xs: $input-btn-line-height-xs !default; // (C) -$btn-line-height-sm: $line-height-sm; //(C) -$btn-line-height-lg: $line-height-lg; //(C) -$btn-line-height-xl: $input-btn-line-height-xl !default; // (C) - -$btn-box-shadow: none !default; -$btn-focus-box-shadow: none !default; -$btn-active-box-shadow: none !default; - -$btn-border-radius-xs: $border-radius-xs !default; // (C) -$btn-border-radius-xl: $border-radius-xl !default; // (C) - -$btn-transition: all 0.2s ease-in-out !default; - -$btn-label-bg-shade-amount: 84% !default; // (C) -$btn-label-bg-tint-amount: 84% !default; // (C) - -$btn-label-disabled-bg-shade-amount: 84% !default; // (C) -$btn-label-disabled-bg-tint-amount: 84% !default; // (C) - -$btn-hover-bg-shade-amount: 10% !default; -$btn-hover-bg-tint-amount: 10% !default; -$btn-hover-border-shade-amount: 10% !default; -$btn-hover-border-tint-amount: 10% !default; -$btn-hover-transform: translateY(-1px) !default; // (C) - -$btn-focus-transform: translateY(0) !default; // (C) - -$btn-disabled-opacity: 0.65 !default; - -$btn-active-bg-shade-amount: 15% !default; -$btn-active-bg-tint-amount: 15% !default; -$btn-active-border-shade-amount: 15% !default; -$btn-active-border-tint-amount: 15% !default; - -// * Forms -// ******************************************************************************* - -// scss-docs-start form-text-variables -$form-text-margin-top: 0.3rem !default; -$form-text-font-size: $small-font-size !default; -$form-text-color: $text-light !default; -// scss-docs-end form-text-variables - -// scss-docs-start form-label-variables -$form-label-font-size: 0.75rem !default; -$form-label-font-weight: 500 !default; -$form-label-color: $headings-color !default; -$form-label-letter-spacing: inherit !default; //(C) -$form-label-text-transform: uppercase !default; //(C) -// scss-docs-end form-label-variables - -// scss-docs-start form-input-variables -$input-padding-x: 0.875rem !default; -$input-line-height: $input-btn-line-height !default; - -$input-padding-x-sm: 0.625rem !default; - -$input-padding-x-lg: 1.25rem !default; - -$input-bg: $white !default; -$input-disabled-bg: rgba-to-hex($gray-100, $rgba-to-hex-bg) !default; - -$input-color: $body-color !default; -$input-border-color: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default; - -$input-hover-border-color: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default; // (C) - -$input-focus-border-color-scale: 50% !default; //(C) -$input-focus-border-color: tint-color($component-active-bg, $input-focus-border-color-scale) !default; - -$input-placeholder-transition: all 0.25s ease; -$input-placeholder-transform: translate(5px); -$input-placeholder-color: rgba-to-hex($gray-400, $rgba-to-hex-bg) !default; - -$input-height-inner: px-to-rem( - floor(rem-to-px(($input-btn-font-size * $input-btn-line-height) + ($input-btn-padding-y * 2))) -) !default; -$input-height-inner-sm: px-to-rem( - floor(rem-to-px(($input-btn-font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2))) -) !default; // (C) -$input-height-inner-lg: px-to-rem( - floor(rem-to-px(($font-size-lg * $line-height-lg) + ($input-btn-padding-y-lg * 2))) -) !default; // (C) -// scss-docs-end form-input-variables - -// scss-docs-start form-check-variables -$form-check-input-width: 1.2em !default; -$form-datatables-check-input-size: 18px !default; // (C) For datatables with checkbox- update according to $form-check-input-width - -$form-check-input-border: 1px solid $input-border-color !default; - -$form-check-label-disabled-color: $text-muted !default; // (C)R - -$form-check-input-checked-color: $component-active-color !default; -$form-check-input-checked-bg-image: url("data:image/svg+xml,") !default; -$form-check-radio-checked-bg-image: url("data:image/svg+xml,") !default; - -$form-check-input-indeterminate-color: $component-active-color !default; -$form-check-input-indeterminate-bg-image: url("data:image/svg+xml,") !default; - -$form-check-input-disabled-bg: $input-disabled-bg !default; -// scss-docs-end form-check-variables - -// scss-docs-start form-switch-variables -$form-switch-color: $gray-300 !default; -$form-switch-width: 2em !default; -$form-switch-padding-start: $form-switch-width + 0.5em !default; - -$form-switch-checked-bg-position-rtl: left center !default; //(C) -// scss-docs-end form-switch-variables - -//input-group-variables -$input-group-addon-color: $input-color !default; -$input-group-addon-bg: $input-bg !default; -$input-group-addon-border-color: $input-border-color !default; -// scss-docs-end input-group-variables - -// scss-docs-start form-select-variables -$form-select-padding-y: $input-btn-padding-y !default; -$form-select-padding-x: $input-padding-x !default; -$form-select-indicator-padding: $form-select-padding-x + 1rem !default; -$form-select-disabled-color: $body-color !default; -$form-select-disabled-bg: $input-disabled-bg !default; -$form-select-bg-size: 17px 12px !default; -$form-select-indicator-color: $gray-600 !default; -$form-select-indicator: url("data:image/svg+xml,") !default; -$form-select-indicator-rtl: url("data:image/svg+xml,") !default; // (C) - -$form-select-focus-box-shadow: $input-btn-focus-box-shadow !default; - -$form-select-padding-y-sm: $input-btn-padding-y-sm !default; -$form-select-padding-x-sm: $input-padding-x-sm !default; - -$form-select-padding-y-lg: $input-btn-padding-y-lg !default; -$form-select-padding-x-lg: $input-padding-x-lg !default; -// scss-docs-end form-select-variables - -// scss-docs-start form-range-variables -$form-range-track-height: 0.375rem !default; -$form-range-track-bg: rgba-to-hex($gray-100, $rgba-to-hex-bg) !default; -$form-range-track-box-shadow: none !default; -$form-range-track-disabled-bg: $gray-50 !default; // (C) - -$form-range-thumb-width: 0.875rem !default; -$form-range-thumb-height: $form-range-thumb-width !default; -$form-range-thumb-bg: $white !default; -$form-range-thumb-box-shadow: 0 0 6px 0 $gray-400 !default; -$form-range-thumb-focus-box-shadow: 0 0 8px 0px $gray-400 !default; -$form-range-thumb-active-bg: $form-range-thumb-bg !default; -$form-range-thumb-disabled-bg: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default; -// scss-docs-end form-range-variables - -// scss-docs-start form-floating-variables -$form-floating-label-opacity: 0.75 !default; -$form-floating-transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out !default; -$form-floating-label-transform-rtl: scale(0.85) translateY(-0.5rem) translateX(-0.15rem) !default; // (C) -// scss-docs-end form-floating-variables - -// Form validation - -// scss-docs-start form-feedback-variables -$form-feedback-valid-color: $success !default; -$form-feedback-invalid-color: $danger !default; - -$form-select-feedback-icon-padding: $form-select-indicator-padding + $input-height-inner !default; // (C) -$form-select-feedback-icon-padding-sm: $form-select-indicator-padding + $input-height-inner-sm !default; // (C) -$form-select-feedback-icon-padding-lg: $form-select-indicator-padding + $input-height-inner-lg !default; // (C) -// scss-docs-end form-feedback-variables - -// * Navs -// ******************************************************************************* - -$nav-spacer: 0.125rem !default; // (C) - -$nav-link-padding-y: 0.5rem !default; -$nav-link-padding-x: 1.25rem !default; -$nav-link-color: $text-muted-hover !default; -$nav-link-disabled-color: $text-lighter !default; -$nav-link-line-height: $component-line-height !default; // (C) - -$nav-link-padding-y-lg: 0.875rem !default; // (C) -$nav-link-padding-x-lg: 1.3125rem !default; // (C) -$nav-link-line-height-lg: $line-height-lg !default; // (C) - -$nav-link-padding-y-sm: 0.3125rem !default; // (C) -$nav-link-padding-x-sm: 0.875rem !default; // (C) -$nav-link-line-height-sm: $line-height-sm !default; // (C) - -$nav-tabs-link-hover-border-color: $gray-100 !default; -$nav-tabs-link-active-color: $body-color !default; -$nav-tabs-link-active-bg: $white !default; -$nav-tabs-border-color: $nav-tabs-link-active-bg !default; -$nav-tabs-link-active-border-color: $nav-tabs-border-color !default; -$nav-tabs-btn-bg-factor: 0.16 !default; // (C) -$nav-tabs-btn-color: $headings-color !default; // (C) -$nav-tabs-btn-bg: rgba-to-hex($gray-100, $rgba-to-hex-bg) !default; // (C) - -$nav-pills-link-active-color: $white !default; -$nav-pills-link-active-bg: transparent !default; - -// * Navbar -// ******************************************************************************* - -$navbar-toggler-padding-y: 0 !default; -$navbar-toggler-padding-x: 0 !default; -$navbar-toggler-font-size: 0.75rem !default; - -$navbar-dark-color: rgba($white, 0.8) !default; -$navbar-dark-hover-color: $white !default; -$navbar-dark-active-color: $white !default; -$navbar-dark-disabled-color: rgba($white, 0.4) !default; -$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,%3Csvg width='14px' height='11px' viewBox='0 0 14 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath d='M0,0 L14,0 L14,1.75 L0,1.75 L0,0 Z M0,4.375 L14,4.375 L14,6.125 L0,6.125 L0,4.375 Z M0,8.75 L14,8.75 L14,10.5 L0,10.5 L0,8.75 Z' id='path-1'%3E%3C/path%3E%3C/defs%3E%3Cg id='💎-UI-Elements' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='12)-Navbar' transform='translate(-1174.000000, -1290.000000)'%3E%3Cg id='Group' transform='translate(1174.000000, 1288.000000)'%3E%3Cg id='Icon-Color' transform='translate(0.000000, 2.000000)'%3E%3Cuse fill='#{$navbar-dark-color}' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.1' fill='#{$navbar-dark-color}' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !default; - -$navbar-light-color: $gray-500 !default; -$navbar-light-hover-color: $body-color !default; -$navbar-light-active-color: $body-color !default; -$navbar-light-disabled-color: $gray-300 !default; -$navbar-light-toggler-icon-bg: url("data:image/svg+xml,%3Csvg width='14px' height='11px' viewBox='0 0 14 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath d='M0,0 L14,0 L14,1.75 L0,1.75 L0,0 Z M0,4.375 L14,4.375 L14,6.125 L0,6.125 L0,4.375 Z M0,8.75 L14,8.75 L14,10.5 L0,10.5 L0,8.75 Z' id='path-1'%3E%3C/path%3E%3C/defs%3E%3Cg id='💎-UI-Elements' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='12)-Navbar' transform='translate(-1174.000000, -1290.000000)'%3E%3Cg id='Group' transform='translate(1174.000000, 1288.000000)'%3E%3Cg id='Icon-Color' transform='translate(0.000000, 2.000000)'%3E%3Cuse fill='#{$navbar-light-color}' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.1' fill='#{$navbar-light-color}' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !default; -$navbar-light-toggler-border-color: rgba($black, 0.06) !default; - -// * Dropdowns -// ******************************************************************************* -$dropdown-min-width: 12rem !default; -$dropdown-padding-y: 0.3125rem !default; -$dropdown-font-size: $font-size-base !default; -$dropdown-border-color: $floating-component-border-color !default; -$dropdown-divider-bg: $border-color !default; -$dropdown-box-shadow: $floating-component-shadow !default; - -$dropdown-inner-border-radius: 0 !default; - -$dropdown-link-color: $body-color !default; -$dropdown-link-hover-bg: rgba($black, 0.04) !default; -$dropdown-link-line-height: $component-line-height !default; // (C) - -$dropdown-link-disabled-color: $text-lighter !default; - -$dropdown-item-padding-y: 0.532rem !default; -$dropdown-item-padding-x: 1.25rem !default; - -$dropdown-header-color: $text-muted !default; - -$dropdown-header-padding: $dropdown-item-padding-y $dropdown-item-padding-x !default; - -// * Pagination -// ******************************************************************************* - -$pagination-padding-y: 0.625rem !default; -$pagination-padding-x: 0.5125rem !default; -$pagination-padding-y-sm: 0.375rem !default; -$pagination-padding-x-sm: 0.25rem !default; -$pagination-padding-y-lg: 0.9375rem !default; -$pagination-padding-x-lg: 0.5rem !default; - -$pagination-line-height: 1 !default; // (c) - -$pagination-color: $body-color !default; -$pagination-bg: rgba-to-hex(rgba($black, 0.08), $rgba-to-hex-bg) !default; -$pagination-border-width: 0px !default; -$pagination-border-radius: $border-radius-sm !default; -$pagination-margin-start: 0.1875rem !default; -$pagination-border-color: $border-inner-color !default; - -$pagination-focus-box-shadow: none !default; - -$pagination-focus-color: $pagination-color !default; -$pagination-focus-bg: rgba-to-hex(rgba($black, 0.16), $rgba-to-hex-bg) !default; - -$pagination-hover-color: $pagination-color !default; -$pagination-hover-bg: rgba-to-hex(rgba($black, 0.16), $rgba-to-hex-bg) !default; - -$pagination-disabled-color: $text-muted !default; -$pagination-disabled-bg: rgba-to-hex(rgba($black, 0.04), $rgba-to-hex-bg) !default; - -// * Cards -// ******************************************************************************* - -$card-spacer-y: $spacer * 1.5 !default; -$card-spacer-x: $spacer * 1.5 !default; -$card-title-font-size: $h5-font-size !default; // (C) -$card-title-spacer-y: $spacer * 0.875 !default; -$card-spacer-x-sm: 1rem !default; // (C) -$card-border-width: 0; -$card-border-color: $border-color !default; -$card-border-radius: $border-radius-lg !default; -$card-box-shadow: 0 2px 6px 0 rgba($black, 0.12) !default; -$card-inner-border-color: $border-inner-color !default; // (C) -$card-cap-padding-y: $spacer * 1.5 !default; - -$card-cap-bg: transparent !default; -$card-img-overlay-padding: 1.5rem !default; - -// * Accordion -// ******************************************************************************* - -$accordion-padding-y: 0.79rem !default; -$accordion-padding-x: 1.125rem !default; -$accordion-color: $body-color !default; -$accordion-bg: $white !default; -$accordion-button-color: $headings-color !default; - -$accordion-border-width: 0 !default; -$accordion-border-color: $border-color !default; -$accordion-button-active-bg: $accordion-bg !default; -$accordion-button-active-color: $accordion-button-color !default; - -$accordion-icon-width: 0.75rem !default; -$accordion-icon-color: $accordion-button-color !default; -$accordion-icon-active-color: $accordion-button-active-color !default; - -$accordion-icon-transform: rotate(90deg) !default; - -$accordion-button-icon: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' d='m1.532 12 6.182-6-6.182-6L0 1.487 4.65 6 0 10.513z'/%3E%3C/defs%3E%3Cg transform='translate(2.571)' fill='none' fill-rule='evenodd'%3E%3Cuse fill='%23435971' xlink:href='%23a'/%3E%3Cuse fill-opacity='.1' fill='#{$accordion-icon-color}' xlink:href='%23a'/%3E%3C/g%3E%3C/svg%3E%0A") !default; -$accordion-button-active-icon: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' d='m1.532 12 6.182-6-6.182-6L0 1.487 4.65 6 0 10.513z'/%3E%3C/defs%3E%3Cg transform='translate(2.571)' fill='none' fill-rule='evenodd'%3E%3Cuse fill='%23435971' xlink:href='%23a'/%3E%3Cuse fill-opacity='.1' fill='#{$accordion-icon-active-color}' xlink:href='%23a'/%3E%3C/g%3E%3C/svg%3E%0A") !default; - -// * Tooltips -// ******************************************************************************* - -$tooltip-bg: $dark !default; -$tooltip-opacity: 1 !default; -$tooltip-box-shadow: $box-shadow-sm !default; // (C) -$tooltip-padding-y: 0.25rem !default; -$tooltip-padding-x: 0.7rem !default; -$tooltip-font-size: $font-size-base !default; -$tooltip-border-radius: $border-radius-sm !default; - -// * Popovers -// ******************************************************************************* - -$popover-bg: $white !default; -$popover-font-size: $font-size-base !default; -$popover-box-shadow: $floating-component-shadow !default; -$popover-border-width: 0px !default; -$popover-header-bg: transparent !default; -$popover-header-padding-y: 0 !default; -$popover-header-padding-x: 1.125rem !default; -$popover-header-font-size: $h5-font-size !default; // (C) - -$popover-body-padding-y: 1.125rem !default; -$popover-body-padding-x: $popover-body-padding-y !default; -$popover-arrow-outer-color: $popover-bg !default; - -// * Toasts -// ******************************************************************************* - -$toast-padding-x: 1.25rem !default; -$toast-padding-y: $toast-padding-x !default; -$toast-font-size: $font-size-base !default; -$toast-background-color: $white !default; -$toast-bg-factor: 0.85 !default; // (C) -$toast-border-width: 0 !default; -$toast-border-color: $gray-100 !default; -$toast-border-radius: $border-radius-lg !default; -$toast-box-shadow: $floating-component-shadow !default; - -$toast-header-color: $body-color !default; -$toast-header-background-color: transparent !default; -$toast-header-border-color: transparent !default; -$toast-spacing: 1.25rem !default; - -$toast-btn-close-size: 0.625em !default; // (C) - -// * Badges -// ******************************************************************************* - -$badge-font-size: 0.8125em !default; -$badge-font-weight: 500 !default; -$badge-padding-y: 0.52em !default; -$badge-padding-x: 0.593em !default; -$badge-border-radius: $border-radius-sm !default; - -$badge-height: 1.5rem !default; // (C) -$badge-width: 1.5rem !default; // (C) -$badge-line-height: 0.75 !default; // (C) - -// * Modals -// ******************************************************************************* -$modal-inner-padding: $spacer * 1.5 !default; -$modal-dialog-margin: 1.5rem !default; - -$modal-content-border-width: 0px !default; -$modal-content-box-shadow-xs: 0 2px 16px 0 rgba($black, 0.45) !default; -$modal-content-box-shadow-sm-up: 0 2px 20px 0 rgba($black, 0.45) !default; -$modal-header-border-width: 0px !default; - -$modal-header-padding-y: 0.25rem !default; -$modal-header-padding-x: $modal-inner-padding !default; -$modal-header-padding: $modal-header-padding-x $modal-header-padding-x $modal-header-padding-y !default; // Keep this for backwards compatibility -$modal-footer-padding: $modal-header-padding-y $modal-header-padding-x $modal-header-padding-x !default; // (C) - -$modal-lg: 50rem !default; -$modal-md: 35rem !default; -$modal-sm: 22.5rem !default; - -$modal-fade-transform: translateY(-100px) scale(0.8) !default; -$modal-show-transform: translateY(0) scale(1) !default; - -$modal-transition-duration: 0.15s !default; // (C) -$modal-transition: transform $modal-transition-duration ease-out !default; - -$modal-simple-padding: 3rem !default; // (C) -$modal-simple-close-position: 1rem !default; // (C) - -// * Alerts -// ******************************************************************************* - -$alert-padding-y: $spacer * 0.9375 !default; -$alert-padding-x: $spacer * 0.9375 !default; -$alert-border-width: 0 !default; -$alert-bg-scale: -84% !default; -$alert-border-scale: -70% !default; -$alert-color-scale: 0% !default; - -// * Progress bars -// ******************************************************************************* - -$progress-height: 0.75rem !default; -$progress-font-size: 0.625rem !default; -$progress-bg: $gray-100 !default; -$progress-border-radius: 10rem !default; -$progress-bar-color: $white !default; - -// List group -// ******************************************************************************* - -// scss-docs-start list-group-variables -$list-group-color: $body-color !default; -$list-group-bg: transparent !default; -$list-group-border-color: $border-color !default; -$list-group-item-padding-y: 0.58rem !default; -$list-group-item-padding-x: 0.9375rem !default; -$list-group-item-color-scale: 0 !default; -$list-group-border-radius: $border-radius-lg !default; -$list-group-item-bg-hover-scale: 5% !default; // (c) - -$list-group-hover-bg: rgba($black, 0.06) !default; -$list-group-active-color: $white !default; - -$list-group-disabled-color: $text-lighter !default; - -$list-group-action-color: $text-muted-hover !default; -$list-group-action-hover-color: $body-color !default; -$list-group-action-active-bg: $gray-50 !default; -// scss-docs-end list-group-variables - -// * Image thumbnails -// ******************************************************************************* - -$thumbnail-padding: 0 !default; -$thumbnail-bg: transparent !default; -$thumbnail-border-width: 0px !default; -$thumbnail-border-radius: 0px !default; - -// * Figures -// ******************************************************************************* - -$figure-caption-color: $text-muted !default; - -// * Breadcrumbs -// ******************************************************************************* - -$breadcrumb-padding-y: 0 !default; -$breadcrumb-padding-x: 0 !default; -$breadcrumb-item-padding-x: 0.5rem !default; -$breadcrumb-margin-bottom: 1rem !default; -$breadcrumb-bg: transparent !default; -$breadcrumb-divider-color: $text-muted !default; -$breadcrumb-active-color: $body-color !default; -$breadcrumb-divider: '/' !default; -$breadcrumb-divider-flipped: '\\' !default; -$breadcrumb-color: $body-color !default; // (C) - -// * Carousel -// ******************************************************************************* -$carousel-control-color: $white !default; -$carousel-control-width: 14% !default; -$carousel-control-icon-width: 2.55rem !default; -$carousel-control-opacity: 1 !default; -$carousel-control-hover-opacity: 1 !default; - -$carousel-control-prev-icon-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' style='fill: #{$carousel-control-color};transform: ;msFilter:;'%3E%3Cpath d='M13.293 6.293 7.586 12l5.707 5.707 1.414-1.414L10.414 12l4.293-4.293z'%3E%3C/path%3E%3C/svg%3E") !default; -$carousel-control-next-icon-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' style='fill: #{$carousel-control-color};transform: ;msFilter:;'%3E%3Cpath d='M10.707 17.707 16.414 12l-5.707-5.707-1.414 1.414L13.586 12l-4.293 4.293z'%3E%3C/path%3E%3C/svg%3E") !default; - -// Spinners -// ******************************************************************************* - -$spinner-width-lg: 3rem !default; // (C) -$spinner-height-lg: $spinner-width-lg !default; // (C) -$spinner-border-width-lg: 0.3em !default; // (C) - -// * Close -// ******************************************************************************* - -$btn-close-width: 0.8em !default; -$btn-close-height: $btn-close-width !default; -$btn-close-color: $text-muted !default; -$btn-close-bg: url("data:image/svg+xml,%3Csvg width='150px' height='151px' viewBox='0 0 150 151' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='131.251657 0 74.9933705 56.25 18.7483426 0 0 18.75 56.2450278 75 0 131.25 18.7483426 150 74.9933705 93.75 131.251657 150 150 131.25 93.7549722 75 150 18.75'%3E%3C/polygon%3E%3C/defs%3E%3Cg id='🎨-%5BSetup%5D:-Colors-&-Shadows' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Artboard' transform='translate(-225.000000, -250.000000)'%3E%3Cg id='Icon-Color' transform='translate(225.000000, 250.500000)'%3E%3Cuse fill='#{$btn-close-color}' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.5' fill='#{$btn-close-color}' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !default; -$btn-close-focus-shadow: none !default; -$btn-close-opacity: 0.95 !default; -$btn-close-hover-opacity: 0.95 !default; -$btn-close-focus-opacity: 0.95 !default; - -$close-font-weight: 300 !default; // (C) - -// * Offcanvas -// ******************************************************************************* - -// scss-docs-start offcanvas-variables -$offcanvas-transition-duration: 0.25s !default; -// scss-docs-end offcanvas-variables - -// Utilities -$overflows: auto, hidden, scroll, visible !default; - -// Config -$rtl-support: false !default; -$dark-style: false !default; - -// * Chevron Icons -// ******************************************************************************** - -$chevron-up: "data:image/svg+xml,%3Csvg width='10px' height='6px' viewBox='0 0 10 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 4.57961362 1.23882951 5.71428571 5 2.26934419 8.76117049 5.71428571 10 4.57961362 5 0'%3E%3C/polygon%3E%3C/defs%3E%3Cg id='⚙️-Symbols' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='31)-DataTables' transform='translate(-289.000000, -64.000000)'%3E%3Cg id='Table-Basic' transform='translate(0.000000, 52.000000)'%3E%3Cg id='Table-Header' transform='translate(19.000000, 10.000000)'%3E%3Cg id='Group' transform='translate(270.000000, 0.000000)'%3E%3Cg id='Icon-Color' transform='translate(0.000000, 2.142857)'%3E%3Cuse fill='#{str-replace(#{rgba-to-hex($gray-500,$rgba-to-hex-bg)},'#', '%23')}' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.5' fill='#{str-replace(#{rgba-to-hex($gray-500,$rgba-to-hex-bg)},'#', '%23')}' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"; -$chevron-down: "data:image/svg+xml,%3Csvg width='10px' height='6px' viewBox='0 0 10 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='8.76117049 0 5 3.44494152 1.23882951 0 0 1.1346721 5 5.71428571 10 1.1346721'%3E%3C/polygon%3E%3C/defs%3E%3Cg id='⚙️-Symbols' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='31)-DataTables' transform='translate(-289.000000, -76.000000)'%3E%3Cg id='Table-Basic' transform='translate(0.000000, 52.000000)'%3E%3Cg id='Table-Header' transform='translate(19.000000, 10.000000)'%3E%3Cg id='Group' transform='translate(270.000000, 12.000000)'%3E%3Cg id='Icon-Color' transform='translate(0.000000, 2.142857)'%3E%3Cuse fill='#{str-replace(#{rgba-to-hex($gray-500,$rgba-to-hex-bg)},'#', '%23')}' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.8' fill='#{str-replace(#{rgba-to-hex($gray-500,$rgba-to-hex-bg)},'#', '%23')}' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"; diff --git a/scss/_bootstrap-extended/forms/_floating-labels.scss b/scss/_bootstrap-extended/forms/_floating-labels.scss deleted file mode 100644 index 8719ea701c496a8987c2437de10832b9a35fb1da..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_floating-labels.scss +++ /dev/null @@ -1,12 +0,0 @@ -// Floating Labels -// ******************************************************************************* - -// Display placeholder on focus -.form-floating { - > .form-control:focus, - > .form-control:not(:placeholder-shown) { - &::placeholder { - color: $input-placeholder-color; - } - } -} diff --git a/scss/_bootstrap-extended/forms/_form-control.scss b/scss/_bootstrap-extended/forms/_form-control.scss deleted file mode 100644 index a538f5e9dd52774da6f71fc88ff5d4a17987809a..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_form-control.scss +++ /dev/null @@ -1,12 +0,0 @@ -// Form control -// ******************************************************************************* - -.form-control { - &::placeholder { - transition: $input-placeholder-transition; - } - &:focus::placeholder { - transform: $input-placeholder-transform; - transition: $input-placeholder-transition; - } -} diff --git a/scss/_bootstrap-extended/forms/_form-range.scss b/scss/_bootstrap-extended/forms/_form-range.scss deleted file mode 100644 index 388a79128bd9d9cc377e062807f09a638d28780c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_form-range.scss +++ /dev/null @@ -1,52 +0,0 @@ -// Range select -// ******************************************************************************* - -.form-range { - // Chrome specific - &::-webkit-slider-thumb { - box-shadow: $form-range-thumb-box-shadow; - transition: transform 0.2s; - transform-origin: center; - - &:focus { - box-shadow: $form-range-thumb-focus-box-shadow; - } - - &:active { - transform: scale(1.4, 1.4); - } - } - - // Mozilla specific - &::-moz-range-thumb { - box-shadow: $form-range-thumb-box-shadow; - transition: transform 0.2s; - transform-origin: center; - - &:focus { - box-shadow: $form-range-thumb-focus-box-shadow; - } - - &:active { - transform: scale(1.4, 1.4); - } - } - - &:disabled { - &::-webkit-slider-runnable-track { - background-color: $form-range-track-disabled-bg; - } - - &::-moz-range-track { - background-color: $form-range-track-disabled-bg; - box-shadow: none; - } - - &::-webkit-slider-thumb { - box-shadow: none; - } - &::-moz-range-thumb { - box-shadow: none; - } - } -} diff --git a/scss/_bootstrap-extended/forms/_form-select.scss b/scss/_bootstrap-extended/forms/_form-select.scss deleted file mode 100644 index a3c33628f4c7eb0229f9b86fae663d789b3a6cf7..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_form-select.scss +++ /dev/null @@ -1,6 +0,0 @@ -// Select -// ******************************************************************************* - -.form-select { - background-clip: padding-box; -} diff --git a/scss/_bootstrap-extended/forms/_input-group.scss b/scss/_bootstrap-extended/forms/_input-group.scss deleted file mode 100644 index a60bf3d2f2fbf2cdd06055e5b2801a0fb96e5124..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_input-group.scss +++ /dev/null @@ -1,68 +0,0 @@ -// Input groups -// ******************************************************************************* - -// Using :focus-within to apply focus/validation border and shadow to default and merged input-group -.input-group { - &:focus-within { - box-shadow: $input-focus-box-shadow; - .form-control, - .input-group-text { - box-shadow: none; - } - } - // For disabled input group - &.disabled { - .input-group-text { - background-color: $input-disabled-bg; - } - } -} - -// input-group-text icon size -.input-group-text { - background-clip: padding-box; - i { - @include font-size($input-font-size); - } -} -.input-group-lg > .input-group-text { - i { - @include font-size($input-font-size-lg); - } -} -.input-group-sm > .input-group-text { - i { - @include font-size($input-font-size-sm); - } -} - -// Merge input - -// Input group merge .form-control border & padding -@include ltr-only { - .input-group-merge { - .input-group-text { - &:first-child { - border-right: 0; - } - &:last-child { - border-left: 0; - } - } - .form-control { - &:not(:first-child) { - padding-left: 0; - border-left: 0; - } - &:not(:last-child) { - padding-right: 0; - border-right: 0; - } - } - } -} - -// Adding transition (On focus border color change) -.input-group-text { - @include transition($input-transition); -} diff --git a/scss/_bootstrap-extended/forms/_labels.scss b/scss/_bootstrap-extended/forms/_labels.scss deleted file mode 100644 index 57639ffed584c1cbaca911fd5f6b8082f8cfbd8c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_labels.scss +++ /dev/null @@ -1,17 +0,0 @@ -// Labels -// ******************************************************************************* - -.form-label, -.col-form-label { - font-size: $form-label-font-size; - text-transform: $form-label-text-transform; - letter-spacing: $form-label-letter-spacing; -} -// Default (vertical ) form label size -.form-label-lg { - @include font-size($input-font-size-lg); -} - -.form-label-sm { - @include font-size($input-font-size-sm); -} diff --git a/scss/_bootstrap-extended/forms/_validation.scss b/scss/_bootstrap-extended/forms/_validation.scss deleted file mode 100644 index 3359173e3bed33b67f42b6f902d0f2ca4951cb3d..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/forms/_validation.scss +++ /dev/null @@ -1,59 +0,0 @@ -// Validation states -// ******************************************************************************* - -@each $state, $data in $form-validation-states { - @include template-form-validation-state($state, $data...); -} - -// Currently supported for formvalidation and jq-validation -form { - .error:not(li):not(input) { - color: $form-feedback-invalid-color; - font-size: 85%; - margin-top: 0.25rem; - } - - .invalid, - .is-invalid .invalid:before, - .is-invalid::before { - border-color: $form-feedback-invalid-color !important; - } - - .form-label { - &.invalid, - &.is-invalid { - border-color: $form-feedback-invalid-color; - box-shadow: 0 0 0 2px rgba($form-feedback-invalid-color, 0.4) !important; - } - } - - select { - &.invalid { - & ~ .select2 { - .select2-selection { - border-color: $form-feedback-invalid-color; - } - } - } - - // FormValidation - - //Select2 - &.is-invalid { - & ~ .select2 { - .select2-selection { - border-color: $form-feedback-invalid-color !important; - } - } - } - // Bootstrap select - &.selectpicker { - &.is-invalid { - ~ .btn { - border-color: 1px solid $form-feedback-invalid-color; - border-color: $form-feedback-invalid-color; - } - } - } - } -} diff --git a/scss/_bootstrap-extended/mixins/_alert.scss b/scss/_bootstrap-extended/mixins/_alert.scss deleted file mode 100644 index a2223899b37f7154677948916266b6f8e3804e3b..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_alert.scss +++ /dev/null @@ -1,41 +0,0 @@ -// Alerts -// ******************************************************************************* - -@mixin alert-variant($background: null, $border: null, $color: null) { -} - -// Basic Alerts -@mixin template-alert-variant($parent, $background) { - $border: if( - $dark-style, - shift-color($background, -$alert-border-scale, $card-bg), - shift-color($background, $alert-border-scale, $card-bg) - ); - $color: if($dark-style, shift-color($background, -$alert-color-scale), shift-color($background, $alert-color-scale)); - $background: if( - $dark-style, - shift-color($background, -$alert-bg-scale, $card-bg), - shift-color($background, $alert-bg-scale, $card-bg) - ); - - #{$parent} { - @include gradient-bg($background); - border-color: $border; - color: $color; - .btn-close { - background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $color), '#', '%23'); - } - - .alert-link { - color: $color; - } - } - - .card { - #{$parent} { - hr { - background-color: $color !important; - } - } - } -} diff --git a/scss/_bootstrap-extended/mixins/_badge.scss b/scss/_bootstrap-extended/mixins/_badge.scss deleted file mode 100644 index d8ec80a021c762c2643a84a94fc51305a8118fc4..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_badge.scss +++ /dev/null @@ -1,9 +0,0 @@ -// Badges -// ******************************************************************************* - -// Size -@mixin badge-size($badge-height, $badge-width, $badge-font-size) { - height: $badge-height; - width: $badge-width; - @include font-size($badge-font-size); -} diff --git a/scss/_bootstrap-extended/mixins/_buttons.scss b/scss/_bootstrap-extended/mixins/_buttons.scss deleted file mode 100644 index 17c7ee56280b69a0f3e8aa432689389ecc4913ab..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_buttons.scss +++ /dev/null @@ -1,171 +0,0 @@ -// Buttons -// ******************************************************************************* - -// Basic -@mixin button-variant($background: null, $border: null, $active-background: null, $active-border: null) { -} -@mixin template-button-variant($parent, $background, $color: null, $border: null) { - $background: $background; - $border: $background; - $color: if($color, $color, color-contrast($background)); - $hover-background: if( - $color == $color-contrast-light, - shade-color($background, $btn-hover-bg-shade-amount), - tint-color($background, $btn-hover-bg-tint-amount) - ); - $hover-border: if( - $color == $color-contrast-light, - shade-color($border, $btn-hover-border-shade-amount), - tint-color($border, $btn-hover-border-tint-amount) - ); - $hover-color: color-contrast($hover-background); - - $active-background: if( - $color == $color-contrast-light, - shade-color($background, $btn-active-bg-shade-amount), - tint-color($background, $btn-active-bg-tint-amount) - ); - $active-border: if( - $color == $color-contrast-light, - shade-color($border, $btn-active-border-shade-amount), - tint-color($border, $btn-active-border-tint-amount) - ); - $active-color: color-contrast($active-background); - $disabled-background: $background; - $disabled-border: $border; - $disabled-color: color-contrast($disabled-background); - - #{$parent} { - color: $color; - @include gradient-bg($background); - border-color: $border; - @include box-shadow($btn-box-shadow); - box-shadow: 0 0.125rem 0.25rem 0 rgba($background, 0.4); - - &:hover { - color: $hover-color; - @include gradient-bg($hover-background); - border-color: $hover-border; - transform: $btn-hover-transform; - } - - .btn-check:focus + &, - &:focus, - &.focus { - color: $hover-color; - @include gradient-bg($hover-background); - border-color: $hover-border; - transform: $btn-focus-transform; - box-shadow: none; - } - - .btn-check:checked + &, - .btn-check:active + &, - &:active, - &.active, - .show > &.dropdown-toggle { - color: $active-color; - background-color: $active-background; - // Remove CSS gradients if they're enabled - background-image: if($enable-gradients, none, null); - border-color: $active-border; - - &:focus { - box-shadow: none; - } - } - - &.disabled, - &:disabled { - box-shadow: none; - } - } - - //? Button groups border (Uncomment if needed) - // .btn-group #{$parent}, - // .input-group #{$parent} { - // border-right: $input-btn-border-width solid $active-background; - // border-left: $input-btn-border-width solid $active-background; - // } -} - -// Outline -@mixin button-outline-variant($color: null, $color-hover: null, $hover-color: null) { -} -// ? $hover-color <-> $color-hover used by bootstrap -@mixin template-button-outline-variant($parent, $color, $hover-color: null) { - $color: $color; - $background: $color; - $color-hover: color-contrast($color); - - $focus-background: $color; - - $hover-background: if( - $color-hover == $color-contrast-light, - shade-color($background, $btn-hover-bg-shade-amount), - tint-color($background, $btn-hover-bg-tint-amount) - ); - - $active-background: if( - $color-hover == $color-contrast-light, - shade-color($background, $btn-active-bg-shade-amount), - tint-color($background, $btn-active-bg-tint-amount) - ); - - #{$parent} { - color: $color; - border-color: $color; - background: transparent; - - &:hover { - color: $color-hover; - background-color: $hover-background; - border-color: $hover-background; - box-shadow: 0 0.125rem 0.25rem 0 rgba($background, 0.4); - transform: $btn-hover-transform; - } - - .btn-check:focus + &, - &:focus { - color: $color-hover; - background-color: $hover-background; - border-color: $hover-background; - box-shadow: none; - transform: $btn-focus-transform; - } - - .btn-check:checked + &, - .btn-check:active + &, - &:active, - &.active, - &.dropdown-toggle.show { - color: $color-hover; - background-color: $active-background; - border-color: $active-background; - &:focus { - box-shadow: none; - } - } - - &.disabled, - &:disabled { - box-shadow: none; - } - } - - #{$parent} .badge { - background: $color; - border-color: $color; - color: color-contrast($color); - } - - #{$parent}:hover .badge, - #{$parent}:focus:hover .badge, - #{$parent}:active .badge, - #{$parent}.active .badge, - .show > #{$parent}.dropdown-toggle .badge { - background: $color-hover; - border-color: $color-hover; - color: if(alpha($color) ==1, $color, color-contrast($color-hover)); - } -} diff --git a/scss/_bootstrap-extended/mixins/_caret.scss b/scss/_bootstrap-extended/mixins/_caret.scss deleted file mode 100644 index d032fc42157b6be2b3877eb5e0b5aa6496656206..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_caret.scss +++ /dev/null @@ -1,42 +0,0 @@ -// * Carets -// ******************************************************************************* - -@mixin caret-up { - margin-top: -0; - width: $caret-width; - height: $caret-width; - border: 1px solid; - border-bottom: 0; - border-left: 0; - transform: rotate(-45deg); -} - -@mixin caret-down { - margin-top: -1 * divide($caret-width, 1.5); - width: $caret-width; - height: $caret-width; - border: 1px solid; - border-top: 0; - border-left: 0; - transform: rotate(45deg); -} - -@mixin caret-left { - margin-top: -1 * divide($caret-width, 2.5); - width: $caret-width; - height: $caret-width; - border: 1px solid; - border-top: 0; - border-right: 0; - transform: rotate(45deg); -} - -@mixin caret-right { - margin-top: -1 * divide($caret-width, 2.5); - width: $caret-width; - height: $caret-width; - border: 1px solid; - border-top: 0; - border-left: 0; - transform: rotate(-45deg); -} diff --git a/scss/_bootstrap-extended/mixins/_dropdown.scss b/scss/_bootstrap-extended/mixins/_dropdown.scss deleted file mode 100644 index 647e2edbb7c01755736d25621134ac1e0566f6bd..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_dropdown.scss +++ /dev/null @@ -1,20 +0,0 @@ -// * Dropdowns -// ******************************************************************************* - -@mixin template-dropdown-variant($parent, $background, $color: null) { - #{$parent} .dropdown-item:not(.disabled).active, - #{$parent} .dropdown-item:not(.disabled):active { - background-color: $background; - color: if($color, $color, color-contrast($background)) !important; - } - - #{$parent}.dropdown-menu > li:not(.disabled) > a:not(.dropdown-item):active, - #{$parent}.dropdown-menu > li.active:not(.disabled) > a:not(.dropdown-item) { - background-color: $background; - color: if($color, $color, color-contrast($background)) !important; - } -} - -@mixin template-dropdown-theme($background, $color: null) { - @include template-dropdown-variant('', $background, $color); -} diff --git a/scss/_bootstrap-extended/mixins/_forms.scss b/scss/_bootstrap-extended/mixins/_forms.scss deleted file mode 100644 index dd63fbdda9d4c66a0e19ba5c430d0fd61c530ada..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_forms.scss +++ /dev/null @@ -1,271 +0,0 @@ -// * Form controls -// ******************************************************************************* - -// Form control -@mixin template-form-control-theme($color) { - .form-control:focus, - .form-select:focus { - border-color: $color; - } - - // Using :focus-within to apply focus border color to default and merged input-group - .input-group { - &:focus-within { - .form-control, - .input-group-text { - border-color: $color; - } - } - } -} - -// Float labels -@mixin template-float-label-theme($color) { - .form-floating { - > .form-control:focus, - > .form-control:not(:placeholder-shown), - > .form-select { - ~ label { - color: $color; - } - } - - > .form-control:-webkit-autofill { - ~ label { - color: $color; - } - } - } -} - -// Form Switch -@mixin template-form-switch-theme($background) { - $focus-color: $background; - $focus-bg-image: url("data:image/svg+xml,"); - - $checked-color: $component-active-color; - $checked-bg-image: url("data:image/svg+xml,"); - - .form-switch { - .form-check-input { - &:focus { - background-image: escape-svg($focus-bg-image); - } - - &:checked { - @if $enable-gradients { - background-image: escape-svg($checked-bg-image), var(--#{$variable-prefix}gradient); - } @else { - background-image: escape-svg($checked-bg-image); - } - } - } - } -} - -// File Input -@mixin template-file-input-theme($color) { - .form-control:focus ~ .form-label { - border-color: $color; - - &::after { - border-color: inherit; - } - } -} - -// Form Check -@mixin template-form-check-variant($parent, $background, $color: null) { - $color: if($color, $color, color-contrast($background)); - $focus-border: $background; - - #{$parent} .form-check-input { - &:focus { - border-color: $focus-border; - box-shadow: 0 2px 4px 0 rgba($background, 0.4); - } - - &:disabled { - background-color: $form-check-input-disabled-bg; - } - - &:checked, - &[type='checkbox']:indeterminate { - background-color: $background; - border-color: $background; - box-shadow: 0 2px 4px 0 rgba($background, 0.4); - } - } - - // Custom options - #{$parent}.custom-option { - &.checked { - border: 1px solid $background; - } - } -} - -@mixin template-form-check-theme($background, $color: null) { - @include template-form-check-variant('', $background, $color); -} - -// Form Validation - -@mixin form-validation-state( - $state: null, - $color: null, - $icon: null, - $tooltip-color: null, - $tooltip-bg-color: null, - $focus-box-shadow: null -) { -} - -@mixin template-form-validation-state( - $state, - $color, - $icon, - $tooltip-color: color-contrast($color), - $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity), - $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity) -) { - .#{$state}-feedback { - display: none; - width: 100%; - margin-top: $form-feedback-margin-top; - @include font-size($form-feedback-font-size); - font-style: $form-feedback-font-style; - color: $color; - } - - .#{$state}-tooltip { - position: absolute; - top: 100%; - z-index: 5; - display: none; - max-width: 100%; // Contain to parent when possible - padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x; - margin-top: 0.1rem; - @include font-size($form-feedback-tooltip-font-size); - line-height: $form-feedback-tooltip-line-height; - color: $tooltip-color; - background-color: $tooltip-bg-color; - @include border-radius($form-feedback-tooltip-border-radius); - } - - @include form-validation-state-selector($state) { - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - } - - .form-control { - @include form-validation-state-selector($state) { - border-color: $color; - - .dark-style & { - border-color: $color !important; - } - - @if $enable-validation-icons { - background-image: escape-svg($icon); - background-repeat: no-repeat; - background-size: $input-height-inner-half $input-height-inner-half; - - @include ltr-style { - padding-right: $input-height-inner; - background-position: right $input-height-inner-quarter center; - } - } - - &:focus { - border-color: $color; - box-shadow: $focus-box-shadow; - } - } - } - - // stylelint-disable-next-line selector-no-qualifying-type - textarea.form-control { - @include form-validation-state-selector($state) { - @if $enable-validation-icons { - @include ltr-style { - padding-right: $input-height-inner; - background-position: top $input-height-inner-quarter right $input-height-inner-quarter; - } - } - } - } - - .form-select { - @include form-validation-state-selector($state) { - border-color: $color; - @if $enable-validation-icons { - background-size: $form-select-bg-size, $form-select-feedback-icon-size; - @include ltr-style { - background-image: escape-svg($form-select-indicator), escape-svg($icon); - padding-right: $form-select-feedback-icon-padding-end; - background-position: $form-select-bg-position, $form-select-feedback-icon-position; - } - } - - &:focus { - border-color: $color; - box-shadow: $focus-box-shadow; - } - } - } - - .form-check-input { - @include form-validation-state-selector($state) { - border-color: $color; - - &:checked { - background-color: $color; - border-color: $color; - } - - &:focus { - box-shadow: $focus-box-shadow; - border-color: $color; - } - - ~ .form-check-label { - color: $color; - } - } - } - .form-check-inline .form-check-input { - ~ .#{$state}-feedback { - @include ltr-style { - margin-left: 0.5em; - } - } - } - // On validation .input-group & .input-group-merged, setup proper border color & box-shadow - .input-group { - .form-control { - @include form-validation-state-selector($state) { - ~ .input-group-text { - border-color: $color; - } - &:focus { - border-color: $color; - box-shadow: none; - // ? .input-group has .input-group-text last/sibling - ~ .input-group-text { - border-color: $color; - } - } - } - } - } - - .input-group .form-control, - .input-group .form-select { - @include form-validation-state-selector($state) { - z-index: 3; - } - } -} diff --git a/scss/_bootstrap-extended/mixins/_list-group.scss b/scss/_bootstrap-extended/mixins/_list-group.scss deleted file mode 100644 index 5c7d6993520365b58d550f12a6524ac760b0010c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_list-group.scss +++ /dev/null @@ -1,53 +0,0 @@ -// List groups -// ******************************************************************************* - -@mixin list-group-item-variant($state: null, $background: null, $color: null) { -} - -// Basic List groups -@mixin template-list-group-item-variant($parent, $background, $color: null) { - $background-color: if( - $dark-style, - shift-color($background, -$list-group-item-bg-scale, $card-bg), - shift-color($background, $list-group-item-bg-scale, $card-bg) - ); - $color: if( - $parent == '.list-group-item-dark' and $dark-style, - color-contrast($background), - shift-color($background, $list-group-item-color-scale) - ); - $hover-background: shade-color($background-color, $list-group-item-bg-hover-scale); - #{$parent} { - background-color: $background-color; - color: $color !important; - } - - a#{$parent}, - button#{$parent} { - color: $color; - &:hover, - &:focus { - background-color: $hover-background; - color: $color; - } - - &.active { - border-color: $background; - background-color: $background; - color: if($color, $color, color-contrast($background)); - } - } -} - -@mixin template-list-group-theme($background, $color: null) { - @include template-list-group-item-variant('.list-group-item-primary', $background); - - .list-group-item.active { - &, - &:hover, - &:focus { - border-color: $background; - background-color: $background; - } - } -} diff --git a/scss/_bootstrap-extended/mixins/_misc.scss b/scss/_bootstrap-extended/mixins/_misc.scss deleted file mode 100644 index b1fa2d0750e66607a4b1b9262c2e6caab84477b3..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_misc.scss +++ /dev/null @@ -1,120 +0,0 @@ -// * Light/Dark layout -// ******************************************************************************* -@mixin light-layout-only() { - @if $dark-style { - html:not(.dark-style) { - @content; - } - } @else { - @content; - } -} - -// * RTL/LTR -// ******************************************************************************* - -@mixin ltr-only() { - @if $rtl-support { - html:not([dir='rtl']) { - @content; - } - } @else { - @content; - } -} - -@mixin ltr-style() { - @if $rtl-support { - html:not([dir='rtl']) & { - @content; - } - } @else { - @content; - } -} - -// * Keyframes -// ******************************************************************************* - -@mixin keyframes($name) { - @-webkit-keyframes #{$name} { - @content; - } - - @-moz-keyframes #{$name} { - @content; - } - - @keyframes #{$name} { - @content; - } -} - -// * Colors -// ******************************************************************************* - -@mixin bg-color-variant($parent, $color, $rth-color: #000) { - #{$parent} { - background-color: $color !important; - } - - a#{$parent} { - &:hover, - &:focus { - background-color: rgba-to-hex(rgba($color, 0.95), $background: $rth-color) !important; - } - } - - //! Fix: Dropdown notification read badge bg color - .dropdown-notifications-item:not(.mark-as-read) { - .dropdown-notifications-read span { - background-color: $color; - } - } -} - -@mixin bg-variant($parent, $color, $rth-color: #000) { - @include bg-color-variant($parent, $color); -} - -// BG Label -@mixin bg-label-variant($parent, $background, $color: $background) { - $label-background: if( - $dark-style, - shade-color($background, $btn-label-bg-shade-amount, $card-bg), - tint-color($background, $btn-label-bg-tint-amount, $card-bg) - ); - #{$parent} { - background-color: $label-background !important; - color: if($color, $color, color-contrast($bg)) !important; - } -} - -// Border Label -@mixin border-label-variant($parent, $background) { - $label-background: if( - $dark-style, - shade-color($background, $border-shade-amount), - tint-color($background, $border-tint-amount) - ); - #{$parent} { - border: 3px solid $label-background !important; - } -} - -// Border Light -@mixin border-light-variant($parent, $background) { - #{$parent} { - border: 3px solid rgba($background, 0.08); - } -} - -@mixin text-variant($parent, $color) { - #{$parent} { - color: $color !important; - } - //! Fix: text-body hover color - .text-body[href]:hover { - color: shift-color($color, $link-shade-percentage) !important; - } -} diff --git a/scss/_bootstrap-extended/mixins/_navs.scss b/scss/_bootstrap-extended/mixins/_navs.scss deleted file mode 100644 index d16d97d2138dc4aa52c1430857c486711d743022..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_navs.scss +++ /dev/null @@ -1,37 +0,0 @@ -// Navs -// ******************************************************************************* - -@mixin template-nav-size($padding-y, $padding-x, $font-size, $line-height) { - > .nav .nav-link, - &.nav .nav-link { - padding: $padding-y $padding-x; - font-size: $font-size; - line-height: $line-height; - } -} - -@mixin template-nav-variant($parent, $background, $color: null) { - // .nav-link class hover theme color for basic nav - .nav .nav-link { - &:hover, - &:focus { - color: shift-color($background, $link-shade-percentage); - } - } - - $pills-selector: if($parent== '', '.nav-pills', '#{$parent}.nav-pills, #{$parent} > .nav-pills'); - - #{$pills-selector} .nav-link.active { - &, - &:hover, - &:focus { - background-color: $background; - color: if($color, $color, color-contrast($background)); - box-shadow: 0 2px 4px 0 rgba($background, 0.4); - } - } -} - -@mixin template-nav-theme($background, $color: null) { - @include template-nav-variant('', $background, $color); -} diff --git a/scss/_bootstrap-extended/mixins/_pagination.scss b/scss/_bootstrap-extended/mixins/_pagination.scss deleted file mode 100644 index 98fa153e29132f3df546e3ada3c24d991a451145..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_pagination.scss +++ /dev/null @@ -1,21 +0,0 @@ -// Pagination -// ******************************************************************************* - -// Basic Pagination -@mixin template-pagination-variant($parent, $background, $color: null) { - #{$parent} .page-item.active .page-link, - #{$parent}.pagination li.active > a:not(.page-link) { - &, - &:hover, - &:focus { - border-color: $background; - background-color: $background; - color: if($color, $color, color-contrast($background)); - box-shadow: 0 0.125rem 0.25rem rgba(rgba-to-hex($background, $rgba-to-hex-bg), 0.4); - } - } -} - -@mixin template-pagination-theme($background, $color: null) { - @include template-pagination-variant('', $background, $color); -} diff --git a/scss/_bootstrap-extended/mixins/_progress.scss b/scss/_bootstrap-extended/mixins/_progress.scss deleted file mode 100644 index ef8c496696f94d00a8d47ce3f64197b7ceeafc6b..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_progress.scss +++ /dev/null @@ -1,19 +0,0 @@ -// Progress bars -// ******************************************************************************* - -@mixin template-progress-bar-theme($background, $color: null) { - .progress-bar { - background-color: $background; - color: if($color, $color, color-contrast($background)); - box-shadow: 0 2px 4px 0 rgba($background, 0.4); - } -} - -@mixin template-progress-bar-shadow-variant($parent, $background-shadow) { - $background-shadow: $background-shadow; - .progress-bar { - &#{$parent} { - box-shadow: 0 2px 4px 0 rgba($background-shadow, 0.4); - } - } -} diff --git a/scss/_bootstrap-extended/mixins/_table-variants.scss b/scss/_bootstrap-extended/mixins/_table-variants.scss deleted file mode 100644 index 687a0f496dd59515167c17065ddc217a10958b5c..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_table-variants.scss +++ /dev/null @@ -1,31 +0,0 @@ -// Tables -// ******************************************************************************* - -@mixin template-table-variant($parent, $background, $layout-color: $white) { - .table-#{$parent} { - $color: color-contrast(opaque($body-bg, $background)); - $hover-bg: mix($color, $background, percentage($table-hover-bg-factor)); - $striped-bg: mix($color, $background, percentage($table-striped-bg-factor)); - $active-bg: mix($color, $background, percentage($table-active-bg-factor)); - $dark-border-color: if($parent == 'dark', mix($color, $background, percentage($table-border-factor)), inherit); - - --#{$variable-prefix}table-bg: #{$background}; - --#{$variable-prefix}table-striped-bg: #{$striped-bg}; - --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)}; - --#{$variable-prefix}table-active-bg: #{$active-bg}; - --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)}; - --#{$variable-prefix}table-hover-bg: #{$hover-bg}; - --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)}; - - color: $color; - border-color: mix($color, $background, percentage($table-border-factor)); - // Highlight border color between thead, tbody and tfoot. - th { - border-bottom-color: $dark-border-color !important; - } - - .btn-icon { - color: $color; - } - } -} diff --git a/scss/_bootstrap-extended/mixins/_toasts.scss b/scss/_bootstrap-extended/mixins/_toasts.scss deleted file mode 100644 index 025cf7db9d0a9ac9a42286f310131c623a95da22..0000000000000000000000000000000000000000 --- a/scss/_bootstrap-extended/mixins/_toasts.scss +++ /dev/null @@ -1,33 +0,0 @@ -// * Toast -// ******************************************************************************* - -@mixin template-toast-variant($parent, $background, $color: null) { - $label-color: if($color, $color, $background); - $color: if($color, $color, color-contrast($background)); - - #{$parent} { - &.toast, - &.bs-toast { - color: $white; - background-color: rgba($background, $toast-bg-factor) !important; - box-shadow: 0 0.25rem 1rem rgba($background, 0.4); - - .toast-header { - color: $white; - .btn-close { - background-color: $background !important; - background-image: str-replace( - str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $white), '#', '%23'), - "fill-opacity='0.5'", - "fill-opacity='1'" - ); - box-shadow: 0 0.1875rem 0.375rem 0 rgba($background, 0.4) !important; - } - } - } - } -} - -@mixin template-toast-theme($parent, $background, $color: null) { - @include template-toast-variant($parent, $background, $color); -} diff --git a/scss/_bootstrap.scss b/scss/_bootstrap.scss deleted file mode 100644 index bd11700076314425ab59e89ff355b93ed38d002a..0000000000000000000000000000000000000000 --- a/scss/_bootstrap.scss +++ /dev/null @@ -1,40 +0,0 @@ -@import '_bootstrap-extended/include'; - -// Import bootstrap core scss from node_module -// ! Utilities are customized and added in bootstrap-extended - -// Layout & components -@import '../node_modules/bootstrap/scss/root'; -@import '../node_modules/bootstrap/scss/reboot'; -@import '../node_modules/bootstrap/scss/type'; -@import '../node_modules/bootstrap/scss/images'; -@import '../node_modules/bootstrap/scss/containers'; -@import '../node_modules/bootstrap/scss/grid'; -@import '../node_modules/bootstrap/scss/tables'; -@import '../node_modules/bootstrap/scss/forms'; -@import '../node_modules/bootstrap/scss/buttons'; -@import '../node_modules/bootstrap/scss/transitions'; -@import '../node_modules/bootstrap/scss/dropdown'; -@import '../node_modules/bootstrap/scss/button-group'; -@import '../node_modules/bootstrap/scss/nav'; -@import '../node_modules/bootstrap/scss/navbar'; -@import '../node_modules/bootstrap/scss/card'; -@import '../node_modules/bootstrap/scss/accordion'; -@import '../node_modules/bootstrap/scss/breadcrumb'; -@import '../node_modules/bootstrap/scss/pagination'; -@import '../node_modules/bootstrap/scss/badge'; -@import '../node_modules/bootstrap/scss/alert'; -@import '../node_modules/bootstrap/scss/progress'; -@import '../node_modules/bootstrap/scss/list-group'; -@import '../node_modules/bootstrap/scss/close'; -@import '../node_modules/bootstrap/scss/toasts'; -@import '../node_modules/bootstrap/scss/modal'; -@import '../node_modules/bootstrap/scss/tooltip'; -@import '../node_modules/bootstrap/scss/popover'; -@import '../node_modules/bootstrap/scss/carousel'; -@import '../node_modules/bootstrap/scss/spinners'; -@import '../node_modules/bootstrap/scss/offcanvas'; -@import '../node_modules/bootstrap/scss/placeholders'; - -// Helpers -@import '../node_modules/bootstrap/scss/helpers'; diff --git a/scss/_colors.scss b/scss/_colors.scss deleted file mode 100644 index f7646b0a149c40317d73506520d5710afe078544..0000000000000000000000000000000000000000 --- a/scss/_colors.scss +++ /dev/null @@ -1,39 +0,0 @@ -@import '_components/include'; - -// * Bootstrap colors (Uncomment required colors) -// ******************************************************************************* - -$bootstrap-colors: () !default; - -@each $color-name, $color-value in $bootstrap-colors { - @include bg-variant('.bg-#{$color-name}', $color-value); - @include bg-label-variant('.bg-label-#{$color-name}', $color-value); - - @include border-label-variant('.border-label-#{$color-name}', $color-value); - @include border-light-variant('.border-light-#{$color-name}', $color-value); - - .border-#{$color-name} { - border-color: $color-value !important; - } - - @include template-button-variant('.btn-#{$color-name}', $color-value); - @include template-button-outline-variant('.btn-outline-#{$color-name}', $color-value); -} - -// * Navbar -// ******************************************************************************* - -@each $color, $value in $theme-colors { - @if $color !=primary and $color !=light { - @include template-navbar-style('.navbar.bg-#{$color}', $value); - } -} - -@include template-navbar-style('.navbar.bg-white', #fff, $color: $text-muted, $active-color: $body-color); -@include template-navbar-style('.navbar.bg-light', $gray-100, $color: $text-muted, $active-color: $body-color); - -// * Footer -// ******************************************************************************* - -@include template-footer-style('.footer.bg-white', #fff, $color: $text-muted, $active-color: $body-color); -@include template-footer-style('.footer.bg-light', $gray-100, $color: $text-muted, $active-color: $body-color); diff --git a/scss/_components.scss b/scss/_components.scss deleted file mode 100644 index 6370b830f79fcba3e4a6a14c1f62e4be8030809e..0000000000000000000000000000000000000000 --- a/scss/_components.scss +++ /dev/null @@ -1,11 +0,0 @@ -@import '_components/include'; - -// Import components scss -@import '_components/base'; -@import '_components/common'; -@import '_components/menu'; -@import '_components/layout'; -@import '_components/app-brand'; -@import '_components/avatar'; -@import '_components/text-divider'; -@import '_components/footer'; diff --git a/scss/_components/_app-brand.scss b/scss/_components/_app-brand.scss deleted file mode 100644 index e6e49982403d23bb072533c463896a7e94d5bd18..0000000000000000000000000000000000000000 --- a/scss/_components/_app-brand.scss +++ /dev/null @@ -1,64 +0,0 @@ -// App Brand -// ******************************************************************************* - -@import 'mixins/app-brand'; - -.app-brand { - display: flex; - flex-grow: 0; - flex-shrink: 0; - overflow: hidden; - line-height: 1; - min-height: 1px; - align-items: center; -} - -.app-brand-link { - display: flex; - align-items: center; -} -.app-brand-logo { - display: block; - flex-grow: 0; - flex-shrink: 0; - overflow: hidden; - min-height: 1px; - - img, - svg { - display: block; - } -} - -.app-brand-text { - flex-shrink: 0; - opacity: 1; - transition: opacity $menu-animation-duration * 0.5 ease-in-out; -} - -.app-brand-img-collapsed { - display: none; -} - -// App brand with vertical menu -.menu-vertical .app-brand { - padding-right: $menu-vertical-link-padding-x + $menu-vertical-link-margin-x; - padding-left: $menu-vertical-link-padding-x + $menu-vertical-link-margin-x; -} - -// App brand with vertical menu -.menu-horizontal .app-brand, -.menu-horizontal .app-brand + .menu-divider { - display: none !important; -} - -:not(.layout-menu) > .menu-vertical.menu-collapsed:not(.layout-menu):not(:hover) { - @include template-app-brand-collapsed(); -} - -@include media-breakpoint-up(xl) { - .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-offcanvas):not(.layout-menu-fixed-offcanvas) - .layout-menu { - @include template-app-brand-collapsed(); - } -} diff --git a/scss/_components/_avatar.scss b/scss/_components/_avatar.scss deleted file mode 100644 index badb8ec0a52315447573c5df7e6e7325c48e6f59..0000000000000000000000000000000000000000 --- a/scss/_components/_avatar.scss +++ /dev/null @@ -1,126 +0,0 @@ -// Avatar -// ******************************************************************************* - -// Avatar Styles -.avatar { - position: relative; - width: $avatar-size; - height: $avatar-size; - cursor: pointer; - img { - width: 100%; - height: 100%; - } - // Avatar Initials if no images added - .avatar-initial { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - text-transform: uppercase; - display: flex; - align-items: center; - justify-content: center; - color: $white; - background-color: $secondary; - font-weight: $font-weight-bold; - } - // Avatar Status indication - &.avatar-online, - &.avatar-offline, - &.avatar-away, - &.avatar-busy { - &:after { - content: ''; - position: absolute; - bottom: 0; - right: 3px; - width: 8px; - height: 8px; - border-radius: 100%; - box-shadow: 0 0 0 2px $white; - } - } - &.avatar-online:after { - background-color: $success; - } - &.avatar-offline:after { - background-color: $secondary; - } - &.avatar-away:after { - background-color: $warning; - } - &.avatar-busy:after { - background-color: $danger; - } -} - -// Pull up avatar style -.pull-up { - transition: all 0.25s ease; - &:hover { - transform: translateY(-4px) scale(1.02); - box-shadow: $box-shadow; - z-index: 30; - border-radius: 50%; - } -} - -// Avatar Sizes -.avatar-xs { - @include template-avatar-style($avatar-size-xs, $avatar-size-xs, $avatar-initial-xs, 1px); -} -.avatar-sm { - @include template-avatar-style($avatar-size-sm, $avatar-size-sm, $avatar-initial-sm, 2px); -} -.avatar-md { - @include template-avatar-style($avatar-size-md, $avatar-size-md, $avatar-initial-md, 4px); -} -.avatar-lg { - @include template-avatar-style($avatar-size-lg, $avatar-size-lg, $avatar-initial-lg, 5px); -} -.avatar-xl { - @include template-avatar-style($avatar-size-xl, $avatar-size-xl, $avatar-initial-xl, 6px); -} - -// Avatar Group SCSS -.avatar-group { - .avatar { - transition: all 0.25s ease; - img, - .avatar-initial { - border: 2px solid $avatar-group-border; - // box-shadow: 0 0 0 2px $avatar-group-border, inset 0 0 0 1px rgba($black, 0.07); //0 2px 10px 0 rgba($secondary,.3); - } - .avatar-initial { - background-color: tint-color($secondary, 20%); - } - &:hover { - z-index: 30; - transition: all 0.25s ease; - } - } - // Avatar Group Sizings - .avatar { - margin-left: -0.8rem; - &:first-child { - margin-left: 0; - } - } - .avatar-xs { - margin-left: -0.65rem; - } - .avatar-sm { - margin-left: -0.75rem; - } - .avatar-md { - margin-left: -0.9rem; - } - .avatar-lg { - margin-left: -1.5rem; - } - .avatar-xl { - margin-left: -1.75rem; - } -} diff --git a/scss/_components/_base.scss b/scss/_components/_base.scss deleted file mode 100644 index 82b937086890196102359fb982423d066fc7b998..0000000000000000000000000000000000000000 --- a/scss/_components/_base.scss +++ /dev/null @@ -1,160 +0,0 @@ -// Base -// ******************************************************************************* - -body { - text-rendering: optimizeLegibility; - font-smoothing: antialiased; - -moz-font-feature-settings: 'liga' on; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -@include media-breakpoint-up(md) { - button.list-group-item { - outline: none; - } -} - -// * App Overlay -// ******************************************************************************* - -.app-overlay { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-color: rgba($black, 0.5); - visibility: hidden; - z-index: 3; - transition: all 0.25s ease; - &.show { - visibility: visible; - } -} - -// * Containers -// ******************************************************************************* - -.container, -.container-fluid, -.container-xxl { - padding-right: $container-padding-x-sm; - padding-left: $container-padding-x-sm; - - @include media-breakpoint-up(lg) { - padding-right: $container-padding-x; - padding-left: $container-padding-x; - } -} - -// * Thumbnails -// ******************************************************************************* - -.img-thumbnail { - position: relative; - display: block; - img { - z-index: 1; - } -} -.img-thumbnail-content { - position: absolute; - top: 50%; - left: 50%; - z-index: 3; - display: block; - opacity: 0; - transition: all 0.2s ease-in-out; - transform: translate(-50%, -50%); - - .img-thumbnail:hover &, - .img-thumbnail:focus & { - opacity: 1; - } -} - -// Overlay effect -.img-thumbnail-overlay { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 2; - display: block; - transition: all 0.2s ease-in-out; - - .img-thumbnail:not(:hover):not(:focus) & { - opacity: 0 !important; - } -} - -.img-thumbnail-shadow { - transition: box-shadow 0.2s; - - &:hover, - &:focus { - box-shadow: 0 5px 20px rgba($black, 0.4); - } -} - -// Zoom-in effect -.img-thumbnail-zoom-in { - overflow: hidden; - - img { - transition: all 0.3s ease-in-out; - transform: translate3d(0); - } - - .img-thumbnail-content { - transform: translate(-50%, -50%) scale(0.6); - } - - &:hover, - &:focus { - img { - transform: scale(1.1); - } - - .img-thumbnail-content { - transform: translate(-50%, -50%) scale(1); - } - } -} - -// * IE Fixes -// ******************************************************************************* - -@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { - // Fix IE parent container height bug when containing image with fluid width - .card, - .card-body, - .media, - .flex-column, - .tab-content { - min-height: 1px; - } - - img { - min-height: 1px; - height: auto; - } -} - -// * Buy now section -// ******************************************************************************* -.buy-now { - .btn-buy-now { - position: fixed; - bottom: 3rem; - - right: $container-padding-x; - z-index: $zindex-notification; - box-shadow: 0 1px 20px 1px $danger; - &:hover { - box-shadow: none; - } - } -} diff --git a/scss/_components/_common.scss b/scss/_components/_common.scss deleted file mode 100644 index 23f3f119cbda91885edfa7686f29325da8c65ae3..0000000000000000000000000000000000000000 --- a/scss/_components/_common.scss +++ /dev/null @@ -1,232 +0,0 @@ -// * Common -// ******************************************************************************* - -@use '../_bootstrap-extended/include' as light; - -.ui-square, -.ui-rect, -.ui-rect-30, -.ui-rect-60, -.ui-rect-67, -.ui-rect-75 { - position: relative !important; - display: block !important; - padding-top: 100% !important; - width: 100% !important; -} - -.ui-square { - padding-top: 100% !important; -} - -.ui-rect { - padding-top: 50% !important; -} - -.ui-rect-30 { - padding-top: 30% !important; -} - -.ui-rect-60 { - padding-top: 60% !important; -} - -.ui-rect-67 { - padding-top: 67% !important; -} - -.ui-rect-75 { - padding-top: 75% !important; -} - -.ui-square-content, -.ui-rect-content { - position: absolute !important; - top: 0 !important; - right: 0 !important; - bottom: 0 !important; - left: 0 !important; -} - -.text-strike-through { - text-decoration: line-through; -} - -// * Line Clamp with ellipsis -// ******************************************************************************* - -$clamp-numbers: ( - '1': 1, - '2': 2, - '3': 3 -) !default; - -@each $clamp-class, $clamp-value in $clamp-numbers { - .line-clamp-#{$clamp-class} { - overflow: hidden; - display: -webkit-box; - -webkit-line-clamp: $clamp-value; - -webkit-box-orient: vertical; - } -} - -// * Stars -// ******************************************************************************* - -.ui-stars, -.ui-star, -.ui-star > * { - height: $ui-star-size; - - // Disable dragging - -webkit-user-drag: none; - -khtml-user-drag: none; - -moz-user-drag: none; - -o-user-drag: none; - user-drag: none; -} - -.ui-stars { - display: inline-block; - vertical-align: middle; - white-space: nowrap; -} - -.ui-star { - position: relative; - display: block; - float: left; - width: $ui-star-size; - height: $ui-star-size; - text-decoration: none !important; - font-size: $ui-star-size; - line-height: 1; - user-select: none; - - & + & { - margin-left: $ui-stars-spacer; - } - - > *, - > *::before, - > *::after { - position: absolute; - left: $ui-star-size * 0.5; - height: 100%; - font-size: 1em; - line-height: 1; - transform: translateX(-50%); - } - - > * { - top: 0; - width: 100%; - text-align: center; - } - - > *:first-child { - z-index: 10; - display: none; - overflow: hidden; - color: $ui-star-filled-color; - } - - // Default icon - > *:last-child { - z-index: 5; - display: block; - } - - &.half-filled > *:first-child { - width: 50%; - transform: translateX(-100%); - } - - &.filled > *:first-child, - &.half-filled > *:first-child { - display: block; - } - - &.filled > *:last-child { - display: none; - } -} - -// Hoverable - -.ui-stars.hoverable .ui-star > *:first-child { - display: block; -} - -// Empty stars if first star is not filled -.ui-stars.hoverable .ui-star:first-child:not(.filled), -.ui-stars.hoverable .ui-star:first-child:not(.half-filled) { - > *:first-child, - ~ .ui-star > *:first-child { - display: none; - } -} - -.ui-stars.hoverable .ui-star.filled > *:first-child, -.ui-stars.hoverable .ui-star.half-filled > *:first-child { - display: block !important; -} - -.ui-stars.hoverable:hover .ui-star > *:first-child { - display: block !important; - width: 100% !important; - transform: translateX(-50%) !important; -} - -.ui-stars.hoverable .ui-star:hover ~ .ui-star { - > *:first-child { - display: none !important; - } - - > *:last-child { - display: block !important; - } -} - -// * Background -// ******************************************************************************* - -.ui-bg-cover { - background-color: rgba(0, 0, 0, 0); - background-position: center center; - background-size: cover; -} - -.ui-bg-overlay-container, -.ui-bg-video-container { - position: relative; - - > * { - position: relative; - } -} - -.ui-bg-overlay-container .ui-bg-overlay { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - display: block; -} - -// * Styles -// ******************************************************************************* -@if not $dark-style { - .light-style { - $ui-star-empty-color: light.$gray-200; - - .ui-bordered { - border: 1px solid light.$border-color; - } - - .ui-star > *:last-child { - color: $ui-star-empty-color; - } - } -} diff --git a/scss/_components/_footer.scss b/scss/_components/_footer.scss deleted file mode 100644 index 3668c06e7dc01f793aa65204a22989f02a71afb9..0000000000000000000000000000000000000000 --- a/scss/_components/_footer.scss +++ /dev/null @@ -1,39 +0,0 @@ -// Footer -// ******************************************************************************* - -.footer-link { - display: inline-block; -} - -// Light footer -.footer-light { - color: $navbar-light-color; - - .footer-text { - color: $navbar-light-active-color; - } - - .footer-link { - color: $navbar-light-color; - - &:hover, - &:focus { - color: $navbar-light-hover-color; - } - - &.disabled { - color: $navbar-light-disabled-color !important; - } - } - - .show > .footer-link, - .active > .footer-link, - .footer-link.show, - .footer-link.active { - color: $navbar-light-active-color; - } - - hr { - border-color: $menu-light-border-color; - } -} diff --git a/scss/_components/_include.scss b/scss/_components/_include.scss deleted file mode 100644 index 6ce1af0e8784adc21fab043d8407b6f6d50d8a79..0000000000000000000000000000000000000000 --- a/scss/_components/_include.scss +++ /dev/null @@ -1,11 +0,0 @@ -// Include -// ******************************************************************************* - -@import '../_bootstrap-extended/include'; - -//Mixins -@import './_mixins'; // Components mixins - -//Components variables -@import '../_custom-variables/components'; // Components variable (for customization purpose) -@import 'variables'; // Components variable diff --git a/scss/_components/_layout.scss b/scss/_components/_layout.scss deleted file mode 100644 index ff25fee04fdc3ed7410a61f3540ed237031d8eb0..0000000000000000000000000000000000000000 --- a/scss/_components/_layout.scss +++ /dev/null @@ -1,535 +0,0 @@ -// Layouts -// ******************************************************************************* - -.layout-container { - min-height: 100vh; -} - -.layout-wrapper, -.layout-container { - width: 100%; - display: flex; - flex: 1 1 auto; - align-items: stretch; -} - -.layout-page, -.content-wrapper, -.content-wrapper > *, -.layout-menu { - min-height: 1px; -} - -.layout-navbar, -.content-footer { - flex: 0 0 auto; -} - -.layout-page { - display: flex; - flex: 1 1 auto; - align-items: stretch; - padding: 0; - - // Without menu - .layout-without-menu & { - padding-right: 0 !important; - padding-left: 0 !important; - } -} - -.content-wrapper { - display: flex; - align-items: stretch; - flex: 1 1 auto; - flex-direction: column; - justify-content: space-between; -} -// Content backdrop -.content-backdrop { - // z-index: 1 (layout static) - @include overlay-backdrop(1, $modal-backdrop-bg, $modal-backdrop-opacity); - // z-index: 10 (layout fixed) - .layout-menu-fixed & { - z-index: 10; - } - &.fade { - z-index: -1; - } -} - -// * Layout Navbar -// ******************************************************************************* -.layout-navbar { - position: relative; - padding-top: 0.25rem; - padding-bottom: 0.2rem; - height: $navbar-height; - flex-wrap: nowrap; - color: $body-color; - z-index: 2; - - .navbar { - transform: translate3d(0, 0, 0); - } - .navbar-nav-right { - flex-basis: 100%; - } - - .navbar-search-wrapper { - .search-input, - .input-group-text { - background-color: transparent; - } - } - // Style for detached navbar - &.navbar-detached { - // Container layout max-width - $container-xxl: map-get($container-max-widths, xxl); - &.container-xxl { - max-width: calc(#{$container-xxl} - calc(#{$container-padding-x} * 2)); - } - // Navbar fixed - .layout-navbar-fixed & { - width: calc(100% - calc(#{$container-padding-x} * 2) - #{$menu-width}); - @include media-breakpoint-down(xl) { - width: calc(100% - calc(#{$container-padding-x} * 2)) !important; - } - @include media-breakpoint-down(lg) { - width: calc(100% - calc(#{$container-padding-x-sm} * 2)) !important; - } - } - .layout-navbar-fixed.layout-menu-collapsed & { - width: calc(100% - calc(#{$container-padding-x} * 2) - #{$menu-collapsed-width}); - } - - // Navbar static - width: calc(100% - calc(#{$container-padding-x} * 2)); - @include media-breakpoint-down(xl) { - width: calc(100vw - (100vw - 100%) - calc(#{$container-padding-x} * 2)) !important; - } - @include media-breakpoint-down(lg) { - width: calc(100vw - (100vw - 100%) - calc(#{$container-padding-x-sm} * 2)) !important; - } - .layout-menu-collapsed &, - .layout-without-menu & { - width: calc(100% - calc(#{$container-padding-x} * 2)); - } - - margin: 0.75rem auto 0; - border-radius: $border-radius; - padding: 0 $card-spacer-x; - } - - .search-input-wrapper { - .search-toggler { - position: absolute; - top: 1.25rem; - right: 1rem; - z-index: 1; - } - - .search-input { - height: 100%; - box-shadow: none; - } - } - &[class*='bg-']:not(.bg-navbar-theme) { - .nav-item { - .input-group-text, - .dropdown-toggle { - color: $white; - } - } - } - - @include media-breakpoint-down(xl) { - .navbar-nav { - .nav-item.dropdown { - .dropdown-menu { - position: absolute; - .last-login { - white-space: nowrap; - } - } - } - } - } - @include media-breakpoint-down(md) { - .navbar-nav { - .nav-item.dropdown { - position: static; - float: left; - .badge-notifications { - top: auto; - } - .dropdown-menu { - position: absolute; - left: 0.9rem; - min-width: auto; - width: 92%; - } - } - } - } -} - -// * Navbar require high z-index as we use z-index for menu slide-out for below large screen -@include media-breakpoint-down(xl) { - .layout-navbar { - z-index: $zindex-menu-fixed; - } -} - -// * Layout Menu -// ******************************************************************************* -.layout-menu { - position: relative; - flex: 1 0 auto; - - .menu { - transform: translate3d(0, 0, 0); - } - - .menu-vertical { - height: 100%; - } -} - -// * Layout Content navbar -// ******************************************************************************* - -.layout-content-navbar { - .layout-page { - flex-basis: 100%; - flex-direction: column; - width: 0; - min-width: 0; - max-width: 100%; - } - - .content-wrapper { - width: 100%; - } -} - -// * Fixed and fixed off-canvas layout (Layout Fixed) -// ******************************************************************************* - -@include media-breakpoint-up(xl) { - // Menu - - .layout-menu-fixed, - .layout-menu-fixed-offcanvas { - .layout-menu { - position: fixed; - top: 0; - bottom: 0; - left: 0; - margin-right: 0 !important; - margin-left: 0 !important; - } - } - - // Container - - // Menu expanded - .layout-menu-fixed:not(.layout-menu-collapsed), - .layout-menu-fixed-offcanvas:not(.layout-menu-collapsed) { - .layout-page { - padding-left: $menu-width; - } - } -} - -// Reset paddings (for non fixed entities) -html:not(.layout-navbar-fixed):not(.layout-menu-fixed):not(.layout-menu-fixed-offcanvas) .layout-page, -html:not(.layout-navbar-fixed) .layout-content-navbar .layout-page { - padding-top: 0 !important; -} -html:not(.layout-footer-fixed) .content-wrapper { - padding-bottom: 0 !important; -} - -@include media-breakpoint-down(xl) { - .layout-menu-fixed .layout-wrapper.layout-navbar-full .layout-menu, - .layout-menu-fixed-offcanvas .layout-wrapper.layout-navbar-full .layout-menu { - top: 0 !important; - } - - html:not(.layout-navbar-fixed) .layout-navbar-full .layout-page { - padding-top: 0 !important; - } -} - -// * Fixed navbar layout -// ******************************************************************************* - -.layout-navbar-fixed { - .layout-navbar { - position: fixed; - top: 0; - right: 0; - left: 0; - } -} - -@include media-breakpoint-up(xl) { - // Fix navbar within Navbar Full layout in fixed mode - .layout-menu-fixed .layout-navbar-full .layout-navbar, - .layout-menu-fixed-offcanvas .layout-navbar-full .layout-navbar { - position: fixed; - top: 0; - right: 0; - left: 0; - } - - // Fix navbar within Content Navbar layout in fixed mode - Menu expanded - .layout-navbar-fixed:not(.layout-menu-collapsed), - .layout-menu-fixed.layout-navbar-fixed:not(.layout-menu-collapsed), - .layout-menu-fixed-offcanvas.layout-navbar-fixed:not(.layout-menu-collapsed) { - .layout-content-navbar:not(.layout-without-menu) .layout-navbar { - left: $menu-width; - } - } -} - -// * Fixed footer -// ******************************************************************************* - -.layout-footer-fixed .content-footer { - position: fixed; - bottom: 0; - left: 0; - right: 0; -} - -@include media-breakpoint-up(xl) { - // Fixed footer - Menu expanded - .layout-footer-fixed:not(.layout-menu-collapsed) { - .layout-wrapper:not(.layout-without-menu) .content-footer { - left: $menu-width; - } - } -} - -// * Small screens layout -// ******************************************************************************* - -@include media-breakpoint-down(xl) { - .layout-menu { - position: fixed !important; - top: 0 !important; - height: 100% !important; - left: 0 !important; - margin-right: 0 !important; - margin-left: 0 !important; - transform: translate3d(-100%, 0, 0); - will-change: transform, -webkit-transform; - - .layout-menu-expanded & { - transform: translate3d(0, 0, 0) !important; - } - } - - .layout-menu-expanded body { - overflow: hidden; - } - - .layout-overlay { - position: fixed; - top: 0; - right: 0; - height: 100% !important; - left: 0; - display: none; - background: $modal-backdrop-bg; - opacity: $modal-backdrop-opacity; - cursor: pointer; - - .layout-menu-expanded & { - display: block; - } - } - - .layout-menu-100vh .layout-menu, - .layout-menu-100vh .layout-overlay { - height: 100vh !important; - } -} - -// * Z-Indexes -// ******************************************************************************* - -// Navbar (fixed) -.layout-navbar-fixed body:not(.modal-open), -.layout-menu-fixed body:not(.modal-open), -.layout-menu-fixed-offcanvas body:not(.modal-open) { - .layout-navbar-full .layout-navbar { - z-index: $zindex-menu-fixed; - } - - .layout-content-navbar .layout-navbar { - z-index: $zindex-menu-fixed - 5; - } -} - -// Footer (fixed) -.layout-footer-fixed .content-footer { - z-index: $zindex-fixed; -} - -@include media-breakpoint-down(xl) { - .layout-menu { - z-index: $zindex-layout-mobile; - } - - .layout-overlay { - z-index: $zindex-layout-mobile - 1; - } -} - -@include media-breakpoint-up(xl) { - // Default expanded - - // Navbar full layout - .layout-navbar-full { - .layout-navbar { - z-index: 10; - } - - .layout-menu { - z-index: 9; - } - } - // Content Navbar layout - .layout-content-navbar { - .layout-navbar { - z-index: 9; - } - - .layout-menu { - z-index: 10; - } - } - - // Fixed - // Navbar full layout - .layout-menu-fixed body:not(.modal-open) .layout-navbar-full .layout-menu, - .layout-menu-fixed-offcanvas body:not(.modal-open) .layout-navbar-full .layout-menu { - z-index: $zindex-menu-fixed - 5; - } - // Content Navbar layout - .layout-navbar-fixed body:not(.modal-open) .layout-content-navbar .layout-menu, - .layout-menu-fixed body:not(.modal-open) .layout-content-navbar .layout-menu, - .layout-menu-fixed-offcanvas body:not(.modal-open) .layout-content-navbar .layout-menu { - z-index: $zindex-menu-fixed; - } -} - -// * Transitions and animations -// ******************************************************************************* - -// Disable navbar link hover transition -.layout-menu-link-no-transition { - .layout-menu .menu-link, - .layout-menu-horizontal .menu-link { - transition: none !important; - animation: none !important; - } -} - -// Disable navbar link hover transition -.layout-no-transition .layout-menu, -.layout-no-transition .layout-menu-horizontal { - &, - & .menu, - & .menu-item { - transition: none !important; - animation: none !important; - } -} - -@include media-breakpoint-down(xl) { - .layout-transitioning { - .layout-overlay { - animation: menuAnimation $menu-animation-duration; - } - - .layout-menu { - transition-duration: $menu-animation-duration; - transition-property: transform, -webkit-transform; - } - } -} - -@include media-breakpoint-up(xl) { - .layout-menu-collapsed:not(.layout-transitioning):not(.layout-menu-offcanvas):not(.layout-menu-fixed):not(.layout-menu-fixed-offcanvas) - .layout-menu { - transition-duration: $menu-animation-duration; - transition-property: margin-left, margin-right, width; - } - - .layout-transitioning { - &.layout-menu-offcanvas .layout-menu { - transition-duration: $menu-animation-duration; - transition-property: margin-left, margin-right, transform, -webkit-transform; - } - - &.layout-menu-fixed, - &.layout-menu-fixed-offcanvas { - .layout-page { - transition-duration: $menu-animation-duration; - transition-property: padding-left, padding-right; - } - } - - &.layout-menu-fixed { - .layout-menu { - transition: width $menu-animation-duration; - } - } - - &.layout-menu-fixed-offcanvas { - .layout-menu { - transition-duration: $menu-animation-duration; - transition-property: transform, -webkit-transform; - } - } - - &.layout-navbar-fixed .layout-content-navbar .layout-navbar, - &.layout-footer-fixed .content-footer { - transition-duration: $menu-animation-duration; - transition-property: left, right; - } - - &:not(.layout-menu-offcanvas):not(.layout-menu-fixed):not(.layout-menu-fixed-offcanvas) .layout-menu { - transition-duration: $menu-animation-duration; - transition-property: margin-left, margin-right, width; - } - } -} - -// Disable transitions/animations in IE 10-11 -@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { - .menu, - .layout-menu, - .layout-page, - .layout-navbar, - .content-footer { - transition: none !important; - transition-duration: 0s !important; - } - .layout-overlay { - animation: none !important; - } -} - -@include keyframes(menuAnimation) { - 0% { - opacity: 0; - } - 100% { - opacity: $modal-backdrop-opacity; - } -} diff --git a/scss/_components/_menu.scss b/scss/_components/_menu.scss deleted file mode 100644 index 13bf3328633813487d8f9a2977009b723521ad21..0000000000000000000000000000000000000000 --- a/scss/_components/_menu.scss +++ /dev/null @@ -1,346 +0,0 @@ -// Menu -// ******************************************************************************* - -.menu { - display: flex; - - .app-brand { - width: 100%; - } - - //PS Scrollbar - .ps__thumb-y, - .ps__rail-y { - width: 0.125rem !important; - } - - .ps__rail-y { - right: 0.25rem !important; - left: auto !important; - background: none !important; - } - - .ps__rail-y:hover, - .ps__rail-y:focus, - .ps__rail-y.ps--clicking, - .ps__rail-y:hover > .ps__thumb-y, - .ps__rail-y:focus > .ps__thumb-y, - .ps__rail-y.ps--clicking > .ps__thumb-y { - width: 0.375rem !important; - } -} - -.menu-inner { - display: flex; - align-items: flex-start; - justify-content: flex-start; - margin: 0; - padding: 0; - height: 100%; -} -.menu-inner-shadow { - display: none; - position: absolute; - top: $navbar-height + 0.35rem; - height: 3rem; - width: 100%; - pointer-events: none; - z-index: 2; - // Hide menu inner shadow in static layout - html:not(.layout-menu-fixed) & { - display: none !important; - } -} - -// Menu item - -.menu-item { - align-items: flex-start; - justify-content: flex-start; - - &.menu-item-animating { - transition: height $menu-animation-duration ease-in-out; - } -} - -.menu-item, -.menu-header, -.menu-divider, -.menu-block { - flex: 0 0 auto; - flex-direction: column; - margin: 0; - padding: 0; - list-style: none; -} -.menu-header { - opacity: 1; - transition: opacity $menu-animation-duration ease-in-out; -} - -// Menu Icon -.menu-icon { - flex-grow: 0; - flex-shrink: 0; - margin-right: $menu-icon-expanded-spacer; - font-size: $menu-icon-expanded-font-size; - .menu:not(.menu-no-animation) & { - transition: margin-right $menu-animation-duration ease; - } -} - -// Menu link -.menu-link { - position: relative; - display: flex; - align-items: center; - flex: 0 1 auto; - margin: 0; - - .menu-item.disabled & { - cursor: not-allowed !important; - } - // link hover animation - .menu:not(.menu-no-animation) & { - transition-duration: $menu-animation-duration; - transition-property: color, background-color; - } - - > :not(.menu-icon) { - flex: 0 1 auto; - opacity: 1; - .menu:not(.menu-no-animation) & { - transition: opacity $menu-animation-duration ease-in-out; - } - } -} - -// Sub menu -.menu-sub { - display: none; - flex-direction: column; - margin: 0; - padding: 0; - - .menu:not(.menu-no-animation) & { - transition: background-color $menu-animation-duration; - } - - .menu-item.open > & { - display: flex; - } -} - -// Menu toggle open/close arrow -.menu-toggle::after { - content: ''; - position: absolute; - top: 50%; - display: block; - width: $caret-width; - height: $caret-width; - border: 1px solid; - border-bottom: 0; - border-left: 0; - transform: translateY(-50%) rotate(45deg); - - .menu-item.open:not(.menu-item-closing) > & { - transform: translateY(-50%) rotate(135deg); - } - - .menu:not(.menu-no-animation) & { - transition-duration: $menu-animation-duration; - transition-property: -webkit-transform, transform; - } -} - -// Menu divider -.menu-divider { - width: 100%; - border: 0; - border-top: 1px solid; -} - -// Vertical Menu -// ******************************************************************************* - -.menu-vertical { - // overflow: hidden; - flex-direction: column; - - // menu expand collapse animation - &:not(.menu-no-animation) { - transition: width $menu-animation-duration; - } - - &, - .menu-block, - .menu-inner > .menu-item, - .menu-inner > .menu-header { - width: $menu-width; - } - - .menu-inner { - flex-direction: column; - flex: 1 1 auto; - - > .menu-item { - margin: $menu-item-spacer 0; - // Sneat menu-link spacing - .menu-link { - margin: $menu-vertical-link-margin-y $menu-vertical-link-margin-x; - } - } - } - - .menu-item .menu-link, - .menu-block { - padding: $menu-vertical-link-padding-y $menu-vertical-link-padding-x; - } - // Sneat menu-header spacing - .menu-header { - margin: $menu-vertical-header-margin-y 0 $menu-vertical-header-margin-y / 2 0; - padding: $menu-vertical-link-padding-y $menu-vertical-link-padding-x * 2 $menu-vertical-link-padding-y - $menu-vertical-link-padding-x * 2; - } - .menu-item .menu-link { - font-size: $menu-font-size; - } - - .menu-item.active:not(.open) > { - .menu-link { - font-weight: $font-weight-semibold; - } - } - .menu-item .menu-toggle { - padding-right: calc(#{$menu-vertical-link-padding-x} + #{$caret-width * 3}); - - &::after { - right: $menu-vertical-link-padding-x; - } - } - - .menu-divider { - margin-top: $menu-vertical-link-padding-y; - margin-bottom: $menu-vertical-link-padding-y; - padding: 0; - } - - .menu-sub { - padding-top: $menu-vertical-menu-link-padding-y / 2; - padding-bottom: $menu-vertical-menu-link-padding-y / 2; - - .menu-link { - padding-top: $menu-vertical-menu-link-padding-y; - padding-bottom: $menu-vertical-menu-link-padding-y; - } - } - - .menu-icon { - width: $menu-icon-expanded-width; - } - - .menu-sub .menu-icon { - margin-right: 0; - - @include media-breakpoint-down(xl) { - display: none; - } - } - - .menu-horizontal-wrapper { - flex: none; - } - - // Levels - // - - $menu-first-level-spacer: $menu-vertical-link-padding-x + $menu-icon-expanded-width + $menu-icon-expanded-spacer; - - .menu-sub .menu-link { - padding-left: $menu-first-level-spacer; - } - // Menu levels loop for padding left/right - @for $i from 2 through $menu-max-levels { - $selector: ''; - - @for $l from 1 through $i { - $selector: '#{$selector} .menu-sub'; - } - - #{$selector} .menu-link { - padding-left: $menu-first-level-spacer + ($menu-vertical-menu-level-spacer * ($i - 1)); - } - } -} - -// Vertical Menu Collapsed -// ******************************************************************************* -// ! Updated menu collapsed styles for sneat in this mixin -@mixin layout-menu-collapsed() { - width: $menu-collapsed-width; - - .menu-inner > .menu-item { - width: $menu-collapsed-width; - } - .menu-inner > .menu-item > .menu-link { - padding-left: $menu-vertical-link-margin-x; - } - - .menu-inner > .menu-header, - .menu-block { - position: relative; - margin-left: $menu-vertical-header-margin-y; - padding-right: ($menu-vertical-link-padding-x * 2) - $menu-icon-expanded-spacer; - padding-left: $menu-icon-expanded-spacer; - width: $menu-width; - text-indent: -9999px; - text-overflow: ellipsis; - white-space: nowrap; - .menu-header-text { - overflow: hidden; - opacity: 0; - } - - &::before { - content: ''; - position: absolute; - left: ($menu-collapsed-width * 0.5) - $menu-vertical-header-margin-y - 0.5; - display: block; - width: 1rem; - text-align: center; - top: 1.1875rem; - } - } - // Custom for sneat only - .menu-block { - &::before { - bottom: 0.75rem; - } - } - .menu-inner > .menu-item div:not(.menu-block) { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - opacity: 0; - } - .menu-inner > .menu-item > .menu-sub, - .menu-inner > .menu-item.open > .menu-sub { - display: none; - } - .menu-inner > .menu-item > .menu-toggle::after { - display: none; - } - - .menu-inner > .menu-item > .menu-link .menu-icon { - margin-left: -($menu-vertical-link-margin-x * 2); - width: $menu-collapsed-width; - text-align: center; - margin-right: 0; - } -} - -// Only for menu example -.menu-collapsed:not(:hover) { - @include layout-menu-collapsed(); -} diff --git a/scss/_components/_mixins.scss b/scss/_components/_mixins.scss deleted file mode 100644 index df8b90b8c16a20e1e2c218c0a47e814e48b7481a..0000000000000000000000000000000000000000 --- a/scss/_components/_mixins.scss +++ /dev/null @@ -1,6 +0,0 @@ -@import 'mixins/navbar'; -@import 'mixins/footer'; -@import 'mixins/menu'; -@import 'mixins/avatar'; -@import 'mixins/text-divider'; -@import 'mixins/misc'; diff --git a/scss/_components/_text-divider.scss b/scss/_components/_text-divider.scss deleted file mode 100644 index d086612064a8b085999de439f7c834b297c57f58..0000000000000000000000000000000000000000 --- a/scss/_components/_text-divider.scss +++ /dev/null @@ -1,89 +0,0 @@ -// Divider -// ******************************************************************************* - -@import '../../scss/_custom-variables/libs'; - -.divider { - display: block; - text-align: center; - margin: $divider-margin-y $divider-margin-x; - overflow: hidden; - white-space: nowrap; - - .divider-text { - position: relative; - display: inline-block; - font-size: $divider-font-size; - padding: $divider-text-padding-y $divider-text-padding-x; - - i { - font-size: $divider-icon-size; - } - - &:before, - &:after { - content: ''; - position: absolute; - top: 50%; - width: 100vw; - border-top: 1px solid $divider-color; - } - - &:before { - right: 100%; - } - - &:after { - left: 100%; - } - } - &.text-start { - .divider-text { - padding-left: 0; - } - } - &.text-end { - .divider-text { - padding-right: 0; - } - } - &.text-start-center { - .divider-text { - left: -25%; - } - } - &.text-end-center { - .divider-text { - right: -25%; - } - } - // Dotted Bordered Divider - &.divider-dotted { - .divider-text { - &:before, - &:after { - border-style: dotted; - border-width: 0 1px 1px; - border-color: $divider-color; - } - } - } - // Dashed Bordered Divider - &.divider-dashed { - .divider-text { - &:before, - &:after { - border-style: dashed; - border-width: 0 1px 1px; - border-color: $divider-color; - } - } - } -} - -// For Contextual Colors -@each $color, $value in $theme-colors { - @if $color !=primary and $color !=light { - @include template-text-divider-variant('.divider.divider-#{$color}', $value); - } -} diff --git a/scss/_components/_variables.scss b/scss/_components/_variables.scss deleted file mode 100644 index 66d36677d1d034bf9b506c44d784170fdfb09fd4..0000000000000000000000000000000000000000 --- a/scss/_components/_variables.scss +++ /dev/null @@ -1,93 +0,0 @@ -// Common -// ******************************************************************************* - -$ui-star-size: 1.1em !default; -$ui-stars-spacer: -0.1em !default; -$ui-star-filled-color: $yellow !default; - -// Navbar (custom navbar) -// ******************************************************************************* -$navbar-height: 3.875rem !default; -$navbar-suggestion-width: 96% !default; -$navbar-suggestion-height: 28rem !default; -$navbar-suggestion-border-radius: 0.5rem !default; -$navbar-dropdown-width: 22rem !default; -$navbar-dropdown-content-height: 30rem !default; -$navbar-notifications-dropdown-item-padding: 1rem !default; - -// Menu -// ******************************************************************************* - -$menu-width: 16.25rem !default; -$menu-collapsed-width: 5.25rem !default; - -$menu-font-size: $font-size-base !default; - -$menu-item-spacer: 0.0625rem !default; - -$menu-vertical-link-margin-y: 0rem !default; -$menu-vertical-link-margin-x: 1rem !default; - -$menu-vertical-header-margin-y: 1rem !default; -$menu-vertical-header-margin-x: 0 !default; - -$menu-vertical-link-padding-y: 0.625rem !default; -$menu-vertical-link-padding-x: 1rem !default; - -$menu-vertical-menu-link-padding-y: 0.625rem !default; -$menu-vertical-menu-level-spacer: 0.65rem !default; - -$menu-horizontal-item-spacer: 0.325rem !default; -$menu-horizontal-link-padding-y: 0.565rem !default; -$menu-horizontal-link-padding-x: 1rem !default; -$menu-horizontal-menu-link-padding-y: 0.625rem !default; -$menu-horizontal-menu-level-spacer: 2.35rem !default; -$menu-horizontal-menu-box-shadow: $dropdown-box-shadow !default; - -$menu-sub-width: 14.5rem !default; -$menu-control-width: 2.25rem !default; -$menu-control-arrow-size: 0.5rem !default; - -$menu-icon-expanded-width: 1.5rem !default; -$menu-icon-expanded-font-size: 1.25rem !default; -$menu-icon-expanded-spacer: 0.5rem !default; - -$menu-animation-duration: 0.3s !default; - -$menu-max-levels: 5 !default; - -$menu-dark-border-color: rgba(255, 255, 255, 0.2) !default; -$menu-dark-menu-bg: rgba(0, 0, 0, 0.06) !default; -$menu-light-border-color: rgba(0, 0, 0, 0.06) !default; -$menu-light-menu-bg: rgba(0, 0, 0, 0.05) !default; - -// Avatars -// ******************************************************************************* - -$avatar-size-xl: 4.5rem !default; -$avatar-size-lg: 4rem !default; -$avatar-size-md: 3rem !default; -$avatar-size: 2.375rem !default; // Default -$avatar-size-sm: 2rem !default; -$avatar-size-xs: 1.625rem !default; - -$avatar-initial-xl: 1.875rem !default; -$avatar-initial-lg: 1.5rem !default; -$avatar-initial-md: 1.125rem !default; -$avatar-initial-sm: 0.75rem !default; -$avatar-initial-xs: 0.625rem !default; - -$avatar-group-border: $white !default; - -// Text Divider -// ******************************************************************************* -$divider-color: $gray-200 !default; - -$divider-margin-y: 1rem !default; -$divider-margin-x: 0 !default; - -$divider-text-padding-y: 0rem !default; -$divider-text-padding-x: 1rem !default; - -$divider-font-size: 0.8rem !default; -$divider-icon-size: 1rem !default; diff --git a/scss/_components/mixins/_app-brand.scss b/scss/_components/mixins/_app-brand.scss deleted file mode 100644 index 7d72da3080f5c36a838c00568f589807880ff006..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_app-brand.scss +++ /dev/null @@ -1,31 +0,0 @@ -// Within menu -@mixin template-app-brand-collapsed() { - .app-brand { - width: $menu-collapsed-width; - } - - .app-brand-logo, - .app-brand-link, - .app-brand-text { - margin-right: auto; - margin-left: auto; - } - - .app-brand-logo ~ .app-brand-text { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - opacity: 0; - } - .app-brand .layout-menu-toggle { - display: none !important; - } - - .app-brand-img { - display: none; - } - - .app-brand-img-collapsed { - display: block; - } -} diff --git a/scss/_components/mixins/_avatar.scss b/scss/_components/mixins/_avatar.scss deleted file mode 100644 index 2941376fdd3a94a24f20816d5a84623781916a20..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_avatar.scss +++ /dev/null @@ -1,22 +0,0 @@ -// Avatar -// ******************************************************************************* - -@mixin template-avatar-style($height, $width, $font-size, $status-indicator-position: 2px) { - width: $width; - height: $height; - - .avatar-initial { - font-size: $font-size; - } - - &.avatar-online, - &.avatar-offline, - &.avatar-away, - &.avatar-busy { - &:after { - width: $width * 0.2; - height: $height * 0.2; - right: $status-indicator-position; - } - } -} diff --git a/scss/_components/mixins/_footer.scss b/scss/_components/mixins/_footer.scss deleted file mode 100644 index ceb114f353f53c6bffef21e370f6703b2e3d2fc2..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_footer.scss +++ /dev/null @@ -1,39 +0,0 @@ -// Footer -// ******************************************************************************* - -@mixin template-footer-style($parent, $bg, $color: null, $active-color: null, $border: null) { - $colors: get-navbar-prop($bg, $active-color, $color, $border); - - #{$parent} { - background-color: map-get($colors, bg) !important; - color: map-get($colors, color); - - .footer-link { - color: map-get($colors, color); - - &:hover, - &:focus { - color: map-get($colors, active-color); - } - - &.disabled { - color: map-get($colors, disabled-color) !important; - } - } - - .footer-text { - color: map-get($colors, active-color); - } - - .show > .footer-link, - .active > .footer-link, - .footer-link.show, - .footer-link.active { - color: map-get($colors, active-color); - } - - hr { - border-color: map-get($colors, border); - } - } -} diff --git a/scss/_components/mixins/_menu.scss b/scss/_components/mixins/_menu.scss deleted file mode 100644 index 154640640569d16a38de1c7273e1dcd154e7077a..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_menu.scss +++ /dev/null @@ -1,118 +0,0 @@ -// Menu -// ******************************************************************************* - -@mixin template-menu-style($parent, $bg, $color: null, $active-color: null, $border: null, $active-bg: null) { - $colors: get-navbar-prop($bg, $active-color, $color, $border); - $contrast-percent: map-get($colors, contrast-percent); - - @if not $active-bg { - $active-bg: rgba-to-hex( - rgba(map-get($colors, bg), 1 - if($contrast-percent < 0.75, 0.025, 0.05)), - if($contrast-percent > 0.25, #fff, #000) - ); - } - - $menu-active-bg: rgba-to-hex( - rgba($active-bg, 1 - if($contrast-percent < 0.75, 0.025, 0.05)), - if($contrast-percent > 0.25, #fff, #000) - ); - - #{$parent} { - background-color: map-get($colors, bg) !important; - color: map-get($colors, color); - - .menu-link, - .menu-horizontal-prev, - .menu-horizontal-next { - color: map-get($colors, color); - &:hover, - &:focus { - color: map-get($colors, active-color); - } - - &.active { - color: map-get($colors, active-color); - } - } - - .menu-item.disabled .menu-link, - .menu-horizontal-prev.disabled, - .menu-horizontal-next.disabled { - color: map-get($colors, disabled-color) !important; - } - - .menu-item.open:not(.menu-item-closing) > .menu-toggle, - .menu-item.active > .menu-link { - color: map-get($colors, active-color); - } - - //vertical menu active item bg color - .menu-item.active > .menu-link:not(.menu-toggle) { - background-color: $active-bg; - } - - //- - &.menu-horizontal .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle) { - background-color: $menu-active-bg; - } - - &.menu-horizontal .menu-inner .menu-item:not(.menu-item-closing) > .menu-sub, - &.menu-horizontal .menu-inner .menu-item.open > .menu-toggle { - background: $active-bg; - } - - .menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-sub, - .menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-toggle { - background: transparent; - color: map-get($colors, color); - } - - .menu-inner-shadow { - background: linear-gradient($bg 41%, rgba($bg, 0.11) 95%, rgba($bg, 0)); - } - - .menu-text { - color: map-get($colors, active-color); - } - - .menu-header { - color: map-get($colors, muted-color); - } - - hr, - .menu-divider, - .menu-inner > .menu-item.open > .menu-sub::before { - border-color: map-get($colors, border) !important; - } - - .menu-inner > .menu-header::before { - background-color: map-get($colors, border); - } - - .menu-block::before { - background-color: map-get($colors, muted-color); - } - - //- - .menu-inner > .menu-item.open .menu-item.open > .menu-toggle::before { - background-color: rgba-to-hex(map-get($colors, border), $active-bg); - } - - .menu-inner > .menu-item.open .menu-item.active > .menu-link::before { - background-color: map-get($colors, active-color); - } - - .menu-inner > .menu-item.open .menu-item.open > .menu-toggle::before, - .menu-inner > .menu-item.open .menu-item.active > .menu-link::before { - box-shadow: 0 0 0 2px $active-bg; - } - - .ps__thumb-y, - .ps__rail-y.ps--clicking > .ps__thumb-y { - background: rgba( - map-get($colors, active-color), - if($contrast-percent > 0.75, map-get($colors, opacity) - 0.4, map-get($colors, opacity) - 0.2) - ) !important; - } - } -} diff --git a/scss/_components/mixins/_misc.scss b/scss/_components/mixins/_misc.scss deleted file mode 100644 index f45340d55ca45b9be1c14d037f0cdd5fcaf72d5f..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_misc.scss +++ /dev/null @@ -1,6 +0,0 @@ -// SVG Color -@mixin template-svg-color($background) { - .svg-illustration svg { - fill: $background; - } -} diff --git a/scss/_components/mixins/_navbar.scss b/scss/_components/mixins/_navbar.scss deleted file mode 100644 index e9ccc8216f9c268e65b2c3efbe7a991bbdf87a42..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_navbar.scss +++ /dev/null @@ -1,90 +0,0 @@ -// Navbar -// ******************************************************************************* - -@mixin template-navbar-style($parent, $bg, $color: null, $active-color: null, $border: null) { - $colors: get-navbar-prop($bg, $active-color, $color, $border); - - #{$parent} { - background-color: map-get($colors, bg) !important; - color: map-get($colors, color); - - .navbar-brand, - .navbar-brand a { - color: map-get($colors, active-color); - - &:hover, - &:focus { - color: map-get($colors, active-color); - } - } - - // Navbar search color - .navbar-search-wrapper { - .navbar-search-icon, - .search-input { - color: map-get($colors, color); - } - } - .search-input-wrapper { - .search-input, - .search-toggler { - background-color: $bg !important; - color: map-get($colors, color); - } - } - - .navbar-nav { - > .nav-link, - > .nav-item > .nav-link, - > .nav > .nav-item > .nav-link { - color: map-get($colors, color); - - &:hover, - &:focus { - color: map-get($colors, active-color); - } - - &.disabled { - color: map-get($colors, disabled-color) !important; - } - } - - .show > .nav-link, - .active > .nav-link, - .nav-link.show, - .nav-link.active { - color: map-get($colors, active-color); - } - } - - .navbar-toggler { - color: map-get($colors, color); - border-color: map-get($colors, border); - } - - .navbar-toggler-icon { - background-image: if( - map-get($colors, active-color) == #fff, - $navbar-dark-toggler-icon-bg, - $navbar-light-toggler-icon-bg - ); - } - - .navbar-text { - color: map-get($colors, color); - - a { - color: map-get($colors, active-color); - - &:hover, - &:focus { - color: map-get($colors, active-color); - } - } - } - - hr { - border-color: map-get($colors, border); - } - } -} diff --git a/scss/_components/mixins/_text-divider.scss b/scss/_components/mixins/_text-divider.scss deleted file mode 100644 index 08ab3dd5b5d66bfadfb6bd292a557dbee2348819..0000000000000000000000000000000000000000 --- a/scss/_components/mixins/_text-divider.scss +++ /dev/null @@ -1,16 +0,0 @@ -// Text Divider -// ******************************************************************************* - -@mixin template-text-divider-variant($divider-color, $background) { - $divider-selector: if($divider-color== '', '', '#{$divider-color}'); - .divider { - &#{$divider-selector} { - .divider-text { - &:before, - &:after { - border-color: $background; - } - } - } - } -} diff --git a/scss/_custom-variables/_bootstrap-extended.scss b/scss/_custom-variables/_bootstrap-extended.scss deleted file mode 100644 index 4cf66dfe1299d3537f5294710c33f7b771b76dc4..0000000000000000000000000000000000000000 --- a/scss/_custom-variables/_bootstrap-extended.scss +++ /dev/null @@ -1,6 +0,0 @@ -// =================================================================================================================== -// ? TIP: It is recommended to use this file for overriding bootstrap extended variables (_bootstrap-extended/_variables.scss). -// Copy and paste variables as needed, modify their values, and remove the !default flag. -// =================================================================================================================== - -// $font-size-root: 14px; \ No newline at end of file diff --git a/scss/_custom-variables/_components.scss b/scss/_custom-variables/_components.scss deleted file mode 100644 index b2d395531338527b6d320ddf7b458cf1326d693b..0000000000000000000000000000000000000000 --- a/scss/_custom-variables/_components.scss +++ /dev/null @@ -1,6 +0,0 @@ -// ================================================================================================ -// ? TIP: It is recommended to use this file for overriding component variables (_components/_variables.scss). -// Copy and paste variables as needed, modify their values, and remove the !default flag. -// ================================================================================================ - -// $menu-width: 14rem; \ No newline at end of file diff --git a/scss/_custom-variables/_libs.scss b/scss/_custom-variables/_libs.scss deleted file mode 100644 index 0235932654ab382f9001e05882679ef2edd723f6..0000000000000000000000000000000000000000 --- a/scss/_custom-variables/_libs.scss +++ /dev/null @@ -1,8 +0,0 @@ -// ================================================================================================ -// ? TIP: It is recommended to use this file for overriding any library variables from (libs/) folder. -// Copy and paste variables as needed, modify their values, and remove the !default flag. -// ================================================================================================ - -@import 'support'; - -// $flatpickr-content-padding: 0.5rem; \ No newline at end of file diff --git a/scss/_custom-variables/_pages.scss b/scss/_custom-variables/_pages.scss deleted file mode 100644 index f72a574a9ca204fb5f3f2d3a4f130aadfba1e97d..0000000000000000000000000000000000000000 --- a/scss/_custom-variables/_pages.scss +++ /dev/null @@ -1,8 +0,0 @@ -// ================================================================================================ -// ? TIP: It is recommended to use this file for overriding any pages variables from the (pages/) folder. -// Copy and paste variables as needed, modify their values, and remove the !default flag. -// ================================================================================================ - -@import 'support'; - -// $calender-sidebar-width: 20rem; \ No newline at end of file diff --git a/scss/_custom-variables/_support.scss b/scss/_custom-variables/_support.scss deleted file mode 100644 index 1a0eafcc438ce569eb695860f0838f83f67e642f..0000000000000000000000000000000000000000 --- a/scss/_custom-variables/_support.scss +++ /dev/null @@ -1,9 +0,0 @@ -$enable-light-style: true; - -@mixin app-ltr($has-child: true) { - @content; -} - -@mixin app-ltr-style() { - @content; -} diff --git a/scss/_theme/_common.scss b/scss/_theme/_common.scss deleted file mode 100644 index 560c7bba6023f0530933b2f00b39cad3bc66882c..0000000000000000000000000000000000000000 --- a/scss/_theme/_common.scss +++ /dev/null @@ -1,49 +0,0 @@ -// Theme mixin -// ******************************************************************************* - -@mixin template-common-theme($background, $color: null) { - @include text-variant('.text-primary', $background); - @include bg-variant('.bg-primary', $background); - @include bg-label-variant('.bg-label-primary', $background); - @include border-label-variant('.border-label-primary', $background); - @include border-light-variant('.border-light-primary', $background); - @include template-pagination-theme($background, $color); - @include template-progress-bar-theme($background, $color); - @include template-list-group-theme($background, $color); - @include template-alert-variant('.alert-primary', $background); - - // Need to add shift-color as BS5 updated with table variant colors like this - - @include template-table-variant('primary', shift-color($background, $table-bg-scale)); - @include template-button-variant('.btn-primary', $background, $color); - @include template-button-outline-variant('.btn-outline-primary', $background, $color); - @include template-dropdown-theme(rgba($background, 0.08), $background); - @include template-nav-theme($background, $color); - @include template-form-control-theme($background); - @include template-form-check-theme($background, $color); - @include template-form-switch-theme($background); - @include template-file-input-theme($background); - - @include template-text-divider-variant('.divider-primary', $background); - - @include template-navbar-style('.navbar.bg-primary', $primary-color); - @include template-menu-style('.menu.bg-primary', $primary-color); - @include template-footer-style('.footer.bg-primary', $primary-color); - @include template-toast-theme('.bg-primary', $primary-color, $color); - @include template-float-label-theme($primary-color); - @include template-svg-color($primary-color); - - html:not([dir='rtl']) .border-primary, - html[dir='rtl'] .border-primary { - border-color: $background !important; - } - a { - color: $background; - &:hover { - color: tint-color($background, 10%); - } - } - .fill-primary { - fill: $background; - } -} diff --git a/scss/_theme/_theme.scss b/scss/_theme/_theme.scss deleted file mode 100644 index bf2dd696d8b319ff967a5da369c558dee6c0ff83..0000000000000000000000000000000000000000 --- a/scss/_theme/_theme.scss +++ /dev/null @@ -1,123 +0,0 @@ -// ? Theme related styles common styles - -@import '../_components/include'; - -// Space above detached navbar (vertical layout only) -.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal) .layout-page:before { - content: ''; - width: 100%; - height: 0.75rem; - position: fixed; - top: 0px; - z-index: 10; -} - -.bg-menu-theme { - // Menu header - .menu-header { - position: relative; - &:before { - content: ''; - position: absolute; - left: 0; - top: 1.1875rem; - width: 1rem; - height: 1px; - transition: all $menu-animation-duration ease-in-out; - } - } - - .menu-inner .menu-item .menu-link { - .layout-wrapper:not(.layout-horizontal) & { - border-radius: $border-radius; - } - } - .menu-inner > .menu-item > .menu-link { - .layout-horizontal & { - border-radius: $border-radius; - } - } - - .menu-inner > { - // Spacing and Box-shadow only for horizontal menu above lg screen - @include media-breakpoint-up(xl) { - .menu-item { - .layout-horizontal & { - margin: $menu-horizontal-link-padding-y 0; - &:not(:first-child) { - margin-left: $menu-item-spacer; - } - &:not(:last-child) { - margin-right: $menu-item-spacer; - } - .menu-sub { - box-shadow: $menu-horizontal-menu-box-shadow; - } - } - } - } - .menu-item.active:before { - .layout-wrapper:not(.layout-horizontal) & { - content: ''; - position: absolute; - right: 0; - width: 0.25rem; - height: 2.5rem; - border-radius: $border-radius 0 0 $border-radius; - } - } - } - - // Sub menu item link bullet - .menu-sub > .menu-item > .menu-link:before { - content: ''; - position: absolute; - left: 1.4375rem; - width: 0.375rem; - height: 0.375rem; - border-radius: 50%; - - // For horizontal layout - .layout-horizontal & { - left: 1.3rem; - } - } - // ? Hide bullet from first child only as we display icon instead (horizontal) - .menu-horizontal-wrapper > .menu-inner > .menu-item > .menu-sub > .menu-item > .menu-link:before { - display: none; - } - // Sub menu item link active bullet - .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle):before { - left: 1.1875rem; - width: 0.875rem; - height: 0.875rem; - - // For horizontal layout - .layout-horizontal & { - left: 1.1rem; - } - } -} - -.layout-menu-hover .layout-menu { - box-shadow: $box-shadow-lg; - transition: all $menu-animation-duration ease-in-out; -} - -.app-brand .layout-menu-toggle { - position: absolute; - left: $menu-width - 1.25rem; - border-radius: 50%; - - i { - width: 1.5rem; - height: 1.5rem; - transition: all $menu-animation-duration ease-in-out; - } - @include media-breakpoint-down(xl) { - display: none !important; - .layout-menu-expanded & { - display: block !important; - } - } -} diff --git a/scss/core.scss b/scss/core.scss deleted file mode 100644 index dae07615c1278597e1dd6f00cc30665800be43f4..0000000000000000000000000000000000000000 --- a/scss/core.scss +++ /dev/null @@ -1,4 +0,0 @@ -@import 'bootstrap'; -@import 'bootstrap-extended'; -@import 'components'; -@import 'colors'; diff --git a/scss/pages/page-account-settings.scss b/scss/pages/page-account-settings.scss deleted file mode 100644 index 03ceb70fc53912029ca8efcf2a2564cf9d4ae060..0000000000000000000000000000000000000000 --- a/scss/pages/page-account-settings.scss +++ /dev/null @@ -1,13 +0,0 @@ -// * Account Settings -// ******************************************************************************* - -@import '../_custom-variables/pages'; -@import '../_bootstrap-extended/include'; - -.api-key-actions { - position: absolute !important; - top: 0.75rem; - @include app-ltr() { - right: 0.5rem; - } -} diff --git a/scss/pages/page-auth.scss b/scss/pages/page-auth.scss deleted file mode 100644 index d36eef7eeb0117327127a225147a0bc5515ca56e..0000000000000000000000000000000000000000 --- a/scss/pages/page-auth.scss +++ /dev/null @@ -1,106 +0,0 @@ -// * Authentication -// ******************************************************************************* - -@use '../_bootstrap-extended/include' as light; -@import '../_custom-variables/pages'; - -$authentication-1-inner-max-width: 400px !default; -$auth-basic-top-svg: "data:image/svg+xml,%3Csvg width='148px' height='148px' viewBox='0 0 148 148' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath d='M355,144 C356.104569,144 357,144.895431 357,146 C357,147.104569 356.104569,148 355,148 C353.895431,148 353,147.104569 353,146 C353,144.895431 353.895431,144 355,144 Z M382,144 C383.104569,144 384,144.895431 384,146 C384,147.104569 383.104569,148 382,148 C380.895431,148 380,147.104569 380,146 C380,144.895431 380.895431,144 382,144 Z M412,144 C413.104569,144 414,144.895431 414,146 C414,147.104569 413.104569,148 412,148 C410.895431,148 410,147.104569 410,146 C410,144.895431 410.895431,144 412,144 Z M442,144 C443.104569,144 444,144.895431 444,146 C444,147.104569 443.104569,148 442,148 C440.895431,148 440,147.104569 440,146 C440,144.895431 440.895431,144 442,144 Z M472,144 C473.104569,144 474,144.895431 474,146 C474,147.104569 473.104569,148 472,148 C470.895431,148 470,147.104569 470,146 C470,144.895431 470.895431,144 472,144 Z M499,144 C500.104569,144 501,144.895431 501,146 C501,147.104569 500.104569,148 499,148 C497.895431,148 497,147.104569 497,146 C497,144.895431 497.895431,144 499,144 Z M355,117 C356.104569,117 357,117.895431 357,119 C357,120.104569 356.104569,121 355,121 C353.895431,121 353,120.104569 353,119 C353,117.895431 353.895431,117 355,117 Z M382,117 C383.104569,117 384,117.895431 384,119 C384,120.104569 383.104569,121 382,121 C380.895431,121 380,120.104569 380,119 C380,117.895431 380.895431,117 382,117 Z M412,117 C413.104569,117 414,117.895431 414,119 C414,120.104569 413.104569,121 412,121 C410.895431,121 410,120.104569 410,119 C410,117.895431 410.895431,117 412,117 Z M442,117 C443.104569,117 444,117.895431 444,119 C444,120.104569 443.104569,121 442,121 C440.895431,121 440,120.104569 440,119 C440,117.895431 440.895431,117 442,117 Z M472,117 C473.104569,117 474,117.895431 474,119 C474,120.104569 473.104569,121 472,121 C470.895431,121 470,120.104569 470,119 C470,117.895431 470.895431,117 472,117 Z M499,117 C500.104569,117 501,117.895431 501,119 C501,120.104569 500.104569,121 499,121 C497.895431,121 497,120.104569 497,119 C497,117.895431 497.895431,117 499,117 Z M355,87 C356.104569,87 357,87.8954305 357,89 C357,90.1045695 356.104569,91 355,91 C353.895431,91 353,90.1045695 353,89 C353,87.8954305 353.895431,87 355,87 Z M382,87 C383.104569,87 384,87.8954305 384,89 C384,90.1045695 383.104569,91 382,91 C380.895431,91 380,90.1045695 380,89 C380,87.8954305 380.895431,87 382,87 Z M412,87 C413.104569,87 414,87.8954305 414,89 C414,90.1045695 413.104569,91 412,91 C410.895431,91 410,90.1045695 410,89 C410,87.8954305 410.895431,87 412,87 Z M442,87 C443.104569,87 444,87.8954305 444,89 C444,90.1045695 443.104569,91 442,91 C440.895431,91 440,90.1045695 440,89 C440,87.8954305 440.895431,87 442,87 Z M472,87 C473.104569,87 474,87.8954305 474,89 C474,90.1045695 473.104569,91 472,91 C470.895431,91 470,90.1045695 470,89 C470,87.8954305 470.895431,87 472,87 Z M499,87 C500.104569,87 501,87.8954305 501,89 C501,90.1045695 500.104569,91 499,91 C497.895431,91 497,90.1045695 497,89 C497,87.8954305 497.895431,87 499,87 Z M355,57 C356.104569,57 357,57.8954305 357,59 C357,60.1045695 356.104569,61 355,61 C353.895431,61 353,60.1045695 353,59 C353,57.8954305 353.895431,57 355,57 Z M472,57 C473.104569,57 474,57.8954305 474,59 C474,60.1045695 473.104569,61 472,61 C470.895431,61 470,60.1045695 470,59 C470,57.8954305 470.895431,57 472,57 Z M412,57 C413.104569,57 414,57.8954305 414,59 C414,60.1045695 413.104569,61 412,61 C410.895431,61 410,60.1045695 410,59 C410,57.8954305 410.895431,57 412,57 Z M499,57 C500.104569,57 501,57.8954305 501,59 C501,60.1045695 500.104569,61 499,61 C497.895431,61 497,60.1045695 497,59 C497,57.8954305 497.895431,57 499,57 Z M382,57 C383.104569,57 384,57.8954305 384,59 C384,60.1045695 383.104569,61 382,61 C380.895431,61 380,60.1045695 380,59 C380,57.8954305 380.895431,57 382,57 Z M442,57 C443.104569,57 444,57.8954305 444,59 C444,60.1045695 443.104569,61 442,61 C440.895431,61 440,60.1045695 440,59 C440,57.8954305 440.895431,57 442,57 Z M355,27 C356.104569,27 357,27.8954305 357,29 C357,30.1045695 356.104569,31 355,31 C353.895431,31 353,30.1045695 353,29 C353,27.8954305 353.895431,27 355,27 Z M382,27 C383.104569,27 384,27.8954305 384,29 C384,30.1045695 383.104569,31 382,31 C380.895431,31 380,30.1045695 380,29 C380,27.8954305 380.895431,27 382,27 Z M412,27 C413.104569,27 414,27.8954305 414,29 C414,30.1045695 413.104569,31 412,31 C410.895431,31 410,30.1045695 410,29 C410,27.8954305 410.895431,27 412,27 Z M442,27 C443.104569,27 444,27.8954305 444,29 C444,30.1045695 443.104569,31 442,31 C440.895431,31 440,30.1045695 440,29 C440,27.8954305 440.895431,27 442,27 Z M472,27 C473.104569,27 474,27.8954305 474,29 C474,30.1045695 473.104569,31 472,31 C470.895431,31 470,30.1045695 470,29 C470,27.8954305 470.895431,27 472,27 Z M499,27 C500.104569,27 501,27.8954305 501,29 C501,30.1045695 500.104569,31 499,31 C497.895431,31 497,30.1045695 497,29 C497,27.8954305 497.895431,27 499,27 Z M355,0 C356.104569,0 357,0.8954305 357,2 C357,3.1045695 356.104569,4 355,4 C353.895431,4 353,3.1045695 353,2 C353,0.8954305 353.895431,0 355,0 Z M382,0 C383.104569,0 384,0.8954305 384,2 C384,3.1045695 383.104569,4 382,4 C380.895431,4 380,3.1045695 380,2 C380,0.8954305 380.895431,0 382,0 Z M412,0 C413.104569,0 414,0.8954305 414,2 C414,3.1045695 413.104569,4 412,4 C410.895431,4 410,3.1045695 410,2 C410,0.8954305 410.895431,0 412,0 Z M442,0 C443.104569,0 444,0.8954305 444,2 C444,3.1045695 443.104569,4 442,4 C440.895431,4 440,3.1045695 440,2 C440,0.8954305 440.895431,0 442,0 Z M472,0 C473.104569,0 474,0.8954305 474,2 C474,3.1045695 473.104569,4 472,4 C470.895431,4 470,3.1045695 470,2 C470,0.8954305 470.895431,0 472,0 Z M499,0 C500.104569,0 501,0.8954305 501,2 C501,3.1045695 500.104569,4 499,4 C497.895431,4 497,3.1045695 497,2 C497,0.8954305 497.895431,0 499,0 Z' id='path-1'%3E%3C/path%3E%3C/defs%3E%3Cg id='📝-Pages' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Login---V2' transform='translate(-822.000000, -197.000000)'%3E%3Cg id='top-illustration' transform='translate(469.000000, 197.000000)'%3E%3Cuse fill='currentColor' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.6' fill='%23FFFFFF' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"; -$auth-basic-bottom-svg: "data:image/svg+xml,%3Csvg width='243px' height='240px' viewBox='0 0 243 240' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath d='M34.5,182 C35.8807119,182 37,183.119288 37,184.5 C37,185.880712 35.8807119,187 34.5,187 C33.1192881,187 32,185.880712 32,184.5 C32,183.119288 33.1192881,182 34.5,182 Z M61.5,182 C62.8807119,182 64,183.119288 64,184.5 C64,185.880712 62.8807119,187 61.5,187 C60.1192881,187 59,185.880712 59,184.5 C59,183.119288 60.1192881,182 61.5,182 Z M91.5,182 C92.8807119,182 94,183.119288 94,184.5 C94,185.880712 92.8807119,187 91.5,187 C90.1192881,187 89,185.880712 89,184.5 C89,183.119288 90.1192881,182 91.5,182 Z M123.5,182 C124.880712,182 126,183.119288 126,184.5 C126,185.880712 124.880712,187 123.5,187 C122.119288,187 121,185.880712 121,184.5 C121,183.119288 122.119288,182 123.5,182 Z M153.5,182 C154.880712,182 156,183.119288 156,184.5 C156,185.880712 154.880712,187 153.5,187 C152.119288,187 151,185.880712 151,184.5 C151,183.119288 152.119288,182 153.5,182 Z M180.5,182 C181.880712,182 183,183.119288 183,184.5 C183,185.880712 181.880712,187 180.5,187 C179.119288,187 178,185.880712 178,184.5 C178,183.119288 179.119288,182 180.5,182 Z M34.5,154 C35.8807119,154 37,155.119288 37,156.5 C37,157.880712 35.8807119,159 34.5,159 C33.1192881,159 32,157.880712 32,156.5 C32,155.119288 33.1192881,154 34.5,154 Z M61.5,154 C62.8807119,154 64,155.119288 64,156.5 C64,157.880712 62.8807119,159 61.5,159 C60.1192881,159 59,157.880712 59,156.5 C59,155.119288 60.1192881,154 61.5,154 Z M91.5,154 C92.8807119,154 94,155.119288 94,156.5 C94,157.880712 92.8807119,159 91.5,159 C90.1192881,159 89,157.880712 89,156.5 C89,155.119288 90.1192881,154 91.5,154 Z M123.5,154 C124.880712,154 126,155.119288 126,156.5 C126,157.880712 124.880712,159 123.5,159 C122.119288,159 121,157.880712 121,156.5 C121,155.119288 122.119288,154 123.5,154 Z M153.5,154 C154.880712,154 156,155.119288 156,156.5 C156,157.880712 154.880712,159 153.5,159 C152.119288,159 151,157.880712 151,156.5 C151,155.119288 152.119288,154 153.5,154 Z M180.5,154 C181.880712,154 183,155.119288 183,156.5 C183,157.880712 181.880712,159 180.5,159 C179.119288,159 178,157.880712 178,156.5 C178,155.119288 179.119288,154 180.5,154 Z M34.5,124 C35.8807119,124 37,125.119288 37,126.5 C37,127.880712 35.8807119,129 34.5,129 C33.1192881,129 32,127.880712 32,126.5 C32,125.119288 33.1192881,124 34.5,124 Z M61.5,124 C62.8807119,124 64,125.119288 64,126.5 C64,127.880712 62.8807119,129 61.5,129 C60.1192881,129 59,127.880712 59,126.5 C59,125.119288 60.1192881,124 61.5,124 Z M91.5,124 C92.8807119,124 94,125.119288 94,126.5 C94,127.880712 92.8807119,129 91.5,129 C90.1192881,129 89,127.880712 89,126.5 C89,125.119288 90.1192881,124 91.5,124 Z M123.5,124 C124.880712,124 126,125.119288 126,126.5 C126,127.880712 124.880712,129 123.5,129 C122.119288,129 121,127.880712 121,126.5 C121,125.119288 122.119288,124 123.5,124 Z M153.5,124 C154.880712,124 156,125.119288 156,126.5 C156,127.880712 154.880712,129 153.5,129 C152.119288,129 151,127.880712 151,126.5 C151,125.119288 152.119288,124 153.5,124 Z M180.5,124 C181.880712,124 183,125.119288 183,126.5 C183,127.880712 181.880712,129 180.5,129 C179.119288,129 178,127.880712 178,126.5 C178,125.119288 179.119288,124 180.5,124 Z M34.5,94 C35.8807119,94 37,95.1192881 37,96.5 C37,97.8807119 35.8807119,99 34.5,99 C33.1192881,99 32,97.8807119 32,96.5 C32,95.1192881 33.1192881,94 34.5,94 Z M153.5,94 C154.880712,94 156,95.1192881 156,96.5 C156,97.8807119 154.880712,99 153.5,99 C152.119288,99 151,97.8807119 151,96.5 C151,95.1192881 152.119288,94 153.5,94 Z M91.5,94 C92.8807119,94 94,95.1192881 94,96.5 C94,97.8807119 92.8807119,99 91.5,99 C90.1192881,99 89,97.8807119 89,96.5 C89,95.1192881 90.1192881,94 91.5,94 Z M180.5,94 C181.880712,94 183,95.1192881 183,96.5 C183,97.8807119 181.880712,99 180.5,99 C179.119288,99 178,97.8807119 178,96.5 C178,95.1192881 179.119288,94 180.5,94 Z M61.5,94 C62.8807119,94 64,95.1192881 64,96.5 C64,97.8807119 62.8807119,99 61.5,99 C60.1192881,99 59,97.8807119 59,96.5 C59,95.1192881 60.1192881,94 61.5,94 Z M123.5,94 C124.880712,94 126,95.1192881 126,96.5 C126,97.8807119 124.880712,99 123.5,99 C122.119288,99 121,97.8807119 121,96.5 C121,95.1192881 122.119288,94 123.5,94 Z M34.5,64 C35.8807119,64 37,65.1192881 37,66.5 C37,67.8807119 35.8807119,69 34.5,69 C33.1192881,69 32,67.8807119 32,66.5 C32,65.1192881 33.1192881,64 34.5,64 Z M61.5,64 C62.8807119,64 64,65.1192881 64,66.5 C64,67.8807119 62.8807119,69 61.5,69 C60.1192881,69 59,67.8807119 59,66.5 C59,65.1192881 60.1192881,64 61.5,64 Z M91.5,64 C92.8807119,64 94,65.1192881 94,66.5 C94,67.8807119 92.8807119,69 91.5,69 C90.1192881,69 89,67.8807119 89,66.5 C89,65.1192881 90.1192881,64 91.5,64 Z M123.5,64 C124.880712,64 126,65.1192881 126,66.5 C126,67.8807119 124.880712,69 123.5,69 C122.119288,69 121,67.8807119 121,66.5 C121,65.1192881 122.119288,64 123.5,64 Z M153.5,64 C154.880712,64 156,65.1192881 156,66.5 C156,67.8807119 154.880712,69 153.5,69 C152.119288,69 151,67.8807119 151,66.5 C151,65.1192881 152.119288,64 153.5,64 Z M180.5,64 C181.880712,64 183,65.1192881 183,66.5 C183,67.8807119 181.880712,69 180.5,69 C179.119288,69 178,67.8807119 178,66.5 C178,65.1192881 179.119288,64 180.5,64 Z M34.5,37 C35.8807119,37 37,38.1192881 37,39.5 C37,40.8807119 35.8807119,42 34.5,42 C33.1192881,42 32,40.8807119 32,39.5 C32,38.1192881 33.1192881,37 34.5,37 Z M61.5,37 C62.8807119,37 64,38.1192881 64,39.5 C64,40.8807119 62.8807119,42 61.5,42 C60.1192881,42 59,40.8807119 59,39.5 C59,38.1192881 60.1192881,37 61.5,37 Z M91.5,37 C92.8807119,37 94,38.1192881 94,39.5 C94,40.8807119 92.8807119,42 91.5,42 C90.1192881,42 89,40.8807119 89,39.5 C89,38.1192881 90.1192881,37 91.5,37 Z M123.5,37 C124.880712,37 126,38.1192881 126,39.5 C126,40.8807119 124.880712,42 123.5,42 C122.119288,42 121,40.8807119 121,39.5 C121,38.1192881 122.119288,37 123.5,37 Z M153.5,37 C154.880712,37 156,38.1192881 156,39.5 C156,40.8807119 154.880712,42 153.5,42 C152.119288,42 151,40.8807119 151,39.5 C151,38.1192881 152.119288,37 153.5,37 Z M180.5,37 C181.880712,37 183,38.1192881 183,39.5 C183,40.8807119 181.880712,42 180.5,42 C179.119288,42 178,40.8807119 178,39.5 C178,38.1192881 179.119288,37 180.5,37 Z' id='path-1'%3E%3C/path%3E%3C/defs%3E%3Cg id='📝-Pages' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Login---V2' transform='translate(-469.000000, -670.000000)'%3E%3Cg id='Shapes' transform='translate(469.000000, 197.000000)'%3E%3Cg id='bottom-illustration' transform='translate(0.000000, 473.000000)'%3E%3Crect id='Rectangle' fill='currentColor' opacity='0.04' x='0' y='0' width='215' height='216' rx='10'%3E%3C/rect%3E%3Crect id='Rectangle' stroke='strokeColor' opacity='0.48' x='104.5' y='100.5' width='138' height='139' rx='10'%3E%3C/rect%3E%3Cg id='Dot'%3E%3Cuse fill='currentColor' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.6' fill='%23FFFFFF' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"; - -.authentication-wrapper { - display: flex; - flex-basis: 100%; - min-height: 100vh; - width: 100%; - - .authentication-inner { - width: 100%; - } - - &.authentication-basic { - align-items: center; - justify-content: center; - overflow: hidden; - } - - &.authentication-cover { - align-items: flex-start; - .authentication-inner { - height: 100vh; - } - } - - &.authentication-basic .authentication-inner { - max-width: $authentication-1-inner-max-width; - position: relative; - &:before { - width: 148px; - height: 148px; - content: ' '; - position: absolute; - top: -40px; - right: -40px; - background-image: url(light.str-replace( - light.str-replace($auth-basic-top-svg, 'currentColor', light.$primary), - '#', - '%23' - )); - } - &:after { - width: 243px; - height: 240px; - content: ' '; - position: absolute; - bottom: -68px; - left: -46px; - } - .card { - z-index: 1; - .app-brand { - margin-bottom: 2.5rem; - } - } - } - - // For two-steps auth - .auth-input-wrapper .auth-input { - max-width: 50px; - padding-left: 0.4rem; - padding-right: 0.4rem; - font-size: light.$large-font-size; - } -} - -// Two-steps auth responsive style -@include light.media-breakpoint-down(sm) { - .authentication-wrapper { - .auth-input-wrapper .auth-input { - font-size: light.$h5-font-size; - } - } -} - -// Light Layout -@if $enable-light-style { - .light-style { - .authentication-wrapper { - .authentication-bg { - background-color: light.$white; - } - &.authentication-basic .authentication-inner { - &:after { - background-image: url(light.str-replace( - light.str-replace( - light.str-replace($auth-basic-bottom-svg, 'currentColor', light.$primary), - 'strokeColor', - light.$gray-500 - ), - '#', - '%23' - )); - } - } - } - } -} diff --git a/scss/pages/page-icons.scss b/scss/pages/page-icons.scss deleted file mode 100644 index 7b70b3a030919492c052279eeb4aaea2f3e86f47..0000000000000000000000000000000000000000 --- a/scss/pages/page-icons.scss +++ /dev/null @@ -1,46 +0,0 @@ -// * Page Icons (Page specific only) -// ******************************************************************************* - -@import '../_bootstrap-extended/include'; -@import '../_custom-variables/pages'; - -#icons-container { - .icon-card { - width: 128px; - - i { - font-size: 2rem; - } - } -} - -@media (max-width: 1024px) { - #icons-container { - .icon-card { - width: 126px; - } - } -} -@include media-breakpoint-down(md) { - #icons-container { - .icon-card { - width: 131px; - } - } -} - -@media (max-width: 414px) { - #icons-container { - .icon-card { - width: 110px; - } - } -} - -@media (max-width: 375px) { - #icons-container { - .icon-card { - width: 150px; - } - } -} diff --git a/scss/pages/page-misc.scss b/scss/pages/page-misc.scss deleted file mode 100644 index 067f947c32a5e9d57306af5a8fedc491b705fbcd..0000000000000000000000000000000000000000 --- a/scss/pages/page-misc.scss +++ /dev/null @@ -1,15 +0,0 @@ -// * Miscellaneous -// ******************************************************************************* - -@import '../_bootstrap-extended/include'; - -.misc-wrapper { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - min-height: calc( - 100vh - calc(#{$container-padding-y} * 2) - ); // ?we have added container-p-y class to add padding on top & bottom - text-align: center; -} diff --git a/scss/theme-default.scss b/scss/theme-default.scss deleted file mode 100644 index 83b5acf91ed9ac7bba9146caa50fe1474586059c..0000000000000000000000000000000000000000 --- a/scss/theme-default.scss +++ /dev/null @@ -1,106 +0,0 @@ -@import './_components/include'; -@import './_theme/common'; -@import './_theme/_theme'; - -$primary-color: #696cff; - -@include template-common-theme($primary-color); - -// Navbar -// --------------------------------------------------------------------------- -@include template-navbar-style('.bg-navbar-theme', $card-bg, $color: $body-color, $active-color: $headings-color); -.layout-navbar { - background-color: rgba($card-bg, 0.95) !important; - backdrop-filter: saturate(200%) blur(6px); -} -.navbar-detached { - box-shadow: 0 0 0.375rem 0.25rem rgba(rgba-to-hex($gray-500, $rgba-to-hex-bg), 0.15); -} -.layout-navbar-fixed .layout-page:before { - backdrop-filter: saturate(200%) blur(10px); - background: rgba($body-bg, 0.6); -} - -// Menu -// --------------------------------------------------------------------------- -@include template-menu-style( - '.bg-menu-theme', - $white, - $color: $body-color, - $active-color: $headings-color, - $border: transparent, - $active-bg: $white -); - -.bg-menu-theme { - // Menu header - .menu-header { - color: $text-muted; - &:before { - background-color: $text-muted !important; - } - } - - // menu shadow - &.menu-vertical { - box-shadow: 0 0.125rem 0.375rem 0 rgba(rgba-to-hex($gray-500, $rgba-to-hex-bg), 0.12); - } - - // menu item open(vertical) & hover (vertical & horizontal) - .menu-inner .menu-item.open > .menu-link, - .menu-inner .menu-item .menu-link:not(.active):hover { - html:not(.layout-menu-collapsed) &, - .layout-menu-hover.layout-menu-collapsed & { - background-color: rgba($black, 0.04); - } - } - // menu item open(horizontal) - .menu-inner .menu-sub > .menu-item.active { - > .menu-link.menu-toggle { - background-color: rgba($black, 0.04); - } - .menu-icon { - color: $primary-color; - } - } - // menu item active - .menu-inner > .menu-item.active > .menu-link { - color: $primary-color; - background-color: rgba($primary-color, 0.16) !important; - } - - .menu-inner > .menu-item.active:before { - background: $primary-color; - } - - // Sub menu item link bullet - .menu-sub > .menu-item > .menu-link:before { - background-color: rgba-to-hex($gray-400, $rgba-to-hex-bg) !important; - } - // Sub menu item link active bullet - .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle):before { - background-color: $primary-color !important; - border: 3px solid rgba-to-hex(rgba($primary-color, 0.16), $rgba-to-hex-bg) !important; - } -} - -.app-brand .layout-menu-toggle { - background-color: $primary-color; - border: 7px solid $body-bg; - i { - color: color-contrast($primary-color); - } - .menu-inner > .menu-header::before { - background-color: rgba-to-hex($gray-400, $rgba-to-hex-bg); - } -} - -// Footer -// --------------------------------------------------------------------------- -@include template-footer-style('.bg-footer-theme', $body-bg, $color: $body-color, $active-color: $headings-color); - -.layout-footer-fixed { - .content-footer { - box-shadow: 0 0 0.375rem 0.25rem rgba(rgba-to-hex($gray-500, $rgba-to-hex-bg), 0.15); - } -}