Mercurial > hg > fapweb
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); ?>