Start working on a custom theme

design/publicfooter.php

@@ -3,7 +3,7 @@
   </table>
 </div>
 <div id="foot">
-  <span><a href="#"><?=SITE_NAME?></a> | <a href="https://git.oppaiti.me/Oppaitime/Gazelle">Project Gazelle</a></span>
+  <span><a href="https://git.oppaiti.me/Oppaitime/Gazelle">Project Gazelle</a></span>
 </div>
 </body>
 </html>

sections/rules/jump.php

@@ -70,49 +70,6 @@
         These rules govern what tags can and cannot be added.
       </td>
     </tr>
-    <tr class="colhead">
-      <td colspan="2">Other languages (Please note, these are community-maintained and are subject to error.)</td>
-    </tr>
-    <tr class="row">
-      <td class="nobr">
-        <a href="wiki.php?action=article&name=Spanish+Golden+Rules">Spanish</a>
-      </td>
-      <td class="nobr">
-        Reglas de Oro
-      </td>
-    </tr>
-    <tr class="row">
-      <td class="nobr">
-        <a href="wiki.php?action=article&name=Finnish+Golden+Rules">Finnish</a>
-      </td>
-      <td class="nobr">
-        Säännöt suomeksi
-      </td>
-    </tr>
-    <tr class="row">
-      <td class="nobr">
-        <a href="wiki.php?action=article&name=German+Golden+Rules">Deutsch</a>
-      </td>
-      <td class="nobr">
-        Die Regeln auf Deutsch
-      </td>
-    </tr>
-    <tr class="row">
-      <td class="nobr">
-        <a href="wiki.php?action=article&name=Swedish+Golden+Rules">Svensk</a>
-      </td>
-      <td class="nobr">
-        Svenska Regler
-      </td>
-    </tr>
-    <tr class="row">
-      <td class="nobr">
-        <a href="wiki.php?action=article&name=French+Golden+Rules">Français</a>
-      </td>
-      <td class="nobr">
-        Les règles d'or
-      </td>
-    </tr>
   </table>
 </div>
 <!-- END Other Sections -->

sections/rules/upload.php

@@ -164,7 +164,7 @@ View::show_header('Uploading Rules', 'rules');
           "10 GiB or 10,000 files."
           Compression is required if your torrent is > 10 GiB or if it contains > 10,000 files.
           Otherwise, please compress text files if it reduces the torrent size by > 30%.
-          Never compress torrents < 2 GiB or binary files < 10 GiB. Multipart archives are only allowed for torrents> 10
+          Never compress torrents < 2 GiB or binary files < 10 GiB. Multipart archives are only allowed for torrents > 10
             GiB.
         </li>
 

static/styles/oppai.2020-01-14/images/logo-back2.png

@@ -0,0 +1 @@
+/var/www/static/styles/oppai/images/logo-back.png

static/styles/oppai/style.css

@@ -1,7 +1,7 @@
-/* Layout (Torrents page) */
+/* Layout (torrents page) */
 
 #site_debug td{
-  border: 1px solid #666;
+  border: 1px solid black;
 }
 
 /* We're going to opt for the category icon method for now, tags_* is also available */
@@ -11,7 +11,9 @@
 .cats_imaging { width: 36px; height: 36px; background: url('/static/common/bioicons/imaging.png') no-repeat center center; }
 .cats_other { width: 36px; height: 36px; background: url('/static/common/bioicons/other.png') no-repeat center center; }
 
+
 /* Global */
