v 1.3.5 - Christmas theme! 🎄

config/config.template.php

@@ -21,6 +21,7 @@ $config["general"]["subtitle"]      = " - Best TeamSpeak server!";
 $config["general"]["desc"]          = "Polski serwer TeamSpeak! Zapraszamy :)";     // Website description - displayed in Google search engine
 $config["general"]["newsDir"]       = "config/news";                                // News folder (relative to project folder)
 $config["general"]["timezone"]      = "Europe/Warsaw";                              // Your timezone - http://php.net/manual/en/timezones.php
+$config["general"]["christmasmode"] = true;                                         // Set to false to permanently disable christmas mode activated in December
 
 $config["general"]["enablehta"]     = false; // Enable / Disable additional website features (recommended, but
                                              // you need to have up-to-date version of Apache and install mod_rewrite)

css/christmas-theme.css

@@ -0,0 +1,148 @@
+/*!
+ * Christmas theme for ts-website
+ * https://github.com/Wruczek/ts-website
+ * (c) Wruczek 2016
+ * The MIT License
+*/
+
+body {
+    background-image: url(../img/christmas-bg.jpg);
+}
+
+.panel {
+    background-color: #410b13;
+}
+
+.table-hover > tbody > tr:hover {
+    background-color: #b41320
+}
+
+.table > thead > tr > td.active,
+.table > tbody > tr > td.active,
+.table > tfoot > tr > td.active,
+.table > thead > tr > th.active,
+.table > tbody > tr > th.active,
+.table > tfoot > tr > th.active,
+.table > thead > tr.active > td,
+.table > tbody > tr.active > td,
+.table > tfoot > tr.active > td,
+.table > thead > tr.active > th,
+.table > tbody > tr.active > th,
+.table > tfoot > tr.active > th {
+    background-color: #a51321
+}
+
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+    background-color: #a51321
+}
+
+.navbar-default .navbar-nav > .active > a,
+.navbar-default .navbar-nav > .active > a:hover,
+.navbar-default .navbar-nav > .active > a:focus {
+    background-color: #a51321
+}
+
+@media (max-width: 767px) {
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+        background-color: #a51321
+    }
+
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+        background-color: #a51321
+    }
+}
+
+.pagination > li > a:hover,
+.pagination > li > span:hover,
+.pagination > li > a:focus,
+.pagination > li > span:focus {
+    background-color: #a51321;
+}
+
+.pager li > a:hover,
+.pager li > a:focus {
+    background-color: #a51321
+}
+
+a.list-group-item:hover,
+button.list-group-item:hover,
+a.list-group-item:focus,
+button.list-group-item:focus {
+    background-color: #a51321
+}
+
+.panel-footer {
+    background-color: #a51321;
+}
+
+.popover-title {
+    background-color: #a51321;
+}
+
+.btn-default:hover {
+    background-color: #a51321
+}
+
+.panel-default > .panel-heading {
+    background-color: #a51321;
+}
+
+.modal-header,
+.modal-footer {
+    background-color: #a51321
+}
+
+.table-bordered {
+    border-color: #871522;
+}
+
+.table > thead > tr > th {
+    background-color: #871522;
+    border-color: #871522;
+}
+
+.table-striped > tbody > tr:nth-of-type(odd) {
+    background-color: #871522;
+}
+
+.navbar-default {
+    background-color: #b91524 !important;
+}
+
+.navbar-default .navbar-nav > li > a:hover,
+.navbar-default .navbar-nav > li > a:focus {
+    background-color: #9b131f
+}
+
+.navbar-default .navbar-nav > .active > a,
+.navbar-default .navbar-nav > .active > a:hover,
+.navbar-default .navbar-nav > .active > a:focus {
+    background-color: #9b131f
+}
+
+.dropdown-menu {
+    background-color: #410b13;
+}
+
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .open > a:hover,
+.navbar-default .navbar-nav > .open > a:focus {
+    background-color: #9b131f;
+}
+
+@media (max-width: 767px) {
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+        background-color: #9b131f
+    }
+
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+        background-color: #9b131f
+    }
+}

css/theme.css

