diff --git a/public/images/settings.png b/public/images/settings.png new file mode 100644 index 0000000..4875d27 Binary files /dev/null and b/public/images/settings.png differ diff --git a/public/javascript/contextMenu.js b/public/javascript/contextMenu.js index 87493be..157b3b7 100644 --- a/public/javascript/contextMenu.js +++ b/public/javascript/contextMenu.js @@ -140,6 +140,7 @@ class ContextMenu { } show(target, options = {}) { + // this.hide(); this.closeAllSubmenus(); let x, y; diff --git a/public/javascript/rbacAPI.js b/public/javascript/rbacAPI.js index 394026f..88ea3b4 100644 --- a/public/javascript/rbacAPI.js +++ b/public/javascript/rbacAPI.js @@ -1,4 +1,4 @@ -const ctx = new ContextMenu(); +const ctxRBAC = new ContextMenu(); ////////////////////////////// // 🌐 API LAYER @@ -145,14 +145,14 @@ const rbacUsersVT = virtualTable({ tr.addEventListener('contextmenu', (evt) => { evt.preventDefault(); - ctx.setItems([ + ctxRBAC.setItems([ { label: "Details", onClick: () => showAuthDetails(row.ObjectGUID) } ]); - ctx.show(evt.pageX + 5, { y: evt.pageY + 5 }); + ctxRBAC.show(evt.pageX + 5, { y: evt.pageY + 5 }); }); createTd(tr, @@ -209,14 +209,14 @@ const rbacPermissionsVT = virtualTable({ tr.addEventListener('contextmenu', (evt) => { evt.preventDefault(); - ctx.setItems([ + ctxRBAC.setItems([ { label: "Details", onClick: () => showAuthDetails(row.ObjectGUID) } ]); - ctx.show(evt.pageX + 5, { y: evt.pageY + 5 }); + ctxRBAC.show(evt.pageX + 5, { y: evt.pageY + 5 }); }); createTd(tr, diff --git a/public/styles/default.css b/public/styles/default.css index 960f85f..755194b 100644 --- a/public/styles/default.css +++ b/public/styles/default.css @@ -38,14 +38,14 @@ button:not(:disabled).yellowbutton:hover { background:var(--theme-button-yellow- /* #region Container */ -.container.static { width:calc(100% - 20px); margin:10px auto; display:flex; gap:12px; min-height:0; overflow:auto; max-height:100%; flex-direction: column;} +.container.static { width:calc(100% - 10px); margin:5px auto; display:flex; gap:12px; min-height:0; overflow:auto; max-height:100%; flex-direction: column;} /* .card.static { display:flex; flex-direction:column;flex: 0 0 auto; } */ .card.static.row { overflow:hidden; display:flex; flex-direction:row; flex-wrap: wrap;} .card.static { overflow:hidden; display:flex; flex-direction:column; } -.container:not(.static) { width:calc(100% - 20px); margin:10px auto; display:grid; grid-template-columns:100%; gap:12px; min-height:0; overflow:auto; max-height:100%; } +.container:not(.static) { width:calc(100% - 10px); margin:5px auto; display:grid; grid-template-columns:100%; gap:12px; min-height:0; overflow:auto; max-height:100%; } .container:not(.static) * { box-sizing:border-box; } -.card { border-width:1px; border-style:solid; border-radius:8px; padding:20px; } +.card { border-width:1px; border-style:solid; border-radius:8px; padding:15px; } .grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); } /* #endregion */ @@ -96,114 +96,16 @@ button:not(:disabled).yellowbutton:hover { background:var(--theme-button-yellow- Ein / Aus */ -.cb-switch { - --w: var(--responsive-switch-width); - --h: var(--responsive-switch-height); - - display: inline-flex; - align-items: center; - flex-shrink: 0; - gap: 8px; -} - -/* Input verstecken */ -.cb-switch input { - position: absolute; - opacity: 0; - width: 0; - height: 0; - pointer-events: none; -} - -/* TRACK */ -.switch-track { - width: var(--w); - height: var(--h); - - border-radius: 999px; - padding: 3px; - border: 1px solid; - - box-sizing: border-box; - display: flex; - align-items: center; - - position: relative; - flex-shrink: 0; - - transition: background var(--times-transition-colors) ease, border-color var(--times-transition-colors) ease; -} - -/* THUMB */ -.switch-thumb { - position: absolute; - top: 50%; - left: 3px; - - width: calc(var(--h) - 6px); - height: calc(var(--h) - 6px); - - background: var(--theme-switch-thumb); - border-radius: 50%; - box-shadow: 0 2px 6px rgba(0,0,0,.15); - - transform: translateY(-50%); - - transition: left var(--times-transition-transform) cubic-bezier(.2,.9,.2,1), background var(--times-transition-colors) ease; -} - -/* CHECKED STATE */ -.cb-switch input:checked + .switch-track { - background: var(--theme-switch-active); -} - -.cb-switch input:checked + .switch-track .switch-thumb { - left: calc(var(--w) - var(--h) + 3px); -} - -/* HOVER */ -.cb-switch input:not(:disabled):hover + .switch-track { - border-color: var(--theme-switch-hover); -} - -/* FOCUS */ -.cb-switch input:focus-visible + .switch-track { - box-shadow: 0 0 0 6px rgba(6, 193, 103, 0.12); -} - -/* DISABLED */ -.cb-switch input:disabled + .switch-track { - background-color: dimgray; - opacity: 0.6; -} - -.cb-switch input:disabled + .switch-track .switch-thumb { - background-color: rgb(54, 50, 50); -} - -/* optional label spacing */ -.cb-switch label { - cursor: pointer; -} -/* .cb-switch { --w:45px; --h:27px; display:inline-flex; align-items:center; } -.cb-switch input { position:absolute; opacity:0; width:0; height:0; pointer-events:none; } -.switch-track { width:var(--w); height:var(--h); border-radius:999px; padding:3px; border-width:1px; border-style:solid; box-sizing:border-box; display:inline-flex; align-items:center; transition:background .18s ease, transform .12s ease, border-color .25s ease; } -.switch-thumb { min-width:calc(var(--h) - 2 * 3px); width:calc(var(--h) - 2 * 3px); height:calc(var(--h) - 2 * 3px); background:var(--theme-switch-thumb); border-radius:50%; box-shadow:0 2px 6px rgba(0,0,0,.15); transform:translateX(-1px); transition:transform .25s cubic-bezier(.2,.9,.2,1), background .18s ease } - - - -.cb-switch input:disabled + .switch-track { background-color: dimgray;} +.cb-switch input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; } +.switch-track { width: var(--responsive-switch-width); height: var(--responsive-switch-height); border-radius: 999px; padding: 3px; border: 1px solid; box-sizing: border-box; display: flex; align-items: center; position: relative; flex-shrink: 0; transition: background var(--times-transition-colors) ease, border-color var(--times-transition-colors) ease; } +.switch-thumb { position: absolute; top: 50%; left: 3px; width: calc(var(--responsive-switch-height) - 6px); height: calc(var(--responsive-switch-height) - 6px); background: var(--theme-switch-thumb); border-radius: 50%; box-shadow: 0 2px 6px rgba(0,0,0,.15); transform: translateY(-50%);transition: left var(--times-transition-transform) cubic-bezier(.2,.9,.2,1), background var(--times-transition-colors) ease; } +.cb-switch input:checked + .switch-track { background: var(--theme-switch-active); } +.cb-switch input:checked + .switch-track .switch-thumb { left: calc(var(--responsive-switch-width) - var(--responsive-switch-height) + 3px); } +.cb-switch input:not(:disabled):hover + .switch-track { border-color: var(--theme-switch-hover); } +.cb-switch input:focus-visible + .switch-track { box-shadow: 0 0 0 6px rgba(6, 193, 103, 0.12); } +.cb-switch input:disabled + .switch-track { background-color: dimgray; opacity: 0.6; } .cb-switch input:disabled + .switch-track .switch-thumb { background-color: rgb(54, 50, 50); } - -.cb-switch input:not(:disabled):checked + .switch-track { background:var(--theme-switch-active); } - -.cb-switch input:not(:disabled):hover + .switch-track { border-color:var(--theme-switch-hover); } - -.cb-switch input:focus-visible + .switch-track { box-shadow:0 0 0 6px rgba(6,193,103,0.12); } -.cb-switch input:checked + .switch-track .switch-thumb { transform:translateX(calc(var(--w) - var(--h))); } -.cb-switch label { width: calc(100% - var(--w)); } */ -/* #endregion */ - +.cb-switch label { cursor: pointer; } /* #region CheckBox */ /* @@ -228,8 +130,8 @@ button:not(:disabled).yellowbutton:hover { background:var(--theme-button-yellow- /* #region Tabs */ -.tabs { display: flex; margin-bottom: 10px; border-bottom-width: 2px; border-bottom-style: solid; } -.tab { padding: 10px 20px; border: 1px solid transparent; border-top-left-radius: 5px; border-top-right-radius: 5px; margin-right: 5px; transition: background .25s, color .25s, border-color .25s; } +.tabs { display: flex; flex:1 0 auto; margin-bottom: 5px; border-bottom-width: 2px; border-bottom-style: solid; overflow-x: auto; scrollbar-width: thin;} +.tab { padding: 5px 10px; text-wrap: nowrap; border: 1px solid transparent; border-top-left-radius: 5px; border-top-right-radius: 5px; margin-right: 5px; transition: background .25s, color .25s, border-color .25s; } .tab-content { border-width: 1px; border-style: solid; border-radius: 5px; padding: 15px; } .item { margin-bottom: 5px; } /* #endregion */ @@ -237,7 +139,7 @@ button:not(:disabled).yellowbutton:hover { background:var(--theme-button-yellow- /* #region Feebox */ .feedbox-overlay { position:fixed; top:0; left:0; width:100vw; height:100vh; display:flex; align-items:center; justify-content:center; z-index:999; } -.feedbox { border-radius:8px; max-width:50vw; max-width:100%; padding:20px; animation:feedboxFadeIn 0.2s ease-out; max-height:80vh; display:flex; flex-direction:column; overflow:hidden; } +.feedbox { border-radius:8px; max-width:50vw; max-width:90vw; padding:20px; animation:feedboxFadeIn 0.2s ease-out; max-height:80vh; display:flex; flex-direction:column; overflow:hidden; } .feedbox h3 { margin:0 0 10px 0; } .feedbox-message { margin-bottom:20px; line-height:1.4; flex:1; overflow-y: auto; /* font-size:1rem; */ } .feedbox-actions { display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; flex-shrink:0; } diff --git a/public/styles/table.css b/public/styles/table.css index fd5c38d..1a1f901 100644 --- a/public/styles/table.css +++ b/public/styles/table.css @@ -50,7 +50,7 @@ td { overflow:hidden; text-overflow:ellipsis; /* verhindert, dass Inhalt die Zel border-bottom-width:8px; border-bottom-style:solid; display:flex; - flex-direction:row; + flex-direction:column; gap:0; position:sticky; left:0px; @@ -60,11 +60,13 @@ td { overflow:hidden; text-overflow:ellipsis; /* verhindert, dass Inhalt die Zel padding:0px; border-radius:var(--border-raduis) var(--border-raduis) 0 0; justify-content: flex-start; - align-items: center; + align-items: space-between; flex: 1; + flex-wrap: wrap; + overflow-x:auto; } -.table-filter-container .live-counter { position:absolute; right:18px; margin-left:auto; font-weight:bold; } -.table-filter-container input { padding:5px !important; } +.table-filter-container .live-counter { position:static; text-align: right ; padding-right:10px; font-weight:bolder; } +.table-filter-container input { padding:5px !important; flex:1 1 100vw; margin:5px 0;} th.sort-asc::after { diff --git a/public/views/desktop.hbs b/public/views/desktop.hbs index bf56ab6..0f5c95f 100644 --- a/public/views/desktop.hbs +++ b/public/views/desktop.hbs @@ -116,7 +116,10 @@ const trayNotifyButton = document.querySelector('#taskbar > .notify-button') const notify = new NotifyBubble(trayNotifyButton, "#notify-bubble"); - document.addEventListener("contextmenu", evt => evt.preventDefault()); + document.addEventListener("contextmenu", evt => { + evt.preventDefault() + evt.stopPropagation(); + }); document.querySelectorAll('#start-menu .start-item.has-submenu').forEach(item => { item.addEventListener('click', evt => { diff --git a/server.js b/server.js index 59d5e1e..70d466d 100644 --- a/server.js +++ b/server.js @@ -57,8 +57,8 @@ const server = https.createServer(httpsOptions, app); const io = new Server(server, { - pingInterval: 1000, // alle 25s Ping senden - pingTimeout: 200, // 20s ohne Pong => disconnect + // pingInterval: 1000, // alle 25s Ping senden + // pingTimeout: 200, // 20s ohne Pong => disconnect maxHttpBufferSize: 1e8, // 100 MB }); diff --git a/src/models/integratedStartMenuItems.json b/src/models/integratedStartMenuItems.json index a8ef060..f1bae32 100644 --- a/src/models/integratedStartMenuItems.json +++ b/src/models/integratedStartMenuItems.json @@ -146,7 +146,7 @@ "width": "460px", "height": "515px" }, - "icon": "app.png", + "icon": "settings.png", "permissions": [ { "scope": "SYSTEM", diff --git a/src/routes/adminRoutes.js b/src/routes/adminRoutes.js index c331f4f..f29165a 100644 --- a/src/routes/adminRoutes.js +++ b/src/routes/adminRoutes.js @@ -95,7 +95,7 @@ module.exports = { - +// #region RBAC // ========================================================= // 👤 AUTH // ========================================================= @@ -408,27 +408,7 @@ module.exports = { res.status(500).json({ error: err.message }); } }); - - - - - - - - - - - - - - - - - - - - - +//#endregion RBAC diff --git a/src/services/renderWindow.js b/src/services/renderWindow.js index 8cb888c..b845393 100644 --- a/src/services/renderWindow.js +++ b/src/services/renderWindow.js @@ -56,7 +56,7 @@ module.exports = { ...{ name: payload.name, view: payload.view, viewLabel: payload.viewLabel}, ...data, }; - console.log(templateData) + // console.log(templateData) // Zuerst Plugin-View rendern app.render(view, templateData, (err, contentHtml) => {