topaLE
/
theme.park
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Fixes for #61 and #45

pull/77/head
Marius 4 years ago
parent
c91801b975
commit
918a7d0009
7 changed files with 715 additions and 11 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      CSS/themes/grafana/aquamarine.css
  2. 6
      CSS/themes/grafana/dark.css
  3. 344
      CSS/themes/grafana/grafana-base.css
  4. 6
      CSS/themes/grafana/hotline.css
  5. 352
      CSS/themes/grafana/organizr-dashboard.css
  6. 6
      CSS/themes/grafana/plex.css
  7. 5
      CSS/themes/grafana/space-gray.css

7
CSS/themes/grafana/aquamarine.css
View File

@ -16,6 +16,9 @@
:root { :root {
--main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed; --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; --modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
--accent-color: #32d1df; --button-color: #009688;
--button-color: #fd5e94; --button-color-hover: #12afa0;
--accent-color: #009688;
--accent-color-hover: #12afa0;
--queue-color: #009688;
} }

6
CSS/themes/grafana/dark.css
View File

@ -16,6 +16,8 @@
:root { :root {
--main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed; --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; --modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
--accent-color: #32d1df; --button-color: hsla(0,0%,100%,.15);
--button-color: #fd5e94; --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);
} }

344
CSS/themes/grafana/grafana-base.css
View File

