search

grafana / clock-panel

Clock Panel Plugin for Grafana
MIT License
95 stars 62 forks source link

Panel Transparent does not work #89

Closed noppo closed 1 year ago

noppo commented 3 years ago

In panel settings if I set the Transparent value to "true" then the clock is not displayed with at transparent background. It seems the default is some kind of gray color and it is not pretty with neither the dark og light theme.

Initially I thought this must be som kind of CSS issue, but it seems that the panel has been developed this way on purpose. I tried to to choose "custom" background and manually wrote "transparent", but the background is changed to gray.

I tried to inject the CSS directly into this style. .css-11b2sem { display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; flex-direction: column; background-color: transparent; } This works perfectly. So i do not see any reason why this should not work.

So can you please implement so that I can either select "transparent" form custom colors. Or make the default behavior of panel-transparent work as intended.

gianlucaromito commented 3 years ago

Same problem here, but if you go in the background color option and choose option you can set it to transparent.

0mnicy commented 3 years ago

same problem with background but mine is a gray. { "datasource": null, "description": "", "gridPos": { "h": 7, "w": 11, "x": 0, "y": 0 }, "id": 12, "options": { "bgColor": "rgba(0, 0, 0, 0)", "clockType": "12 hour", "countdownSettings": { "endCountdownTime": "2021-06-09T23:39:16-04:00", "endText": "00:00:00" }, "dateSettings": { "dateFormat": "YYYY-MM-DD", "fontSize": "80px", "fontWeight": "bold", "showDate": true }, "mode": "time", "timeSettings": { "fontSize": "80px", "fontWeight": "bold" }, "timezone": "", "timezoneSettings": { "fontSize": "12px", "fontWeight": "normal", "showTimezone": false, "zoneFormat": "offsetAbbv" } }, "targets": [ { "queryType": "randomWalk", "refId": "A" } ], "transparent": true, "type": "grafana-clock-panel" }

image

Zixim commented 3 years ago

I had to do a force refresh of the browser for the BG color to be applied. Grafana 8.0.6 & clock 1.1.3

iomatch commented 2 years ago

I had to do a force refresh of the browser for the BG color to be applied. Grafana 8.0.6 & clock 1.1.3

For me the update to 1.2.0 with Grafana 8.1.5 fixed the issue.