Browse Source

minor bug fixes

pull/4926/head
Daniel 2 years ago
parent
commit
c30b554b00
  1. 2
      .eslintignore
  2. 3
      .gitignore
  3. 135
      package-lock.json
  4. 3
      package.json
  5. 14
      src/scss/_app-sidebar.scss
  6. 6
      src/scss/_variables-dark.scss
  7. 8
      src/scss/_variables.scss
  8. 19
      src/ts/direct-chat.ts
  9. 29
      src/ts/treeview.ts

2
.eslintignore

@ -4,4 +4,4 @@
/dist/
/docs/
/docs_html/
/env.d.ts/
**/env.d.ts

3
.gitignore vendored

@ -4,6 +4,9 @@ dist/
# generated types
.astro/
# unwanted types
**/env.d.ts
# System / Log files
*.DS_Store
*.log

135
package-lock.json generated

@ -17,6 +17,7 @@
"bootstrap": "^5.3.0-alpha1",
"bundlewatch": "^0.3.3",
"clean-css-cli": "^5.6.2",
"concurrently": "^7.6.0",
"cross-env": "^7.0.3",
"eslint": "^8.33.0",
"eslint-config-xo": "^0.43.1",
@ -2928,6 +2929,48 @@
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"node_modules/concurrently": {
"version": "7.6.0",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-7.6.0.tgz",
"integrity": "sha512-BKtRgvcJGeZ4XttiDiNcFiRlxoAeZOseqUvyYRUp/Vtd+9p1ULmeoSqGsDA+2ivdeDFpqrJvGvmI+StKfKl5hw==",
"dev": true,
"dependencies": {
"chalk": "^4.1.0",
"date-fns": "^2.29.1",
"lodash": "^4.17.21",
"rxjs": "^7.0.0",
"shell-quote": "^1.7.3",
"spawn-command": "^0.0.2-1",
"supports-color": "^8.1.0",
"tree-kill": "^1.2.2",
"yargs": "^17.3.1"
},
"bin": {
"conc": "dist/bin/concurrently.js",
"concurrently": "dist/bin/concurrently.js"
},
"engines": {
"node": "^12.20.0 || ^14.13.0 || >=16.0.0"
},
"funding": {
"url": "https://github.com/open-cli-tools/concurrently?sponsor=1"
}
},
"node_modules/concurrently/node_modules/supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"dependencies": {
"has-flag": "^4.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/confusing-browser-globals": {
"version": "1.0.11",
"resolved": "https://registry.npmjs.org/confusing-browser-globals/-/confusing-browser-globals-1.0.11.tgz",
@ -3012,6 +3055,19 @@
"node": ">=4"
}
},
"node_modules/date-fns": {
"version": "2.29.3",
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz",
"integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==",
"dev": true,
"engines": {
"node": ">=0.11"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/date-fns"
}
},
"node_modules/debug": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz",
@ -8223,6 +8279,15 @@
"queue-microtask": "^1.2.2"
}
},
"node_modules/rxjs": {
"version": "7.8.0",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.0.tgz",
"integrity": "sha512-F2+gxDshqmIub1KdvZkaEfGDwLNpPvk9Fs6LD/MyQxNgMds/WH9OdDDXOmxUZpME+iSK3rQCctkL0DYyytUqMg==",
"dev": true,
"dependencies": {
"tslib": "^2.1.0"
}
},
"node_modules/s.color": {
"version": "0.0.15",
"resolved": "https://registry.npmjs.org/s.color/-/s.color-0.0.15.tgz",
@ -8524,6 +8589,12 @@
"url": "https://github.com/sponsors/wooorm"
}
},
"node_modules/spawn-command": {
"version": "0.0.2-1",
"resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz",
"integrity": "sha512-n98l9E2RMSJ9ON1AKisHzz7V42VDiBQGY6PB1BwRglz99wpVsSuGzQ+jOi6lFXBGVTCrRpltvjm+/XA+tpeJrg==",
"dev": true
},
"node_modules/spdx-correct": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.1.1.tgz",
@ -9188,6 +9259,15 @@
"node": "*"
}
},
"node_modules/tree-kill": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
"integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
"dev": true,
"bin": {
"tree-kill": "cli.js"
}
},
"node_modules/trim-lines": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/trim-lines/-/trim-lines-3.0.1.tgz",
@ -12136,6 +12216,34 @@
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"concurrently": {
"version": "7.6.0",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-7.6.0.tgz",
"integrity": "sha512-BKtRgvcJGeZ4XttiDiNcFiRlxoAeZOseqUvyYRUp/Vtd+9p1ULmeoSqGsDA+2ivdeDFpqrJvGvmI+StKfKl5hw==",
"dev": true,
"requires": {
"chalk": "^4.1.0",
"date-fns": "^2.29.1",
"lodash": "^4.17.21",
"rxjs": "^7.0.0",
"shell-quote": "^1.7.3",
"spawn-command": "^0.0.2-1",
"supports-color": "^8.1.0",
"tree-kill": "^1.2.2",
"yargs": "^17.3.1"
},
"dependencies": {
"supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"requires": {
"has-flag": "^4.0.0"
}
}
}
},
"confusing-browser-globals": {
"version": "1.0.11",
"resolved": "https://registry.npmjs.org/confusing-browser-globals/-/confusing-browser-globals-1.0.11.tgz",
@ -12196,6 +12304,12 @@
"integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
"dev": true
},
"date-fns": {
"version": "2.29.3",
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz",
"integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==",
"dev": true
},
"debug": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz",
@ -15867,6 +15981,15 @@
"queue-microtask": "^1.2.2"
}
},
"rxjs": {
"version": "7.8.0",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.0.tgz",
"integrity": "sha512-F2+gxDshqmIub1KdvZkaEfGDwLNpPvk9Fs6LD/MyQxNgMds/WH9OdDDXOmxUZpME+iSK3rQCctkL0DYyytUqMg==",
"dev": true,
"requires": {
"tslib": "^2.1.0"
}
},
"s.color": {
"version": "0.0.15",
"resolved": "https://registry.npmjs.org/s.color/-/s.color-0.0.15.tgz",
@ -16111,6 +16234,12 @@
"integrity": "sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==",
"dev": true
},
"spawn-command": {
"version": "0.0.2-1",
"resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz",
"integrity": "sha512-n98l9E2RMSJ9ON1AKisHzz7V42VDiBQGY6PB1BwRglz99wpVsSuGzQ+jOi6lFXBGVTCrRpltvjm+/XA+tpeJrg==",
"dev": true
},
"spdx-correct": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.1.1.tgz",
@ -16620,6 +16749,12 @@
}
}
},
"tree-kill": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
"integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
"dev": true
},
"trim-lines": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/trim-lines/-/trim-lines-3.0.1.tgz",