@ -269,7 +269,7 @@ color:#FFFFFF !important;
border-right: none; border-right: none;
} }
/* Variable label color */ /* Variable label color */
.template-variable { .template-variable, .gf-form-label--variable {
color: var(--accent-color) !important; color: var(--accent-color) !important;
} }
@ -332,6 +332,7 @@ color:#FFFFFF !important;
.panel-container { .panel-container {
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
border: transparent; border: transparent;
box-shadow: none !important;
} }
.panel-container.panel-transparent, .panel-container--transparent { .panel-container.panel-transparent, .panel-container--transparent {
background-color: transparent; background-color: transparent;
@ -343,7 +344,7 @@ color:#FFFFFF !important;
} }
/* ////PANEL BACKGROUND COLOR//// */ /* ////PANEL BACKGROUND COLOR//// */
.graph-legend-table .graph-legend-series:nth-child(odd) { .graph-legend-table .graph-legend-series:nth-child(odd), .graph-legend-table .graph-legend-series:nth-child(2n) {
background: transparent !important; background: transparent !important;
} }
@ -532,3 +533,342 @@ border-color: #b56d16 !important;
position: relative; position: relative;
background: var(--modal-bg-color); background: var(--modal-bg-color);
} }
/*V7*/
/*LOGIN*/
.css-bnbqsv {background: var(--main-bg-color)}
.css-3iwqj4 { background: transparent;}
#login-view > div > form > div:nth-child(1) > div:nth-child(2) > div > div > input, #login-view > div > form > div:nth-child(2) > div:nth-child(2) > div > div > input {
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,
.gf-form-button-row a, .gf-form-button-row button,
.page-action-bar>a, .page-action-bar>button,
.btn-primary{
background: var(--button-color) !important;
background-color: var(--button-color) !important;
border-color: var(--button-color);
}
.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,
.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;
box-shadow: none !important;
}
.css-1d9e5zy-button {color: #fff; background: var(--button-color)}
.css-1d9e5zy-button:hover {color: #fff; background: var(--button-color-hover)}
/*INPUT*/
input:focus {box-shadow: none !important;}
.css-17rc2pp-input-wrapper:focus, .css-1i9is3t:focus {
box-shadow:none;
color: transparent;
}
.gf-form-select-box__control--is-focused {
border-color: transparent;
outline: none;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.css-1bjepp-input-input {
background-color: hsla(0,0%,100%,.25);
border-radius: 3px;
border-color: transparent;
-webkit-transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
}
.css-1bjepp-input-input:focus {
box-shadow: none !important;
background-color: white;
color: black;
transition: background-color .2s;
-webkit-transition: background-color .2s;
border-radius: 3px;
}
.css-14hvfbu-input-wrapper:focus {
border-color:transparent !important;
box-shadow: none !important;
}
.css-1w5c5dq-input-inputWrapper input:not(:last-child) {
height: 100%
}
/*Disabled input*/
.css-1bjepp-input-input:disabled {
background-color: rgba(0, 0, 0, .5);
color: rgb(159, 167, 179);
}
.css-1bjepp-input-input:hover {border-color: transparent;}
body > grafana-app > div > div > react-container > div > div > div.view > div > div.page-container.page-body > div:nth-child(2) > form > div > div > div > div.css-1w5c5dq-input-inputWrapper > input {height: 100%;}
/* SEARCH */
.css-x9mxj5 {
background: var(--main-bg-color);
}
.css-1m6pigl:focus + label {
outline-offset: 2px;
box-shadow: rgba(20, 22, 25, 0) 0px 0px 0px 2px, rgba(31, 97, 196, 0) 0px 0px 0px 4px !important;
z-index: 3;
outline: transparent dotted 2px;
transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.css-1m6pigl:checked + label {
color: var(--accent-color) !important;
border-color: rgba(255, 255, 255, .1);
background: rgba(0, 0, 0, .5);
}
.css-b40tk8:focus + label {
box-shadow: rgba(20, 22, 25, 0) 0px 0px 0px 2px, rgba(31, 97, 196, 0) 0px 0px 0px 4px !important;
}
.css-y0yg3l {
background: var(--main-bg-color);
border-color: transparent;
}
.css-y0yg3l {
background: rgba(0, 0, 0, .25) !important;
border-color: transparent;
}
.css-1je3bh6 {
background: transparent;
border-bottom: 1px solid rgba(0, 0, 0, 0);
}
/*Folder bars*/
.css-1umfglk {
background: rgba(0, 0, 0, .25);
}
.css-1umfglk:hover {
background: rgba(0, 0, 0, .35);
}
/* Login Error message*/
.css-1ow9mne-input-input {
line-height: 1.5;
height: 38px;
background-color: hsla(0,0%,100%,.25);
border-radius: 3px;
border-color: transparent;
-webkit-transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
}
.css-1ow9mne-input-input {
box-shadow: none !important;
background-color: white;
color: black;
transition: background-color .2s;
-webkit-transition: background-color .2s;
height: 38px;
border-radius: 3px;
}
.css-13o428a {
margin: 10px 0px 0px;
}
/*Welcome to Grafana*/
.css-15xxblz,.css-1ld19yb {background: rgba(0, 0, 0, .25);}
.css-1as70ku, .css-u5zjuh {
background: rgba(0, 0, 0, .25);}
.css-17abkeq, .css-5ak73y {
color: #fff;
}
/* Import */
body > grafana-app > div > div > react-container > div > div > div.view > div > div.page-container.page-body > form > div:nth-child(4) > div:nth-child(2) > div > div.css-1w5c5dq-input-inputWrapper > input {height:100%}
/*PANEL EDIT*/
/*Header*/
.css-1marj6o {
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 8px;
background: transparent;
border-bottom: 1px solid transparent;
}
/*Background*/
.css-azp59k {
background: var(--main-bg-color);
}
/*Query box*/
.css-hz0utb {
background: rgba(0, 0, 0, .35);
border-right: 1px solid rgba(0, 0, 0, 0);
}
.query-keyword, .css-wvxxxy, .css-fpnw35 {
font-weight: 500;
color: var(--accent-color);
}
.css-lvafs5 {
background: rgba(0, 0, 0, .5);
}
.css-ui3sz4-activeTabStyle {
margin-right: 16px;
position: relative;
display: block;
color: rgb(216, 217, 218);
cursor: default;
list-style: none;
padding: 11px 15px 9px;
border-style: solid;
border-image: initial;
border-width: 0px 1px 1px;
border-radius: 3px 3px 0px 0px;
border-color: transparent !important;
background: rgba(0, 0, 0, .5);
overflow: hidden;
}
.css-1awj6q7-counter {
background-color: rgba(0, 0, 0, .5);
color: rgb(255, 255, 255);
}
/*Transform tab*/
.css-y2f54e {
background: rgba(0, 0, 0, .25);
}
.css-y2f54e:hover {
background: rgba(0, 0, 0, .35);
}
.css-1e8invk::before {
background:rgba(0, 0, 0, .35) !important;
}
/* Right side menu*/
.css-1xj5tuf {
background: rgba(0, 0, 0, .35);
border-left: 1px solid transparent;
}
/*Dropdown bottom borders*/
.css-1majipf {
border-bottom: 1px solid rgba(255, 255, 255, .08);
}
/*Settings text input*/
.css-1f38lle:focus {
box-shadow: none !important;
}
.css-1gokw4e input:checked + label, .css-1gokw4e input:checked + label:hover {
background: var(--accent-color);
}
.css-1gokw4e label {
background: white;
}
/*Visualization*/
.css-1lemfi9 {
background: rgba(0, 0, 0, .25);
border-color: transparent;
}
.css-1fsv7gr:hover > div:first-child {
border-color: 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;
}
/*Old stat panel unit dropdown */
body > grafana-app > div > div > react-container > div > div.css-azp59k > div.css-1bd2u9 > div > div.Pane.vertical.Pane2 > div > div > div.css-1xj5tuf > div > div.view > div:nth-child(3) > div:nth-child(1) > div.panel-options-group__body > panel-editor-tab > panel-editor-tab-singlestatoptions > div > div:nth-child(2) > div:nth-child(6) > unit-picker > div > div > div > div > input {
height: 100%;
}
/*Buttons*/
.css-m58wdd:hover {
color: rgba(255, 255, 255, .94);
z-index: 2;
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, .1);
border-image: initial;
background: rgba(255, 255, 255, .15)
}
.css-m58wdd {
color: rgba(255, 255, 255, .94);
z-index: 2;
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, 0);
border-image: initial;
background: rgba(255, 255, 255, .08)
}
input:checked+.gf-form-switch__slider {
background: var(--accent-color);
}
/* RuPaul Drag Line*/
.css-pii3u7:hover {
border-color: rgba(255, 255, 255, .25);
}
.css-1t13ra6 {
border-color: rgba(255, 255, 255, .09);
}
.css-1t13ra6:hover {
border-color: rgba(255, 255, 255, .25);
}
/*SETTINGS*/
/*Teams*/
.css-1w9m9al-call-to-action-card {
background: rgba(0, 0, 0, .25);
}
/*DASHBOARD SETINGS*/
.dashboard-settings,.dashboard-settings__body2 {
background: var(--main-bg-color);
}
.navbar--edit {
background: rgba(0, 0, 0, .25);
border-bottom: 1px solid transparent;
-webkit-box-shadow: 0 0 10px transparent;
box-shadow: 0 0 10px transparent;
}
.grafana-info-box {
background-color: rgba(0, 0, 0, .5);
border-top: 3px solid var(--accent-color);
}
/* Variables*/
.filter-table--hover tbody tr:hover {
background: hsla(0,0%,100%,.15);
}
.filter-table tbody tr:nth-child(odd):hover {
background: hsla(0,0%,100%,.15) !important;
}
/*Placeholder text*/
::placeholder {color: #fff !important;}
:-ms-input-placeholder {color: #fff !important;}
::-webkit-input-placeholder {color: #fff !important;}

6
CSS/themes/grafana/hotline.css
View File

@ -16,6 +16,8 @@
:root { :root {
--main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed; --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; --modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
--accent-color: #32d1df; --button-color: hsla(0,0%,100%,.15);
--button-color: #fd5e94; --button-color-hover: hsla(0,0%,100%,.30);
--accent-color: #F44336;
--accent-color-hover: #0b3161;
} }

352
CSS/themes/grafana/organizr-dashboard.css
View File

@ -163,6 +163,7 @@ div.flot-text {
.panel-container { .panel-container {
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
border: transparent; border: transparent;
box-shadow: none !important;
} }
.panel-container.panel-transparent, .panel-container--transparent { .panel-container.panel-transparent, .panel-container--transparent {
background-color: transparent; background-color: transparent;
@ -240,3 +241,354 @@ div.flot-text {
box-shadow: none; box-shadow: none;
border-bottom: 0px; border-bottom: 0px;
} }
@import url(https://gilbn.github.io/theme.park/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;
}
/*V7*/
/*LOGIN*/
.css-bnbqsv {background: var(--main-bg-color)}
.css-3iwqj4 { background: transparent;}
#login-view > div > form > div:nth-child(1) > div:nth-child(2) > div > div > input, #login-view > div > form > div:nth-child(2) > div:nth-child(2) > div > div > input {
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,
.gf-form-button-row a, .gf-form-button-row button,
.page-action-bar>a, .page-action-bar>button,
.btn-primary{
background: var(--button-color) !important;
background-color: var(--button-color) !important;
border-color: var(--button-color);
}
.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,
.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;
box-shadow: none !important;
}
.css-1d9e5zy-button {color: #fff; background: var(--button-color)}
.css-1d9e5zy-button:hover {color: #fff; background: var(--button-color-hover)}
/*INPUT*/
input:focus {box-shadow: none !important;}
.css-17rc2pp-input-wrapper:focus, .css-1i9is3t:focus {
box-shadow:none;
color: transparent;
}
.gf-form-select-box__control--is-focused {
border-color: transparent;
outline: none;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.css-1bjepp-input-input {
background-color: hsla(0,0%,100%,.25);
border-radius: 3px;
border-color: transparent;
-webkit-transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
}
.css-1bjepp-input-input:focus {
box-shadow: none !important;
background-color: white;
color: black;
transition: background-color .2s;
-webkit-transition: background-color .2s;
border-radius: 3px;
}
.css-14hvfbu-input-wrapper:focus {
border-color:transparent !important;
box-shadow: none !important;
}
.css-1w5c5dq-input-inputWrapper input:not(:last-child) {
height: 100%
}
/*Disabled input*/
.css-1bjepp-input-input:disabled {
background-color: rgba(0, 0, 0, .5);
color: rgb(159, 167, 179);
}
.css-1bjepp-input-input:hover {border-color: transparent;}
body > grafana-app > div > div > react-container > div > div > div.view > div > div.page-container.page-body > div:nth-child(2) > form > div > div > div > div.css-1w5c5dq-input-inputWrapper > input {height: 100%;}
/* SEARCH */
.css-x9mxj5 {
background: var(--main-bg-color);
}
.css-1m6pigl:focus + label {
outline-offset: 2px;
box-shadow: rgba(20, 22, 25, 0) 0px 0px 0px 2px, rgba(31, 97, 196, 0) 0px 0px 0px 4px !important;
z-index: 3;
outline: transparent dotted 2px;
transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.css-1m6pigl:checked + label {
color: var(--accent-color) !important;
border-color: rgba(255, 255, 255, .1);
background: rgba(0, 0, 0, .5);
}
.css-b40tk8:focus + label {
box-shadow: rgba(20, 22, 25, 0) 0px 0px 0px 2px, rgba(31, 97, 196, 0) 0px 0px 0px 4px !important;
}
.css-y0yg3l {
background: var(--main-bg-color);
border-color: transparent;
}
.css-y0yg3l {
background: rgba(0, 0, 0, .25) !important;
border-color: transparent;
}
.css-1je3bh6 {
background: transparent;
border-bottom: 1px solid rgba(0, 0, 0, 0);
}
/*Folder bars*/
.css-1umfglk {
background: rgba(0, 0, 0, .25);
}
.css-1umfglk:hover {
background: rgba(0, 0, 0, .35);
}
/* Login Error message*/
.css-1ow9mne-input-input {
line-height: 1.5;
height: 38px;
background-color: hsla(0,0%,100%,.25);
border-radius: 3px;
border-color: transparent;
-webkit-transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
}
.css-1ow9mne-input-input {
box-shadow: none !important;
background-color: white;
color: black;
transition: background-color .2s;
-webkit-transition: background-color .2s;
height: 38px;
border-radius: 3px;
}
.css-13o428a {
margin: 10px 0px 0px;
}
/*Welcome to Grafana*/
.css-15xxblz,.css-1ld19yb {background: rgba(0, 0, 0, .25);}
.css-1as70ku, .css-u5zjuh {
background: rgba(0, 0, 0, .25);}
.css-17abkeq, .css-5ak73y {
color: #fff;
}
/* Import */
body > grafana-app > div > div > react-container > div > div > div.view > div > div.page-container.page-body > form > div:nth-child(4) > div:nth-child(2) > div > div.css-1w5c5dq-input-inputWrapper > input {height:100%}
/*PANEL EDIT*/
/*Header*/
.css-1marj6o {
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 8px;
background: transparent;
border-bottom: 1px solid transparent;
}
/*Background*/
.css-azp59k {
background: var(--main-bg-color);
}
/*Query box*/
.css-hz0utb {
background: rgba(0, 0, 0, .35);
border-right: 1px solid rgba(0, 0, 0, 0);
}
.query-keyword, .css-wvxxxy, .css-fpnw35 {
font-weight: 500;
color: var(--accent-color);
}
.css-lvafs5 {
background: rgba(0, 0, 0, .5);
}
.css-ui3sz4-activeTabStyle {
margin-right: 16px;
position: relative;
display: block;
color: rgb(216, 217, 218);
cursor: default;
list-style: none;
padding: 11px 15px 9px;
border-style: solid;
border-image: initial;
border-width: 0px 1px 1px;
border-radius: 3px 3px 0px 0px;
border-color: transparent !important;
background: rgba(0, 0, 0, .5);
overflow: hidden;
}
.css-1awj6q7-counter {
background-color: rgba(0, 0, 0, .5);
color: rgb(255, 255, 255);
}
/*Transform tab*/
.css-y2f54e {
background: rgba(0, 0, 0, .25);
}
.css-y2f54e:hover {
background: rgba(0, 0, 0, .35);
}
.css-1e8invk::before {
background:rgba(0, 0, 0, .35) !important;
}
/* Right side menu*/
.css-1xj5tuf {
background: rgba(0, 0, 0, .35);
border-left: 1px solid transparent;
}
/*Dropdown bottom borders*/
.css-1majipf {
border-bottom: 1px solid rgba(255, 255, 255, .08);
}
/*Settings text input*/
.css-1f38lle:focus {
box-shadow: none !important;
}
.css-1gokw4e input:checked + label, .css-1gokw4e input:checked + label:hover {
background: var(--accent-color);
}
.css-1gokw4e label {
background: white;
}
/*Visualization*/
.css-1lemfi9 {
background: rgba(0, 0, 0, .25);
border-color: transparent;
}
.css-1fsv7gr:hover > div:first-child {
border-color: 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;
}
/*Old stat panel unit dropdown */
body > grafana-app > div > div > react-container > div > div.css-azp59k > div.css-1bd2u9 > div > div.Pane.vertical.Pane2 > div > div > div.css-1xj5tuf > div > div.view > div:nth-child(3) > div:nth-child(1) > div.panel-options-group__body > panel-editor-tab > panel-editor-tab-singlestatoptions > div > div:nth-child(2) > div:nth-child(6) > unit-picker > div > div > div > div > input {
height: 100%;
}
/*Buttons*/
.css-m58wdd:hover {
color: rgba(255, 255, 255, .94);
z-index: 2;
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, .1);
border-image: initial;
background: rgba(255, 255, 255, .15)
}
.css-m58wdd {
color: rgba(255, 255, 255, .94);
z-index: 2;
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, 0);
border-image: initial;
background: rgba(255, 255, 255, .08)
}
input:checked+.gf-form-switch__slider {
background: var(--accent-color);
}
/* RuPaul Drag Line*/
.css-pii3u7:hover {
border-color: rgba(255, 255, 255, .25);
}
.css-1t13ra6 {
border-color: rgba(255, 255, 255, .09);
}
.css-1t13ra6:hover {
border-color: rgba(255, 255, 255, .25);
}
/*SETTINGS*/
/*Teams*/
.css-1w9m9al-call-to-action-card {
background: rgba(0, 0, 0, .25);
}
/*DASHBOARD SETINGS*/
.dashboard-settings,.dashboard-settings__body2 {
background: var(--main-bg-color);
}
.navbar--edit {
background: rgba(0, 0, 0, .25);
border-bottom: 1px solid transparent;
-webkit-box-shadow: 0 0 10px transparent;
box-shadow: 0 0 10px transparent;
}
.grafana-info-box {
background-color: rgba(0, 0, 0, .5);
border-top: 3px solid var(--accent-color);
}
/* Variables*/
.filter-table--hover tbody tr:hover {
background: hsla(0,0%,100%,.15);
}
.filter-table tbody tr:nth-child(odd):hover {
background: hsla(0,0%,100%,.15) !important;
}
/*Placeholder text*/
::placeholder {color: #fff !important;}
:-ms-input-placeholder {color: #fff !important;}
::-webkit-input-placeholder {color: #fff !important;}

6
CSS/themes/grafana/plex.css
View File

@ -16,6 +16,8 @@
:root { :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; --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; --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;
--accent-color: #f9be03; --button-color: #cc7b19;
--button-color: #fd5e94; --button-color-hover: #e59029;
--accent-color: #e5a00d;
--accent-color-hover: #ffc107;
} }

5
CSS/themes/grafana/space-gray.css
View File

@ -16,5 +16,8 @@
:root { :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; --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; --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;
--accent-color: #fff; --button-color: #607D8B;
--button-color-hover: #81a6b7;
--accent-color: #607D8B;
--accent-color-hover: #81a6b7;
} }
Write Preview
Loading…
Cancel
Save