+
 * {
   padding: 0em;
   margin: 0em;
@@ -21,6 +23,14 @@ html {
   width: 100%;
 }
 
+body {
+  font-family: Bitstream Vera Sans, Tahoma, sans-serif;
+  font-size: 11px;
+  color: black;
+  background: url('/static/common/hiware.png') fixed;
+}
+
+/*
 body {
   width: 100%;
   background-color: #EDDDE7;
@@ -29,29 +39,30 @@ body {
   color: #000;
   min-width: 850px;
 }
+*/
+
 
 /* Common elements */
 
 a {
   text-decoration: none;
-  border: none;
-  color: #444;
+  color: #016670;
 }
 
 a:hover {
   text-decoration: underline;
-  color: #555;
+  color: black;
 }
 
 button, input[type=button], input[type=submit] {
-  background: #EAABED;
-  box-shadow: 0 1px 1px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
+  background: #fff9c7;
+  box-shadow: 2px 2px 10px -5px gray;
 }
 button:hover, input[type=button]:hover, input[type=submit]:hover {
-  background: #E197E5;
+  background: #fbe180;
 }
 button:focus, input[type=button]:focus, input[type=submit]:focus {
-  background: #D48DD8;
+  background: #fbe180;
 }
 
 .spoilerButton {
@@ -60,14 +71,12 @@ button:focus, input[type=button]:focus, input[type=submit]:focus {
 
 .forum_post .body a:not([href="#"]), .rule_summary a, .wiki_article a, #actual_rules a, .news_post .pad a, .store_table a {
   text-decoration: none;
-  border: none;
-  color: #862A5E;
+  color: #016670;
 }
 
 .forum_post .body a:hover:not([href="#"]), .rule_summary a:hover, .wiki_article a:hover, #actual_rules a:hover, .news_post .pad a:hover, .store_table a:hover {
   text-decoration: underline;
-  border: none;
-  color: #B65A8E;
+  color: black;
 }
 
 h1,h2,h3,h4 {
@@ -96,6 +105,7 @@ img {
   border: none;
 }
 
+
 /* Styles generated by the BBCode parser */
 
 span.size1 { font-size:0.75em; }
@@ -112,34 +122,34 @@ span.size10 { font-size:3em; }
 ul.thin { margin:0px 0px 0px 25px; padding:0px; }
 ul.thin li { margin:0px 0px; padding:0px; }
 
-/* Layout (Every page) */
+
+/* Layout (every page) */
 
 #header {
   width: 100%;
   padding: 0px 0 0 0;
-  background: #fbc2e5;
+  background: url('/static/common/sam-komon.png');
   margin-bottom: 10px;
 }
 
 #content {
   margin: auto;
   margin-top: 10px;
-/*  margin-top: 100px; */
   width: 90%;
   min-width: 872px;
   overflow: hidden;
 }
 
 #footer {
-/*  margin-top: 40px; */
   margin-top: 10px;
   width: 100%;
   text-align: center;
   padding: 1em 0;
   opacity: 0;
-  transition: ease-in-out 0.3s;
-  transition-delay: 0.7s;
+  transition: ease-in-out 0.2s;
+  transition-delay: 0.5s;
 }
+
 #footer:hover {
   opacity: 1;
 }
@@ -147,7 +157,7 @@ ul.thin li { margin:0px 0px; padding:0px; }
 #logo {
   width: 250px;
   height: 50px;
-  background: url('/static/common/logo.png') no-repeat center center;
+  background: url('/static/common/logo-bw.png') no-repeat center center;
   margin: 0 0 0 10%;
 }
 
@@ -165,7 +175,7 @@ ul.thin li { margin:0px 0px; padding:0px; }
 #menu {
   width: 100%;
   text-align: center;
-  background-color: #461640;
+  background-color: #016670;
   font-size: 10pt;
 }
 
@@ -187,8 +197,9 @@ ul.thin li { margin:0px 0px; padding:0px; }
   padding: 0.6em 0;
   display: inline-block;
   width: 100%;
-  color: #fbc2e5;
+  color: white;
   transition: ease-in-out 0.1s;
+  text-decoration: none;
 }
 
 #nav_links {
@@ -196,22 +207,24 @@ ul.thin li { margin:0px 0px; padding:0px; }
 }
 
 #menu ul li a.active {
-  background-color: #565656;
+  background-color: #016670;
 }
 
 #menu ul li a:hover {
-  background-color: #7A3572;
+  background-color: #9fedd7;
+  color: black;
   text-decoration: none;
 }
 
 #menu .nav_dropdown {
