UNPKG

popover-css-inspector

Version:

Displays CSS attributes of elements in a Bootstrap popover. Ideal for design systems and style guides.

6 lines 26.7 kB
/*! * Popover CSS Inspector v1.0.0-beta15 * Copyright 2023-2024 C.Oliff * Licensed under MIT (https://github.com/coliff/popover-css-inspector/blob/main/LICENSE) */ const PopoverTriggerList=[].slice.call(document.querySelectorAll('[data-bs-custom-class*="popover-css-inspector"]'));let popoverList=[];function createPopovers(){popoverList.forEach((function(t){t.dispose()})),popoverList=[],popoverList=PopoverTriggerList.map((function(t){const e=window.getComputedStyle(t),r=e.getPropertyValue("background-color"),o=e.getPropertyValue("border-color"),a=e.getPropertyValue("border-bottom-color"),s=e.getPropertyValue("color");let l='<table class="small" style="margin: 0; padding: 0;">';e.getPropertyValue("accent-color")&&""!==e.getPropertyValue("accent-color")&&null!==e.getPropertyValue("accent-color")&&/accent-color/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-accent-color"><td>accent-color:</td><td>'+e.getPropertyValue("accent-color")+"</td></tr>"),e.getPropertyValue("animation")&&""!==e.getPropertyValue("animation")&&null!==e.getPropertyValue("animation")&&/(?<!-)\banimation\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-animation"><td>animation:</td><td>'+e.getPropertyValue("animation")+"</td></tr>"),e.getPropertyValue("animation-name")&&"none"!==e.getPropertyValue("animation-name")&&""!==e.getPropertyValue("animation-name")&&null!==e.getPropertyValue("animation-name")&&!/animation-name/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-animation-name"><td>animation-name:</td><td>'+e.getPropertyValue("animation-name")+"</td></tr>"),e.getPropertyValue("animation-duration")&&"0s"!==e.getPropertyValue("animation-duration")&&""!==e.getPropertyValue("animation-duration")&&null!==e.getPropertyValue("animation-duration")&&!/animation-duration/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-animation-duration"><td>animation-duration:</td><td>'+e.getPropertyValue("animation-duration")+"</td></tr>"),e.getPropertyValue("appearance")&&"none"!==e.getPropertyValue("appearance")&&""!==e.getPropertyValue("appearance")&&null!==e.getPropertyValue("appearance")&&/appearance/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-appearance"><td>appearance:</td><td>'+e.getPropertyValue("appearance")+"</td></tr>"),e.getPropertyValue("aspect-ratio")&&""!==e.getPropertyValue("aspect-ratio")&&null!==e.getPropertyValue("aspect-ratio")&&/aspect-ratio/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-aspect-ratio"><td>aspect-ratio:</td><td>'+e.getPropertyValue("aspect-ratio")+"</td></tr>"),e.getPropertyValue("background-color")&&"none"!==e.getPropertyValue("background-color")&&""!==e.getPropertyValue("background-color")&&null!==e.getPropertyValue("background-color")&&!/bg-color/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-background-color"><td>background-color:</td><td><div class="css-swatch" style="background-color:'+rgbToHex(r)+'"></div><span>'+rgbToHex(r)+"</td></tr>"),e.getPropertyValue("background-image")&&"none"!==e.getPropertyValue("background-image")&&""!==e.getPropertyValue("background-image")&&null!==e.getPropertyValue("background-image")&&/bg-image/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-background-image"><td>background-image:</td><td>'+e.getPropertyValue("background-image")+"</td></tr>"),e.getPropertyValue("background-position")&&"none"!==e.getPropertyValue("background-position")&&""!==e.getPropertyValue("background-position")&&null!==e.getPropertyValue("background-position")&&/bg-position/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-background-position"><td>background-position:</td><td>'+e.getPropertyValue("background-position")+"</td></tr>"),e.getPropertyValue("background-repeat")&&"none"!==e.getPropertyValue("background-repeat")&&""!==e.getPropertyValue("background-repeat")&&null!==e.getPropertyValue("background-repeat")&&/bg-repeat/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-background-repeat"><td>background-repeat:</td><td>'+e.getPropertyValue("background-image")+"</td></tr>"),e.getPropertyValue("background-size")&&"none"!==e.getPropertyValue("background-size")&&""!==e.getPropertyValue("background-size")&&null!==e.getPropertyValue("background-size")&&/bg-size/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-background-size"><td>background-size:</td><td>'+e.getPropertyValue("background-size")+"</td></tr>"),e.getPropertyValue("border")&&"none"!==e.getPropertyValue("border")&&""!==e.getPropertyValue("border")&&null!==e.getPropertyValue("border")&&/(?<!-)\bborder\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-border"><td>border:</td><td>'+e.getPropertyValue("border")+"</td></tr>"),e.getPropertyValue("border-bottom-color")&&"none"!==e.getPropertyValue("border-bottom-color")&&""!==e.getPropertyValue("border-bottom-color")&&null!==e.getPropertyValue("border-bottom-color")&&/b-bottom-color/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-bottom-border-color"><td>border-bottom-color:</td><td><div class="css-swatch" style="background-color:'+rgbToHex(a)+'"></div><span>'+rgbToHex(a)+"</td></tr>"),e.getPropertyValue("border-bottom-width")&&"none"!==e.getPropertyValue("border-bottom-width")&&""!==e.getPropertyValue("border-bottom-width")&&null!==e.getPropertyValue("border-bottom-width")&&/b-bottom-width/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-border-bottom-width"><td>border-bottom-width:</td><td>'+e.getPropertyValue("border-bottom-width")+"</td></tr>"),e.getPropertyValue("border-color")&&"none"!==e.getPropertyValue("border-color")&&""!==e.getPropertyValue("border-color")&&null!==e.getPropertyValue("border-color")&&/b-color/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-border-color"><td>border-color:</td><td><div class="css-swatch" style="background-color:'+rgbToHex(o)+'"></div><span>'+rgbToHex(o)+"</td></tr>"),e.getPropertyValue("border-left-width")&&"none"!==e.getPropertyValue("border-left-width")&&""!==e.getPropertyValue("border-left-width")&&null!==e.getPropertyValue("border-left-width")&&/b-left-width/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-border-left-width"><td>border-left-width:</td><td>'+e.getPropertyValue("border-left-width")+"</td></tr>"),e.getPropertyValue("border-radius")&&"none"!==e.getPropertyValue("border-radius")&&""!==e.getPropertyValue("border-radius")&&null!==e.getPropertyValue("border-radius")&&!/b-radius/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-border-radius"><td>border-radius:</td><td>'+e.getPropertyValue("border-radius")+"</td></tr>"),e.getPropertyValue("border-style")&&""!==e.getPropertyValue("border-style")&&null!==e.getPropertyValue("border-style")&&/b-style/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-border-style"><td>border-style:</td><td>'+e.getPropertyValue("border-style")+"</td></tr>"),e.getPropertyValue("border-width")&&"none"!==e.getPropertyValue("border-width")&&"0px"!==e.getPropertyValue("border-width")&&""!==e.getPropertyValue("border-width")&&null!==e.getPropertyValue("border-width")&&!/b-width/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-border-width"><td>border-width:</td><td>'+e.getPropertyValue("border-width")+"</td></tr>"),e.getPropertyValue("box-shadow")&&"none"!==e.getPropertyValue("box-shadow")&&""!==e.getPropertyValue("box-shadow")&&null!==e.getPropertyValue("box-shadow")&&/box-shadow/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-box-sizing"><td>box-shadow:</td><td>'+e.getPropertyValue("box-shadow")+"</td></tr>"),e.getPropertyValue("box-sizing")&&"none"!==e.getPropertyValue("box-sizing")&&""!==e.getPropertyValue("box-sizing")&&null!==e.getPropertyValue("box-sizing")&&/box-sizing/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-box-sizing"><td>box-sizing:</td><td>'+e.getPropertyValue("box-sizing")+"</td></tr>"),e.getPropertyValue("color")&&"none"!==e.getPropertyValue("color")&&""!==e.getPropertyValue("color")&&null!==e.getPropertyValue("color")&&!/(?<!-)\bcolor\b(?!-)/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-color"><td>color:</td><td><div class="css-swatch" style="background-color:'+rgbToHex(s)+'"></div><span>'+rgbToHex(s)+"</td></tr>"),e.getPropertyValue("color-scheme")&&"none"!==e.getPropertyValue("color-scheme")&&""!==e.getPropertyValue("color-scheme")&&null!==e.getPropertyValue("color-scheme")&&/color-scheme/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-color-scheme"><td>color-scheme:</td><td>'+e.getPropertyValue("color-scheme")+"</td></tr>"),e.getPropertyValue("cursor")&&"none"!==e.getPropertyValue("cursor")&&""!==e.getPropertyValue("cursor")&&null!==e.getPropertyValue("cursor")&&/cursor/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-cursor"><td>cursor:</td><td>'+e.getPropertyValue("cursor")+"</td></tr>"),e.getPropertyValue("display")&&"none"!==e.getPropertyValue("display")&&""!==e.getPropertyValue("display")&&null!==e.getPropertyValue("display")&&/display/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-display"><td>display:</td><td>'+e.getPropertyValue("display")+"</td></tr>"),e.getPropertyValue("float")&&"none"!==e.getPropertyValue("float")&&""!==e.getPropertyValue("float")&&null!==e.getPropertyValue("float")&&/float/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-float"><td>float:</td><td>'+e.getPropertyValue("float")+"</td></tr>"),e.getPropertyValue("font-family")&&"none"!==e.getPropertyValue("font-family")&&""!==e.getPropertyValue("font-family")&&null!==e.getPropertyValue("font-family")&&/font-family/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-font-family"><td>font-family:</td><td>'+e.getPropertyValue("font-family")+"</td></tr>"),e.getPropertyValue("font-size")&&"none"!==e.getPropertyValue("font-size")&&""!==e.getPropertyValue("font-size")&&null!==e.getPropertyValue("font-size")&&!/font-size/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-font-size"><td>font-size:</td><td>'+e.getPropertyValue("font-size")+"</td></tr>"),e.getPropertyValue("font-style")&&"none"!==e.getPropertyValue("font-style")&&"normal"!==e.getPropertyValue("font-style")&&""!==e.getPropertyValue("font-style")&&null!==e.getPropertyValue("font-style")&&!/font-style/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-font-style"><td>font-style:</td><td>'+e.getPropertyValue("font-style")+"</td></tr>"),e.getPropertyValue("font-weight")&&"none"!==e.getPropertyValue("font-weight")&&"400"!==e.getPropertyValue("font-weight")&&""!==e.getPropertyValue("font-weight")&&null!==e.getPropertyValue("font-weight")&&!/font-weight/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-font-weight"><td>font-weight:</td><td>'+e.getPropertyValue("font-weight")+"</td></tr>"),e.getPropertyValue("height")&&"none"!==e.getPropertyValue("height")&&""!==e.getPropertyValue("height")&&null!==e.getPropertyValue("height")&&!/(?<!-)\bheight\b(?!-)/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-height"><td>height:</td><td>'+e.getPropertyValue("height")+"</td></tr>"),e.getPropertyValue("justify-content")&&"none"!==e.getPropertyValue("justify-content")&&""!==e.getPropertyValue("justify-content")&&null!==e.getPropertyValue("justify-content")&&/justify-content/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-justify-content"><td>justify-content:</td><td>'+e.getPropertyValue("justify-content")+"</td></tr>"),e.getPropertyValue("letter-spacing")&&"none"!==e.getPropertyValue("letter-spacing")&&""!==e.getPropertyValue("letter-spacing")&&null!==e.getPropertyValue("letter-spacing")&&/letter-spacing/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-letter-spacing"><td>letter-spacing:</td><td>'+e.getPropertyValue("letter-spacing")+"</td></tr>"),e.getPropertyValue("line-break")&&"none"!==e.getPropertyValue("line-break")&&""!==e.getPropertyValue("line-break")&&null!==e.getPropertyValue("line-break")&&/line-break/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-line-break"><td>line-break:</td><td>'+e.getPropertyValue("line-break")+"</td></tr>"),e.getPropertyValue("line-height")&&"none"!==e.getPropertyValue("line-height")&&""!==e.getPropertyValue("line-height")&&null!==e.getPropertyValue("line-height")&&/line-height/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-line-height"><td>line-height:</td><td>'+e.getPropertyValue("line-height")+"</td></tr>"),e.getPropertyValue("list-style")&&"none"!==e.getPropertyValue("list-style")&&""!==e.getPropertyValue("list-style")&&null!==e.getPropertyValue("list-style")&&/list-style/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-list-style"><td>list-style:</td><td>'+e.getPropertyValue("list-style")+"</td></tr>"),e.getPropertyValue("margin")&&"none"!==e.getPropertyValue("margin")&&"0px"!==e.getPropertyValue("margin")&&""!==e.getPropertyValue("margin")&&null!==e.getPropertyValue("margin")&&!/(?<!-)\bmargin\b(?!-)/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-margin"><td>margin:</td><td>'+e.getPropertyValue("margin")+"</td></tr>"),e.getPropertyValue("margin-bottom")&&"none"!==e.getPropertyValue("margin-bottom")&&"0px"!==e.getPropertyValue("margin-bottom")&&""!==e.getPropertyValue("margin-bottom")&&null!==e.getPropertyValue("margin-bottom")&&/margin-bottom/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-margin-bottom"><td>margin-bottom:</td><td>'+e.getPropertyValue("margin-bottom")+"</td></tr>"),e.getPropertyValue("margin-left")&&"none"!==e.getPropertyValue("margin-left")&&"0px"!==e.getPropertyValue("margin-left")&&""!==e.getPropertyValue("margin-left")&&null!==e.getPropertyValue("margin-left")&&/margin-top/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-margin-left"><td>margin-left:</td><td>'+e.getPropertyValue("margin-left")+"</td></tr>"),e.getPropertyValue("margin-right")&&"none"!==e.getPropertyValue("margin-right")&&"0px"!==e.getPropertyValue("margin-right")&&""!==e.getPropertyValue("margin-right")&&null!==e.getPropertyValue("margin-right")&&/margin-right/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-margin-right"><td>margin-right:</td><td>'+e.getPropertyValue("margin-right")+"</td></tr>"),e.getPropertyValue("margin-top")&&"none"!==e.getPropertyValue("margin-top")&&"0px"!==e.getPropertyValue("margin-top")&&""!==e.getPropertyValue("margin-top")&&null!==e.getPropertyValue("margin-top")&&/margin-top/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-margin-top"><td>margin-top:</td><td>'+e.getPropertyValue("margin-top")+"</td></tr>"),e.getPropertyValue("max-height")&&"none"!==e.getPropertyValue("max-height")&&""!==e.getPropertyValue("max-height")&&null!==e.getPropertyValue("max-height")&&!/max-height/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-max-height"><td>max-height:</td><td>'+e.getPropertyValue("max-height")+"</td></tr>"),e.getPropertyValue("max-width")&&"none"!==e.getPropertyValue("max-width")&&""!==e.getPropertyValue("max-width")&&null!==e.getPropertyValue("max-width")&&!/max-width/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-max-width"><td>max-width:</td><td>'+e.getPropertyValue("max-width")+"</td></tr>"),e.getPropertyValue("min-height")&&"none"!==e.getPropertyValue("min-height")&&"0px"!==e.getPropertyValue("min-height")&&""!==e.getPropertyValue("min-height")&&null!==e.getPropertyValue("min-height")&&/min-height/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-min-width"><td>min-height:</td><td>'+e.getPropertyValue("min-height")+"</td></tr>"),e.getPropertyValue("min-width")&&"none"!==e.getPropertyValue("min-width")&&"0px"!==e.getPropertyValue("min-width")&&""!==e.getPropertyValue("min-width")&&null!==e.getPropertyValue("min-width")&&/min-width/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-min-width"><td>min-width:</td><td>'+e.getPropertyValue("min-width")+"</td></tr>"),e.getPropertyValue("opacity")&&"none"!==e.getPropertyValue("opacity")&&"1"!==e.getPropertyValue("opacity")&&""!==e.getPropertyValue("opacity")&&null!==e.getPropertyValue("opacity")&&!/opacity/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-opacity"><td>opacity:</td><td>'+e.getPropertyValue("opacity")+"</td></tr>"),e.getPropertyValue("overflow")&&""!==e.getPropertyValue("overflow")&&null!==e.getPropertyValue("overflow")&&/(?<!-)\boverflow\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-overflow"><td>overflow:</td><td>'+e.getPropertyValue("overflow")+"</td></tr>"),e.getPropertyValue("overflow-x")&&""!==e.getPropertyValue("overflow-x")&&null!==e.getPropertyValue("overflow-x")&&/(?<!-)\boverflow-x\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-overflow-x"><td>overflow-x:</td><td>'+e.getPropertyValue("overflow-x")+"</td></tr>"),e.getPropertyValue("overflow-y")&&""!==e.getPropertyValue("overflow-y")&&null!==e.getPropertyValue("overflow-y")&&/(?<!-)\boverflow-y\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-overflow-x"><td>overflow-y:</td><td>'+e.getPropertyValue("overflow-y")+"</td></tr>"),!e.getPropertyValue("padding")||"none"===e.getPropertyValue("padding")||""===e.getPropertyValue("padding")||null===e.getPropertyValue("padding")||e.getPropertyValue("padding").includes(".")||/(?<!-)\bpadding\b(?!-)/.test(t.getAttribute("data-css-inspector-hide"))||(l+='<tr class="css-padding"><td>padding:</td><td>'+e.getPropertyValue("padding")+"</td></tr>"),e.getPropertyValue("position")&&""!==e.getPropertyValue("position")&&null!==e.getPropertyValue("position")&&/(?<!-)\bposition\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-position"><td>position:</td><td>'+e.getPropertyValue("position")+"</td></tr>"),e.getPropertyValue("text-align")&&"none"!==e.getPropertyValue("text-align")&&"start"!==e.getPropertyValue("text-align")&&""!==e.getPropertyValue("text-align")&&null!==e.getPropertyValue("text-align")&&!/text-align/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-text-align"><td>text-align:</td><td>'+e.getPropertyValue("text-align")+"</td></tr>"),e.getPropertyValue("text-decoration")&&"none"!==e.getPropertyValue("text-decoration")&&"start"!==e.getPropertyValue("text-decoration")&&""!==e.getPropertyValue("text-decoration")&&null!==e.getPropertyValue("text-decoration")&&/text-decoration/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-text-decoration"><td>text-decoration:</td><td>'+e.getPropertyValue("text-decoration")+"</td></tr>"),e.getPropertyValue("text-indent")&&"none"!==e.getPropertyValue("text-indent")&&""!==e.getPropertyValue("text-indent")&&null!==e.getPropertyValue("text-indent")&&/text-indent/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-text-indent"><td>text-indent:</td><td>'+e.getPropertyValue("text-indent")+"</td></tr>"),e.getPropertyValue("text-shadow")&&"none"!==e.getPropertyValue("text-shadow")&&""!==e.getPropertyValue("text-shadow")&&null!==e.getPropertyValue("text-shadow")&&/text-shadow/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-text-shadow"><td>text-shadow:</td><td>'+e.getPropertyValue("text-shadow")+"</td></tr>"),e.getPropertyValue("text-transform")&&"none"!==e.getPropertyValue("text-transform")&&""!==e.getPropertyValue("text-transform")&&null!==e.getPropertyValue("text-transform")&&!/text-transform/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-text-transform"><td>text-transform:</td><td>'+e.getPropertyValue("text-transform")+"</td></tr>"),e.getPropertyValue("text-wrap")&&"none"!==e.getPropertyValue("text-wrap")&&""!==e.getPropertyValue("text-wrap")&&null!==e.getPropertyValue("text-wrap")&&/text-wrap/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-text-wrap"><td>text-wrap:</td><td>'+e.getPropertyValue("text-wrap")+"</td></tr>"),e.getPropertyValue("transform")&&"none"!==e.getPropertyValue("transform")&&""!==e.getPropertyValue("transform")&&null!==e.getPropertyValue("transform")&&/transform/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-transform"><td>transform:</td><td>'+e.getPropertyValue("transform")+"</td></tr>"),e.getPropertyValue("transition")&&"none"!==e.getPropertyValue("transition")&&""!==e.getPropertyValue("transition")&&null!==e.getPropertyValue("transition")&&/(?<!-)\btransition\b(?!-)/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-transition"><td>transition:</td><td>'+e.getPropertyValue("transition")+"</td></tr>"),e.getPropertyValue("user-select")&&""!==e.getPropertyValue("user-select")&&null!==e.getPropertyValue("user-select")&&/user-select/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-user-select"><td>user-select:</td><td>'+e.getPropertyValue("user-select")+"</td></tr>"),e.getPropertyValue("vertical-align")&&"none"!==e.getPropertyValue("vertical-align")&&""!==e.getPropertyValue("vertical-align")&&null!==e.getPropertyValue("vertical-align")&&/vertical-align/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-vertical-align"><td>vertical-align:</td><td>'+e.getPropertyValue("vertical-align")+"</td></tr>"),e.getPropertyValue("white-space")&&"none"!==e.getPropertyValue("white-space")&&"normal"!==e.getPropertyValue("white-space")&&""!==e.getPropertyValue("white-space")&&null!==e.getPropertyValue("white-space")&&!e.getPropertyValue("white-space").includes(".")&&/white-space/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-white-space"><td>white-space:</td><td>'+e.getPropertyValue("white-space")+"</td></tr>"),!e.getPropertyValue("width")||"none"===e.getPropertyValue("width")||""===e.getPropertyValue("width")||null===e.getPropertyValue("width")||e.getPropertyValue("width").includes(".")||/(?<!-)\bwidth\b(?!-)/.test(t.getAttribute("data-css-inspector-hide"))||(l+='<tr class="css-width"><td>width:</td><td>'+e.getPropertyValue("width")+"</td></tr>"),e.getPropertyValue("word-break")&&"none"!==e.getPropertyValue("word-break")&&""!==e.getPropertyValue("word-break")&&null!==e.getPropertyValue("word-break")&&/word-break/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-word-break"><td>word-break:</td><td>'+e.getPropertyValue("word-break")+"</td></tr>"),e.getPropertyValue("word-spacing")&&"none"!==e.getPropertyValue("word-spacing")&&""!==e.getPropertyValue("word-spacing")&&null!==e.getPropertyValue("word-spacing")&&/word-spacing/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-word-spacing "><td>word-spacing :</td><td>'+e.getPropertyValue("word-spacing ")+"</td></tr>"),e.getPropertyValue("word-wrap")&&"none"!==e.getPropertyValue("word-wrap")&&""!==e.getPropertyValue("word-wrap")&&null!==e.getPropertyValue("word-wrap")&&/word-wrap/.test(t.getAttribute("data-css-inspector-show"))&&(l+='<tr class="css-word-wrap "><td>word-wrap :</td><td>'+e.getPropertyValue("word-wrap ")+"</td></tr>"),e.getPropertyValue("z-index")&&"none"!==e.getPropertyValue("z-index")&&""!==e.getPropertyValue("z-index")&&null!==e.getPropertyValue("z-index")&&!e.getPropertyValue("z-index").includes(".")&&/z-index/.test(t.getAttribute("data-css-inspector-hide"))&&(l+='<tr class="css-z-index"><td>z-index:</td><td>'+e.getPropertyValue("z-index")+"</td></tr>"),l+="</table><style>.popover-css-inspector {z-index: 1010; display: block; max-width: 285px; text-shadow: none; text-transform: none; letter-spacing: normal; word-break: normal; white-space: normal; word-spacing: normal; line-break: auto; font-size: 0.875rem; border: 1px solid rgba(133, 133, 133, .3); border-radius: .5rem} .popover-css-inspector .popover-body {padding: .5rem .75rem; line-height: 1.5; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial, sans-serif; } .popover-css-inspector .popover-body td {height: 1.1rem; padding: 0; font-style: normal; text-align: left; text-decoration: none;} .popover-css-inspector .popover-body td:nth-child(1) {font-weight: bold; padding-right: .5rem; text-wrap: nowrap !important}.popover-css-inspector .popover-body td:nth-child(2) {font-weight: 400 !important; font-family: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !important; padding-top: 1px;}.popover-css-inspector .popover-body td:nth-child(2):not(:has(div)) {opacity: .7;}.popover-css-inspector .popover-body td:nth-child(2) span {opacity: .7; padding-top: 1px;}.popover-css-inspector .popover-header {padding: 4px; padding-left: 12px; font-size: .875em; border: 0;}.popover-css-inspector .css-swatch {border: 1px solid rgba(133, 133, 133, .3); border-radius: 50%; display: inline-block; height: 12px; width: 12px; margin-bottom: -2px; margin-right: .25rem; forced-color-adjust: none;}.popover-css-inspector[data-popper-placement='left'] {margin-right: 10px !important;}.popover-css-inspector[data-popper-placement='right'] {margin-left: 10px !important;}.popover-css-inspector[data-popper-placement='left'] .popover-arrow {position: fixed; top: 50%; transform: translateY(-50%);}.popover-css-inspector[data-popper-placement='right'] .popover-arrow {position: fixed; top: 50%; transform: translateY(-50%);}.popover-css-inspector[data-popper-placement='top'] {margin-bottom: 10px !important;}.popover-css-inspector[data-popper-placement='top'] .popover-arrow {position: fixed; left: 48%; transform: translateY(-40%); bottom: -12px;}.popover-css-inspector[data-popper-placement='bottom'] {margin-top: 10px !important;}.popover-css-inspector[data-popper-placement='bottom'] .popover-arrow {position: fixed; left: 48%; transform: translateY(-40%); top: -5px;}</style>";const n=new bootstrap.Popover(t,{content:l,boundary:"window",html:!0,sanitize:!1,popperConfig:{modifiers:[{name:"preventOverflow",options:{rootBoundary:"document"}}]}});return n.show(),n._config.keyboard=!1,n._config.backdrop="static",n;function rgbToHex(t){const e=t.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);return e?"#"+hex(e[1])+hex(e[2])+hex(e[3]):t}function hex(t){return("0"+parseInt(t).toString(16)).slice(-2)}}))}createPopovers();const themeObserver=new MutationObserver((function(t){t.forEach((function(t){"data-bs-theme"===t.attributeName&&createPopovers()}))}));themeObserver.observe(document.documentElement,{attributes:!0});