topic Re: HTML - Style - remove the extra lin eof black in Splunk Search

HTML - Style - remove the extra lin eof black

robertlynch2020 — Wed, 20 Nov 2024 18:32:06 GMT

I have the below code to produce this table - but does anyone know how to get rid of the part in red (I have added this with paint) - it's just taking up too much real estate on the screen. It is like an extra line of black that I don't want.

Thanks so much in advance 🙂

<panel> <title>Process Resources</title> <html depends="$alwaysHideCSSStyle$"> <style> #tableWithHiddenHeader6 th[data-sort-key=label] { width: 40% !important; text-align: left; } #tableWithHiddenHeader6 th[data-sort-key=value] { width: 20% !important; text-align: left; } #tableWithHiddenHeader6 th[data-sort-key=threshold] { width: 20% !important; text-align: left; } #tableWithHiddenHeader6 th[data-sort-key=limit] { width: 20% !important; text-align: left; } #tableWithHiddenHeader6 td { text-align: left; } #tableWithHiddenHeader7 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader7 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader7 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader7 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader7 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader7 td { text-align: left; } #tableWithHiddenHeader8 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader8 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader8 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader8 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader8 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader8 td { text-align: left; } #tableWithHiddenHeader9 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader9 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader9 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader9 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader9 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader9 td { text-align: left; } #tableWithHiddenHeader10 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader10 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader10 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader10 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader10 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader10 td { text-align: left; } </style> </html> <table id="tableWithHiddenHeader6"> <search id="twenty_one"> <done> <set token="tokStatus20">$result.threshold$</set> <set token="tokStatus30">$result.limit$</set> </done> <query>| mstats max("mx.database.space.usage") as value WHERE "index"="murex_metrics" AND "mx.env"="*" AND process.pid ="*" span=10s BY degraded.threshold down.threshold process.pid | rename degraded.threshold as T_CpuPerc | rename down.threshold as limit | sort - _time | head 1 | eval value = round(value,1) | eval label="Database space" | eval threshold=T_CpuPerc | eval limit=limit | table label value threshold limit | appendpipe [ stats count | eval "label"="No results Found" | where count=0 | table "label"]</query> <earliest>$time_token.earliest$</earliest> <latest>$time_token.latest$</latest> <sampleRatio>1</sampleRatio> <refresh>5s</refresh> <refreshType>delay</refreshType> </search> <option name="count">20</option> <option name="dataOverlayMode">none</option> <option name="drilldown">none</option> <option name="percentagesRow">false</option> <option name="refresh.display">progressbar</option> <option name="rowNumbers">false</option> <option name="totalsRow">false</option> <option name="wrap">true</option> <format type="color" field="value"> <colorPalette type="expression">if(value > $tokStatus30$, "$TOKEN_RED$",if(value > $tokStatus20$, "$TOKEN_YELLOW$", "$TOKEN_GREEN$"))</colorPalette> </format> </table> etc,, for each row of the table

Re: HTML - Style - remove the extra lin eof black

ITWhisperer — Wed, 20 Nov 2024 18:33:05 GMT

Please share the panel source including the search you have used

Re: HTML - Style - remove the extra lin eof black

robertlynch2020 — Wed, 20 Nov 2024 19:29:31 GMT

Hi @ITWhisperer

Below is pannel to pannel - thanks for the help