3
package.json

@ -28,7 +28,7 @@
"lint": "npm-run-all --aggregate-output --continue-on-error --parallel js-lint css-lint docs-lint lockfile-lint",
"compile": "npm-run-all docs-compile assets css js",
"production": "npm-run-all lint compile",
"watch": "npm-run-all --parallel watch-*",
"watch": "concurrently \"npm:watch-*\"",
"watch-css-main": "nodemon --watch src/scss/ --ext scss --exec \"npm-run-all css-lint css-compile\"",
"watch-css-dist": "nodemon --watch dist/css/ --ext css --ignore \"dist/css/*.rtl.*\" --exec \"npm run css-rtl\"",
"watch-js-main": "nodemon --watch src/ts/ --ext ts --exec \"npm-run-all js-lint js-compile\"",
@ -64,6 +64,7 @@
"bootstrap": "^5.3.0-alpha1",
"bundlewatch": "^0.3.3",
"clean-css-cli": "^5.6.2",
"concurrently": "^7.6.0",
"cross-env": "^7.0.3",
"eslint": "^8.33.0",
"eslint-config-xo": "^0.43.1",

14
src/scss/_app-sidebar.scss

@ -3,8 +3,8 @@
--#{$lte-prefix}sidebar-color: #{$lte-sidebar-color};
--#{$lte-prefix}sidebar-hover-color: #{$lte-sidebar-hover-color};
--#{$lte-prefix}sidebar-active-color: #{$lte-sidebar-active-color};
--#{$lte-prefix}sidebar-menu-active-bg: #{$primary};
--#{$lte-prefix}sidebar-menu-active-color: #{color-contrast($primary)};
--#{$lte-prefix}sidebar-menu-active-bg: #{$lte-sidebar-menu-active-bg};
--#{$lte-prefix}sidebar-menu-active-color: #{$lte-sidebar-menu-active-color};
--#{$lte-prefix}sidebar-submenu-bg: #{$lte-sidebar-submenu-bg};
--#{$lte-prefix}sidebar-submenu-color: #{$lte-sidebar-submenu-color};
--#{$lte-prefix}sidebar-submenu-hover-color: #{$lte-sidebar-submenu-hover-color};
@ -40,9 +40,9 @@
}
}
> .nav-link.active {
> .nav-link.active:not(:hover) {
color: var(--#{$lte-prefix}sidebar-menu-active-color) !important;
// background-color: var(--#{$lte-prefix}sidebar-menu-active-bg) !important;
background-color: var(--#{$lte-prefix}sidebar-menu-active-bg) !important;
}
// Hover and active states
@ -50,7 +50,7 @@
&:hover > .nav-link,
> .nav-link:focus {
color: var(--#{$lte-prefix}sidebar-hover-color);
// background-color: var(--#{$lte-prefix}sidebar-hover-bg);
background-color: var(--#{$lte-prefix}sidebar-hover-bg);
}
// First Level Submenu
@ -183,8 +183,8 @@
--#{$lte-prefix}sidebar-color: #{$lte-sidebar-color-dark};
--#{$lte-prefix}sidebar-hover-color: #{$lte-sidebar-hover-color-dark};
--#{$lte-prefix}sidebar-active-color: #{$lte-sidebar-active-color-dark};
--#{$lte-prefix}sidebar-menu-active-bg: #{$primary};
--#{$lte-prefix}sidebar-menu-active-color: #{color-contrast($primary)};
--#{$lte-prefix}sidebar-menu-active-bg: #{$lte-sidebar-menu-active-bg-dark};
--#{$lte-prefix}sidebar-menu-active-color: #{$lte-sidebar-menu-active-color-dark};
--#{$lte-prefix}sidebar-submenu-bg: #{$lte-sidebar-submenu-bg-dark};
--#{$lte-prefix}sidebar-submenu-color: #{$lte-sidebar-submenu-color-dark};
--#{$lte-prefix}sidebar-submenu-hover-color: #{$lte-sidebar-submenu-hover-color-dark};

6
src/scss/_variables-dark.scss

@ -5,10 +5,12 @@ $lte-sidebar-hover-bg-dark: rgba(255, 255, 255, .1) !default;
$lte-sidebar-color-dark: #c2c7d0 !default;
$lte-sidebar-hover-color-dark: $white !default;
$lte-sidebar-active-color-dark: $white !default;
$lte-sidebar-menu-active-bg-dark: transparent !default;
$lte-sidebar-menu-active-color-dark: $white !default;
$lte-sidebar-submenu-bg-dark: transparent !default;
$lte-sidebar-submenu-color-dark: $lte-sidebar-color-dark !default;
$lte-sidebar-submenu-color-dark: #c2c7d0 !default;
$lte-sidebar-submenu-hover-color-dark: $white !default;
$lte-sidebar-submenu-hover-bg-dark: $lte-sidebar-hover-bg-dark !default;
$lte-sidebar-submenu-hover-bg-dark: rgba(255, 255, 255, .1) !default;
$lte-sidebar-submenu-active-color-dark: $white !default;
$lte-sidebar-submenu-active-bg-dark: rgba(255, 255, 255, .1) !default;
$lte-sidebar-header-color-dark: tint-color(#c2c7d0, 5%) !default;

8
src/scss/_variables.scss

@ -28,12 +28,14 @@ $lte-sidebar-hover-bg: rgba($black, .1) !default;
$lte-sidebar-color: $gray-800 !default;
$lte-sidebar-hover-color: $gray-900 !default;
$lte-sidebar-active-color: $black !default;
$lte-sidebar-menu-active-bg: transparent !default;
$lte-sidebar-menu-active-color: $black !default;
$lte-sidebar-submenu-bg: transparent !default;
$lte-sidebar-submenu-color: #777 !default;
$lte-sidebar-submenu-hover-color: $black !default;
$lte-sidebar-submenu-hover-bg: $lte-sidebar-hover-bg !default;
$lte-sidebar-submenu-active-color: $lte-sidebar-hover-color !default;
$lte-sidebar-submenu-active-bg: $lte-sidebar-submenu-hover-bg !default;
$lte-sidebar-submenu-hover-bg: rgba($black, .1) !default;
$lte-sidebar-submenu-active-color: $gray-900 !default;
$lte-sidebar-submenu-active-bg: rgba($black, .1) !default;
$lte-sidebar-header-color: shade-color($gray-800, 5%) !default;
// SIDEBAR MINI

19
src/ts/direct-chat.ts

@ -30,26 +30,26 @@ const CLASS_NAME_DIRECT_CHAT_OPEN = 'direct-chat-contacts-open'
*/
class DirectChat {
_element: HTMLElement | undefined
_element: HTMLElement
_config: undefined
constructor(element: HTMLElement | undefined, config: undefined) {
constructor(element: HTMLElement, config: undefined) {
this._element = element
this._config = config
}
toggle(): void {
if (this._element?.classList.contains(CLASS_NAME_DIRECT_CHAT_OPEN)) {
if (this._element.classList.contains(CLASS_NAME_DIRECT_CHAT_OPEN)) {
const event = new Event(EVENT_COLLAPSED)
this._element?.classList.remove(CLASS_NAME_DIRECT_CHAT_OPEN)
this._element.classList.remove(CLASS_NAME_DIRECT_CHAT_OPEN)
this._element?.dispatchEvent(event)
this._element.dispatchEvent(event)
} else {
const event = new Event(EVENT_EXPANDED)
this._element?.classList.add(CLASS_NAME_DIRECT_CHAT_OPEN)
this._element.classList.add(CLASS_NAME_DIRECT_CHAT_OPEN)
this._element?.dispatchEvent(event)
this._element.dispatchEvent(event)
}
}
}
@ -67,9 +67,12 @@ domReady(() => {
btn.addEventListener('click', event => {
event.preventDefault()
const target = event.target as HTMLElement
const chatPane = target?.closest(SELECTOR_DIRECT_CHAT) as HTMLElement | undefined
const chatPane = target.closest(SELECTOR_DIRECT_CHAT) as HTMLElement | undefined
if (chatPane) {
const data = new DirectChat(chatPane, undefined)
data.toggle()
}
})
}
})

29
src/ts/treeview.ts

@ -46,48 +46,40 @@ type Config = {
class Treeview {
_element: HTMLElement
_config: Config
_navItem: HTMLElement | undefined
_childNavItem: HTMLElement | undefined | undefined
_childNavItem: HTMLElement | undefined
constructor(element: HTMLElement, config: Config) {
this._element = element
this._config = { ...Default, ...config }
this._navItem = this._element?.closest(SELECTOR_NAV_ITEM) as HTMLElement | undefined
this._childNavItem = this._navItem?.querySelector(SELECTOR_TREEVIEW_MENU) as HTMLElement | undefined
this._childNavItem = this._element.querySelector(SELECTOR_TREEVIEW_MENU) as HTMLElement | undefined
}
open(): void {
const event = new Event(EVENT_EXPANDED)
if (this._navItem) {
this._navItem.classList.add(CLASS_NAME_MENU_OPEN)
}
this._element.classList.add(CLASS_NAME_MENU_OPEN)
if (this._childNavItem) {
slideDown(this._childNavItem, this._config.animationSpeed)
}
this._element?.dispatchEvent(event)
this._element.dispatchEvent(event)
}
close(): void {
const event = new Event(EVENT_COLLAPSED)
window.setTimeout(() => {
if (this._navItem) {
this._navItem.classList.remove(CLASS_NAME_MENU_OPEN)
}
}, this._config.animationSpeed)
this._element.classList.remove(CLASS_NAME_MENU_OPEN)
if (this._childNavItem) {
slideUp(this._childNavItem, this._config.animationSpeed)
}
this._element?.dispatchEvent(event)
this._element.dispatchEvent(event)
}
toggle(): void {
if (this._navItem?.classList.contains(CLASS_NAME_MENU_OPEN)) {
if (this._element.classList.contains(CLASS_NAME_MENU_OPEN)) {
this.close()
} else {
this.open()
@ -106,10 +98,13 @@ domReady(() => {
for (const btn of button) {
btn.addEventListener('click', event => {
const treeviewMenu = event.target as HTMLElement
const target = event.target as HTMLElement
const targetItem = target.closest(SELECTOR_NAV_ITEM) as HTMLElement | undefined
const data = new Treeview(treeviewMenu, Default)
if (targetItem) {
const data = new Treeview(targetItem, Default)
data.toggle()
}
})
}
})

Loading…
Cancel
Save