a dark theme for PhpMyAdmin
based on Shadow PMA by markreddick
licensed as CC BY-SA
dark theme for PhpMyAdmin by s-light
Details
Authors-light
LicenseCC-BY-SA-4.0
Categorydemo.phpmyadmin.net
Created
Updated
Size11 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
a dark theme for PhpMyAdmin
based on Shadow PMA by markreddick
licensed as CC BY-SA
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name dark theme for PhpMyAdmin
@version 20230106.08.10
@namespace userstyles.world/user/s-light
@description a dark theme for PhpMyAdmin
based on Shadow PMA by markreddick
licensed as CC BY-SA
@author s-light
@license CC-BY-SA-4.0
==/UserStyle== */
@-moz-document domain("demo.phpmyadmin.net"), regexp("http://pma.*"), regexp("https://pma.*"), regexp(".*/phpMyAdmin/.*") {
/* ==UserStyle==
@name Test style name
@namespace userstyles.world
@version 1.0.0
==/UserStyle== */
/*
Shadow PMA
by markreddick
CC BY-SA - Creative Commons Attribution-ShareAlike
https://userstyles.org/styles/172636/shadow-pma
*/
:root {
--main: #b9b9b9;
--main-bg: #1a1a1a;
--input: white;
--input-bg: #3c3c3c;
--link: #ffffda;
--link-hover: #f5fb89;
--tab-bg: #3c3c3c;
--tab: #bbb;
--tab-hover: white;
--tab-hover-bg: #aeaeae;
--panel-bg: #3e3d3d;
--panel-header: #e8e8e8;
--panel-header-bg: #313131;
--highlight: black;
--highlight-bg: #999;
--button: white;
--button-bg: #354979;
--button-hover-bg: #4160aa;
--header: #e6e6e6;
--header-bg: #555;
--row: white;
--row-even-bg: #313131;
--row-odd-bg: #3c3c3c;
--filter-control: #ff7373;
--notice: black;
--notice-bg: #9f9f85;
--success: white;
--success-bg: #3d6f3d;
--error: #fff;
--error-bg: #733c3c;
--sql: black;
--sql-keyword: #873e00;
--sql-var2: #4a0569;
--sql-num: #0b7d00;
--disabled: #c12d2d;
--disabled-bg: #9f2e2e00;
}
body {
background-color: var(--main-bg);
color: var(--main);
}
a,
a:active,
a:link,
a:visited {
color: var(--link);
}
a:hover {
color: var(--link-hover);
}
h1,
h2,
h3,
h4 p a {
text-shadow: none;
}
div {
box-shadow: none !important;
}
div.success,
div.notice,
div.error {
border: none !important;
}
button.mult_submit,
button.mult_submit:hover {
color: var(--link);
}
.checkall_box + label,
.checkall_box + label:hover {
color: var(--link);
}
fieldset,
fieldset fieldset {
background-color: var(--panel-bg);
color: var(--panel);
}
.group {
background-color: var(--panel-bg);
color: var(--main);
border: none;
border-radius: 6px;
overflow: hidden;
}
.group h2 {
background-color: var(--panel-header-bg);
color: var(--panel-header);
text-shadow: none;
box-shadow: none;
}
table {
border-top: none !important;
}
table caption,
table th,
table td {
text-shadow: none;
}
table tbody:first-of-type tr:nth-child(odd) {
background-color: var(--row-odd-bg);
}
table tbody:first-of-type tr:nth-child(odd) th {
background-color: var(--row-odd-bg);
}
table tbody:first-of-type tr:nth-child(even) {
background-color: var(--row-even-bg);
}
table tbody:first-of-type tr:nth-child(even) th {
background-color: var(--row-even-bg);
}
thead th {
border-right: 1px solid var(--main-bg);
}
th {
background-image: none;
background-color: var(--header-bg);
color: var(--header);
}
tr th {
color: var(--header);
}
th a,
th a:link {
color: var(--link);
}
tr.disabled td {
background-color: var(--disabled-bg) !important;
color: var(--disabled) !important;
}
.disabled {
color: var(--disabled) !important;
background-color: var(--disabled-bg) !important;
}
.disabled a:link,
.disabled a:active,
.disabled a:visited {
color: var(--main) !important;
background-color: var(--disabled-bg) !important;
}
.disabled:hover a,
.disabled a:hover {
color: var(--main-bg) !important;
background-color: var(--disabled-bg) !important;
}
tr.marked:not(.nomarker) td {
background: var(--highlight-bg) !important;
color: var(--highlight) !important;
}
tr:hover:not(.marked),
tr:not(.marked) td.hover,
rd:not(.marked) th:hover,
tr:hover:not(.marked) a:link,
td:not(.marked).hover a:link,
tr:hover:not(.marked) th,
li.nowrap:hover {
background: none !important;
background-image: none !important;
background-color: var(--highlight-bg) !important;
color: var(--highlight);
}
.table th, .table td {
text-shadow:none;
color: var(--input);
}
.tblcomment {
color: var(--highlight) !important;
text-shadow: none;
}
th a, th a:link {
color: var(--highlight);
}
input,
select,
textarea {
background: var(--input-bg) !important;
color: var(--input) !important;
text-shadow: none !important;
}
#sectionlinks {
background-color: var(--panel-bg);
color: var(--panel);
border: none;
}
input[type="button"],
input[type="submit"],
input[type=reset],
button,
#sectionlinks a {
background: none !important;
background-color: var(--button-bg) !important;
border-radius: 2px !important;
box-shadow: none !important;
color: var(--button) !important;
border: none !important;
}
input[type="button"]:hover,
input[type="submit"]:hover,
input[type=reset]:hover,
#sectionlinks a:hover {
background-color: var(--button-hover-bg) !important;
}
#sectionlinks a:hover {
color: var(--button-bg) !important;
background-color: var(--button) !important;
}
li.fast_filter span {
color: var(--filter-control);
}
.notice,
.ajax_notification {
border: none !important;
box-shadow: none !important;
background-color: var(--notice-bg) !important;
color: var(--notice) !important;
}
.notice a {
color: black;
}
.tblcomment {
color: var(--highlight-bg);
}
.tblHeaders {
background: var(--panel-header-bg) !important;
color: var(--panel-header) !important;
}
th.header,
.var-header {
background: var(--header-bg) !important;
color: var(--header) !important;
}
.tblFooters {
background: var(--panel-header-bg);
color: var(--panel-header);
}
fieldset {
border: none !important;
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}
.result_query div.sqlOuter {
-webkit-filter: invert(100%) !important;
}
.result_query div.sqlOuter input[type="button"],
.result_query div.sqlOuter input[type="submit"] {
-webkit-filter: invert(100%) !important;
}
.result_query div.sqlOuter,
#sqlquerycontainer .CodeMirror,
#sqlquerycontainerfull .CodeMirror {
-webkit-filter: invert(100%) !important;
}
.navigation input[type=submit] {
background: none !important;
}
.navigation tr:hover input[type=submit] {
color: var(--highlight) !important;
}
.navigation tr:hover input[type=submit]:hover {
background-color: var(--highlight) !important;
color: var(--highlight-bg) !important;
}
.cm-s-default {
color: var(--sql);
font-size: 1.1rem;
}
.cm-keyword {
color: var(--sql-keyword) !important;
}
.cm-variable-2 {
color: var(--sql-var2) !important;
}
.cm-number {
color: var(--sql-num) !important;
}
#pma_navigation {
color: var(--main);
background: var(--main-bg);
}
#pma_navigation_header {
background-color: var(--input-bg);
}
#pma_navigation_tree {
color: var(--main);
}
#pma_navigation_tree a {
color: var(--link);
}
#pma_navigation_tree li.activePointer {
background-color: var(--highlight-bg);
}
#pma_navigation_tree li.activePointer a {
color: var(--highlight) !important;
}
#pma_navigation_tree li.activePointer.selected a:hover {
color: var(--link) !important;
}
#pma_navigation_tree li.selected {
background-color: var(--panel-bg);
}
#pma_navigation_tree li.selected a {
color: var(--link);
}
.navbar.bg-light,
.navbar-nav .nav-item {
border-right: 1px solid var(--button-bg);
border-left: 1px solid var(--panel-header-bg);
border-bottom: 1px solid var(--panel-header-bg);
background: linear-gradient(var(--panel-header-bg), var(--button-bg));
}
.navbar-nav .nav-item.active {
background: var(--button-bg);
border-bottom: 0;
}
.pma_quick_warp .drop_button {
border: none;
background: none;
}
.menucontainer {
background-image: none;
background-color: var(--tab-bg);
color: var(--tab);
}
#topmenu a,
#topmenu a:link {
color: var(--link);
text-shadow: none;
}
#topmenu a.tabactive,
#topmenu a:link.tabactive {
background-color: var(--main-bg) !important;
color: var(--main) !important;
}
#topmenu a:hover,
#topmenu a:link:hover {
background-color: var(--highlight-bg);
color: var(--highlight);
}
ul#topmenu li,
ul#topmenu li.active {
border-color: var(--main-bg);
}
ul#topmenu2 a {
color: var(--highlight) !important;
background-color: var(--highlight-bg);
border-color: var(--highlight) !important;
}
ul#topmenu2 a .tabactive {
background-color: var(--main-bg) !important;
color: var(--main) !important;
}
#serverinfo {
background: var(--main-bg);
text-shadow: none;
}
#serverinfo .item {
color: var(--main);
}
div.tools {
background-color: var(--panel-bg);
color: var(--main);
}
div.tools a,
div.tools a:link {
color: var(--link) !important;
}
.success {
background-color: var(--success-bg);
color: var(--success);
}
.error {
background-color: var(--error-bg);
color: var(--error);
}
a img {
border: none;
outline: none;
}
#pma_console {
-webkit-filter: invert(100%) !important;
color: var(--main-bg);
}
.action_content {
color: var(--main-bg);
}
#full_name_layer {
background-color: var(--panel-bg);
color: var(--link-hover);
border-color: var(--link-hover);
}
#initials_table tr a,
#initials_table tr:hover a {
color: var(--button) !important;
background: var(--button-bg) !important;
}
.submenu .tab {
color: var(--panel);
background-color: var(--panel-bg);
}
#goto_pagetop,
#lock_page_icon,
#page_settings_icon {
background: none;
}
.ui-widget-header {
border: none;
color: var(--panel-header);
background: none;
background-color: var(--panel-header-bg);
}
.ui-widget-content {
background-color: var(--panel-bg);
color: var(--main);
}
ul.tabs a {
color: var(--tab) !important;
background: n...