Non-retina searing theme for arkservers.io control panel
ASIO Dark Mode by PELIC
Mirrored from https://github.com/PELICSPLACE/ASIO-Dark-Mode/raw/main/ASIO_DarkMode.user.css
Details
AuthorPELIC
LicenseGNU GPLv3
Categoryarkservers.io
Created
Updated
Size24 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name ASIO Dark Mode
@description Non-retina searing theme for arkservers.io control panel
@version 1.5.2
@homepageURL https://github.com/PELICSPLACE/ASIO-Dark-Mode
@license CC-BY-SA-4.0
@namespace PelicsPlace
@author Pelic
@preprocessor stylus
==/UserStyle== */
@-moz-document domain('arkservers.io'), domain('arkers.io'), domain('7d2d.io'), domain('rusters.io'), domain('valheimers.com'), domain('palworlders.com'), domain('minecrafters.io') {
:root {
--dark01:#0A0A0A;
--dark02:#141414;
--dark03:#1E1E1E;
--dark04:#292929;
--dark05:#333333;
--dark06:#3D3D3D;
--dark07:#474747;
--dark08:#525252;
--dark09:#5C5C5C;
--dark10:#666666;
--lite01:#747474;
--lite02:#828282;
--lite03:#919191;
--lite04:#9F9F9F;
--lite05:#ADADAD;
--lite06:#BCBCBC;
--lite07:#CACACA;
--lite08:#D8D8D8;
--lite09:#E7E7E7;
--lite10:#F5F5F5;
--success-default:#336633;
--success-hovered:#448844;
--warning-default:#997300;
--warning-hovered:#CC9900;
--failure-default:#660000;
--failure-hovered:#990000;
--linkage-default:#336699;
--linkage-hovered:#4080BF;
}
/*****************************************/
/* Works on Chrome, Edge, and Safari */
/* the scrollbar. */
*::-webkit-scrollbar {
width:8px;
height:8px;
background:var(--dark01) !important;
}
/* the draggable scrolling handle. */
*::-webkit-scrollbar-thumb {
background:var(--dark07) !important;
}
*::-webkit-scrollbar-thumb:hover {
background:var(--lite01) !important;
}
/* the track (progress bar) of the scrollbar. */
*::-webkit-scrollbar-track {
background:var(--dark02) !important;
}
/* the bottom corner of the scrollbar, where both horizontal and vertical scrollbars meet. */
*::-webkit-scrollbar-corner {
background:var(--dark07) !important;
}
/* Works on Firefox */
* {
scrollbar-color:var(--dark07) var(--dark01) !important;
scrollbar-width:thin !important;
}
/*****************************************/
*::-moz-selection {
background:var(--linkage-hovered);
color:var(--lite08);
text-shadow:none;
}
*::selection {
background:var(--linkage-hovered);
color:var(--lite08);
text-shadow:none;
}
/*****************************************/
*,
*::before,
*::after {
box-sizing:border-box;
}
html {
background:var(--dark01) !important;
color:var(--lite04) !important;
font-size:1em !important;
line-height:1.15 !important;
-webkit-text-size-adjust:100% !important;
}
body {
background:var(--dark01) !important;
color:var(--lite04) !important;
margin:0;
margin:0 auto;
border:0;
}
/* ========================================================================== */
/* Forms
/* ========================================================================== */
/* 1. Change the font styles in all browsers. */
/* 2. Remove the margin in Firefox and Safari. */
button,
input,
optgroup,
select,
textarea {
font-family:inherit; /* 1 */
font-size:100%; /* 1 */
line-height:1.15; /* 1 */
margin:0; /* 2 */
}
/* Cut Image Brightness by 50% */
img {
filter:brightness(50%) !important;
}
/* Generic Links */
a {
color:var(--linkage-default) !important;
text-decoration:none;
&:visited {
color:var(--linkage-default) !important;
text-decoration:none;
}
&:hover {
color:var(--linkage-hovered) !important;
text-decoration:underline;
}
}
div.header img {
filter:brightness(100%) !important;
}
input,
textarea {
color:var(--dark03) !important;
background:var(--lite06) !important;
background-image:none !important;
}
/* ========================================================================== */
/* Grouping content
/* ========================================================================== */
/* 1. Add the correct box sizing in Firefox. */
/* 2. Show the overflow in Edge and IE. */
hr {
box-sizing:content-box; /* 1 */
height:0; /* 1 */
overflow:visible; /* 2 */
display:block;
border:0;
border-top:1px solid var(--dark04) !important;
margin:1em 0;
padding:0;
}
/* 1. Correct the inheritance and scaling of font size in all browsers. */
/* 2. Correct the odd `em` font sizing in all browsers. */
pre {
font-family:monospace; /* 1 */
font-size:1em; /* 2 */
color:var(--dark02) !important;
background:var(--lite06) !important;
background-image:none !important;
border:1px solid var(--dark04);
border-radius:4px;
}
table, thead, tbody, th, tr, td, th {
background:var(--dark02) !important;
border-collapse:collapse;
border-spacing:0;
margin:0;
}
a.btn-info {
color:var(--lite08) !important;
background:var(--linkage-default) !important;
border:2px solid var(--linkage-default) !important;
border-radius:8px !important;
&:hover {
color:var(--lite09) !important;
background:var(--linkage-hovered) !important;
border:2px solid var(--linkage-hovered) !important;
border-radius:8px !important;
}
}
kbd {
font-family:monospace !important;
font-size:1em !important;
color:var(--lite06) !important;
background:var(--dark02) !important;
}
.server-list .server-list-item {
background:var(--dark02) !important;
border:0;
border:1px solid var(--dark06) !important;
border-radius:8px;
}
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th,
.table>thead>tr {
background:var(--dark02) !important;
border:0;
border-top:1px solid var(--dark06) !important;
margin:0;
&:hover {
background:var(--dark02) !important;
border:0;
border-top:1px solid var(--dark06) !important;
margin:0;
}
}
.server-list .server-list-item h3 {
border:0;
border-bottom:2px solid transparent !important;
}
.server-list .server-list-item .info-box {
border:0;
border:1px solid var(--dark06) !important;
border-radius:4px !important;
}
.label-success {
color:var(--lite06) !important;
background:var(--success-default) !important;
}
.label-warning {
color:var(--lite06) !important;
background:var(--warning-default) !important;
}
.label-danger {
color:var(--lite06) !important;
background:var(--failure-default) !important;
}
a.btn-default,
.btn-default {
color:var(--lite06) !important;
background:var(--dark05) !important;
border:2px solid var(--dark05) !important;
border-radius:8px !important;
&:hover {
color:var(--lite08) !important;
background:var(--dark06) !important;
border:2px solid var(--dark06) !important;
border-radius:8px !important;
}
}
a.btn-primary,
.btn-primary {
color:var(--lite06) !important;
background:var(--linkage-default) !important;
border:2px solid var(--linkage-default) !important;
border-radius:8px !important;
&:hover {
color:var(--lite08) !important;
background:var(--linkage-hovered) !important;
border:2px solid var(--linkage-hovered) !important;
border-radius:8px !important;
}
}
a.btn-info,
.btn-info {
color:var(--lite06) !important;
background:var(--linkage-default) !important;
border:2px solid var(--linkage-default) !important;
border-radius:8px !important;
&:hover {
color:var(--lite08) !important;
background:var(--linkage-hovered) !important;
border:2px solid var(--linkage-hovered) !important;
border-radius:8px !important;
}
}
a.btn-success,
.btn-success {
color:var(--lite06) !important;
background:var(--success-default) !important;
border:2px solid var(--success-default) !important;
border-radius:8px !important;
&:hover {
color:var(--lite08) !important;
background:var(--success-hovered) !important;
border:2px solid var(--success-hovered) !important;
border-radius:8px !important;
}
}
a.btn-warning,
.btn-warning {
color:var(--lite06) !important;
background:var(--warning-default) !important;
border:2px solid var(--warning-default) !importan...