diff --git a/CSS/themes/grafana/aquamarine.css b/CSS/themes/grafana/aquamarine.css index ed4309af..1aa7975d 100644 --- a/CSS/themes/grafana/aquamarine.css +++ b/CSS/themes/grafana/aquamarine.css @@ -16,6 +16,9 @@ :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; - --accent-color: #32d1df; - --button-color: #fd5e94; + --button-color: #009688; + --button-color-hover: #12afa0; + --accent-color: #009688; + --accent-color-hover: #12afa0; + --queue-color: #009688; } \ No newline at end of file diff --git a/CSS/themes/grafana/dark.css b/CSS/themes/grafana/dark.css index 4c54343a..8e44da71 100644 --- a/CSS/themes/grafana/dark.css +++ b/CSS/themes/grafana/dark.css @@ -16,6 +16,8 @@ :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; - --accent-color: #32d1df; - --button-color: #fd5e94; + --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); } \ No newline at end of file diff --git a/CSS/themes/grafana/grafana-base.css b/CSS/themes/grafana/grafana-base.css index b77e8c37..53f5a686 100644 --- a/CSS/themes/grafana/grafana-base.css +++ b/CSS/themes/grafana/grafana-base.css @@ -269,7 +269,7 @@ color:#FFFFFF !important; border-right: none; } /* Variable label color */ -.template-variable { +.template-variable, .gf-form-label--variable { color: var(--accent-color) !important; } @@ -332,6 +332,7 @@ color:#FFFFFF !important; .panel-container { background-color: rgba(0, 0, 0, .25); border: transparent; + box-shadow: none !important; } .panel-container.panel-transparent, .panel-container--transparent { background-color: transparent; @@ -343,7 +344,7 @@ color:#FFFFFF !important; } /* ////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; } @@ -532,3 +533,342 @@ border-color: #b56d16 !important; position: relative; 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;} \ No newline at end of file diff --git a/CSS/themes/grafana/hotline.css b/CSS/themes/grafana/hotline.css index 81dc8b21..b639652f 100644 --- a/CSS/themes/grafana/hotline.css +++ b/CSS/themes/grafana/hotline.css @@ -16,6 +16,8 @@ :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; - --accent-color: #32d1df; - --button-color: #fd5e94; + --button-color: hsla(0,0%,100%,.15); + --button-color-hover: hsla(0,0%,100%,.30); + --accent-color: #F44336; + --accent-color-hover: #0b3161; } \ No newline at end of file diff --git a/CSS/themes/grafana/organizr-dashboard.css b/CSS/themes/grafana/organizr-dashboard.css index 6f051896..a49a69d7 100644 --- a/CSS/themes/grafana/organizr-dashboard.css +++ b/CSS/themes/grafana/organizr-dashboard.css @@ -163,6 +163,7 @@ div.flot-text { .panel-container { background-color: rgba(0, 0, 0, .25); border: transparent; + box-shadow: none !important; } .panel-container.panel-transparent, .panel-container--transparent { background-color: transparent; @@ -240,3 +241,354 @@ div.flot-text { box-shadow: none; 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;} \ No newline at end of file diff --git a/CSS/themes/grafana/plex.css b/CSS/themes/grafana/plex.css index 847cd208..e9f31849 100644 --- a/CSS/themes/grafana/plex.css +++ b/CSS/themes/grafana/plex.css @@ -16,6 +16,8 @@ :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; - --accent-color: #f9be03; - --button-color: #fd5e94; + --button-color: #cc7b19; + --button-color-hover: #e59029; + --accent-color: #e5a00d; + --accent-color-hover: #ffc107; } \ No newline at end of file diff --git a/CSS/themes/grafana/space-gray.css b/CSS/themes/grafana/space-gray.css index 1b4eb00c..12a7aa72 100644 --- a/CSS/themes/grafana/space-gray.css +++ b/CSS/themes/grafana/space-gray.css @@ -16,5 +16,8 @@ :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; - --accent-color: #fff; + --button-color: #607D8B; + --button-color-hover: #81a6b7; + --accent-color: #607D8B; + --accent-color-hover: #81a6b7; } \ No newline at end of file