/* * jQuery UI 1.13 appends the shared #ui-datepicker-div to at init time (1.7.3 * appended it only on show). Code that calls .datepicker('setDate', ...) right after * init renders a full calendar into that div; jQuery UI hides it via inline style only * when opened/closed, so on the setDate-after-init path nothing hides it and an unwanted * calendar appears in page flow. Force the default hidden state; jQuery UI's * _showDatepicker sets inline display:block when opening, so popups still work normally. * (This is a JS-behaviour guard, independent of the 1.13 theme.) */ #ui-datepicker-div { display: none; } /* * Preload the interaction-state icon sprites. ui-icons_ffffff (hover/focus) and * ui-icons_8DC262 (active / highlight / toolbar-icon hover) are each referenced * ONLY by interaction-state rules, so the browser doesn't download them until the * first hover/click of a UI control on a page — during that fetch the icon paints * blank for a frame (the one-time flicker; cached afterwards, so it never repeats). * Force both into the cache at page load via a 1px, invisible, non-interactive * pseudo-element. Done with CSS (not ) so it does not emit a * "preloaded but not used" console warning. */ body::after { content: ""; position: fixed; top: -1px; left: -1px; width: 1px; height: 1px; opacity: 0.001; z-index: -1; pointer-events: none; background-image: url("south-street/images/ui-icons_ffffff_256x240.png"), url("south-street/images/ui-icons_8DC262_256x240.png"); } .ui-state-default:not(.kru-buttoncontrol), .ui-widget-content .ui-state-default:not(.kru-buttoncontrol), .ui-state-default, .ui-widget-content .ui-state-default{ background: none; background-color: var(--primary-color); border: 1px solid var(--primary-color); } /* * Normal (kru) buttons: restore the old (jQuery UI 1.7.3) behaviour — hovering a * button only changes the cursor to a pointer, nothing else. index.tpl binds a * global handler that adds .ui-state-hover to EVERY .ui-state-default element on * mouseenter; since kru buttons are .ui-state-default this restyled them via the * theme (lighter-green bg + bold text) and — worse — swapped their icon to * ui-icons_ffffff (theme.css `.ui-state-hover .ui-icon`). That sprite is referenced * nowhere else, so the FIRST hover on a page lazy-loaded it and the icon flickered * for a frame; once cached no further button flickered (hence "one flicker per * page"). Pin the hover/focus state to the default button look and keep the icon * on its resting sprite so nothing changes and nothing is fetched on first hover. * Abort buttons keep their own (.ui-state-abort) styling. */ .kru-buttoncontrol.ui-state-hover:not(.ui-state-abort), .kru-buttoncontrol.ui-state-focus:not(.ui-state-abort), .kru-buttoncontrol.kru-buttoncontrol-hover:not(.ui-state-abort) { background: var(--primary-color); border: 1px solid var(--primary-color); color: #ffffff; /* * Deliberately do NOT set font-weight here: the resting button is bold (via * .ui-state-default), so pinning it to normal on hover flipped the text * bold→normal. Omitting it lets the resting bold carry through unchanged. */ } .kru-buttoncontrol.ui-state-hover .ui-icon, .kru-buttoncontrol.ui-state-focus .ui-icon, .kru-buttoncontrol.kru-buttoncontrol-hover .ui-icon { background-image: url("south-street/images/ui-icons_eeeeee_256x240.png"); } .datalist th { background-color: var(--primary-color); border: 0!important; } .datalist th, .datalist td { padding-left: 4px; padding-right: 4px; } .datalist th:not(:last-child) { position: relative; /*border-right: 1px solid rgba(255, 255, 255, 0.5)!important;*/ } .datalist th:not(:last-child)::after { content: ''; background-color: rgb(from var(--white-color) r g b / 0.36); display: block; width: 1px; height: 68%; position: absolute; inset: 0; margin: auto 0 auto auto; } .ui-dialog { padding: 20px; } .ui-dialog .ui-dialog-content { padding: 0; } .ui-dialog .ui-dialog-titlebar { padding: 0 0 0.2em 0; margin-bottom: 10px; } .ui-dialog .ui-dialog-buttonpane button { cursor: pointer; /* * float:right reverses the DOM button order visually and right-aligns the set, * matching master (jQuery UI 1.7.3 floated each dialog button right). Call sites * define buttons in { primary, …, cancel } order expecting the float to put the * primary action on the right — e.g. notSavedDialog { speichern, nicht speichern, * abbrechen } → displayed abbrechen / nicht speichern / speichern. * * jQuery UI 1.12+ only floats the .ui-dialog-buttonset wrapper, leaving the * buttons themselves in DOM order — so without this they rendered save-first * and squished. The W-D override (jquery-plugins.js) sets an INLINE float for * per-button position / buttonPosition, which still wins over this default. */ float: right; margin-left: .5em; display: inline-block; padding: 5px 10px 5px 10px; vertical-align: middle; line-height: 1.5; background: var(--primary-color); border: 1px solid var(--primary-color); border-radius: var(--btn-border-radius); } /* * Keep dialog buttons uniform in EVERY state — on-brand green background with * white text on default, hover, focus (the auto-focused default button) and * active. Nothing changes on mouse-over except the pointer cursor. * * Without this the full jQuery UI base theme (loaded before our jquery-ui-theme.css * since W-H step 1) bleeds through: its `.ui-button:hover` / `:focus` set a dark * text colour that our theme.css does not re-assert for buttons (it deliberately * dropped element-level colour from the .ui-state-hover/.ui-state-focus groups to * avoid white-on-grey cards elsewhere). The result was a hovered — or default * (focused) — dialog button turning its text black. Abort buttons keep their own * !important grey background (.ui-state-abort); only the white text is shared. */ .ui-dialog .ui-dialog-buttonpane button, .ui-dialog .ui-dialog-buttonpane button:hover, .ui-dialog .ui-dialog-buttonpane button:focus, .ui-dialog .ui-dialog-buttonpane button:active, .ui-dialog .ui-dialog-buttonpane button.ui-state-hover, .ui-dialog .ui-dialog-buttonpane button.ui-state-focus, .ui-dialog .ui-dialog-buttonpane button.ui-state-active { color: #ffffff; background: var(--primary-color); border: 1px solid var(--primary-color); /* * jQuery UI 1.13+ auto-focuses the dialog's default button on open * (_focusTabbable: first tabbable in the content, else in the buttonpane). * Because that focus is programmatic, the browser treats it as :focus-visible * and paints its native BLUE ring around our green button; master (1.7.3 / * jQuery 1.4.2) did not. Suppress it, same as for the titlebar close button * and the auto-focused form fields (forms.css). Keyboard users still get a * visible indicator: jQuery UI adds .ui-visual-focus on keyboard focus, which * jquery-ui-theme.css renders as an on-brand green glow. */ outline: none; } .ui-dialog .ui-dialog-buttonpane { padding-left: 0; padding-right: 0; } /* * In jQuery UI 1.13 the titlebar close button is a .ui-button, so the base * theme would paint it as a filled (green) box. Flatten it to a borderless * icon-only control — resolves the grey/green close-button glitch (§5b #1). */ .ui-dialog .ui-dialog-titlebar-close, .ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus, .ui-dialog .ui-dialog-titlebar-close.ui-state-hover, .ui-dialog .ui-dialog-titlebar-close.ui-state-focus { right: 0; margin-top: -12px; background: transparent; border: none; box-shadow: none; /* jQuery UI 1.13 auto-focuses the close button when a dialog has no focusable content, so the browser paints a native (blue) focus ring around it. Master (1.7.3) did not. Suppress it — the button is flat/icon-only anyway. */ outline: none; } /* ...and a dark X icon, since the flat (non-green) button means the theme's light button-icon sprite would otherwise be invisible on the titlebar. */ .ui-dialog .ui-dialog-titlebar-close .ui-icon, .ui-dialog .ui-dialog-titlebar-close:hover .ui-icon { background-image: url("south-street/images/ui-icons_808080_256x240.png"); } /* * jQuery UI 1.13 marks the dialog SE resize grip with .ui-icon. The 1.13 base * theme would paint it from the gripsmall-diagonal-se sprite slot; we instead * draw a clean on-brand diagonal grip via inline SVG (kept by choice as part of * the design refresh — see jquery-migration-plan.md §5b). */ .ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cg stroke='%23c8c8c8' stroke-width='1.4' stroke-linecap='round'%3E%3Cline x1='13' y1='4' x2='4' y2='13'/%3E%3Cline x1='13' y1='8' x2='8' y2='13'/%3E%3Cline x1='13' y1='12' x2='12' y2='13'/%3E%3C/g%3E%3C/svg%3E") no-repeat center; } .ui-accordion .ui-accordion-header a { font-size: 12px; } .ui-accordion .ui-accordion-header a img { transform: translate(0, 2px); } .ui-helper-reset { font-size: 12px; } .ui-widget { font-size: 12px; } .ui-state-default.ui-state-active:not(.kru-buttoncontrol), .ui-widget-content .ui-state-default.ui-state-active:not(.kru-buttoncontrol), .ui-state-default.ui-state-active, .ui-widget-content .ui-state-default.ui-state-active { background-color: var(--white-color); border-color: #d4ccb0; } #editMessstelleDialog .ui-icon-comment, #assignMessstelleDialog .ui-icon-commen { transform: translate(0, 7px); } #timepickerStart + span .ui-icon-comment, #shutdownMinutes + span .ui-icon-comment, #timepickerEnd + span .ui-icon-comment { transform: translate(0, 3px); } /* EN50001 energy assistant – modern inline SVG tree icons */ .jstree li[lang="N_info"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%233b82f6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='9' r='7.5'/%3E%3Cline x1='9' y1='8' x2='9' y2='13'/%3E%3Ccircle cx='9' cy='5.5' r='0.5' fill='%233b82f6' stroke='none'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[lang="N_none"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%23646464' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 15.5H2V5.5l2-3h10l2 3z'/%3E%3Cline x1='2' y1='5.5' x2='16' y2='5.5'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[lang="N_inputTodo"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%23f59e0b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='9' r='7.5'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[lang="N_inputDone"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%2355ab26' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='9' r='7.5' fill='%2355ab26'/%3E%3Cpolyline points='5.5,9.5 8,12 12.5,6.5' stroke='%23ffffff' stroke-width='2'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[lang="N_inputMissing"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%23ef4444' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='9' r='7.5'/%3E%3Cline x1='6.5' y1='6.5' x2='11.5' y2='11.5'/%3E%3Cline x1='11.5' y1='6.5' x2='6.5' y2='11.5'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } /* Sichten tree (berichtSichten) – modern inline SVG tree icons (Lucide shapes) */ .jstree li[rel="sicht"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cline x1='8' y1='13' x2='16' y2='13'/%3E%3Cline x1='8' y1='16' x2='14' y2='16'/%3E%3Cline x1='8' y1='10' x2='12' y2='10'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="sigmasicht"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cline x1='8' y1='13' x2='16' y2='13'/%3E%3Cline x1='8' y1='16' x2='14' y2='16'/%3E%3Cline x1='8' y1='10' x2='12' y2='10'/%3E%3Crect x='11' y='4' width='16' height='19' rx='1.5' fill='white' stroke='none'/%3E%3Ctext x='19' y='22' font-family='sans-serif' font-weight='bold' font-size='21' fill='%233b82f6' stroke='none' text-anchor='middle'%3E%CE%A3%3C/text%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="verbraucher"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="sigmaverbraucher"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z'/%3E%3Crect x='11' y='4' width='16' height='19' rx='1.5' fill='white' stroke='none'/%3E%3Ctext x='19' y='22' font-family='sans-serif' font-weight='bold' font-size='21' fill='%23646464' stroke='none' text-anchor='middle'%3E%CE%A3%3C/text%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="verbraucher"].jstree-open > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="sigmaverbraucher"].jstree-open > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2'/%3E%3Crect x='11' y='4' width='16' height='19' rx='1.5' fill='white' stroke='none'/%3E%3Ctext x='19' y='22' font-family='sans-serif' font-weight='bold' font-size='21' fill='%23646464' stroke='none' text-anchor='middle'%3E%CE%A3%3C/text%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="messstelle"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2355ab26' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="messstelle_dynamic"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%238b5cf6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Ctext x='8' y='17' font-family='sans-serif' font-weight='bold' font-size='9' fill='%238b5cf6' stroke='none'%3Ef(x)%3C/text%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="gesamtzaehler"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='3' x2='12' y2='7'/%3E%3Cline x1='12' y1='17' x2='12' y2='21'/%3E%3Cline x1='3' y1='12' x2='7' y2='12'/%3E%3Cline x1='17' y1='12' x2='21' y2='12'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } /* Einzelwert-Favorit / dynamische-Messstelle cluster tree – unit group + dynamic meter */ .jstree li[rel="entityGroup"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="entityGroup"].jstree-open > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="gesamtzaehler_dynamic"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%238b5cf6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='3' x2='12' y2='7'/%3E%3Cline x1='12' y1='17' x2='12' y2='21'/%3E%3Cline x1='3' y1='12' x2='7' y2='12'/%3E%3Cline x1='17' y1='12' x2='21' y2='12'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="deltamessstelle"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ef4444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Ctext x='8.5' y='18' font-family='serif' font-weight='bold' font-size='12' fill='%23ef4444' stroke='none'%3E%CE%94%3C/text%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } /* Unit+ editor tree (editUnitPlus) – unit (folder) / zaehler (meter) / datapoint on|off (document) */ .jstree li[rel="unit"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="unit"].jstree-open > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="zaehler"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='3' x2='12' y2='7'/%3E%3Cline x1='12' y1='17' x2='12' y2='21'/%3E%3Cline x1='3' y1='12' x2='7' y2='12'/%3E%3Cline x1='17' y1='12' x2='21' y2='12'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="datapoint_on"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2355ab26' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } .jstree li[rel="datapoint_off"] > a > .jstree-themeicon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c8c8c8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3C/svg%3E") !important; background-position: center center !important; background-size: 16px 16px; } /* Override dynamically generated inline