Basic UI.

www/blog/index.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>

www/blog/post.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>

www/contact/index.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>

www/css/home.css

@@ -0,0 +1,8 @@
+/* Page logo in the top of the toolbar */
+div#logo{
+    width: 100%;
+    text-align: center;
+}
+div#logo img{
+    max-height: 7em;
+}

www/css/ui.css

@@ -0,0 +1,591 @@
+/**********************************
+ * Fonts used across the page     *
+ **********************************/
+
+/* Font used for inputs */
+@font-face {
+    font-family: 'Nunito'; 
+    src:  url('/fonts/Nunito-Regular.ttf'); 
+}
+
+/**********************************
+ * Styles to be applied across    *
+ * all the site for all the       *
+ * elements of it's type          *
+ **********************************/
+
+/* Styles for the body of the page */
+body{
+    background-color: #111111;
+}
+
+/* Style for all links */
+a{
+    color: #555555;
+    text-shadow: 0 0 0.5em #7777ff;
+    text-decoration: none;
+}
+
+/* Elements fith bold font */
+span.bold{
+    font-weight: bold;
+}
+
+
+
+/**********************************
+ * Toolbar style                  *
+ **********************************/
+
+/* Container for the header */
+div#header_parent{
+    width: 100%;
+    text-align: center;
+}
+
+/* The actual header */
+nav#header{
+    text-align: center;
+    height: 3.4em;
+    display: inline;
+    z-index: 300;
+    margin-left: auto;
+    margin-right: auto;
+    font-weight: bold;
+    font-size: 110%;
+}
+
+/* Dummy <span> to use as vertical separator between links */
+nav#header span.link_separator{
+    border-left: 0.077em solid rgba(200, 200, 200, .5);
+}
+
+/* All the links in the bar. Contains the text and the icon */
+nav#header a{
+    margin: auto;
+    text-decoration: none;
+    color: #cccccc;
+    text-shadow: 0 0 0.5em #000000;
+}
+
+/* Contains everithing inside each link (direct and only child of a.header_link) */
+nav#header span.header_container {
+    margin: auto;
+    text-align: center;
+    min-width: 3.125em;
+    margin-right: 0.43em;
+    margin-left: 0.43em;
+    padding-left: 0.625em;
+    padding-top: 0.375em;
+    padding-bottom: 0.375em;
+    padding-right: 2.19em;
+    display: inline-block;
+    position: relative;
+    transition: all .3s ease-in-out;
+    box-shadow: 0 0 0.063em rgba(0, 0, 0, 0);
+    border: rgba(0,0,0,0) solid 0.063em;
+    border-radius: 0.5em;
+}
+
+nav#header span.header_container:hover {
+    border: rgba(255, 255, 255, 0.5) solid 0.063em;
+    background-color: rgba(255, 255, 255, 0.2);
+}
+
+/* Contains the icon for each entry */
+nav#header span.header_icon_container{
+    border-bottom: 0.063em solid #999999;
+    padding-bottom: 0.313em;
+}
+
+/* Icon for each entry of the header */
+nav#header img.header_icon{
+    opacity: 0.1;
+    width: 1.563em;
+    height: 1.563em;
+    vertical-align: middle;
+    transition: opacity 0.4s ease-in-out;
+}
+nav#header span.header_container:hover img.header_icon{
+    opacity: 0.9;
+}
+
+
+/* A line separating the header from the rest of the page */
+hr#header_separator{
+    width: 70%;
+}
+
+
+
+/**********************************
+ * Footer style                   *
+ **********************************/
+
+/* The actual footer */
+div#footer{
+    display: inline-block;
+    font-size: 80%;
+    text-align: center;
+    height: 3.438em;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 3.125em;
+    margin-bottom: 3.125em;
+    color: #dddddd;
+}
+
+/* A table containing all the elements in the footer */
+div#footer table#footer_table{
+    margin-left: auto;
+    margin-right: auto;
+    width: 80%;
+    table-layout: fixed;
+}
+
+/* An horizontal line separating the page contents from the footer */
+div#footer hr#footer_separator{
+/*  margin-top: 3.125em; */
+    border: 0;
+    background-color: #444444;
+    height: 0.1em;
+    width: 70%;
+}
+
+/* Left area of the footer */
+div#footer td#footer_left{
+    width: 33%;
+    text-align: left;
+}
+
+/* Middle area of the footer */
+div#footer td#footer_center{
+    width: 33%;
+    text-align: center;
+}
+
+/* Right area of the footer */
+div#footer td#footer_right{
+    width: 33%;
+    text-align: right;
+}
+
+/* Icons for social media */
+div#footer img.footer_social_icon{
+    width: 1.875em;
+    vertical-align: middle;
+}
+
+div#footer a.lang img{
+    height: 1em;
+    margin: 0.5em;
+    border-radius: 0.2em;
+    border: 0.15em solid #555555;
+    cursor: pointer;
+    box-shadow: 0 0 0.7em #dde;
+    transition: all .3s ease-in-out;
+}
+
+div#footer a.lang img:hover{
+    box-shadow: 0 0 1em #111;
+}
+
+
+
+
+/**********************************
+ * Styles for the elements that   *
+ * compose the basic strucure of  *
+ * the site.                      *
+ **********************************/
+
+/* The content is everything between the header and the footer */
+div#content{
+    position: relative;
+    width: 100%;
+    height: 100%;
+    margin-bottom: 1.875em;
+}
+
+/* .lighted is a style-only class to make contrast against the dark background */
+.lighted{
+    background-color: #898989;
+    border: 0.063em solid #77777;
+    border-radius: 0.15em;
+  padding: 0.5em;
+    box-shadow: 0 0 0.75em #888888;
+}
+
+/* Style only class. Is the title of a .lighted element */
+.section_title{
+    font-size: 150%;
+    margin: 0.625em 0 0.438em 0.625em;
+    text-shadow: 0 0 0.75em #dddddd;
+}
+
+/* Style for the mathces in search results */
+span.result_counter{
+    margin-left: 1.2em;
+    margin-bottom: 0.5em;
+    font-weight: bold;
+    font-style: italic;
+}
+
+/* .entry is a style only class to show content. Must be allways children os a .lighted element */
+.entry{
+    transition: all .3s ease-in-out;
+    margin: 1% 0.438em 0 0.438em;
+    background-color: #cccccc;
+    border: 0.143em solid #555555;
+    border-radius: 0.314em;
+    padding: 0.5em;
+    box-shadow: 0 0 0.5em #333333;
+}
+
+.entry:hover{
+    background-color: #eeeeee;
+}
+
+/* Shown when no records on database */
+div.unavailable{
+    margin-left: 4em;
+    font-style: italic;
+}
+
+
+/**********************************
+ * Styles to be applied to some   *
+ * horizontally scrollable        *
+ * elements                       *
+ **********************************/
+
+/* Horizontall scrollbar that apears when a project has lots of renders */
+.slider::-webkit-scrollbar{
+    width: 0.5em;
+    height: 0.25em;
+    background-color: #444444;
+} 
+.slider::-webkit-scrollbar-thumb{
+    background-color: #cccccc;
+    border-radius: 0.714em;
+}
+.slider::-webkit-scrollbar-thumb:hover{
+    background-color: #cccccc;
+    border: 0.143em solid #000000;
+}
+.slider::-webkit-scrollbar-thumb:active{
+    background-color: #cccccc;
+    border: 0.143em solid #000000;
+}
+
+/* Icons for sharing page in a social network */
+img.social_icon{
+    width: 4.286em;
+    height: 4.286em;
+}
+
+/* Elements that should have the cursor as pointer */
+.pointer{
+    cursor: pointer;
+}
+
+
+
+/**********************************
+ * Styles for diverse input       *
+ * elements. Type-assigned        *
+ **********************************/
+
+/* Font for all the input elements */
+input{
+    font-family: 'Nunito';
+}
+
+/* Style for the "submit" type elements in forms */
+input[type=submit]{
+    font-weight: bold;
+    color: #cccccc;
+    background-color: #555555;
+    border: 0.143em solid #bbbbbb;
+    border-radius: 0.429em;
+    padding: 0.5em;
+    text-shadow: 0 0 0.75em #000000;
+    cursor: pointer;
+}
+
+/* Style forr buttons */
+input[type=button]{
+    font-weight: bold;
+    color: #cccccc;
+    background-color: #555555;
+    border: 0.143em solid #bbbbbb;
+    border-radius: 0.429em;
+    padding: 0.5em;
+    text-shadow: 0 0 0.75em #000000;
+    cursor: pointer;
+}
+
+/* Style for textboxes */
+input[type=text]{
+    font-weight: bold;
+    color: #444444;
+    background-color: #bbbbbb;
+  border: 0.286em solid #dddddd; 
+    border-color: #dddddd;
+    border-radius: 0.429em;
+    padding: 0.25em;
+    text-shadow: 0 0 0.5em #ffffff;
+}
+
+/* Style for textareas */
+textarea{
+    width: 80%;
+    font-weight: bold;
+    color: #444444;
+    background-color: #bbbbbb;
+  border: 0.286em solid #dddddd; 
+    border-color: #dddddd;
+    border-radius: 0.286em;
+    padding: 0.25em;
+    text-shadow: 0 0 0.5em #ffffff;
+    resize: none;
+}
+
+/* Style for selects */
+select{
+    font-weight: bold;
+    color: #444444;
+    background-color: #bbbbbb;
+  border: 0.286em solid #dddddd; 
+    border-radius: 0.286em;
+    padding: 0.25em;
+    text-shadow: 0 0 0.5em #ffffff;
+}
+
+/* Style for placeholders in input fields */
+::-webkit-input-placeholder { /* WebKit browsers */
+    color: #777777;
+}
+:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
+    color: #777777;
+}
+::-moz-placeholder { /* Mozilla Firefox 19+ */
+    color: #777777;
+}
+:-ms-input-placeholder { /* Internet Explorer 10+ */
+    color: #777777;
+}
+
+/* Style-only class user to indicate that a field is incorrect. Ususally this class is added to an element with js */
+.error{
+    border-color: #ffaaaa;
+}
+
+/* Style for the textbox input when the entered text is not the expected one */
+input[type=text].error{
+    border-color: #ffaaaa;
+}
+
+/* Style for the textared input when the entered text is not the expected one */
+textarea.error{
+    border-color: #ffaaaa;
+}
+
+/* Style for buttons that act as links */
+a.a_button{
+    display: inline-block;
+    color: #cccccc;
+    background-color: #555555;
+    border: 0.143em solid #bbbbbb;
+    border-radius: 0.429em;
+    padding: 0.5em;
+    text-shadow: 0 0 0.75em #000000;
+    text-decoration: none;
+    font: -webkit-small-control;
+    font-family: 'Nunito';
+    font-weight: bold;
+}
+
+/**********************************
+ * Styles for comment-related     *
+ * elements                       *
+ **********************************/
+
+/* Contains fields to identify the user before the comment can be posted. Hidden by css, must be displayed with js */
+div#identification_form{
+    display: none;
+}
+
+/* Contain a comment, with the details and the text */
+div.comment{
+    background-color: #cccccc;
+    border: 0.143em solid #777777;
+    border-radius: 0.314em;
+    padding: 0.5em;
+    margin: 0.714em 0.625em 0.714em 0.625em;
+    box-shadow: 0 0 0.750em #444444;
+}
+
+/* User who posted the coment */
+h4.comment_user{
+    margin-top: 0.417em;
+    margin-bottom: 0;
+}
+
+/* Style for the comment's images */
+img.comment_image{
+    border: 0.077em solid black;
+    max-height: 6em;
+    max-width: 60%;
+  display: block;
+    vertical-align: top;
+    border: 0.133em solid black;
+    margin-left: 0.938em;
+    margin-bottom: 0.938em;
+    box-shadow: 0 0 1em #444444;
+}
+
+/* Paragraph with the comment text */
+p.comment_text{
+    vertical-align: top;
+    width: auto;
+    display: block;
+    margin-top: 0.938em;
+    margin-left: 0.938em;
+}
+
+span.comment_date{
+    font-size: 80%;
+    font-style: italic;
+}
+
+/* Input field for the comment text */
+textarea#new_comment_text{
+    width: 98%;
+}
+
+/* Input field for the comment user */
+input#new_comment_user{
+    width: 47%;
+}
+
+/* Input field for the comment email */
+input#new_comment_email{
+    width: 47%;
+}
+
+/* Styles so the input field to upload an image with the comment looks like a button */
+label.image_upload {
+    font-weight: bold;
+    color: #cccccc;
+    background-color: #555555;
+    border: 0.067em solid #bbbbbb;
+    border-radius: 0.2em;
+    padding: 0.5em;
+    text-shadow: 0 0 0.750em #000000;
+    font-size: 0.813em; /*Same as buttons*/
+    font-family: 'Nunito';
+}
+
+label.image_upload input {
+    width: 0 !important;
+    opacity: 0 !important;
+    overflow: hidden !important;
+}
+
+/* Previsualization for the upload image in a comment */
+img#new_comment_image_preview{
+    max-height: 7.692em;
+    max-width: 11.538em;
+}
+
+
+
+/**********************************
+ * Styles for the pager, present  *
+ * in blog, tutorials, etc        *
+ **********************************/
+
+/* A table containing the pager */
+table#pager{
+    margin-left: auto;
+    margin-right: auto;
+    border-spacing: 0.625em
+}
+
+/* Each cell in the pager */
+table#pager td{
+    font-weight: bold;
+    color: #cccccc;
+    background-color: #bbbbbb;
+    border: 0.077em solid #666666;
+    border-radius: 0.231em;
+    padding: 0.5em 0.625em 0.5em 0.625em;
+    text-shadow: 0 0 0.75em #000000;
+}
+
+/* The current page */
+table#pager td.pager_current{
+    background-color: #666666;
+    border: 0.077em solid #444444;
+}
+
+/* Dummy <td> that contains "..." */
+table#pager td.pager_ellipse{
+    background-color: initial;
+    border: initial;
+}
+
+
+
+/**********************************
+ * Styles for social sharing icon *
+ **********************************/
+
+/* Icons for social media */
+img.share_icon{
+    width: 1.875em;
+    vertical-align: middle;
+}
+
+
+
+/**********************************
+ * Styles for downloads           *
+ **********************************/
+
+/* Dummy span for download count */
+span#span_download{
+    display: none;
+}
+
+/* Hidden <div> to confirm downloading */
+div.license{
+    box-shadow: 0 0 1.2em rgba(120, 120, 120, 1);
+    display: none;
+    position: fixed;
+    top: 30%;
+    left: 25%;
+    width: 40%;
+    opacity: 0;
+    z-index: 1001;
+    padding: 0.625em;
+    background-color: #333333;
+    border: 0.150em solid #111111;
+    border-radius: 1.250em;
+}
+
+/* <div> to dimm the screen */
+#screen_cover{
+    position: fixed;
+    top: 0;
+    left: 0;
+    background-color: black;
+    display: none;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    transition: all .9s ease-in-out;
+    z-index: 1000;
+}
+

