Update Gruvbox themes for Proxmox, Searx, and Base, adding new styles and improving overall design
This commit is contained in:
parent
94480e8149
commit
d7a73b3624
4 changed files with 212 additions and 12 deletions
|
|
@ -1,7 +1,7 @@
|
|||
/* ==UserStyle==
|
||||
@name Gruvbox Base
|
||||
@namespace git.m3.fyi/Marsn3
|
||||
@version 1.0.2
|
||||
@version 1.0.4
|
||||
@description Base Gruvbox Theme
|
||||
@author Marsn3
|
||||
@homepageURL https://git.m3.fyi/Marsn3/userstyles
|
||||
|
|
@ -151,4 +151,21 @@ regexp("about:(?!addons|app-manager|config|customizing|stylish-edit|downloads|pe
|
|||
|
||||
--bg-road: url("https://cdn.m3.fyi/road.jpg") !important;
|
||||
}
|
||||
input::placeholder,
|
||||
textarea::placeholder {
|
||||
color: var(--fg4) !important;
|
||||
}
|
||||
input,
|
||||
textarea {
|
||||
color: var(--fg) !important;
|
||||
}
|
||||
* {
|
||||
scrollbar-color: var(--fg2) var(--bg3) !important;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
background-color: var(--bg3);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: var(--fg2);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
192
src/headscaleui.user.css
Normal file
192
src/headscaleui.user.css
Normal file
|
|
@ -0,0 +1,192 @@
|
|||
/* ==UserStyle==
|
||||
@name Gruvbox for Headscale-UI
|
||||
@namespace git.m3.fyi/Marsn3
|
||||
@version 1.0.2
|
||||
@description A dark Theme for Headscale-UI
|
||||
@author Marsn3
|
||||
@homepageURL https://git.m3.fyi/Marsn3/userstyles
|
||||
@updateURL https://git.m3.fyi/Marsn3/userstyles/~raw/main/src/headscaleui.user.css
|
||||
@license MIT
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain("vpn.m3.fyi") {
|
||||
img[src="static/img/headscale3-dots.png"] {
|
||||
filter: invert(100%) sepia(100%);
|
||||
-webkit-filter: invert(100%) sepia(100%);
|
||||
}
|
||||
.red.darken-1 {
|
||||
background-color: var(--bg3) !important;
|
||||
}
|
||||
body {
|
||||
background-color: var(--bg);
|
||||
color: var(--fg);
|
||||
}
|
||||
.modal,
|
||||
.card {
|
||||
background-color: var(--bg1);
|
||||
}
|
||||
.modal .modal-close {
|
||||
color: var(--fg);
|
||||
}
|
||||
.modal-footer {
|
||||
background-color: var(--bg_h) !important;
|
||||
color: var(--fg);
|
||||
}
|
||||
.collection.with-header .collection-header,
|
||||
.collapsible-header,
|
||||
.collection .collection-item {
|
||||
background-color: var(--bg1);
|
||||
border-bottom: 1px solid var(--bg3);
|
||||
}
|
||||
.collection {
|
||||
border: 1px solid var(--bg3);
|
||||
}
|
||||
.btn,
|
||||
.btn-small,
|
||||
.btn-large {
|
||||
color: var(--fg);
|
||||
background-color: var(--green);
|
||||
}
|
||||
.btn:hover,
|
||||
.btn-small:hover,
|
||||
.btn-large:hover {
|
||||
background-color: var(--green-dim);
|
||||
}
|
||||
.material-icons,
|
||||
nav ul a,
|
||||
nav .brand-logo,
|
||||
.btn-floating i {
|
||||
color: var(--fg);
|
||||
}
|
||||
.grey.lighten-2 {
|
||||
background-color: var(--fg4) !important;
|
||||
color: var(--fg);
|
||||
}
|
||||
.z-depth-1 {
|
||||
box-shadow: 0 2px 2px 0 rgba(40, 40, 40, 0.14),
|
||||
0 3px 1px -2px rgba(40, 40, 40, 0.12), 0 1px 5px 0 rgba(40, 40, 40, 0.2);
|
||||
}
|
||||
nav ul a:hover {
|
||||
background-color: rgba(40, 40, 40, 0.1);
|
||||
}
|
||||
.orange-text,
|
||||
.yellow-text,
|
||||
.modal-trigger {
|
||||
color: var(--yellow) !important;
|
||||
}
|
||||
.card
|
||||
.card-action
|
||||
a:not(.btn):not(.btn-small):not(.btn-large):not(.btn-large):not(
|
||||
.btn-floating
|
||||
):hover {
|
||||
color: var(--yellow-dim) !important;
|
||||
}
|
||||
.green-text,
|
||||
.input-field .prefix.active {
|
||||
color: var(--green) !important;
|
||||
}
|
||||
.red.darken-3,
|
||||
.green {
|
||||
background-color: var(--green) !important;
|
||||
}
|
||||
.white-text {
|
||||
color: var(--fg) !important;
|
||||
}
|
||||
.blue-grey.lighten-1 {
|
||||
background-color: var(--blue-dim) !important;
|
||||
}
|
||||
.blue-grey-text.text-lighten-1 {
|
||||
color: var(--blue-dim) !important;
|
||||
}
|
||||
.teal-text.text-lighten-1 {
|
||||
color: var(--aqua) !important;
|
||||
}
|
||||
.teal.lighten-1 {
|
||||
background-color: var(--aqua) !important;
|
||||
}
|
||||
.grey-text {
|
||||
color: var(--gray) !important;
|
||||
}
|
||||
.green-text.text-lighten-2 {
|
||||
color: var(--green-dim) !important;
|
||||
}
|
||||
.material-tooltip {
|
||||
color: var(--fg);
|
||||
background-color: var(--bg2);
|
||||
}
|
||||
.dropdown-content li {
|
||||
color: var(--fg);
|
||||
}
|
||||
.collection .collection-item.avatar i.circle {
|
||||
color: var(--fg);
|
||||
background-color: var(--bg3);
|
||||
}
|
||||
.dropdown-content li > a,
|
||||
.dropdown-content li > span {
|
||||
color: var(--fg);
|
||||
}
|
||||
.divider {
|
||||
background-color: var(--bg4);
|
||||
}
|
||||
#dropdown1 > li:nth-child(3) {
|
||||
background-color: var(--bg1);
|
||||
}
|
||||
table.striped > tbody > tr:nth-child(2n + 1) {
|
||||
background-color: var(--bg4);
|
||||
}
|
||||
.input-field > label {
|
||||
color: var(--fg3);
|
||||
}
|
||||
input:not([type]):not(.browser-default),
|
||||
input[type="text"]:not(.browser-default),
|
||||
input[type="password"]:not(.browser-default),
|
||||
input[type="email"]:not(.browser-default),
|
||||
input[type="url"]:not(.browser-default),
|
||||
input[type="time"]:not(.browser-default),
|
||||
input[type="date"]:not(.browser-default),
|
||||
input[type="datetime"]:not(.browser-default),
|
||||
input[type="datetime-local"]:not(.browser-default),
|
||||
input[type="month"]:not(.browser-default),
|
||||
input[type="tel"]:not(.browser-default),
|
||||
input[type="number"]:not(.browser-default),
|
||||
input[type="search"]:not(.browser-default),
|
||||
textarea.materialize-textarea {
|
||||
border-bottom: 1px solid var(--fg3);
|
||||
}
|
||||
input:not([type]):not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="text"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="password"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="email"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="url"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="time"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="date"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="datetime"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="datetime-local"]:not(.browser-default):focus:not([readonly])
|
||||
+ label,
|
||||
input[type="month"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="tel"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="number"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
input[type="search"]:not(.browser-default):focus:not([readonly]) + label,
|
||||
textarea.materialize-textarea:focus:not([readonly]) + label,
|
||||
a {
|
||||
color: var(--green);
|
||||
}
|
||||
|
||||
input:not([type]):not(.browser-default):focus:not([readonly]),
|
||||
input[type="text"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="password"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="email"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="url"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="time"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="date"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="datetime"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="datetime-local"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="month"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="tel"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="number"]:not(.browser-default):focus:not([readonly]),
|
||||
input[type="search"]:not(.browser-default):focus:not([readonly]),
|
||||
textarea.materialize-textarea:focus:not([readonly]) {
|
||||
border-bottom: 1px solid var(--green);
|
||||
box-shadow: 0 1px 0 0 var(--green);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
/* ==UserStyle==
|
||||
@name Gruvbox for Proxmox
|
||||
@namespace git.m3.fyi/Marsn3
|
||||
@version 1.0.3
|
||||
@version 1.0.4
|
||||
@description Gruvbox Theme for Proxmox
|
||||
@author Marsn3
|
||||
@homepageURL https://git.m3.fyi/Marsn3/userstyles
|
||||
|
|
@ -296,10 +296,4 @@
|
|||
box-shadow: none;
|
||||
border-color: var(--bg4);
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
background-color: var(--bg1);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: var(--bg3);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/* ==UserStyle==
|
||||
@name Gruvbox for Searx
|
||||
@namespace git.m3.fyi/Marsn3
|
||||
@version 1.0.4
|
||||
@version 1.0.5
|
||||
@description Gruvbox Theme for Searx
|
||||
@author Marsn3
|
||||
@homepageURL https://git.m3.fyi/Marsn3/userstyles
|
||||
|
|
@ -112,9 +112,6 @@
|
|||
.search_filters select {
|
||||
filter: var(--filter-reset) var(--filter-fg) !important;
|
||||
}
|
||||
* {
|
||||
scrollbar-color: var(--fg2) var(--bg3) !important;
|
||||
}
|
||||
#main_index {
|
||||
margin-top: 0em;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue