gitolite/pngs
gitolite
/
pngs
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

layout draft

This commit is contained in:
Astro 2010-09-16 18:32:35 +02:00
commit 9499b47060
2 changed files with 110 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
index.html Normal file
View File

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="quiz.css" rel="stylesheet" type="text/css">
</head>
<body>
<ul id="players">
<li><span class="name">Fnord</span><span class="score">£35,000</span></li>
<li><span class="name">Eris</span><span class="score">£5,000</span></li>
<li><span class="name active">Hagbard C.</span><span class="score">£67,000</span></li>
</ul>
<p id="tier">
£30,000
</p>
<div id="question">
<p>Welches Land erlaubt Filesharing für private Zwecke straffrei?</p>
</div>
<div id="answers">
<ul>
<li>Montenegro</li>
<li class="selected">China</li>
</ul>
<ul>
<li class="wrong">Deutschland</li>
<li class="right">Brasilien</li>
</ul>
</div>
</body>
</html>

80
quiz.css Normal file
View File

@ -0,0 +1,80 @@
body {
margin: 0 auto;
color: white;
background-color: #20203f;
text-align: center;
font-size: 200%;
font-family: sans-serif;
}
ul {
list-style-type: none;
margin: 0;
}
li {
display: inline-block;
}
p {
margin: 0;
padding: 0;
}
#players {
margin-bottom: 2em;
}
#players li {
margin: 0 0.5em;
}
#players li span {
margin: 0 0.2em;
}
.name {
color: #7f7f7f;
}
.score {
font-size: 66%;
color: #ccc;
}
.active {
color: white;
font-weight: bold;
}
#tier {
color: #ccc;
font-weight: bold;
}
#question {
font-size: 300%;
max-width: 20em;
margin: 0 auto;
}
#answers {
position: absolute;
bottom: 0;
width: 100%;
}
#answers ul {
margin: 0.5em 0.5em;
text-align: center;
}
#answers ul li {
width: 30%;
padding: 0.1em 0.5em;
border: 0.2em solid #ccc;
border-radius: 1em;
}
.selected {
background-color: #ff9600;
color: black;
}
.right {
background-color: #06ff00;
color: black;
}
.wrong {
background-color: #ff2f00;
color: black;
}