diff --git a/CSS/themes/plpp-plex.css b/CSS/themes/plpp-plex.css
new file mode 100644
index 00000000..57d0fd7f
--- /dev/null
+++ b/CSS/themes/plpp-plex.css
@@ -0,0 +1,121 @@
+body {
+ background-image: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"),
+ url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-light.png") !important;
+ background-repeat: repeat, no-repeat;
+ background-attachment: fixed, fixed;
+ background-position: center center, center center;
+ background-size: auto, cover;
+ -webkit-background-size: auto, cover;
+ -moz-background-size: auto, cover;
+ -o-background-size: auto, cover;
+ background-color: transparent;
+ color:hsla(0,0%,100%,.7)!important;
+ font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif !important;
+ font-size: 1.4em !important;
+}
+/* scroller */
+::-webkit-scrollbar-corner {
+ background-color: rgba(0, 0, 0, .25) !important;
+}
+::-webkit-scrollbar {
+ width: 10px !important;
+ height: 10px !important;
+ background: hsla(0,0%,100%,.08) !important;
+
+}
+::-webkit-scrollbar-thumb {
+ -webkit-border-radius: 2px !important;
+ border-radius: 2px !important;
+ background-color: rgba(0, 0, 0, .25) !important;
+}
+.navbar-inverse {
+ background-color: rgba(0, 0, 0, 0.6);
+ border-color: transparent;
+}
+.side-nav {
+ background-color: rgba(0, 0, 0, 0.15);
+}
+.navbar-inverse .navbar-nav > li > a {
+ color: hsla(0,0%,100%,.7);
+}
+.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
+ background-color: hsla(0,0%,100%,.08);
+}
+.nav > li.selected > a {
+ background-color: transparent;
+ color: #f9be03 !important;
+}
+.breadcrumb > .active {
+ text-transform: uppercase;
+ text-transform: bold;
+}
+.panel, .panel-default > .panel-heading, .breadcrumb > .active {
+ background-color: transparent;
+ border: transparent;
+ color: inherit;
+ font-size: 15px;
+ font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif !important;
+ line-height: 24px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0);
+}
+ .panel-heading {
+font-weight: bold;
+}
+.plpp_thumbs_Title:hover, .plpp_slider_Title:hover, .plpp_thumbs_Episode_Title:hover,
+.plpp_slider_Episode_Title:hover, .plpp_thumbs_Season_Title:hover, .plpp_slider_Season_Title:hover,
+.plpp_thumbs_Show_Title:hover, .plpp_slider_Show_Title:hover, .plpp_thumbs_Artist:hover, .plpp_slider_Artist:hover,
+.plpp_thumbs_Year:hover, .plpp_thumbs_Episode_No:hover, .plpp_slider_Year:hover, .plpp_slider_Episode_no:hover,
+.plpp_thumbs_Track_no:hover, .plpp_slider_Track_no:hover, .plpp_thumbs_Episode_Count:hover, .plpp_slider_Episode_Count:hover,
+.plpp_thumbs_Track_Count:hover, .plpp_slider_Track_Count:hover, .plpp_thumbs_Dimensions:hover, .plpp_slider_Dimensions:hover,
+.plpp_thumbs_Duration:hover, .plpp_slider_Duration:hover {
+text-decoration: underline;
+}
+.img-rounded {
+ border-radius: 0px;
+}
+.img-rounded:hover {
+ border-radius: 0px;
+ box-shadow: 0 0 0 2px #cc7b19;
+ background: radial-gradient(farthest-corner at 50% 50%,rgba(50,50,50,.5) 50%,#323232 100%);
+ opacity: .4;
+ transition: linear .2s;
+}
+.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
+ width: 100%;
+}
+div.modal-content > div.modal-body > div.plpp_details_container > div.plpp_details_Thumbnail, div.plpp_details_Poster > .img-rounded {
+ box-shadow: none;
+ opacity: 1;
+}
+
+div.plpp_slider {
+ margin: 2px 15px 10px 2px;
+}
+table {
+ background-color: rgba(0, 0, 0, 0.25);
+}
+table, .table {
+ color: hsla(0,0%,100%,.7);
+}
+.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
+ border-top: 1px solid rgba(255,255,255,.15);
+}
+.table > thead > tr > th {
+ vertical-align: bottom;
+ border-bottom: 2px solid rgba(255,255,255,.15);
+}
+.pagination > li > a, .pagination > li > span {
+ color: #ffffff;
+ background-color: rgba(0, 0, 0, 0.25);
+ border: transparent;
+}
+.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
+ color: #BDBDBD;
+ background-color: rgba(0, 0, 0, 0.25);
+ border: transparent;
+ cursor: not-allowed;
+}
diff --git a/CSS/themes/plpporg.css b/CSS/themes/plpporg.css
new file mode 100644
index 00000000..ac74e8e0
--- /dev/null
+++ b/CSS/themes/plpporg.css
@@ -0,0 +1,121 @@
+body { /*
+ background-image: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"),
+ url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-light.png") !important;
+ background-repeat: repeat, no-repeat;
+ background-attachment: fixed, fixed;
+ background-position: center center, center center;
+ background-size: auto, cover;
+ -webkit-background-size: auto, cover;
+ -moz-background-size: auto, cover;
+ -o-background-size: auto, cover; */
+ background-color: #1f1f1f;
+ color:hsla(0,0%,100%,.7)!important;
+ font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif !important;
+ font-size: 1.4em !important;
+}
+/* scroller */
+::-webkit-scrollbar-corner {
+ background-color: rgba(0, 0, 0, .25) !important;
+}
+::-webkit-scrollbar {
+ width: 10px !important;
+ height: 10px !important;
+ background: hsla(0,0%,100%,.08) !important;
+
+}
+::-webkit-scrollbar-thumb {
+ -webkit-border-radius: 2px !important;
+ border-radius: 2px !important;
+ background-color: rgba(0, 0, 0, .25) !important;
+}
+.navbar-inverse {
+ background-color: rgba(0, 0, 0, 0.6);
+ border-color: transparent;
+}
+.side-nav {
+ background-color: rgba(0, 0, 0, 0.25);
+}
+.navbar-inverse .navbar-nav > li > a {
+ color: hsla(0,0%,100%,.7);
+}
+.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
+ background-color: hsla(0,0%,100%,.08);
+}
+.nav > li.selected > a {
+ background-color: transparent;
+ color: #f9be03 !important;
+}
+.breadcrumb > .active {
+ text-transform: uppercase;
+ text-transform: bold;
+}
+.panel, .panel-default > .panel-heading, .breadcrumb > .active {
+ background-color: transparent;
+ border: transparent;
+ color: inherit;
+ font-size: 15px;
+ font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif !important;
+ line-height: 24px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0);
+}
+ .panel-heading {
+font-weight: bold;
+}
+.plpp_thumbs_Title:hover, .plpp_slider_Title:hover, .plpp_thumbs_Episode_Title:hover,
+.plpp_slider_Episode_Title:hover, .plpp_thumbs_Season_Title:hover, .plpp_slider_Season_Title:hover,
+.plpp_thumbs_Show_Title:hover, .plpp_slider_Show_Title:hover, .plpp_thumbs_Artist:hover, .plpp_slider_Artist:hover,
+.plpp_thumbs_Year:hover, .plpp_thumbs_Episode_No:hover, .plpp_slider_Year:hover, .plpp_slider_Episode_no:hover,
+.plpp_thumbs_Track_no:hover, .plpp_slider_Track_no:hover, .plpp_thumbs_Episode_Count:hover, .plpp_slider_Episode_Count:hover,
+.plpp_thumbs_Track_Count:hover, .plpp_slider_Track_Count:hover, .plpp_thumbs_Dimensions:hover, .plpp_slider_Dimensions:hover,
+.plpp_thumbs_Duration:hover, .plpp_slider_Duration:hover {
+text-decoration: underline;
+}
+.img-rounded {
+ border-radius: 0px;
+}
+.img-rounded:hover {
+ border-radius: 0px;
+ box-shadow: 0 0 0 2px #cc7b19;
+ background: radial-gradient(farthest-corner at 50% 50%,rgba(50,50,50,.5) 50%,#323232 100%);
+ opacity: .4;
+ transition: linear .2s;
+}
+.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
+ width: 100%;
+}
+div.modal-content > div.modal-body > div.plpp_details_container > div.plpp_details_Thumbnail, div.plpp_details_Poster > .img-rounded {
+ box-shadow: none;
+ opacity: 1;
+}
+
+div.plpp_slider {
+ margin: 2px 15px 10px 2px;
+}
+table {
+ background-color: rgba(0, 0, 0, 0.25);
+}
+table, .table {
+ color: hsla(0,0%,100%,.7);
+}
+.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
+ border-top: 1px solid rgba(255,255,255,.15);
+}
+.table > thead > tr > th {
+ vertical-align: bottom;
+ border-bottom: 2px solid rgba(255,255,255,.15);
+}
+.pagination > li > a, .pagination > li > span {
+ color: #ffffff;
+ background-color: rgba(0, 0, 0, 0.25);
+ border: transparent;
+}
+.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
+ color: #BDBDBD;
+ background-color: rgba(0, 0, 0, 0.25);
+ border: transparent;
+ cursor: not-allowed;
+}
diff --git a/README.md b/README.md
index e5250bcf..cba6afe8 100644
--- a/README.md
+++ b/README.md
@@ -15,6 +15,61 @@ A collection of themes/skins for use in conjunction with [Organizr](https://gith
[Archmonger/Blackberry-Flat](https://github.com/Archmonger/Blackberry-Flat)
+# PHP Library Presenter Dark/Plex Theme
+
+Custom [PLPP](https://github.com/Tensai75/plpp) CSS to match the [Organizr](https://github.com/causefx/Organizr) theme.
+
+
+
+#### `plpporg.css` is a dark theme that matches Organizr.
+
+#### `plpp-plex.css` is a Plex theme for PLPP
+
+## Setup
+Expand
+
+### Subfilter
+As PLPP 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;
+```
+Here is a complete example:
+```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;
+ }
+}
+```
+Expand
-
+
### Subfilter
@@ -46,8 +99,6 @@ Add this to your plex reverse proxy:
```
Here is a complete example:
```nginx
-#MONITORR CONTAINER
-
# REDIRECT HTTP TRAFFIC TO https://[domain.com]
server {
listen 80;
diff --git a/Screenshots/plpp/plpp.png b/Screenshots/plpp/plpp.png
new file mode 100644
index 00000000..ae6d515d
Binary files /dev/null and b/Screenshots/plpp/plpp.png differ