suzanne.soy/2011-m1s2-ter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Un peu de couleur...

Browse Source
This commit is contained in:
Georges Dupéron 2011-03-30 10:18:14 +02:00
parent d1dc58bc5a
commit 080d857d99
1 changed files with 46 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
code/html5/index.html
View File

@ -4,31 +4,63 @@
<title>PtiClic pre-alpha 0.2</title> <title>PtiClic pre-alpha 0.2</title>
<meta charset="utf-8" /> <meta charset="utf-8" />
<style> <style>
#screen { body {
border: thin solid blue; background-color: black;
width: 320px; padding: 0;
position: absolute; margin: 0;
height: 400px; text-align: center;
} }
.mn.caption { #screen {
border-bottom: thin solid blue; background-color: white;
text-align: center; display: inline-block;
text-align: left;
width: 480px;
height: 800px;
background-color : #FFFFE0;
} }
.mc.caption { .mc.caption {
border-bottom: thin solid blue; border-bottom: medium solid #44AA44;
text-align: center; text-align: center;
color: #8b4;
font-size: 50px;
padding: 10px 0;
}
.mn.caption {
border-bottom: medium solid #44AA44;
text-align: center;
color: #4a4;
background-color: #F0F8D0;
font-size: 30px;
padding: 10px 0;
}
.relations {
width: 100%;
} }
.relations div { .relations div {
padding-left: 76px; background-color: #F0F8D0;
background-color: #dfe; border: thin solid #44AA44;
-moz-border-radius: 10px; -moz-border-radius: 10px;
margin: 10px; margin: 10px;
min-height: 72px; height: 72px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 0 center; padding: 10px;
}
.relations div:nth-child(odd) {
text-align: right;
padding-left: 76px;
background-position: 2% center;
}
.relations div:nth-child(even) {
text-align: left;
padding-right: 76px;
background-position: 98% center;
} }
.relations .rid-1 { background-image: url("img/rel/-1.png"); } .relations .rid-1 { background-image: url("img/rel/-1.png"); }
@ -44,8 +76,8 @@
</head> </head>
<body> <body>
<div id="screen"> <div id="screen">
<div class="mn caption"></div>
<div class="mc caption"></div> <div class="mc caption"></div>
<div class="mn caption"></div>
<div class="relations"></div> <div class="relations"></div>
</div> </div>
</body> </body>