Write color mapping for board

Signed-off-by: falkTX <falktx@falktx.com>

Board.php

@@ -1,11 +1,49 @@
 <?php
 $PAGE_TITLE    = "KXStudio : Board";
-$PAGE_TYPE     = "KXSTUDIO";
+$PAGE_TYPE     = "BOARD";
 $PAGE_SOURCE_1 = ARRAY("/Board");
 $PAGE_SOURCE_2 = ARRAY("Board");
 include_once("includes/header.php");
 ?>
 
+<div id="board-colors">
+    <p>
+        <b>Color mapping:</b>
+    </p>
+    <ul>
+        <li class="board-color">
+            <div style="background-color:rgba(255, 187, 187, 0.9);border:1px solid rgba(255, 151, 151, 0.2);">
+            </div>
+            <span>Bug fixing</span>
+        </li>
+        <li class="board-color">
+            <div style="background-color:rgb(255,172,98);border:1px solid rgb(255,172,98);">
+            </div>
+            <span>Write up / Releases</span>
+        </li>
+        <li class="board-color">
+            <div style="background-color:rgba(245, 247, 196, 0.9);border:1px solid rgba(223, 227, 45, 0.2);">
+            </div>
+            <span>Packaging</span>
+        </li>
+        <li class="board-color">
+            <div style="background-color:rgba(189, 244, 203, 0.9);border:1px solid rgba(74, 227, 113, 0.2);">
+            </div>
+            <span>Easy or quick tasks</span>
+        </li>
+        <li class="board-color">
+            <div style="background-color:rgba(219, 235, 255, 0.9);border:1px solid rgba(168, 207, 255, 0.2);">
+            </div>
+            <span>Regular tasks</span>
+        </li>
+        <li class="board-color">
+            <div style="background-color:rgba(223, 176, 255, 0.9);border:1px solid rgba(205, 133, 254, 0.2);">
+            </div>
+            <span>New projects / long tasks</span>
+        </li>
+    </ul>
+</div>
+
 <script type="text/javascript">
 function resizeIframe() {
     var board = document.getElementById("iframe-board");

includes/header.php

@@ -56,7 +56,48 @@ function isMobile() {
     <link rel="stylesheet" href="<?php echo $ROOT; ?>/css/style.css" type="text/css" media="screen" />
     <link rel="icon" type="image/png" href="<?php echo $ROOT; ?>/images/ico_kxstudio.png" />
     <link rel="shortcut icon" href="<?php echo $ROOT; ?>/favicon.ico" />
-<?php if ($PAGE_TYPE == "DONATIONS") { ?>
+<?php if ($PAGE_TYPE == "BOARD") { ?>
+    <!-- Special Board CSS -->
+    <style type="text/css">
+        .omega {
+            position: relative;
+        }
+        #board-colors {
+            float: right;
+            display: flex;
+            flex-direction: row;
+            position: absolute;
+            top: 0px;
+            right: 0px;
+        }
+        #board-colors p,
+        #board-colors ul {
+            line-height: 100%;
+            margin: 0;
+            padding: 0;
+        }
+        #board-colors p,
+        #board-colors span {
+            margin: auto;
+        }
+        #board-colors ul {
+            display: inline-flex;
+            list-style: none inside;
+            margin-right: 8px;
+            overflow: hidden;
+        }
+        #board-colors li {
+            display: inline-flex;
+            margin: 0px 4px;
+        }
+        .board-color > div {
+            display: inline-block;
+            width: 16px;
+            height: 16px;
+            margin: 4px;
+        }
+    </style>
+<?php } else if ($PAGE_TYPE == "DONATIONS") { ?>
     <style type="text/css">
         html > body .liberapay-btn {
             background-color: #f6c915;
@@ -282,7 +323,7 @@ function isMobile() {
             <div class="box-header header-tabs">
                 <ul>
                     <li><a href="#Top">Top</a></li>
-<?php if ($PAGE_TYPE == "APPLICATION") { ?>
+<?php /*  */ if ($PAGE_TYPE == "APPLICATION") { ?>
                     <li><a href="#Interface">Interface</a></li>
                     <li><a href="#Usage">Usage</a></li>
                     <li><a href="#Download">Download</a></li>
@@ -305,7 +346,7 @@ function isMobile() {
             <div id="contentSub"></div>
             <!-- End: Box header -->
             <div class="alpha omega paste_canvas_area">
-<?php if ($PAGE_TYPE == "HOME") { ?>
+<?php /*  */ if ($PAGE_TYPE == "HOME") { ?>
                 <h1><span class="mw-headline"> About KXStudio </span></h1>
 <?php } else if ($PAGE_TYPE == "NEWS") { ?>
                 <div style="float: right; padding-right: 16px;">