-  background: #461640;
+  background: #016670;
   margin-top: 0;
 }
 
 .nav_dropdown > div {
+  box-shadow: 2px 2px 10px -2px gray;
   position: absolute;
-  background-color: #461640;
+  background-color: #016670;
   width: 100%;
   z-index: 99999;
   margin-top: 32px;
@@ -225,9 +238,10 @@ ul.thin li { margin:0px 0px; padding:0px; }
 
 .nav_dropdown > div > a {
   display: none;
-  color: #fbc2e5;
+  color: white;
   height: 32px;
   line-height: 32px;
+  text-decoration: none;
 }
 
 .nav_dropdown:hover > div > a {
@@ -235,15 +249,12 @@ ul.thin li { margin:0px 0px; padding:0px; }
 }
 
 #userinfo {
-/*  position: absolute;
-  top: 258px; */
-  background: #fbc2e5;
-  color: #444;
+  background: #fff9c7;
+  color: black;
   padding: 4px 0px;
   width: 100%;
   text-align: center;
   font-size: 8pt;
-  /* border-bottom: 1px solid #999; */
 }
 
 #userinfo img {
@@ -263,13 +274,17 @@ ul.thin li { margin:0px 0px; padding:0px; }
   padding: 0px;
 }
 
+
 #userinfo a {
-  color: #222;
+  color: black;
+  text-decoration: none;
 }
+
 #userinfo a:hover {
   text-decoration: underline;
 }
 
+
 #userinfo b a {
   font-weight: normal;
   font-size: 0.9em;
@@ -278,10 +293,9 @@ ul.thin li { margin:0px 0px; padding:0px; }
 
 #searchbars {
   text-align: center;
-  background-color: #7A3572;
+  background-color: #9fedd7;
   box-sizing: content-box;
   padding: 4px 10%;
-  border-bottom: 2px solid #FBC2E5;
   display: flex;
 }
 
@@ -297,9 +311,9 @@ ul.thin li { margin:0px 0px; padding:0px; }
   box-sizing: border-box;
   padding: 2px 2px 2px 4px;
   font-size: 0.9em;
-  background-color: #e0e0e0;
+  background-color: white;
   width: 100%;
-  color: #444;
+  color: black;
 }
 
 #searchbars ul {
@@ -321,7 +335,7 @@ ul.thin li { margin:0px 0px; padding:0px; }
   top: 1em;
   left: 0;
   z-index: 1000;
-  background-color: #999;
+  background-color: white;
   width: 12em;
   margin-top: 12px;
 }
@@ -334,21 +348,13 @@ ul.thin li { margin:0px 0px; padding:0px; }
 }
 
 #searchbars ul li ul li.highlight {
-  background: #D7D7D7;
+  background: white;
 }
 
 #searchbars ul li form {
   display: inline;
 }
 
-#alerts {
-/*  margin-top: 85px;
-  margin-bottom: -85px; */
-  background: #EDDDE7;
-/*  padding: 10px 0px; */
-  margin: 10px 0px;
-}
-
 #cat-selector ul {
   width: 100%;
 }
@@ -361,9 +367,9 @@ ul.thin li { margin:0px 0px; padding:0px; }
 }
 
 .alertbar {
-  background-color: #fbc2e5;
+  background-color: #fff9c7;
   text-align: center;
-  color: #444;
+  color: black;
   font-weight: bold;
   font-size: 0.95em;
   width: 350px;
@@ -378,15 +384,15 @@ ul.thin li { margin:0px 0px; padding:0px; }
   background-color: #ff8a8a;
 }
 .alertbar a {
-  color: #555;
-  text-decoration: underline;
+  color: black;
+  text-decoration: none;
 }
 .alertbar.modbar a {
   margin: 0px 5px;
 }
 .alertbar a:hover {
-  color: #777;
-  text-decoration: none;
+  color: black;
+  text-decoration: underline;
 }
 
 /* IE doesn't appear to like a simple display:none in our header. Random things start fucking up pretty badly. */
