Bootstrap Dark theme for phpMyAdmin
escape-svg
functioncyan
(main), teal
, nord
and orange
The best way to see BooDark in action is to try it on phpMyAdmin demo server.
themes
folder and add here the boodark
folderBooDark
theme on the home pageBooDark theme respects the folders structure of phpMyAdmin.
├── node_modules
├── themes
│ └── boodark
│ ├── css/
│ ├── img/
│ ├── jquery/
│ ├── scss/
│ ├── screen.png
│ └── theme.json
├── package.json
└── yarn.lock
To build the theme or customize it with your preferences you must have Node, Yarn and Git installed. Then follow step by step:
Open your command-line and navigate to your projects folder
Clone this repo locally: git clone https://github.com/adorade/boodark .
Install project dependecies: yarn install
Do any modifications you want (eg. change color scheme)
Compile scss
files to css
# production, minified files
yarn run build
# development
yarn run build:dev
Theme files are in themes/boodark
.
BooDark has several color schemes: cyan
(main), teal
, nord
and orange
.
There is currently no way to change the color scheme in GUI.
How to change color scheme?
Option 1. Edit scss/_variables.scss
(see Building)
// Theme color scheme
// Values: "cyan", "teal", "nord", "orange"
// Default: "cyan"
// Set this value for the desired color scheme
// --- Change cyan
$color-scheme: cyan !default;
// --- to nord
$color-scheme: nord !default;
// --- then run `yarn run build`
Option 2. Replace the CSS files. For example:
mv themes/boodark/css/theme.css themes/boodark/css/theme-cyan.css
mv themes/boodark/css/theme-nord.css themes/boodark/css/theme.css
Have a bug or a feature request? Please search for existing and closed issues. If your problem or idea is not addressed yet, please open a new issue.
BooDark Theme is licensed under MIT. Copyright (c) 2022-23 Adorade
Hopefully, this theme is useful to you.