@@ -5,7 +5,9 @@
 */
 
 body {
-    background: url(../img/bg.png) no-repeat center center fixed;
+    background: no-repeat fixed center;
+    background-image: url(../img/bg.png);
+
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;

include/footer.php

@@ -12,12 +12,12 @@
                 <ul class="list-inline">
                     <li> <!-- Please respect the amount of work we've put for free into this project and leave the authors in the footer. Thank you. -->
                         <p>
-                            <a href="https://github.com/Wruczek/ts-website">ts-website</a> v 1.3.4 &mdash; &copy; <a href="http://wruczek.top">Wruczek</a> 2016
+                            <a href="https://github.com/Wruczek/ts-website">ts-website</a> v 1.3.5 &mdash; &copy; <a href="http://wruczek.top">Wruczek</a> 2016
                         </p>
 
                         <p>
                             <?php tl($lang["footer"]["css"]); ?> <a href="https://flamespersecond.de">NothingTV</a>, <?php tl($lang["footer"]["background"]); ?> &copy;
-                            <a href="https://twitter.com/MrSanman98">NabulsiGraphix</a>
+                            <span id="background-artist"><a href="https://twitter.com/MrSanman98">NabulsiGraphix</a></span>
                         </p>
                     </li>
                 </ul>

include/header.php

@@ -41,6 +41,10 @@ $htalink = $config["general"]["enablehta"] ? "" : ".php";
     <link href="css/navbar.css" rel="stylesheet">
     <link href="css/style.css" rel="stylesheet">
 
+    <?php if(!empty($config["general"]["christmasmode"])) { ?>
+    <script src="js/christmas.js"></script>
+    <?php } ?>
+
     <script src="api/i18n.php"></script>
 
     <!--[if IE]>

include/modulecheck.php

@@ -90,7 +90,7 @@ function showError($title, $text) { ?>
             <?php echo $text; ?>
         </div>
         <div class="panel-footer">
-            &copy; <a href="http://wruczek.top">Wruczek</a> 2016 | <a href="https://github.com/Wruczek/ts-website">ts-website</a> v 1.3.4 | MIT License
+            &copy; <a href="http://wruczek.top">Wruczek</a> 2016 | <a href="https://github.com/Wruczek/ts-website">ts-website</a> v 1.3.5 | MIT License
         </div>
     </div>
 

js/christmas.js

@@ -0,0 +1,34 @@
+// Remember: This file is loaded before jQuery!
+
+// Check if the current month on user device is December...
+if (new Date().getMonth() === 11) {
+    // Enable the christmas functions! Happy holidays from Wruczek! :D
+
+    // Load and enable the christmas theme
+    var stylesheet = document.createElement('link');
+    stylesheet.href = 'css/christmas-theme.css';
+    stylesheet.rel = 'stylesheet';
+    document.head.appendChild(stylesheet);
+
+    // Load and enable the snow
+    var script = document.createElement('script');
+    script.src = 'https://cdnjs.cloudflare.com/ajax/libs/JQuery-Snowfall/1.7.4/snowfall.jquery.min.js';
+    document.head.appendChild(script);
+
+    // Wait for the snowfall script and jQuery to load
+    window.addEventListener('load', function () {
+        $(document).snowfall({
+            flakeCount: 500,
+            flakeIndex: -1,
+            minSize: 4,
+            maxSize: 5,
+            minSpeed: 1,
+            maxSpeed: 2,
+            round: true,
+            shadow: true
+        });
+
+        // Change background artist in the footer
+        $('#background-artist').html('<a href="http://www.publicdomainpictures.net/view-image.php?image=28562&picture=christmas-bulbs-red-background">Debi Geroux - Public Domain</a>');
+    });
+}

js/script.js

@@ -1,10 +1,17 @@
-$(function () {
-    $('[data-toggle="tooltip"]').tooltip({"html": true})
-})
+$(document).ready(function () {
+    "use strict";
+
+    // Bootstrap tooltips initialization
+    $('[data-toggle="tooltip"]').tooltip({
+        "html": true
+    });
+
+    // Add "Show more" button to news panels
+    $('.news-body').readmore({
+        speed: 500,
+        collapsedHeight: 300,
+        moreLink: '<button type="button" class="btn btn-dark"><i class="fa fa-plus-circle" aria-hidden="true"></i> ' + textShowMore + '</button>',
+        lessLink: '<button type="button" class="btn btn-dark"><i class="fa fa-minus-circle" aria-hidden="true"></i> ' + textShowLess + '</button>'
+    });
 
-$('.news-body').readmore({
-    speed: 500,
-    collapsedHeight: 300,
-    moreLink: '<button type="button" class="btn btn-dark"><i class="fa fa-plus-circle" aria-hidden="true"></i> ' + textShowMore + '</button>',
-    lessLink: '<button type="button" class="btn btn-dark"><i class="fa fa-minus-circle" aria-hidden="true"></i> ' + textShowLess + '</button>'
 });