# theme.park
A collection of themes/skins for use in conjunction with [Organizr](https://github.com/causefx/Organizr)
## Setup
### Subfilter
As most of these apps doesn't have support for custom CSS you can get around that by using [subfilter](http://nginx.org/en/docs/http/ngx_http_sub_module.html) in Nginx.
Add this to your plex reverse proxy:
```nginx
proxy_set_header Accept-Encoding "";
sub_filter
''
'
';
sub_filter_once on;
```
Where `CUSTOM_CSS` is the name of the theme css.
Here is a complete example:
Expand
```nginx
# REDIRECT HTTP TRAFFIC TO https://[domain.com]
server {
listen 80;
server_name plpp.domain.com;
return 301 https://$server_name$request_uri;
}
server {
listen 443 ssl http2;
server_name plpp.domain.com;
#SSL settings
include /config/nginx/ssl.conf
location / {
proxy_pass http://192.168.1.2:8701;
include /config/nginx/proxy.conf;
proxy_set_header Accept-Encoding "";
sub_filter
''
'
';
sub_filter_once on;
}
}
```
***
# PHP Library Presenter Dark/Plex Theme
Custom [PLPP](https://github.com/Tensai75/plpp) CSS to match the [Organizr](https://github.com/causefx/Organizr) theme.
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/plpp/plpp.png)
#### `plpporg.css` is a dark theme that matches Organizr.
#### `plpp-plex.css` is a Plex theme for PLPP
***
# Guacamole Dark/Plex Theme
Custom [Guacamole](https://guacamole.apache.org/) CSS to match the [Organizr](https://github.com/causefx/Organizr) theme.
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/guacorg/guacorg.png)
#### `guacorg.css` is a dark theme that matches Organizr.
#### `guacplex.css` is a Plex theme for Guacamole
***
# Plex Organizr Theme
Custom [Plex](https://plex.tv) CSS to match the [Organizr](https://github.com/causefx/Organizr) theme.
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/plexorg/plexorg.png)
#### The `plexorg.css` theme is a dark theme that matches Organizr.
***
# OrgArr - Sonarr v2/v3 - Radarr - Lidarr
Custom [Sonarr V2 and V3](https://github.com/Sonarr/Sonarr)/[Radarr](https://github.com/Radarr/Radarr)/[Lidarr](https://github.com/Lidarr/Lidarr) CSS for consistent UI in [Organizr](https://github.com/causefx/Organizr)
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/orgarr/sonarrv3.png)
Thank you iFelix18 for doing all the hard work! :)
#### The `orgarr.css` theme is a dark theme that matches the Organizr dark theme.
#### `orgarr-plex.css` If you want a regular Plex theme for your *arr setup, use the **`orgarr-plex.css`** instead.
### Screenshots
Expand
***
# NZBGet Plex Theme
Custom CSS for [Nzbget](https://github.com/nzbget/nzbget)
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/nzbget/nzbget1.jpg)
The `nzbget-plex.css` theme is a plex theme for NZBGet.
Thank you [ydkmlt84](https://github.com/ydkmlt84) for making the job easier :)
### Screenshots
Expand
***
# GrafOrg - Grafana
Custom [Grafana](https://github.com/grafana/grafana) CSS for [Organizr](https://github.com/causefx/Organizr) homepage integration and consistent UI.
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/graforg/grafana-1.png)
## Custom CSS for Organizr
#### The `graforg.css` theme is a dark theme that matches the Organizr dark theme. NOTE: The `graforg.css` theme will hide the side menu. Go to https://graforg.domain.com/login for settings.
#### `grafplex.css` If you want a regular Plex theme for your Grafana setup, use the **`grafplex.css`** theme instead.
### Screenshots
Expand
### Custom HTML for Organizr Homepage
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/graforg/3.jpg)
Expand
Thank you [Fma965](https://gist.github.com/Fma965) for the base [code](https://gist.github.com/Fma965/d30ac1fa5695304a7d6dcdc748220027)
Change the ***Panel name*** to what you want and the ***src*** to the panel URL.
```css
Panel name
**
```
The URL can be found by clicking **share** on the panel you want to add.
If you dont want the ***Panel name*** text, just remove the `
` line entirely.
```css
Panel name
Panel name
Panel name
Panel name
```
***
# NetOrg - Netdata
Custom [Netdata](https://github.com/firehol/netdata) CSS for consistent UI in [Organizr](https://github.com/causefx/Organizr)
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/netorg/netdata-1.png)
## Custom CSS for Organizr
#### The `netorg.css` theme is a dark theme that matches Organizr.
#### `netplex.css` If you want a regular Plex theme for your Netdata setup, use the **`netplex.css`** instead.
### Screenshots
Expand
### Custom HTML for Organizr Homepage
***
# Monitorg - Monitorr
Custom [Monitorr](https://github.com/Monitorr/Monitorr) CSS for [Organizr](https://github.com/causefx/Organizr) homepage integration.
![](https://raw.githubusercontent.com/gilbN/theme.park/master/Screenshots/monitorg/1-flat.jpg)
## Custom CSS for Organizr
#### This theme will mess with your Monitorr base theme. And it will hide the settings button. Go to /monitorr/settings.php for settings.
#### It is created purely for use with Organizr.
**NOTE:** When viewing /monitorr in Organizr iframe it will follow the Organizr theme. When viewing it outside of Organizr iframe the background will be white ect.
### Screenshots
Expand
Add this in the Monitorr custom css box:
```css
@import "https://gilbn.github.io/theme.park/CSS/themes/monitorg.css";
```
And add this in custom HTML in Organizr:
```css