<row> <panel> <title>Process Resources</title> <html depends="$alwaysHideCSSStyle$"> <style> #tableWithHiddenHeader6 th[data-sort-key=label] { width: 40% !important; text-align: left; } #tableWithHiddenHeader6 th[data-sort-key=value] { width: 20% !important; text-align: left; } #tableWithHiddenHeader6 th[data-sort-key=threshold] { width: 20% !important; text-align: left; } #tableWithHiddenHeader6 th[data-sort-key=limit] { width: 20% !important; text-align: left; } #tableWithHiddenHeader6 td { text-align: left; } #tableWithHiddenHeader7 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader7 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader7 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader7 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader7 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader7 td { text-align: left; } #tableWithHiddenHeader8 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader8 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader8 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader8 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader8 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader8 td { text-align: left; } #tableWithHiddenHeader9 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader9 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader9 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader9 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader9 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader9 td { text-align: left; } #tableWithHiddenHeader10 thead{ visibility: hidden; height: min-content; } #tableWithHiddenHeader10 th[data-sort-key=label] { width: 40% !important; } #tableWithHiddenHeader10 th[data-sort-key=value] { width: 20% !important; } #tableWithHiddenHeader10 th[data-sort-key=threshold] { width: 20% !important; } #tableWithHiddenHeader10 th[data-sort-key=limit] { width: 20% !important; } #tableWithHiddenHeader10 td { text-align: left; } </style> </html> <table id="tableWithHiddenHeader6"> <search id="twenty_one"> <done> <set token="tokStatus20">$result.threshold$</set> <set token="tokStatus30">$result.limit$</set> </done> <query>| mstats max("mx.database.space.usage") as value WHERE "index"="murex_metrics" AND "mx.env"="*" AND process.pid ="*" span=10s BY degraded.threshold down.threshold process.pid | rename degraded.threshold as T_CpuPerc | rename down.threshold as limit | sort - _time | head 1 | eval value = round(value,1) | eval label="Database space" | eval threshold=T_CpuPerc | eval limit=limit | table label value threshold limit | appendpipe [ stats count | eval "label"="No results Found" | where count=0 | table "label"]</query> <earliest>$time_token.earliest$</earliest> <latest>$time_token.latest$</latest> <sampleRatio>1</sampleRatio> <refresh>5s</refresh> <refreshType>delay</refreshType> </search> <option name="count">20</option> <option name="dataOverlayMode">none</option> <option name="drilldown">none</option> <option name="percentagesRow">false</option> <option name="refresh.display">progressbar</option> <option name="rowNumbers">false</option> <option name="totalsRow">false</option> <option name="wrap">true</option> <format type="color" field="value"> <colorPalette type="expression">if(value > $tokStatus30$, "$TOKEN_RED$",if(value > $tokStatus20$, "$TOKEN_YELLOW$", "$TOKEN_GREEN$"))</colorPalette> </format> </table> <table id="tableWithHiddenHeader7"> <search id="twenty_two"> <done> <set token="tokStatus40">$result.threshold$</set> <set token="tokStatus50">$result.limit$</set> </done> <query>| mstats max("mx.database.statement.top_running.time") as value WHERE "index"="murex_metrics" AND "mx.env"="*" AND process.pid ="*" span=10s BY degraded.threshold down.threshold process.pid | rename degraded.threshold as T_CpuPerc | rename down.threshold as limit | sort - _time | head 1 | eval value = round(value,1) | eval label="Top Running" | eval threshold=T_CpuPerc | eval limit=limit | table label value threshold limit | appendpipe [ stats count | eval "label"="No results Found" | where count=0 | table "label"]</query> <earliest>$time_token.earliest$</earliest> <latest>$time_token.latest$</latest> <sampleRatio>1</sampleRatio> <refresh>5s</refresh> <refreshType>delay</refreshType> </search> <option name="count">20</option> <option name="dataOverlayMode">none</option> <option name="drilldown">none</option> <option name="percentagesRow">false</option> <option name="refresh.display">progressbar</option> <option name="rowNumbers">false</option> <option name="totalsRow">false</option> <option name="wrap">true</option> <format type="color" field="value"> <colorPalette type="expression">if(value > $tokStatus50$, "$TOKEN_RED$",if(value > $tokStatus40$, "$TOKEN_YELLOW$", "$TOKEN_GREEN$"))</colorPalette> </format> </table> <table id="tableWithHiddenHeader8"> <search id="twenty_three"> <done> <set token="tokStatus60">$result.threshold$</set> <set token="tokStatus70">$result.limit$</set> </done> <query>| mstats max("mx.database.lock.top_blocking.time") as value WHERE "index"="murex_metrics" AND "mx.env"="*" AND process.pid ="*" span=10s BY degraded.threshold down.threshold process.pid | rename degraded.threshold as T_CpuPerc | rename down.threshold as limit | sort - _time | head 1 | eval value = round(value,1) | eval label="Blocking Locks" | eval threshold=T_CpuPerc | eval limit=limit | table label value threshold limit | appendpipe [ stats count | eval "label"="No results Found" | where count=0 | table "label"]</query> <earliest>$time_token.earliest$</earliest> <latest>$time_token.latest$</latest> <sampleRatio>1</sampleRatio> <refresh>30s</refresh> <refreshType>delay</refreshType> </search> <option name="count">20</option> <option name="dataOverlayMode">none</option> <option name="drilldown">none</option> <option name="percentagesRow">false</option> <option name="refresh.display">progressbar</option> <option name="rowNumbers">false</option> <option name="totalsRow">false</option> <option name="wrap">true</option> <format type="color" field="value"> <colorPalette type="expression">if(value > $tokStatus70$, "$TOKEN_RED$",if(value > $tokStatus60$, "#ffae46", "$TOKEN_GREEN$"))</colorPalette> </format> </table> <table id="tableWithHiddenHeader9"> <search id="twenty_four"> <done> <set token="tokStatus80">$result.threshold$</set> <set token="tokStatus90">$result.limit$</set> </done> <query>| mstats max("mx.database.oracle.redo_switch.count") as value WHERE "index"="murex_metrics" AND "mx.env"="*" AND process.pid ="*" span=10s BY degraded.threshold down.threshold process.pid | rename degraded.threshold as T_CpuPerc | rename down.threshold as limit | sort - _time | head 1 | eval value = round(value,1) | eval label="Redo Switch Count" | eval threshold=T_CpuPerc | eval limit=limit | table label value threshold limit | appendpipe [ stats count | eval "label"="No results Found" | where count=0 | table "label"]</query> <earliest>$time_token.earliest$</earliest> <latest>$time_token.latest$</latest> <sampleRatio>1</sampleRatio> <refresh>30s</refresh> <refreshType>delay</refreshType> </search> <option name="count">20</option> <option name="dataOverlayMode">none</option> <option name="drilldown">none</option> <option name="percentagesRow">false</option> <option name="refresh.display">progressbar</option> <option name="rowNumbers">false</option> <option name="totalsRow">false</option> <option name="wrap">true</option> <format type="color" field="value"> <colorPalette type="expression">if(value > $tokStatus90$, "$TOKEN_RED$",if(value > $tokStatus80$, "$TOKEN_YELLOW$", "$TOKEN_GREEN$"))</colorPalette> </format> </table> <table id="tableWithHiddenHeader10"> <search id="twenty_five"> <done> <set token="tokStatus100">$result.threshold$</set> <set token="tokStatus110">$result.limit$</set> </done> <query>| mstats max("mx.database.object.invalid.count") as value WHERE "index"="murex_metrics" AND "mx.env"="*" AND process.pid ="*" span=10s BY degraded.threshold down.threshold process.pid | rename degraded.threshold as T_CpuPerc | rename down.threshold as limit | sort - _time | head 1 | eval value = round(value,1) | eval label="Database space" | eval threshold=T_CpuPerc | eval limit=limit | table label value threshold limit | appendpipe [ stats count | eval "label"="No results Found" | where count=0 | table "label"]</query> <earliest>$time_token.earliest$</earliest> <latest>$time_token.latest$</latest> <sampleRatio>1</sampleRatio> <refresh>30s</refresh> <refreshType>delay</refreshType> </search> <option name="count">20</option> <option name="dataOverlayMode">none</option> <option name="drilldown">none</option> <option name="percentagesRow">false</option> <option name="refresh.display">progressbar</option> <option name="rowNumbers">false</option> <option name="totalsRow">false</option> <option name="wrap">true</option> <format type="color" field="value"> <colorPalette type="expression">if(value > $tokStatus110$, "$TOKEN_RED$",if(value > $tokStatus100$, "$TOKEN_YELLOW$", "$TOKEN_GREEN$"))</colorPalette> </format> </table> </panel> </row>

