Mercurial > hg > fapweb
view fap.css @ 106:324f3a415237
Add extra HTML + sponsors box to layout.
author | Matti Hamalainen <ccr@tnsp.org> |
---|---|
date | Mon, 21 Oct 2013 22:11:40 +0300 |
parents | 53b35cb4111b |
children | 3ed09527e348 |
line wrap: on
line source
/* http://colorschemedesigner.com/#0351ZuJm6iKUB */ html { -webkit-backface-visibility: hidden; } body { font-family: monospace; font-size: 12pt; color: black; margin: 0px; padding: 0px; background: black url(img/grid.png); } img { border: none; } a:hover { text-decoration: underline; } a:active { outline: none; } a:focus { outline-style: none; } a, a:visited, a:active { text-decoration: underline; color: white; } #contents { position: absolute; width: 100%; height: 100%; } #header h1 { margin: 0px; } #header { position: fixed; top: 0em; left: 0em; right: 0em; height: 4em; margin: 0px; padding: 0.25em; color: white; font-family: Impact; font-size: 20pt; text-align: center; text-shadow: 2px 2px 1px rgba(0,0,0,0.4); border-radius: 5pt; border: 5pt dashed rgba(0,0,0,0.2); } .logo { font-size: 30pt; } #menu { position: fixed; top: 10em; left: 0.5em; right: 1em; 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; border-right: 2pt solid #060; border-bottom: 2pt solid #060; font-family: Impact; font-size: 15pt; border-radius: 5pt; box-shadow: 8px 8px 16px #000; } #sponsors { position: fixed; top: auto; bottom: 1em; left: 0.5em; right: 1em; margin: 0px; padding: 5pt; width: 8em; color: #0f0; text-shadow: 0px 0px 3px #0f0; font-family: Impact; font-size: 15pt; text-align: center; } #menu div { text-align: center; font-size: 20pt; } #menu a { text-decoration: none; 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; border-right: 2pt solid #060; border-bottom: 2pt solid #060; 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: 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; margin-left: 1pt; margin-right: 1pt; } #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 { font-size: 15pt; text-align: right; position: absolute; right: 0.5em; top: 0.5em; padding: 5pt; 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; } #maincontent { position: fixed; left: 13em; right: 1em; top: 12em; bottom: 1em; padding: 1em; margin: 0px; background: rgba(0,0,0,0.8); border: 1pt solid #0f0; box-shadow: 4px 4px 4px rgba(0,255,0,0.7), -4px -4px 4px rgba(0,255,0,0.7), 8px 8px 32px rgba(0,255,0,0.4) inset; text-shadow: 1px 1px 1px rgba(0,0,0,0.6); -moz-border-radius: 8pt; border-radius: 8pt; color: white; } #maincontent > div { width: 100%; height: 100%; overflow-y: auto; } #maincontent h1, #maincontent h2 { margin: 0px; margin-top: 1em; padding: 2pt; padding-left: 1em; background: rgba(0,255,0,0.3); border-bottom: 2px solid rgba(0,0,0,0.2); -moz-border-radius: 8pt; border-radius: 8pt; } #maincontent h1 { margin: 0px; } div.newsitem { } div.newsitem div.text { margin-top: 0.5em; margin-left: 1.5em; margin-right: 1.5em; padding-bottom: 1em; border-bottom: 1px dotted white; } div.newsitem div.sig { padding: 5pt; font-family: Impact; text-align: right; } table.attendees,table.misc,table.vote { width: 100%; font-size: 10pt; } table td, table th { -moz-border-radius: 2pt; border-radius: 2pt; } table th { background: rgba(0,255,0,0.25); } table.attendees th.regtime { width: 20%; } table.attendees th.oneliner { width: 50%; } tr.rodd td { background: rgba(0,255,0,0.05); -moz-border-radius: 2pt; border-radius: 2pt; } tr.reven td { background: rgba(0,255,0,0.15); } table.misc, table.vote { padding-top: 1em; } table.misc tr:hover td, table.vote tr:hover td { background: rgba(0,50,0,0.50); } div.reglink { text-align: center; padding: 0.5em; font-size: 15pt; color: red; border: 2pt solid rgba(0,0,0,0.35); margin: 5pt; -moz-border-radius: 8pt; border-radius: 8pt; } .notice { color: red; text-align: center; font-size: 15pt; } .quote { font-size: 20pt; color: #0f0; text-shadow: 2px 2px 3px #0f0; } .overbooked { color: red; } #pageTabs { margin-top: 10pt; margin-bottom: 0px; border-bottom: 5pt solid #595F23; } #pageTabs a { text-decoration: none; padding: 5pt; margin: 5pt; background: #595F23; text-shadow: 2px 2px 1px rgba(0,0,0,0.4); border-top-left-radius: 5pt; border-top-right-radius: 5pt; } #pageTabs a:hover { background: #C8D286; } #pageTabs a:active { background: #C8D286; } #pageTabs a.admin { position: relative; right: -2em; } table.vote th.vvalue { width: 1%; min-width: 2.5em; } table.vote td.vvalue { text-align: center; } td.vactive, td.vid { text-align: center; } td.vid { padding-right: 1em; padding-left: 1em; } td.vkey { width: 25%; } table.attendees th.rname { width: 15%; } tr.vactive td.vkey, tr.vactive td.vactive { background: rgba(0,255,0,0.7); } div.votectrl { padding: 1em; } .mblink { animation: mblink 1s steps(5, start) infinite; } @keyframes mblink { to { visibility: hidden; } }