www/cv/index.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>

www/fonts/OFL.txt

@@ -0,0 +1,93 @@
+Copyright (c) 2011, Vernon Adams (vern@newtypography.co.uk),
+with Reserved Font Name Nunito.
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

www/footer.php

@@ -0,0 +1,24 @@
+<div id='footer'>
+    <hr id='footer_separator'/><br/>
+    <table id='footer_table'>
+        <tr>
+            <td id='footer_left'>
+                <span id='footer_follow' class='desktop'>TR#Follow me</span>
+                <a title='Github' href='https://www.github.com/u/Seavenois'><img class='footer_social_icon' src='<?=$server?>/img/social/github.gif' alt='Github'/></a>
+                <a title='Facebook' href='https://www.facebook.com/ivalentin'><img class='footer_social_icon' src='<?=$server?>/img/social/facebook.gif' alt='Facebook'/></a>
+                <a title='Google+' href='https://plus.google.com/108048773942421710294/'><img class='footer_social_icon' src='<?=$server?>/img/social/googleplus.gif' alt='Google+'/></a>
+                <a title='RSS' href='<?=$server?>/feed/'><img class='footer_social_icon' src='<?=$server?>/img/social/rss.gif' alt='RSS'/></a>
+            </td>
+            <td id='footer_center'> Copyright I&ntilde;igo Valentin 2014 - 2017</td>
+            <td id='footer_right' class='desktop'>
+                <a href='<?=$server?>/help/'>TR#Help</a>&nbsp;&nbsp;&nbsp;<a href='<?=$server?>/help/#cookies'>TR#Cookie police</a>
+                <br/><br/>
+                <!-- TODO Use DB -->
+                <!-- <a class='lang' href='#'><img src='<?=$server?>/img/lang/' /></a> -->
+                <a class='lang' href='#'><img src='<?=$server?>/img/lang/es.gif' alt='Castellano' /></a>
+                <a class='lang' href='#'><img src='<?=$server?>/img/lang/en.gif' alt='English' /></a>
+                <a class='lang' href='#'><img src='<?=$server?>/img/lang/eu.gif' alt='Euskara' /></a>
+            </td>
+        </tr>
+    </table>
+</div>

