Updated Themes (markdown)
Rsl1122
parent
443be7eeb7
commit
9546bdb69a
95
Themes.md
95
Themes.md
|
|
@ -1,25 +1,22 @@
|
|||
|
||||
# Themes
|
||||
|
||||
Theme system is a new addition in version 4.0.0. It brings a lot more flexibility for colors, backgrounds and font used on the web pages.
|
||||
New html in 4.1.0 required a new theme system.
|
||||
|
||||
In the new system colors are changed in theme.yml.
|
||||
|
||||
If you want to change how the web pages look **completely** check out [[Html Customization]]
|
||||
|
||||
## Themes
|
||||
|
||||
Here is a list of Themes currently available in version 4.0.0. (Click the link to view an image.)
|
||||
Here is a list of Themes currently available in version 4.1.1. (Click the link to view an image.)
|
||||
|
||||
- [Default](http://puu.sh/xIEC1/ccde460c15.png) (Green)
|
||||
- [Blaze](http://puu.sh/xIEFD/e66ec6d592.png)
|
||||
- [BlueGray](http://puu.sh/xIEIN/95a3a549cf.png)
|
||||
- [DarkRed](http://puu.sh/xIEMd/f649022be8.png)
|
||||
- [Greyscale](http://puu.sh/xIEPi/e0fc0545a8.png)
|
||||
- [Indigo](http://puu.sh/xIESD/e6ea052617.png)
|
||||
- [Night](http://puu.sh/xIF0G/6f95685e60.png)
|
||||
- [Pink](http://puu.sh/xIF3e/991787fce1.png)
|
||||
- [Purple](http://puu.sh/xIF5E/3ff85bb37a.png)
|
||||
|
||||
If you set `Theme.Base` as a theme that is not defined the page will look like [this](http://puu.sh/xIEXz/2f7678a2ac.png)
|
||||
- [Default](https://puu.sh/yxWTt/1965c90d0b.jpg)
|
||||
- [Soft](https://puu.sh/yy1lv/5e3e4795f4.jpg)
|
||||
- [Mute](https://puu.sh/yxWU3/33364a6d84.jpg)
|
||||
- [Pastel](https://puu.sh/yxWUf/fa111f273b.jpg)
|
||||
- [Grey](https://puu.sh/yxWRJ/b16d1a9e45.jpg)
|
||||
- [Sepia](https://puu.sh/yxWUG/93ed75fd8c.jpg)
|
||||
|
||||
**All colors can be changed, so if you do not like a single color you can set it with the other settings.**
|
||||
If you want a certain themed theme to be created just ask - They're one of the easiest things to implement.
|
||||
|
|
@ -27,67 +24,35 @@ If you want a certain themed theme to be created just ask - They're one of the e
|
|||
Looking for the color codes?
|
||||
- [Theme enum](https://github.com/Rsl1122/Plan-PlayerAnalytics/blob/master/Plan/src/main/java/com/djrapitops/plan/systems/webserver/theme/Theme.java)
|
||||
|
||||
## Base
|
||||
|
||||
`Theme.Base` is the main config setting that affects all other settings.
|
||||
If a color-setting is set as "Base" it will use the color of the Base theme.
|
||||
|
||||
Example:
|
||||
- Base is set as 'bluegray'
|
||||
- Colors.Main is set as 'base'
|
||||
- Theme system translates the setting to 'bluegray' (Without changing the config setting)
|
||||
|
||||
If a faulty color setting is used the Base color will be used instead.
|
||||
|
||||
## Borrow colors from other Themes
|
||||
|
||||
Let's say you like the default graph colors, but want to use another theme like Indigo.
|
||||
Indigo will try to set the graph colors as a shade of blue.
|
||||
|
||||
Instead of figuring the color codes for the default theme's graphs, they can be used directly:
|
||||
In order to copy colors from another theme:
|
||||
- Change Theme.Base in config.yml to name of a theme you want colors from
|
||||
- Remove the settings you want to copy inside the theme.yml
|
||||
- /plan reload the plugin
|
||||
|
||||
For example:
|
||||
```
|
||||
Theme:
|
||||
Base: Indigo
|
||||
...
|
||||
Graphs:
|
||||
PunchCard: Default
|
||||
PlayersOnline: Default
|
||||
TPS:
|
||||
High-Threshold: 18
|
||||
Medium-Threshold: 10
|
||||
High: Default
|
||||
Medium: Default
|
||||
Low: Default
|
||||
CPU: Default
|
||||
RAM: Default
|
||||
Chunks: Default
|
||||
Entities: Default
|
||||
red: "#Value"
|
||||
pink: "#Value"
|
||||
```
|
||||
Remove pink:
|
||||
```
|
||||
red: "#Value"
|
||||
```
|
||||
Reload:
|
||||
```
|
||||
red: "#Value"
|
||||
pink: "#NewValue"
|
||||
```
|
||||
|
||||
|
||||
|
||||
This applies to all settings that accept 'Base' as an option.
|
||||
|
||||
## Custom colors
|
||||
|
||||
All the settings except `Theme.Base` accept a Html color code.
|
||||
All the settings inside theme.yml accept a Html color code.
|
||||
This means that any setting can be set as any color.
|
||||
|
||||
**Example:**
|
||||
`Colors.Secondary: '#ff75f3'`
|
||||
|
||||
|
||||
|
||||
## Background images
|
||||
|
||||
Some color settings accept image URLs as input.
|
||||
Please note that when using Background images, elements such as the Plan Icon and links use the `Theme.Base` color
|
||||
`Colors.Main: https://www.filterforge.com/filters/11635-v7.jpg` with `Theme.Base: Blaze`
|
||||
|
||||
|
||||
|
||||
Following settings can use a background image: Main, Main-Dark, Secondary, Secondary-Dark, Tertiary, Background, Table-Light, Table-Dark
|
||||
`pink: '#ff75f3'`
|
||||
|
||||
## Changing the Font
|
||||
|
||||
|
|
@ -99,7 +64,7 @@ If you want to use another web font, set `FontFamily: '''WebFontName'', sans-ser
|
|||
|
||||
## Pie Chart colors
|
||||
|
||||
Pie charts require many different colors so defining each one of them per theme would have taken a lot of time.
|
||||
Instead all of the color codes can be defined directly.
|
||||
Piecharts require multiple colors so they're all defined in a single row.
|
||||
The colors are placed on worlds in alphabetical order.
|
||||
|
||||
Format: `'"#000000", "#111"'`
|
||||
Loading…
Reference in New Issue