mirror of
https://github.com/gilbN/theme.park.git
synced 2024-08-18 16:09:36 +02:00
small grafana fix, still broken
This commit is contained in:
parent
35aa31149d
commit
82154f7e89
@ -13,12 +13,4 @@
|
||||
|
||||
/* GRAFANA AQUAMARINE THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--button-color: #009688;
|
||||
--button-color-hover: #12afa0;
|
||||
--accent-color: #009688;
|
||||
--accent-color-hover: #12afa0;
|
||||
--queue-color: #009688;
|
||||
}
|
||||
@import url(https://theme-park.dev/CSS/variables/aquamarine.css);
|
@ -13,11 +13,4 @@
|
||||
|
||||
/* GRAFANA DARK THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
||||
--modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
||||
--button-color: hsla(0,0%,100%,.15);
|
||||
--button-color-hover: hsla(0,0%,100%,.30);
|
||||
--accent-color: rgba(255, 255, 255, 0.25);
|
||||
--accent-color-hover: rgba(255, 255, 255, 0.45);
|
||||
}
|
||||
@import url(https://theme-park.dev/CSS/variables/dark.css);
|
16
CSS/themes/grafana/dracula.css
Normal file
16
CSS/themes/grafana/dracula.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* dP dP dP */
|
||||
/* 88 88 88 */
|
||||
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
|
||||
/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */
|
||||
/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */
|
||||
/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
|
||||
/* 88 */
|
||||
/* dP */
|
||||
|
||||
/* Made by @gilbN */
|
||||
/* https://github.com/gilbN/theme.park */
|
||||
|
||||
/* GRAFANA DRACULA THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/dracula.css);
|
@ -12,7 +12,7 @@
|
||||
/* https://github.com/gilbN/theme.park */
|
||||
|
||||
body {
|
||||
color:#FFFFFF !important;
|
||||
color:var(--text) !important;
|
||||
background: var(--main-bg-color) !important;
|
||||
background-repeat: repeat, no-repeat!important;
|
||||
background-attachment: fixed, fixed!important;
|
||||
@ -32,7 +32,20 @@ body {
|
||||
-moz-background-size: auto, cover!important;
|
||||
-o-background-size: auto, cover!important;
|
||||
}
|
||||
.page-header-canvas {
|
||||
|
||||
h1, h2, h3, h4, h5, h6, label,legend {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
div>aria-label>span,
|
||||
#reactRoot > div > div.main-view > div > div:nth-child(1) > div > div:nth-child(10) > div > div.button-group.css-1uxatfi > div > div > div > div > div > div > span {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
p {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.page-header-canvas,
|
||||
.page-toolbar[class*="css-"] {
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
box-shadow: none !important;
|
||||
border-bottom: none !important;
|
||||
@ -165,9 +178,20 @@ color:#FFFFFF !important;
|
||||
}
|
||||
.sidemenu-item.active, .sidemenu-item:hover {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
border-image: none;
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
.side-menu-header, .dropdown-menu--menu, .dropdown-menu--navbar, .dropdown-menu--sidemenu {
|
||||
background: var(--modal-bg-color);
|
||||
.sidemenu-link {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
.sidemenu-link:hover {
|
||||
color: rgb(var(--accent-color))!important;
|
||||
}
|
||||
.side-menu-header, .dropdown-menu--menu, .dropdown-menu--navbar, .dropdown-menu--sidemenu,
|
||||
|
||||
#reactRoot > div > div.main-view > div[class*="css-"] > div:nth-child(1) > div > div:nth-child(10) > div > div.button-group[class*="css-"] > div > div {
|
||||
background: var(--drop-down-menu-bg);
|
||||
background-repeat: repeat, no-repeat!important;
|
||||
background-attachment: fixed, fixed!important;
|
||||
background-position: center center, center center!important;
|
||||
@ -176,12 +200,15 @@ color:#FFFFFF !important;
|
||||
-moz-background-size: auto, cover!important;
|
||||
-o-background-size: auto, cover!important;
|
||||
}
|
||||
#reactRoot > div > div.main-view > div[class*="css-"] > div:nth-child(1) > div > div:nth-child(10) > div > div.button-group[class*="css-"] > div > div > div > span {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
.dropdown-menu .divider {
|
||||
border-bottom: 1px solid #d8d9da;
|
||||
}
|
||||
.dropdown-menu--sidemenu>li>.side-menu-header-link:hover {
|
||||
color: #fff!important;
|
||||
background: var(--modal-bg-color)!important;
|
||||
color: var(--text-hover)!important;
|
||||
background: var(--drop-down-menu-bg)!important;
|
||||
background-repeat: repeat, no-repeat!important;
|
||||
background-attachment: fixed, fixed!important;
|
||||
background-position: center center, center center!important;
|
||||
@ -192,12 +219,13 @@ color:#FFFFFF !important;
|
||||
}
|
||||
.dropdown-menu--menu>li>a:hover, .dropdown-menu--navbar>li>a:hover, .dropdown-menu--sidemenu>li>a:hover {
|
||||
background: rgba(0, 0, 0, 0.25)!important;
|
||||
color: var(--text-hover)!important;
|
||||
}
|
||||
.dropdown-menu>li>a {
|
||||
color: #ffffff!important;
|
||||
color: var(--text)!important;
|
||||
}
|
||||
.dropdown-menu-item-shortcut {
|
||||
color: #ffffff!important;
|
||||
color: var(--text)!important;
|
||||
}
|
||||
.dropdown-menu {
|
||||
border: 1px solid transparent;
|
||||
@ -329,23 +357,26 @@ color:#FFFFFF !important;
|
||||
}
|
||||
.gf-form-select-box__option.gf-form-select-box__option--is-focused {
|
||||
color: #fff;
|
||||
-o-border-image: -o-linear-gradient(var(--accent-color) 30%,var(--accent-color) 99%);
|
||||
border-image: -webkit-gradient(linear,left top,left bottom,color-stop(30%,var(--accent-color)),color-stop(99%,var(--accent-color)));
|
||||
border-image: -webkit-linear-gradient(var(--accent-color) 30%,var(--accent-color) 99%);
|
||||
-o-border-image: -o-linear-gradient(rgb(var(--accent-color)) 30%,rgb(var(--accent-color)) 99%);
|
||||
border-image: -webkit-gradient(linear,left top,left bottom,color-stop(30%,rgb(var(--accent-color))),color-stop(99%,rgb(var(--accent-color))));
|
||||
border-image: -webkit-linear-gradient(rgb(var(--accent-color)) 30%,rgb(var(--accent-color)) 99%);
|
||||
}
|
||||
.filter-table td.filter-table__switch-cell {
|
||||
border-right: none;
|
||||
}
|
||||
/* Variable label color */
|
||||
.template-variable, .gf-form-label--variable {
|
||||
color: var(--accent-color) !important;
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* Variable label box */
|
||||
.gf-form-label {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
border: none !important;
|
||||
}
|
||||
.gf-form-label>button[class*="css-"] {
|
||||
background: transparent !important;
|
||||
}
|
||||
.gf-form-label--btn:hover {
|
||||
background: rgba(0, 0, 0, 0.45) !important;
|
||||
}
|
||||
@ -410,6 +441,9 @@ color:#FFFFFF !important;
|
||||
.panel-header:hover {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
.panel-title-text:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
/* ////PANEL BACKGROUND COLOR//// */
|
||||
|
||||
.graph-legend-table .graph-legend-series:nth-child(odd), .graph-legend-table .graph-legend-series:nth-child(2n) {
|
||||
@ -471,9 +505,18 @@ div.flot-text {
|
||||
background: rgb(0 0 0 / 35%);
|
||||
}
|
||||
.css-1n8kpcb-activeTabStyle::before, .css-dnqfjg-activeTabStyle::before {
|
||||
background: var(--accent-color);
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
/* Edit panel tabs */
|
||||
[aria-label="Panel editor content"]{
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
div>.scrollbar-view>div>[class*="css-"],
|
||||
#reactRoot > div > div.main-view > div.css-1mwktlb > div[class*="css-"] > div[class*="css-"] > div > div.Pane.vertical.Pane1 > div > div.Pane.horizontal.Pane2 > div > div > div[class*="css-"],
|
||||
.css-v2fjpc,
|
||||
.css-ld7ft6{
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
.tabbed-view-header {
|
||||
box-shadow: none;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
@ -662,63 +705,26 @@ border-color: #b56d16 !important;
|
||||
height: 38px;
|
||||
}
|
||||
/*Buttons*/
|
||||
.css-y3nv3e-button,
|
||||
.css-cc7c9f-button,
|
||||
.css-1vlnne-button,
|
||||
.css-1ihbihm-button,
|
||||
.css-14zdxje-button,
|
||||
.css-179z9yx-button,
|
||||
.css-370vzt-button,
|
||||
.css-msayan-button,
|
||||
.css-19kbjxc-button,
|
||||
.css-n4gkqg-button,
|
||||
.css-u6ysb0-button,
|
||||
.css-ak0gkt-button,
|
||||
.css-1pa3vaj-button,
|
||||
.css-g7zx83-button,
|
||||
.css-1pcbsvw-button,
|
||||
button[class$="-button"]:not(button[aria-label="toggle-viz-picker"]),
|
||||
.gf-form-button-row a, .gf-form-button-row button,
|
||||
.page-action-bar>a, .page-action-bar>button,
|
||||
.btn-primary{
|
||||
.btn-primary,
|
||||
button.toolbar-button {
|
||||
background: var(--button-color) !important;
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color);
|
||||
border-color: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
.css-y3nv3e-button:hover,
|
||||
.css-y3nv3e-button:focus,
|
||||
.css-cc7c9f-button:hover,
|
||||
.css-cc7c9f-button:focus,
|
||||
.css-1vlnne-button:hover,
|
||||
.css-1vlnne-button:focus,
|
||||
.css-1ihbihm-button:hover,
|
||||
.css-1ihbihm-button:focus,
|
||||
.css-14zdxje-button:hover,
|
||||
.css-14zdxje-button:focus,
|
||||
.css-179z9yx-button:hover,
|
||||
.css-179z9yx-button:focus,
|
||||
.css-370vzt-button:hover,
|
||||
.css-370vzt-button:focus,
|
||||
.css-msayan-button:hover,
|
||||
.css-msayan-button:focus,
|
||||
.css-19kbjxc-button:hover,
|
||||
.css-19kbjxc-button:focus,
|
||||
.css-n4gkqg-button:hover,
|
||||
.css-n4gkqg-button:focus,
|
||||
.css-u6ysb0-button:hover,
|
||||
.css-u6ysb0-button:focus,
|
||||
.css-ak0gkt-button:hover,
|
||||
.css-ak0gkt-button:focus,
|
||||
.css-1pa3vaj-button:hover,
|
||||
.css-1pa3vaj-button:focus,
|
||||
.css-g7zx83-button:hover,
|
||||
.css-g7zx83-button:focus,
|
||||
.css-1pcbsvw-button:hover,
|
||||
.css-1pcbsvw-button:focus,
|
||||
button[class$="-button"]:hover,
|
||||
button[class$="-button"]:focus,
|
||||
button[class$="-button"]:active,
|
||||
.gf-form-button-row a, .gf-form-button-row button:hover,
|
||||
.btn-primary:hover{
|
||||
color: rgb(255, 255, 255);
|
||||
background: var(--button-color-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.css-1d9e5zy-button {color: #fff; background: var(--button-color)}
|
||||
@ -867,9 +873,11 @@ body > grafana-app > div > div > react-container > div > div > div.view > div >
|
||||
.css-cxwxzk-Label-description,.css-n370st {
|
||||
color: #eee;
|
||||
}
|
||||
.css-1pziiev {
|
||||
.css-10pj50r,
|
||||
.css-15rfc12 {
|
||||
background: rgb(0 0 0 / 50%);
|
||||
}
|
||||
|
||||
/*Header*/
|
||||
.css-1marj6o {
|
||||
display: flex;
|
||||
@ -897,7 +905,7 @@ border-right: 1px solid rgba(0, 0, 0, 0);
|
||||
}
|
||||
.query-keyword, .css-wvxxxy, .css-fpnw35 {
|
||||
font-weight: 500;
|
||||
color: var(--accent-color);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
.css-lvafs5 {
|
||||
background: rgba(0, 0, 0, .5);
|
||||
@ -948,7 +956,7 @@ border-bottom: 1px solid rgba(255, 255, 255, .08);
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.css-1gokw4e input:checked + label, .css-1gokw4e input:checked + label:hover {
|
||||
background: var(--accent-color);
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
.css-1gokw4e label {
|
||||
background: white;
|
||||
@ -959,16 +967,16 @@ background: var(--accent-color);
|
||||
border-color: transparent;
|
||||
}
|
||||
.css-1fsv7gr:hover > div:first-child {
|
||||
border-color: var(--accent-color);
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
.css-1emhacm-currentVisualizationItem > div:first-child {
|
||||
outline-offset: 2px;
|
||||
box-shadow: rgb(20, 22, 25) 0px 0px 0px 2px, var(--accent-color) 0px 0px 0px 4px;
|
||||
box-shadow: rgb(20, 22, 25) 0px 0px 0px 2px, rgb(var(--accent-color)) 0px 0px 0px 4px;
|
||||
}
|
||||
.css-mgq0xs-currentVisualizationItem > div:first-child {
|
||||
outline: transparent dotted 2px;
|
||||
outline-offset: 1px;
|
||||
box-shadow: var(--accent-color) 0px 0px 0px 2px, #607D8B 0px 0px 0px 2px;
|
||||
box-shadow: rgb(var(--accent-color)) 0px 0px 0px 2px, #607D8B 0px 0px 0px 2px;
|
||||
transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
|
||||
}
|
||||
/*Old stat panel unit dropdown */
|
||||
@ -995,7 +1003,7 @@ height: 100%;
|
||||
background: rgba(255, 255, 255, .08)
|
||||
}
|
||||
input:checked+.gf-form-switch__slider {
|
||||
background: var(--accent-color);
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
/* RuPaul Drag Line*/
|
||||
.css-pii3u7:hover {
|
||||
@ -1034,7 +1042,7 @@ border-color: rgba(255, 255, 255, .09);
|
||||
}
|
||||
.grafana-info-box {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
border-top: 3px solid var(--accent-color);
|
||||
border-top: 3px solid rgb(var(--accent-color));
|
||||
}
|
||||
/* Variables*/
|
||||
.filter-table--hover tbody tr:hover {
|
||||
|
@ -13,11 +13,4 @@
|
||||
|
||||
/* GRAFANA HOTLINE THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--button-color: hsla(0,0%,100%,.15);
|
||||
--button-color-hover: hsla(0,0%,100%,.30);
|
||||
--accent-color: #F44336;
|
||||
--accent-color-hover: #0b3161;
|
||||
}
|
||||
@import url(https://theme-park.dev/CSS/variables/hotline.css);
|
@ -13,11 +13,4 @@
|
||||
|
||||
/* GRAFANA ORGANIZR-DARK THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
:root {
|
||||
--main-bg-color: #1f1f1f;
|
||||
--modal-bg-color: #1b1b1b;
|
||||
--button-color: #2cabe3;
|
||||
--button-color-hover: rgb(44 171 227 / .8);
|
||||
--accent-color: #2cabe3;
|
||||
--accent-color-hover: white;
|
||||
}
|
||||
@import url(https://theme-park.dev/CSS/variables/organizr-dark.css);
|
@ -13,11 +13,4 @@
|
||||
|
||||
/* LIDARR PLEX THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
:root {
|
||||
--main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed;
|
||||
--button-color: #cc7b19;
|
||||
--button-color-hover: #e59029;
|
||||
--accent-color: #e5a00d;
|
||||
--accent-color-hover: #ffc107;
|
||||
}
|
||||
@import url(https://theme-park.dev/CSS/variables/plex.css);
|
@ -13,11 +13,4 @@
|
||||
|
||||
/* GRAFANA SPACE GRAY THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
:root {
|
||||
--main-bg-color: radial-gradient( ellipse at center, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
|
||||
--modal-bg-color: radial-gradient( ellipse at top, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
|
||||
--button-color: #607D8B;
|
||||
--button-color-hover: #81a6b7;
|
||||
--accent-color: #607D8B;
|
||||
--accent-color-hover: #81a6b7;
|
||||
}
|
||||
@import url(https://theme-park.dev/CSS/variables/space-gray.css);
|
Loading…
Reference in New Issue
Block a user