changeset 44:72dcc1d48809

More work on the design.
author Matti Hamalainen <ccr@tnsp.org>
date Fri, 04 Oct 2013 23:54:25 +0300
parents 66ab7d43f8a1
children 842003d78994
files fap.css index.php
diffstat 2 files changed, 63 insertions(+), 12 deletions(-) [+]
line wrap: on
line diff
--- a/fap.css	Fri Oct 04 22:23:02 2013 +0300
+++ b/fap.css	Fri Oct 04 23:54:25 2013 +0300
@@ -7,15 +7,12 @@
 }
 
 body {
-/*
-	font-family: Verdana, Arial, helvetica, sans-serif;
-*/
 	font-family: monospace;
 	font-size: 12pt;
 	color: black;
 	margin: 0px;
 	padding: 0px;
-	background: black url(img/grid.jpg);
+	background: black url(img/grid.png);
 }
 
 img {
@@ -78,11 +75,14 @@
 	top: 10em;
 	left: 0.5em;
 	right: 1em;
-	height: 10em;
+	min-height: 10em;
 	margin: 0px;
 	padding: 5pt;
 	width: 8em;
 
+	color: #0f0;
+	text-shadow: 0px 0px 3px #0f0;
+
 	background: rgba(0,0,0,0.6);
 	border-top: 2pt solid #0f0;
 	border-left: 2pt solid #0f0;
@@ -93,7 +93,12 @@
 	font-size: 15pt;
 
 	border-radius: 5pt;
-	box-shadow: 2px 4px 4px rgba(0,0,0,0.7);
+	box-shadow: 8px 8px 16px #000;
+}
+
+#menu div {
+	text-align: center;
+	font-size: 20pt;
 }
 
 #menu a {
@@ -101,7 +106,9 @@
 	padding: 5pt;
 	margin: 5pt;
 	background: rgba(0,50,0,0.7);
+
 	color: #0d0;
+	text-shadow: 0px 0px 3px #0f0;
 
 	border-top: 2pt solid #0f0;
 	border-left: 2pt solid #0f0;
@@ -111,16 +118,44 @@
 	text-shadow: 1px 1px 1px rgba(0,0,0,0.4);
 
 	box-shadow: 2px 2px 2px rgba(0,0,0,0.4);
-	border-top-right-radius: 5pt;
-	border-bottom-left-radius: 5pt;
+	border-top-right-radius: 10pt;
+	border-bottom-left-radius: 10pt;
 	display: block;
+
+	transition: all 0.3s;
 }
 
 #menu a:hover {
 	background: rgba(0,50,0,0.4);
 	color: #fff;
+	box-shadow: 2px 2px 4px rgba(0,255,0,0.5) inset, -2px -2px 4px rgba(0,255,0,0.5) inset;
+}
 
-	box-shadow: 2px 2px 4px rgba(0,255,0,0.5) inset, -2px -2px 4px rgba(0,255,0,0.5) inset;
+#infobox {
+	position: fixed;
+	top: 8.5em;
+	left: 12em;
+	min-width: 10em;
+
+	margin: 0px;
+	padding: 5pt;
+
+	z-index: 15;
+
+	font-family: Impact;
+	font-size: 15pt;
+	text-align: center;
+	color: #0f0;
+	text-shadow: 0px 0px 3px #0f0;
+
+	background: rgba(0,0,0,0.6);
+	border-top: 2pt solid #0f0;
+	border-left: 2pt solid #0f0;
+	border-right: 2pt solid #060;
+	border-bottom: 2pt solid #060;
+
+	border-radius: 5pt;
+	box-shadow: 8px 8px 16px #000;
 }
 
 #date {
@@ -139,7 +174,7 @@
 	border-bottom: 2pt solid #060;
 
 	border-radius: 5pt;
-	box-shadow: 2px 4px 4px rgba(0,0,0,0.7);
+	box-shadow: 8px 8px 16px #000;
 }
 
 #maincontent {
@@ -318,3 +353,14 @@
 div.votectrl {
 	padding: 1em;
 }
+
+
+.mblink {
+	animation: mblink 1s steps(5, start) infinite;
+}
+
+@keyframes mblink {
+	to {
+		visibility: hidden;
+	}
+}
--- a/index.php	Fri Oct 04 22:23:02 2013 +0300
+++ b/index.php	Fri Oct 04 23:54:25 2013 +0300
@@ -62,11 +62,16 @@
 ?>
 </div>
 
+<?
+$pageName = isset($_GET["p"]) ? $_GET["p"] : "news";
+$pageBasename = basename($pageName);
+$pageFilename = $pageBasename.".inc.php";
+if (file_exists($pageFilename))
+  echo "<div id=\"infobox\">".strtoupper($pageBasename)."</div>\n";
+?>
 <div id="maincontent">
 <div>
 <?
-$pageName = isset($_GET["p"]) ? $_GET["p"] : "news";
-$pageFilename = basename($pageName).".inc.php";
 if (file_exists($pageFilename))
   include($pageFilename);
 ?>