diff --git a/src/_panel.scss b/src/_panel.scss index 583eb85..7296b81 100644 --- a/src/_panel.scss +++ b/src/_panel.scss @@ -55,6 +55,10 @@ position: relative; box-sizing: border-box; padding: $base-margin / 1.5; + + & > div { + display: inherit; + } } .osjs-panel-item--icon { diff --git a/src/items/_menu.scss b/src/items/_menu.scss index 4db11b4..e14120e 100644 --- a/src/items/_menu.scss +++ b/src/items/_menu.scss @@ -33,7 +33,7 @@ align-items: center; padding: 0; - & > div { + & > .osjs-panel-item-content > div { padding: $base-margin / 1.5; } } diff --git a/src/items/_tray.scss b/src/items/_tray.scss index d7436fa..33f0da1 100644 --- a/src/items/_tray.scss +++ b/src/items/_tray.scss @@ -32,7 +32,7 @@ display: flex; padding: 0; - & > div { + & > .osjs-panel-item-content > div { flex: 1 1; padding: $base-margin / 1.5 $base-margin / 3; @@ -43,3 +43,10 @@ } } } + +.osjs-root[data-dir="rtl"] { + .osjs-panel-item[data-name=tray] > .osjs-panel-item-content > div:not(:last-child) { + margin-right: 0; + margin-left: $base-margin; + } +} diff --git a/src/items/_windows.scss b/src/items/_windows.scss index ef3874d..242776b 100644 --- a/src/items/_windows.scss +++ b/src/items/_windows.scss @@ -34,7 +34,7 @@ overflow: hidden; padding: 0; - & > div { + & > .osjs-panel-item-content > div { cursor: pointer; flex: initial; padding: $base-margin / 1.5; diff --git a/src/items/menu.js b/src/items/menu.js index 25502c2..13c36b6 100644 --- a/src/items/menu.js +++ b/src/items/menu.js @@ -170,7 +170,7 @@ export default class MenuPanelItem extends PanelItem { this.core.make('osjs/contextmenu').show({ menu: makeMenu([].concat(packages)), - position: ev.target, + position: this.$element, callback: (item) => { const {name, action} = item.data || {}; diff --git a/src/panel-item.js b/src/panel-item.js index e1eb6de..23684a8 100644 --- a/src/panel-item.js +++ b/src/panel-item.js @@ -53,6 +53,7 @@ export default class PanelItem extends EventEmitter { this.state = {}; this.actions = {}; this.inited = false; + this.$element = null; } /** @@ -76,9 +77,13 @@ export default class PanelItem extends EventEmitter { this.inited = true; this.emit('init', this); + this.$element = document.createElement('div'); + this.$element.classList.add('osjs-panel-item'); + this.panel.$element.appendChild(this.$element); + return app(state, actions, (state, actions) => { return this.render(state, actions); - }, this.panel.$element); + }, this.$element); } /** @@ -88,9 +93,9 @@ export default class PanelItem extends EventEmitter { * @return {Node} A *virtual* node */ render(name, children = []) { + this.$element.setAttribute('data-name', name); return h('div', { - className: 'osjs-panel-item', - 'data-name': name + className: 'osjs-panel-item-content' }, children); }