Re: HTML - Style - remove the extra lin eof black

ITWhisperer — Wed, 20 Nov 2024 22:52:20 GMT

Try like this

#tableWithHiddenHeader7 thead{ display: none; } #tableWithHiddenHeader7 tr td:nth-child(1) { width: 40% !important; } #tableWithHiddenHeader7 tr td:nth-child(2) { width: 20% !important; } #tableWithHiddenHeader7 tr td:nth-child(3) { width: 20% !important; } #tableWithHiddenHeader7 tr td:nth-child(4) { width: 20% !important; } #tableWithHiddenHeader7 td { text-align: left; } #tableWithHiddenHeader8 thead{ display: none; } #tableWithHiddenHeader8 tr td:nth-child(1) { width: 40% !important; } #tableWithHiddenHeader8 tr td:nth-child(2) { width: 20% !important; } #tableWithHiddenHeader8 tr td:nth-child(3) { width: 20% !important; } #tableWithHiddenHeader8 tr td:nth-child(4) { width: 20% !important; } #tableWithHiddenHeader8 td { text-align: left; } #tableWithHiddenHeader9 thead{ display: none; } #tableWithHiddenHeader9 tr td:nth-child(1) { width: 40% !important; } #tableWithHiddenHeader9 tr td:nth-child(2) { width: 20% !important; } #tableWithHiddenHeader9 tr td:nth-child(3) { width: 20% !important; } #tableWithHiddenHeader9 tr td:nth-child(4) { width: 20% !important; } #tableWithHiddenHeader9 td { text-align: left; } #tableWithHiddenHeader10 thead{ display: none; } #tableWithHiddenHeader10 tr td:nth-child(1) { width: 40% !important; } #tableWithHiddenHeader10 tr td:nth-child(2) { width: 20% !important; } #tableWithHiddenHeader10 tr td:nth-child(3) { width: 20% !important; } #tableWithHiddenHeader10 tr td:nth-child(4) { width: 20% !important; } #tableWithHiddenHeader10 td { text-align: left; }

Re: HTML - Style - remove the extra lin eof black

robertlynch2020 — Thu, 21 Nov 2024 10:05:00 GMT

wonderful - and thanks. 🙂

Re: HTML - Style - remove the extra lin eof black

ITWhisperer — Thu, 21 Nov 2024 12:18:41 GMT

Updated the accepted solution with the actual solution 😎