@@ -400,7 +406,8 @@ input.hidden {
   display: none;
 }
 
-/* Layout (Any page) */
+
+/* Layout (any page) */
 
 .thin {
   width: 850px;
@@ -430,7 +437,7 @@ input.hidden {
   position: absolute;
   padding: 5px;
   left: -5px;
-  background-color: #FBC2E5;
+  background-color: #fff9c7;
   z-index: 100;
 }
 
@@ -474,7 +481,7 @@ p.min_padding {
 
 .box {
   font-size: 8pt;
-  background-color: #EEE;
+  background-color: white;
   /* border: 1px solid #666666; */
   border: none;
   margin-bottom: 10px;
@@ -487,7 +494,7 @@ p.min_padding {
 .box2 {
   margin-bottom: 10px;
   font-size: 8pt;
-  background-color: #EAEAEA;
+  background-color: white;
   /* border: 1px solid #666666; */
   border: none;
 }
@@ -506,8 +513,8 @@ p.min_padding {
   padding: 4px;
   /* border-bottom: 1px solid #666; */
   /* background: #E1E1E1; */
-  background: #EAABED;
-  color: #333;
+  background: #9fedd7;
+  color: black;
 }
 
 .body {
@@ -528,11 +535,11 @@ p.min_padding {
 }
 
 .tags a {
-  color: #222;
+  color: black;
 }
 
 .tags a:hover {
-  color: #444;
+  color: black;
   text-decoration: underline;
 }
 
@@ -551,7 +558,7 @@ table {
 }
 
 tr {
-  background-color: #EEE;
+  background-color: white;
 }
 
 td, th {
@@ -561,9 +568,9 @@ td, th {
 }
 
 .colhead {
-  background: #E197E5;
+  background: #9fedd7;
   font-weight: bold;
-  color: #000;
+  color: black;
 }
 
 td.colhead, .colhead td, .colhead th {
@@ -587,17 +594,17 @@ td.colhead, .colhead td, .colhead th {
 
 .colhead_dark {
   /* background: #E1E1E1; */
-  background: #E197E5;
-  color: #333;
+  background: #9fedd7;
+  color:black;
 }
 .forum_post .colhead_dark {
-  background: #F1CDF4;
+  background: #9fedd7;
 }
 .forum_post.staff_post .colhead_dark {
-  background: #f1849a;
+  background: #fbe180;
 }
 .forum_post.sticky_post {
-  border: 3px solid #f1849a;
+  border: 3px solid #fbe180;
 }
 
 td.label {
@@ -638,6 +645,7 @@ ul.nobullet {
   display: inline-block;
 }
 
+
 /* Layout (home page) */
 
 ul.stats li {
@@ -655,7 +663,8 @@ ul.poll li.graph {
   padding-left: 20px;
 }
 
-/* Layout (Torrents page) */
+
+/* Layout (torrents page) */
 
 .show_torrents {
   width: 21px;
@@ -680,7 +689,7 @@ ul.poll li.graph {
 .filter_torrents {
   width: 750px;
   margin: auto;
-  background: #EEE;
+  background: white;
 }
 
 .filter_torrents .submit {
@@ -688,11 +697,6 @@ ul.poll li.graph {
   padding-top: 5px;
 }
 
-.filter_torrents .ft_cat_list {
-  border-top: 1px solid #AAA;
-  border-bottom: 1px solid #AAA;
-}
-
 #content form.search_form + .torrent_table {
   margin-top: 20px;
 }
@@ -723,13 +727,13 @@ ul.poll li.graph {
 }
 
 .torrent_table tr.group {
-  background-color: #cfcfcf;
+  background-color: white;
 }
 .torrent_table tr.group_torrent {
-  background-color: #fafafa;
+  background-color: white;
 }
 .torrent_table tr.torrent {
-  background-color: #ddd;
+  background-color: white;
 }
 
 .torrent_table tr.group td.center:first-child {
@@ -737,13 +741,13 @@ ul.poll li.graph {
   width: 21px;
 }
 .torrent_table tr.torrent:nth-child(2n) {
-  background-color: #FAD1E3;
+  background-color: #edeae5;
 }
 .torrent_table tr.torrent:nth-child(2n-1) {
-  background-color: #EDC5F4;
+  background-color: white;
 }
 .torrent_table tr.group {
-  background-color: #F8B8FF;
+  background-color: white;
 }
 
 .torrent_table div.tags {
@@ -769,7 +773,8 @@ ul.poll li.graph {
   white-space: nowrap;
 }
 
-/* Layout (Forums) */
+
+/* Layout (forums) */
 
 .last_read {margin-left: 5px; fill: #A9A9A9;}
 .colhead_dark .last_read {fill: #DC86E0;}
@@ -785,7 +790,7 @@ ul.poll li.graph {
 strong.quoteheader {color: #000;}
 
 tr.row:nth-of-type(odd) {
-  background-color: #E2E2E2;
+  background-color: white;
 }
 
 table.forum_post {
@@ -832,13 +837,15 @@ blockquote {
   border: 1px solid #BBB;
 }
 
-/* Layout (Inbox) */
+
+/* Layout (inbox) */
 
 tr.unreadpm {
-  background-color: #ECC;
+  background-color: #fff9c7;
 }
 
-/* Layout (Permission Page) */
+
+/* Layout (permission page) */
 
 .permission_head {
   width: 400px;
@@ -867,7 +874,8 @@ tr.unreadpm {
   text-align: right;
 }
 
-/* Layout (Invite tree) */
+
+/* Layout (invite tree) */
 
 ul .invitetree {
   margin: 0px 0px 0px 25px;
@@ -878,13 +886,15 @@ ul .invitetree {
   margin: 10px 2px;
 }
 
-/* Layout (User options) */
+
+/* Layout (user options) */
 
 .user_options .options_list li {
   margin: 0;
 }
 
-/* Layout (MISC) */
+
+/* Layout (misc) */
 
 .left_poll {
   display: none;
@@ -897,7 +907,7 @@ ul .invitetree {
 
 .center_poll {
   height: 9px;
-  background: #C5D1FF;
+  background: white;
   border-radius: 4px;
   float: left;
   margin: 0px;
@@ -968,14 +978,14 @@ tr.torrent .bookmark > a:after {
 }
 
 div[class~=tooltipster-content] > a {
-  color: #AAAAAA;
+  color: #edeae5;
 }
 
 .post_id {
   font-weight: normal;
 }
 
-/* get rid of extraneous padding in the Top Contributors box */
+/* Get rid of extraneous padding in the Top Contributors box */
 #request_top_contrib {
   border: none;
 }
@@ -997,25 +1007,17 @@ div[class~=tooltipster-content] > a {
   border-right: 0;
 }
 
-#requests table.layout.cat_list {
-  border-bottom: 1px solid #AAA;
-  border-top: 1px solid #AAA;
-}
-#requests tr#media_list {
-  border-bottom: 1px solid #AAA;
-  border-top: 1px solid #AAA;
-}
 #request_table {
   margin-bottom: 5px;
 }
 #request_table .request:nth-of-type(odd){
-  background: #FAD1E3;
+  background: #edeae5;
 }
 #request_table .request:nth-of-type(even){
-  background: #EDC5F4;
+  background: white;
 }
 
-/* workaround for calendar display issue */
+/* Workaround for calendar display issue */
 div.sidebar #event_div {
   margin-left: -232px;
 }
@@ -1029,12 +1031,12 @@ ol {
 }
 
 #coverCont {
-  background-color: #FF5AA5;
+  background-color: #fff9c7;
   padding: 5px;
-  box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
+  box-shadow: 2px 2px 10px -2px gray;
 }
 #coverCont img {
-  background-color: #FFD2E6;
+  background-color: #fff9c7;
 }
 .torrent_info {
   font-size: 100%;
@@ -1053,19 +1055,19 @@ ol {
 }
 
 .row_hl {
-  background-color: #EED5F1;
+  background-color: #edeae5;
 }
 
 input.inputtext {
   border: none;
-  border-bottom: 1px solid #AAA;
-  background-color: rgba(0, 0, 0, 0);
+  border-bottom: 1px solid #edeae5;
+  background-color: white;
   font-size: 13px;
   outline: none;
   transition: ease-in-out 0.12s;
 }
 input.inputtext:focus {
-  border-bottom: 1px solid #E197E5;
+  border-bottom: 1px solid #fbe180;
 }
 
 .bbcode_bar {
@@ -1074,7 +1076,7 @@ input.inputtext:focus {
   border-bottom: none;
 }
 .bbcode_bar .emoji_box {
-  background-color: #EEE;
+  background-color: white;
 }
 
 .collage_images .collage_image {
@@ -1084,11 +1086,10 @@ input.inputtext:focus {
 }
 
 .box, .border, .alertbar, .artist_table, .request_table, .forum_index, #userinfo_minor > li > ul, .permissions table {
-  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+  box-shadow: 2px 2px 10px -2px gray;
 }
 #userinfo {
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -2px rgba(0, 0, 0, 0.2), 0 0px 5px 0 rgba(0, 0, 0, 0.12);
-}
+  box-shadow: 0 2px 10px -2px gray;
 
 .last_edited {
   font-size: 10px;
@@ -1130,7 +1131,7 @@ input.inputtext:focus {
   box-sizing: border-box;
 }
 .dead {
-  opacity: 0.6;
+  opacity: 0.5;
 }
 .search_warning {
   fill: #E197E5;
@@ -1139,7 +1140,6 @@ input.inputtext:focus {
 .tl_reported {
   color: red;
 }
-
 .tl_snatched {
   color: #C35C1C;
 }
@@ -1149,11 +1149,13 @@ input.inputtext:focus {
 .tl_seeding {
   color: #068206;
 }
+
 caption {
-  border-bottom: 1px solid #BBB;
+  border-bottom: 1px solid #edeae5;
   font-weight: bold;
 }
 
+/*
 .tag_parody {
 	color: #e08e00 !important;
 }
@@ -1166,8 +1168,4 @@ caption {
 .tag_male {
 	color: #0000ff !important;
 }
-
-.collage_image:hover {
-  box-shadow: 0px 0px 0px 3px #fbc2e5;
-  position: relative;
-}
+*/

static/styles/public.2020-01-14/style.css

@@ -0,0 +1,156 @@
+@media all and (orientation: portrait) {
+  #content {
+    background: none !important;
+  }
+  table#maincontent {
+    margin: auto;
+  }
+}
+
+* {
+  margin: 0;
+  padding: 0;
+}
+
+html, body {
+  height: 100%;
+}
+
+body {
+  font-family: Bitstream Vera Sans, Tahoma, sans-serif;
+  font-size: 11px;
+  color: #464646;
+  background-color: #fbc2e5;
+}
+
+table {
+  font-size: inherit;
+}
+
+a {
+  color: #464646;
+  text-decoration: none;
+}
+
+a:hover {
+  color: #888888;
+}
+
+input[type="text"], input[type="password"], input[type="email"] {
+  color: black;
+  background-color: white;
+  padding: 0 0 0 6px;
+  font: 500 14px/29px Helvetica, Arial, sans-serif;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+input[type="text"]:valid, input[type="password"]:valid, input[type="email"] {
+  border-style: none;
+}
+
+input[type="text"]:invalid, input[type="password"]:invalid {
+  border: none;
+  border-right: 2px solid red;
+}
+
+#loginform > table, #recoverform > div > table {
+  border-spacing: 1px;
+}
+
+#loginform #username, #recoverform #new_pass_1 {
+  border-radius: 5px 5px 0 0;
+}
+
+#loginform input[type="submit"], #recoverform input[type="submit"] {
+  width: 100%;
+  background-color: white;
+  font: 500 14px/29px Helvetica, Arial, sans-serif;
+  border: none;
+  border-radius: 0 0 5px 5px;
+  cursor: pointer;
+}
+#loginform input[type="submit"]:hover, #recoverform input[type="submit"]:hover {
+  background-color: #FFF7F7;
+}
+
+#recoverform .layout td:first-child {
+  width: 140px;
+  text-align: right;
+  padding-right: 5px;
+}
+
+#head, #foot {
+  height: 30px;
+  width: 100%;
+  background-color: #461640;
+  overflow: hidden;
+}
+
+#head {
+  text-align: right;
+}
+
+#foot {
+  text-align: center;
+  bottom: 0;
+  position: absolute;
+}
+
+#foot > span, #head > span {
+  line-height: 30px;
+  margin: 10px;
+}
+
+#foot > span, #head > span {
+  color: #a07c92;
+}
+
+#foot a, #head a {
+  color: #b98fa9;
+}
+
+#content {
+  height: calc(100% - 60px);
+  overflow-y: auto;
+  box-sizing: border-box;
+  background-repeat: no-repeat;
+  background-size: contain;
+  display: flex;
+  align-items: center;
+  padding: 0 10%;
+}
+
+#maincontent {
+  margin: auto 0 auto auto;
+  background-color: transparent;
+}
+
+#logo {
+  width: 250px;
+  height: 50px;
+  background-image: url('/static/common/logo.png');
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+  margin: 0 0 0 auto;
+}
+
+.centered {
+  text-align: center;
+  vertical-align: middle;
+}
+
+.hidden {
+  display: none;
+}
+
+.info {
+  color: green;
+  font-weight: bold;
+}
+
+.warning {
+  color: red;
+  font-weight: bold;
+}

static/styles/public/style.css

@@ -19,8 +19,8 @@ html, body {
 body {
   font-family: Bitstream Vera Sans, Tahoma, sans-serif;
   font-size: 11px;
-  color: #464646;
-  background-color: #fbc2e5;
+  color: black;
+  background: url('/static/common/hiware.png');
 }
 
 table {
@@ -28,12 +28,13 @@ table {
 }
 
 a {
-  color: #464646;
+  color: white;
   text-decoration: none;
 }
 
 a:hover {
-  color: #888888;
+  color:white;
+  text-decoration: underline;
 }
 
 input[type="text"], input[type="password"], input[type="email"] {
@@ -64,14 +65,14 @@ input[type="text"]:invalid, input[type="password"]:invalid {
 
 #loginform input[type="submit"], #recoverform input[type="submit"] {
   width: 100%;
-  background-color: white;
+  background-color: #fff9c7;
   font: 500 14px/29px Helvetica, Arial, sans-serif;
   border: none;
   border-radius: 0 0 5px 5px;
   cursor: pointer;
 }
 #loginform input[type="submit"]:hover, #recoverform input[type="submit"]:hover {
-  background-color: #FFF7F7;
+  background-color: #fbe180;
 }
 
 #recoverform .layout td:first-child {
@@ -83,7 +84,7 @@ input[type="text"]:invalid, input[type="password"]:invalid {
 #head, #foot {
   height: 30px;
   width: 100%;
-  background-color: #461640;
+  background-color: #016670;
   overflow: hidden;
 }
 
@@ -103,11 +104,15 @@ input[type="text"]:invalid, input[type="password"]:invalid {
 }
 
 #foot > span, #head > span {
-  color: #a07c92;
+  color: black;
 }
 
 #foot a, #head a {
-  color: #b98fa9;
+  color: white;
+}
+
+#foot a:hover, #head a:hover {
+  color: white;
 }
 
 #content {
@@ -129,7 +134,7 @@ input[type="text"]:invalid, input[type="password"]:invalid {
 #logo {
   width: 250px;
   height: 50px;
-  background-image: url('/static/common/logo.png');
+  background-image: url('/static/common/logo-bw.png');
   background-repeat: no-repeat;
   background-position: center;
   background-size: contain;