All Projects → yesoreyeram → yesoreyeram-boomtheme-panel

yesoreyeram / yesoreyeram-boomtheme-panel

Licence: Apache-2.0 License
Grafana Panel for adding styles

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to yesoreyeram-boomtheme-panel

yesoreyeram-boomsummary-panel
Boom Summary Panel for Grafana
Stars: ✭ 14 (-76.27%)
Mutual labels:  grafana, grafana-panel, grafana-plugin
grafana-treemap-panel
A panel plugin for Grafana to visualize treemaps.
Stars: ✭ 18 (-69.49%)
Mutual labels:  grafana, grafana-plugin
grafana-plugin-sdk-go
A Go SDK for building backend plugins for Grafana
Stars: ✭ 151 (+155.93%)
Mutual labels:  grafana, grafana-plugin
gapit-htmlgraphics-panel
Grafana panel for displaying metric sensitive HTML or SVG graphics.
Stars: ✭ 41 (-30.51%)
Mutual labels:  grafana, grafana-panel
grafana-infinity-panel
Grafana Infinity Panel plugin. Visualize data in infinite ways using data viz APIs such as Vega
Stars: ✭ 17 (-71.19%)
Mutual labels:  grafana, grafana-panel
grafana-sqlite-datasource
Grafana Plugin to enable SQLite as a Datasource
Stars: ✭ 57 (-3.39%)
Mutual labels:  grafana, grafana-plugin
grafana-pandas-datasource
Grafana Pandas Datasource - using Python for generating timeseries-, table-data and annotations
Stars: ✭ 38 (-35.59%)
Mutual labels:  grafana, grafana-plugin
grafana-redis-datasource
Redis Data Source for @grafana allows connecting to any @redis database On-Premises and in the Cloud.
Stars: ✭ 107 (+81.36%)
Mutual labels:  grafana, grafana-plugin
jira-grafana-json-datasource
Connect Grafana to Jira cloud to retrieve metrics on your Jira issues.
Stars: ✭ 68 (+15.25%)
Mutual labels:  grafana, grafana-panel
macropower-analytics-panel
It's like Google Analytics, but for Grafana dashboards!
Stars: ✭ 16 (-72.88%)
Mutual labels:  grafana, grafana-plugin
grafana-redis-app
Redis Application for @grafana provides Application pages and custom panels for Redis Data Source.
Stars: ✭ 23 (-61.02%)
Mutual labels:  grafana, grafana-plugin
alexandra-trackmap-panel
Grafana map plugin to visualise coordinates as markers, hexbin, ant path, or heatmap.
Stars: ✭ 58 (-1.69%)
Mutual labels:  grafana, grafana-plugin
histou
Adds templates to Grafana in combination with nagflux
Stars: ✭ 33 (-44.07%)
Mutual labels:  grafana
jarvis
🍿 Simple Home Media Stack
Stars: ✭ 28 (-52.54%)
Mutual labels:  grafana
microservices-observability
🎉 Microservices Observability - Log Aggregation, Distributed Tracking, Metrics
Stars: ✭ 40 (-32.2%)
Mutual labels:  grafana
monasca-docker
Docker files and setup for Monasca
Stars: ✭ 24 (-59.32%)
Mutual labels:  grafana
grafana
Ansible role to setup Grafana.
Stars: ✭ 28 (-52.54%)
Mutual labels:  grafana
serilog-sinks-grafana-loki
A Serilog sink sending log events to Grafana Loki
Stars: ✭ 55 (-6.78%)
Mutual labels:  grafana
grafana-plugin-template-webpack
Template project for developing plugins for Grafana with Webpack
Stars: ✭ 34 (-42.37%)
Mutual labels:  grafana
epiphany
Cloud and on-premises automation for Kubernetes centered industrial grade solutions.
Stars: ✭ 114 (+93.22%)
Mutual labels:  grafana

Boom Theme Panel

Build & Publish Release

Theme switcher with custom styles / themes for grafana dashboards.

image image

Features

  • Theme switcher
  • Multiple themes per dashboard
  • Theme builder
  • External stylesheets support
  • Add inline styles to themes to override styles
  • Add many themes as possible without rebuilding / restarting grafana
  • Users can change the themes without editing the dashboard
  • Dashboard specific themes

Creating Theme

Themes can be created with multiple building blocks like background image, base theme etc.

Property Description
Base theme Themes can be built on top of default/dark/light theme. Default is Default Theme
Background image Optional property. Can be blank. If specified more than once, last wins. Value should be valid image URL
CSS url External theme file. Should be valid CSS file URL
Custom Style / CSS Override CSS Styles. Should be valid css
Panel container BG Background color for the panels

Supported Grafana version

This grafana plugin is tested with the following grafana versions, But other versions are also expected to work.

  • Grafana version 8.x
  • Grafana version 7.x
  • Grafana version 6.x

Notes

  • When adding external stylesheets, make sure CORS enabled for those domains.

  • To make panel invisible : Modify following theme panel settings:

    • transparent = true
    • title = ""
    • Disable Theme Picker using panel settings
    • Move this panel to the bottom of the dashboard
    • Adjust the height and width if required.

Known issues / Limitations

  • If any custom plugin is used, dark/light theme switch, base theme will not work for those custom plugins. Refer this github issue

  • Theme panel should be within view port. Otherwise, Grafana won't render the theme. Refer this

Installation Instructions

There are multiple ways to install this plugin into your grafana instance

Download and extract zip file

Download the zip file from github releases page and extract into your grafana plugin folder. Then restart Grafana.

Using grafana-cli

If you are using grafana-cli, execute the following command to install the plugin

grafana-cli plugins install yesoreyeram-boomtheme-panel

or for specific versions

grafana-cli --pluginUrl https://github.com/yesoreyeram/yesoreyeram-boomtheme-panel/releases/download/v0.2.1/yesoreyeram-boomtheme-panel-0.2.1.zip plugins install yesoreyeram-boomtheme-panel

Using helm chart

If you use helm chart to provision grafana, use the following config to install the plugin

plugins:
  - yesoreyeram-boomtheme-panel

or for any specific versions

plugins:
  - https://github.com/yesoreyeram/yesoreyeram-boomtheme-panel/releases/download/v0.2.1/yesoreyeram-boomtheme-panel-0.2.1.zip;yesoreyeram-boomtheme-panel
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].