From 915d226f6548ec00238741688eef302b309d9f8c Mon Sep 17 00:00:00 2001 From: Marius Date: Fri, 10 Jul 2020 21:27:28 +0200 Subject: [PATCH] Added pihole. #54 --- CSS/themes/pihole/aquamarine.css | 24 +++ CSS/themes/pihole/dark.css | 24 +++ CSS/themes/pihole/hotline.css | 24 +++ CSS/themes/pihole/pihole-base.css | 245 ++++++++++++++++++++++++++++++ CSS/themes/pihole/plex.css | 24 +++ CSS/themes/pihole/space-gray.css | 24 +++ 6 files changed, 365 insertions(+) create mode 100644 CSS/themes/pihole/aquamarine.css create mode 100644 CSS/themes/pihole/dark.css create mode 100644 CSS/themes/pihole/hotline.css create mode 100644 CSS/themes/pihole/pihole-base.css create mode 100644 CSS/themes/pihole/plex.css create mode 100644 CSS/themes/pihole/space-gray.css diff --git a/CSS/themes/pihole/aquamarine.css b/CSS/themes/pihole/aquamarine.css new file mode 100644 index 00000000..919fff9f --- /dev/null +++ b/CSS/themes/pihole/aquamarine.css @@ -0,0 +1,24 @@ +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + +/* PI-HOLE AQUAMARINE THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/pihole/pihole-base.css); +:root { + --main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed; + --modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed; + + --button-color: #009688; + --button-color-hover: #12afa0; + --accent-color: #009688; + --accent-color-hover: #12afa0; + --link-color: #12afa0; +} \ No newline at end of file diff --git a/CSS/themes/pihole/dark.css b/CSS/themes/pihole/dark.css new file mode 100644 index 00000000..d45f2afa --- /dev/null +++ b/CSS/themes/pihole/dark.css @@ -0,0 +1,24 @@ +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + +/* PI-HOLE DARK THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/pihole/pihole-base.css); +:root { + --main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed; + --modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed; + + --button-color: hsla(0,0%,100%,.15); + --button-color-hover: hsla(0,0%,100%,.30); + --accent-color: rgba(255, 255, 255, 0.25); + --accent-color-hover: rgba(255, 255, 255, 0.45); + --queue-color: rgba(255, 255, 255, 0.45);; + } \ No newline at end of file diff --git a/CSS/themes/pihole/hotline.css b/CSS/themes/pihole/hotline.css new file mode 100644 index 00000000..aeeb2cab --- /dev/null +++ b/CSS/themes/pihole/hotline.css @@ -0,0 +1,24 @@ +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + +/* PI-HOLE HOTLINE THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/pihole/pihole-base.css); +:root { + --main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed; + --modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed; + + --button-color: hsla(0,0%,100%,.15); + --button-color-hover: hsla(0,0%,100%,.30); + --accent-color: #F44336; + --accent-color-hover: #0b3161; + --link-color: #fd534a; +} \ No newline at end of file diff --git a/CSS/themes/pihole/pihole-base.css b/CSS/themes/pihole/pihole-base.css new file mode 100644 index 00000000..ce397fd9 --- /dev/null +++ b/CSS/themes/pihole/pihole-base.css @@ -0,0 +1,245 @@ + /* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + + body { + background: var(--main-bg-color) !important; + color: #eee; + } + a { + color: var(--link-color); + } + a:hover, a:active, a:focus { + color: var(--accent-color) !important; + } + /* Donate dropdown */ + .skin-blue .main-header li.user-header { + background: var(--modal-bg-color); + } + .dropdown-menu { + box-shadow: none; + border-color: rgba(0, 0, 0, .25); + background: var(--modal-bg-color) + } + .navbar-nav>.user-menu>.dropdown-menu>.user-body { + padding: 15px; + border-bottom: 1px solid rgba(255, 255, 255, .25); + border-top: 1px solid rgba(255, 255, 255, .25); + background-color: rgba(255, 255, 255, .2) !important; + } + .navbar-nav>.user-menu>.dropdown-menu>.user-body a { + color: white !important; + } + .navbar-nav>.user-menu>.dropdown-menu>.user-footer { + background-color: transparent; + } + /* Header */ + .skin-blue .main-header .navbar, .skin-blue .main-header .logo { + background-color: rgba(0, 0, 0, .25); + } + .skin-blue .main-header .logo:hover, .skin-blue .main-header .navbar .sidebar-toggle:hover { + background-color: rgba(255, 255, 255, .05); + } + /* Footer */ + .main-footer { + background: rgba(0, 0, 0, .25); + color: #eee; + border-top: 1px solid #eee; + } + /* Side bar */ + .skin-blue .sidebar a { + color: #eee; + } + .skin-blue .sidebar a:hover { + color: white !important; + } + .skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side { + background-color: rgba(0, 0, 0, .25); + } + .skin-blue .sidebar-menu>li.header { + color: white; + background: rgba(0, 0, 0, .2); + } + /* Menus */ + .skin-blue .sidebar-menu>li:hover>a, .skin-blue .sidebar-menu>li.active>a { + color: #fff; + background: rgba(0, 0, 0, .1); + border-left-color: var(--accent-color); + } + .skin-blue .sidebar-menu>li>.treeview-menu { + background: rgba(0, 0, 0, .25); + } + .skin-blue .treeview-menu>li>a { + color: #eee; + } + /* Pages */ + /*Background*/ + .content-wrapper, .right-side { + background-color: var(--main-bg-color); + } + /* Dashboard */ + /*Total Queries box */ + .box-header { + color: white; + } + .box { + background: rgba(0, 0, 0, .24); + border-top: 3px solid #0000; + box-shadow: 0 1px 1px rgba(0,0,0,0.1); + } + .chart svg, .chart canvas, .chartjs-render-monitor, .chart-legend { + -webkit-filter: invert(100%); + filter: invert(100%); + } + #chartjs-tooltip { + filter: invert(100%); + } + .chart-legend ul { + -webkit-filter: invert(100%); + filter: invert(100%); + } + /* Total queries box*/ + .small-box.bg-green { + background-color: rgba(0, 166, 90, .45) !important; + border-top: 3px solid var(--accent-color); + } + /* Queries blocked box*/ + .small-box.bg-aqua { + background-color: rgba(0, 192, 239, .45) !important; + border-top: 3px solid var(--accent-color); + } + /* Percent blocked box */ + .small-box.bg-yellow { + background-color: rgba(243, 156, 18, .45) !important; + border-top: 3px solid var(--accent-color); + } + /*Blocklist box*/ + .small-box.bg-red { + background-color: rgba(221, 75, 57, .45) !important; + border-top: 3px solid var(--accent-color); + } + .table-bordered { + border: 1px solid #f4f4f41a !important; + background: rgba(0, 0, 0, .1); + } + .table-bordered>thead>tr>th, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>tbody>tr>td, .table-bordered>tfoot>tr>td { + border: 1px solid rgba(255, 255, 255, 0.15); + } + .table-striped>tbody>tr:nth-of-type(odd) { + background-color:rgba(255, 255, 255, .1); + } + /* Query Log */ + .text-black { + color: #eee!important; + } + .pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover { + color: rgba(238, 238, 238, .5); + background-color: rgba(255, 255, 255, .1); + border-color: #ddd0; + } + .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover { + color: #fff; + background-color: var(--button-color); + border-color: var(--button-color); + } + .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover { + color: #fff !important; + background-color: var(--button-color-hover); + border-color: var(--button-color-hover); + } + .pagination>li>a { + background: rgba(0, 0, 0, 0.25); + color: #eee; + border: 1px solid rgba(255, 255, 255, 0.07); + } + .pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover { + color: rgb(255, 255, 255) !important; + background-color: rgba(255, 255, 255, .25); + border-color: rgba(255, 255, 255, 0.07); + } + /* Login */ + .panel-default { + border-color: transparent; + background: rgba(0, 0, 0, 0.25); + } + .panel-default>.panel-heading { + color: #eee; + background-color: transparent; + border-color: rgba(255, 255, 255, .25) + } + /* Blacklist */ + .nav-tabs-custom { + background: rgba(0, 0, 0, 0.25); + } + .nav-tabs-custom>.tab-content { + background: transparent; + } + .nav-tabs-custom>.nav-tabs>li.active { + border-top-color: var(--accent-color); + } + .nav-tabs-custom>.nav-tabs>li.active>a { + border-top-color: transparent; + border-left-color: rgba(255, 255, 255, 0.1); + border-right-color: rgba(255, 255, 255, 0.1); + } + .nav-tabs-custom>.nav-tabs>li.active>a, .nav-tabs-custom>.nav-tabs>li.active:hover>a { + background-color: rgba(255, 255, 255, .15); + color: #eee !important; + } + .nav-tabs-custom>.nav-tabs>li>a { + color: #eee !important; + border-radius: 0; + } + .input-group .input-group-addon { + border-radius: 0; + border-color: #d2d6de00; + background-color: var(--accent-color); + color: #eee; + } + + /* Network */ + .table-striped>tbody>tr:nth-of-type(odd) { + background-color:rgba(0, 0, 0, .25) !important; + } + .table-striped>tbody>tr:nth-of-type(even) { + background-color:rgba(0, 0, 0, .5) !important; + } + .text-center { + text-align: center; + color: #000 !important; + } + /* Buttons */ + button,.btn-default { + background-color:var(--button-color) !important; + border:1px solid var(--button-color) !important; + color: white !important; + } + .btn-primary:hover, .btn-primary:active, .btn-primary.hover { + background-color: var(--button-color-hover) !important; + } + .btn-default:hover, .btn-default:active, .btn-default.hover { + background-color: var(--button-color-hover) !important; + } + .box.box-solid>.box-header .btn:hover, .box.box-solid>.box-header a:hover { + background: var(--button-color-hover) !important; + border: 1px solid transparent !important + } + .box.box-solid.box-info>.box-header, .box.box-solid.box-info { + color: #fff; + background: var(--button-color) !important; + border: 1px solid var(--button-color) !important; + } + /* Input */ + input,.form-control,pre,.box-footer,.datatables_processing { + background:#080909; + border:1px solid #666; + color:#b2b2b2; + } \ No newline at end of file diff --git a/CSS/themes/pihole/plex.css b/CSS/themes/pihole/plex.css new file mode 100644 index 00000000..8ba492f0 --- /dev/null +++ b/CSS/themes/pihole/plex.css @@ -0,0 +1,24 @@ +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + +/* PI-HOLE PLEX THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/pihole/pihole-base.css); +:root { + --main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed; + --modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed; + + --button-color: #cc7b19; + --button-color-hover: #e59029; + --accent-color: #e5a00d; + --accent-color-hover: #ffc107; + --link-color: #ffc107; + } \ No newline at end of file diff --git a/CSS/themes/pihole/space-gray.css b/CSS/themes/pihole/space-gray.css new file mode 100644 index 00000000..cf403582 --- /dev/null +++ b/CSS/themes/pihole/space-gray.css @@ -0,0 +1,24 @@ +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + +/* PI-HOLE SPACE GRAY THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/pihole/pihole-base.css); +:root { + --main-bg-color: radial-gradient( ellipse at center, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed; + --modal-bg-color: radial-gradient( ellipse at top, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed; + + --button-color: #607D8B; + --button-color-hover: #81a6b7; + --accent-color: #607D8B; + --accent-color-hover: #81a6b7; + --link-color: #81a6b7; +} \ No newline at end of file