www/functions.php

@@ -302,7 +302,7 @@
      *    section: (string): Site section being visited. *
      *    id: (int): ID of the entri being visited       *
      *****************************************************/
-    function stats($section, $id){
+    function stats($con, $section, $id){
 
         // Get client data
         $ip = get_ip();
@@ -368,7 +368,6 @@
         }
 
         //Look for a visit with the same IP in the last 30 mins.
-        $con = startdb("rw");
         $q = mysqli_query($con, "SELECT stat_visit.id AS visitid FROM stat_view, stat_visit WHERE visit = stat_visit.id AND dtime > DATE_SUB(now(), INTERVAL 30 MINUTE) AND ip = '$ip' AND uagent = '$uagent';");
         if (mysqli_num_rows($q) == 0){
             mysqli_query($con, "INSERT INTO stat_visit (ip, uagent, os, browser) VALUES ('$ip', '$uagent', '$os', '$browser');");

www/header.php

@@ -0,0 +1,32 @@
+<div id="header_parent">
+    <nav id="header">
+        <a href="<?=$server?>/">
+            <span class="header_container">
+                <span class="header_icon_container"><img class="header_icon" alt="TR#Home" src="<?=$server?>/img/icon/home.gif"/></span>
+                TR#Home
+            </span>
+        </a>
+        <span class="link_separator desktop"></span>
+        <a href="<?=$server?>/me/">
+            <span class="header_container">
+                <span class="header_icon_container"><img class="header_icon" alt="TR#Me" src="<?=$server?>/img/icon/me.gif"/></span>
+                TR#Me
+            </span>
+        </a>
+        <span class="link_separator desktop"></span>
+        <a href="<?=$server?>/projects/">
+            <span class="header_container">
+                <span class="header_icon_container"><img class="header_icon" alt="TR#Projects" src="<?=$server?>/img/icon/projects.gif"/></span>
+                TR#Projects
+            </span>
+        </a>
+        <span class="link_separator desktop"></span>
+        <a href="<?=$server?>/blog/">
+            <span class="header_container">
+                <span class="header_icon_container"><img class="header_icon" alt="TR#Blog" src="<?=$server?>/img/icon/blog.gif"/></span>
+                TR#Blog
+            </span>
+        </a>
+    </nav>
+</div>
+<hr id="header_separator"/>

www/help/index.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>

www/index.php

@@ -1,71 +1,79 @@
 <?php
     session_start();
-    $http_host = $_SERVER["HTTP_HOST"];
-    $doc_root = $_SERVER["DOCUMENT_ROOT"]; 
-    include $doc_root . "functions.php";
+    $http_host = $_SERVER['HTTP_HOST'];
+    $doc_root = $_SERVER['DOCUMENT_ROOT']; 
+    include $doc_root . 'functions.php';
     $proto = get_protocol();
     $con = start_db();
     $server = $proto . $http_host;
+
+    //Language
     $lang = select_language();
-    $cur_section = "";
-    $cur_entry = "";
+
+    $cur_section = '';
+    $cur_entry = '';
 ?>
 <!DOCTYPE html>
 <html>
     <head>
-        <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
-        <meta charset="utf-8"/>
-        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1"/>
+        <meta content='text/html; charset=utf-8' http-equiv='content-type'/>
+        <meta charset='utf-8'/>
+        <meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1'/>
         <title>I&ntilde;igo Valentin</title>
-        <link rel="shortcut icon" href="<?=$server?>/img/logo/favicon.ico"/>
+        <link rel='shortcut icon' href='<?=$server?>/img/logo/favicon.ico'/>
         <!-- CSS files -->
         <style>
 <?php
-            include $doc_root . "css/ui.css";
+            include $doc_root . 'css/ui.css';
+            include $doc_root . 'css/home.css';
 ?>
         </style>
         <!-- CSS for mobile version -->
-        <style media="(max-width : 990px)">
+        <style media='(max-width : 990px)'>
 <?php
-            include $doc_root . "css/m/ui.css";
+            include $doc_root . 'css/m/ui.css';
+            include $doc_root . 'css/m/home.css';
 ?>
         </style>
         <!-- Script files -->
-        <script type="text/javascript">
+        <script type='text/javascript'>
 <?php
-            include $doc_root . "script/ui.js";
+            include $doc_root . 'script/ui.js';
 ?>
         </script>
         <!-- Meta tags -->
-        <link rel="canonical" href="<?=$server?>"/>
-        <link rel="author" href="<?=$server?>"/>
-        <link rel="publisher" href="<?=$server?>"/>
-        <meta name="description" content=""/>
-        <meta property="og:title" content="I&ntilde;igo Valentin"/>
-        <meta property="og:url" content="<?=$server?>"/>
-        <meta property="og:description" content=""/>
-        <meta property="og:image" content=""/>
-        <meta property="og:site_name" content="I&ntilde;igo Valentin"/>
-        <meta property="og:type" content="website"/>
-        <meta property="og:locale" content="<?=$lang?>"/>
-        <meta name="twitter:card" content="summary"/>
-        <meta name="twitter:title" content="I&ntilde;igo Valentin"/>
-        <meta name="twitter:description" content=""/>
-        <meta name="twitter:image" content=""/>
-        <meta name="twitter:url" content="<?=$server?>"/>
-        <meta name="robots" content="index follow"/>
+        <link rel='canonical' href='<?=$server?>'/>
+        <link rel='author' href='<?=$server?>'/>
+        <link rel='publisher' href='<?=$server?>'/>
+        <meta name='description' content=''/>
+        <meta property='og:title' content='I&ntilde;igo Valentin'/>
+        <meta property='og:url' content='<?=$server?>'/>
+        <meta property='og:description' content=''/>
+        <meta property='og:image' content=''/>
+        <meta property='og:site_name' content='I&ntilde;igo Valentin'/>
+        <meta property='og:type' content='website'/>
+        <meta property='og:locale' content='<?=$lang?>'/>
+        <meta name='twitter:card' content='summary'/>
+        <meta name='twitter:title' content='I&ntilde;igo Valentin'/>
+        <meta name='twitter:description' content=''/>
+        <meta name='twitter:image' content=''/>
+        <meta name='twitter:url' content='<?=$server?>'/>
+        <meta name='robots' content='index follow'/>
     </head>
     <body>
+        <div id='logo'>
+            <img id='logo' src='<?=$server?>/img/logo/inigovalentin.png' alt='I&ntilde;igo Valentin'/>
+        </div>
 <?php
-        include $doc_root . "header.php";
+        include $doc_root . 'header.php';
 ?>
-        <div id="content">
+        <div id='content'>
 
         </div> <!-- #content -->
 <?php
 
         //Footer
-        include $doc_root . "footer.php";
+        include $doc_root . 'footer.php';
         stats($cur_section, $cur_entry);
 ?>
     </body>

www/project/index.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>

www/project/project.php

@@ -66,7 +66,7 @@
 
         //Footer
         include $doc_root . "footer.php";
-        stats($cur_section, $cur_entry);
+        stats($con, $cur_section, $cur_entry);
 ?>
     </body>
 </html>