frontend layout rein

This commit is contained in:
age 2008-06-12 10:02:04 +00:00
parent 2ad677ac72
commit 6a89afb92e
4 changed files with 135 additions and 14 deletions

View file

@ -0,0 +1,109 @@
body {
padding: 0;
margin: 0;
color: #454456;
text-align: center;
font: 1em Arial, Helvetica, sans-serif;
}
#header {
/** background: url(../static/images/header.jpg) top left no-repeat; **/
position: relative;
margin: 20px auto auto 50px;
padding-left: 85px;
font-size: 5em;
color: #777688;
width: 760px;
width: 89%;
height: 160px;
}
#nav {
position: relative;
margin: -18px 0 10px auto;
width: 760px;
width: 89%;
line-height: 2em;
}
#nav ul {
padding:5px;
margin:0;
padding:0;
}
#nav ul li {
float:right;
list-style:none;
margin:0;
padding:0;
}
#nav a, a:link {
display:block;
margin:0;
padding: 2px 15px;
text-align:center;
background: #EFE9ED;
}
#nav a:hover {
color: #EFE9ED;
background: #5684BF;
text-decoration: none;
}
/* Styles for the text area */
#main_content {
position: relative;
margin: 75px auto 50px auto;
padding: 0;
width: 760px;
width: 90%;
text-align: left;
line-height: 1.25em;
}
a, a:link {
color: #5684BF;
background-color: inherit;
text-decoration: none;
display: inline;
padding: 0;
}
a:hover {
color: #454456;
text-decoration: underline;
}
p {
margin: 0;
padding: 5px;
padding-left: 20px;
}
h1 {
font: 1.5em Garamond, serif;
color: #777688;
border-left: #777688 15px solid;
padding: 5px;
margin: 20px 0;
}
h2 {
font:1.25em Garamond, serif;
color: #777688;
margin: 0;
padding: 20px;
}
/* Style for the footer */
#footer {
padding: 2px;
margin: auto;
background-color: #EFE9ED;
font-size: 1em;
width: 70%;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

View file

@ -5,7 +5,7 @@
<head py:match="item.tag=='{http://www.w3.org/1999/xhtml}head'" py:attrs="item.items()"> <head py:match="item.tag=='{http://www.w3.org/1999/xhtml}head'" py:attrs="item.items()">
<meta content="text/html; charset=UTF-8" http-equiv="content-type" py:replace="''"/> <meta content="text/html; charset=UTF-8" http-equiv="content-type" py:replace="''"/>
<title py:replace="''">Your title goes here</title> <title py:replace="''">panoptische Fotokiste</title>
<meta py:replace="item[:]" name="description" content="master template"/> <meta py:replace="item[:]" name="description" content="master template"/>
<style type="text/css" media="screen"> <style type="text/css" media="screen">
#pageLogin #pageLogin
@ -15,8 +15,8 @@
text-align: right; text-align: right;
} }
</style> </style>
<link rel="stylesheet" type="text/css" media="screen" href="../static/css/style.css" <link rel="stylesheet" type="text/css" media="screen" href="../static/css/1024optimized.css"
py:attrs="href=tg.url('/static/css/style.css')"/> py:attrs="href=tg.url('/static/css/idea.css')"/>
</head> </head>
<body py:match="item.tag=='{http://www.w3.org/1999/xhtml}body'" py:attrs="item.items()"> <body py:match="item.tag=='{http://www.w3.org/1999/xhtml}body'" py:attrs="item.items()">
@ -30,24 +30,36 @@
</span> </span>
</div> </div>
<div id="header">&#160;</div> <div id="header">
<img src="${tg.url('/static/images/header.jpg')}" alt="panoptische Fotokiste" />
</div>
<div id="main_content"> <div id="main_content">
<div id="nav">
<ul>
<li><a href="#">Privacy Shades</a></li>
<li><a href="#">Start</a></li>
</ul>
</div>
<div id="status_block" class="flash" <div id="status_block" class="flash"
py:if="value_of('tg_flash', None)" py:content="tg_flash"></div> py:if="value_of('tg_flash', None)" py:content="tg_flash"></div>
<div py:replace="[item.text]+item[:]">page content</div> <div py:replace="[item.text]+item[:]">
<h1>&Uuml;berschrift</h1>
<p>page content</p>
<h2>kleinere &Uuml;berschrift</h2>
<p> foo </p>
<h1>&Uuml;berschrift</h1>
<p>page content</p>
</div>
</div> </div>
<div id="footer"> <div id="footer">
<!-- TODO: logo <img src="${tg.url('/static/images/logo.png')}" <p>
alt="sense.lab e.V." /> --> <img src="${tg.url('/static/images/logo.png')}" alt="Sense.Lab e.V." /> <br>
<p>Die Fotokiste ist ein Projekt von <a href="http://senselab.org" Die Fotokiste ist ein Sense.Lab Projekt und ein Modul der Glasmensch Ausstellung.<br>
alt="sense.lab-Webseite">sense.lab e.V.</a>.</p> Alle Inhalte k&ouml;nnen wegen der Creative Commons Lizenz beliebig weiter verwendet werden.
<p>Diese Webseiten k&ouml;nnen unter den Bedingungen der<br/> </p>
<a href="http://creativecommons.org/licenses/by-sa/2.5/"
alt="Creative-Commans-Lizenz by-sa v2.5">Creative-Commons-Lizenz:
Namensnennung-Weitergabe unter gleichen Bedingungen</a>
wiederverwendet werden.</p>
</div> </div>
</body> </body>