1
0
Fork 0

Initial page redesign

website
Mike Gerwitz 2011-03-23 22:34:44 -04:00
parent 5d909dfdec
commit 8ee645056b
2 changed files with 91 additions and 54 deletions

View File

@ -6,15 +6,19 @@
<link type="text/css" rel="stylesheet" href="style.css" /> <link type="text/css" rel="stylesheet" href="style.css" />
</head> </head>
<body> <body>
<div id="content"> <div id="header">
<h1>ease.js</h1> <h1>ease.js</h1>
<h2>The JavaScript Paradigm Shifter</h2> </div>
<ul id="menu"> <div id="menu">
<ul>
<li><a href="manual.html">Manual (Single Page)</a></li> <li><a href="manual.html">Manual (Single Page)</a></li>
<li><a href="manual/">Manual (Split)</a></li> <li><a href="manual/">Manual (Split)</a></li>
<li><a href="https://github.com/mikegerwitz/easejs">Source Code</a></li> <li><a href="https://github.com/mikegerwitz/easejs">Source Code</a></li>
</ul> </ul>
</div>
<div id="content">
<br clear="both" /> <br clear="both" />
<p> <p>
@ -31,7 +35,6 @@
place of employment. Feel free to use ease.js in your own projects. place of employment. Feel free to use ease.js in your own projects.
</p> </p>
</div> </div>
</content>
<p class="copyright"> <p class="copyright">
Copyright &copy; 2011 <a href="http://mikegerwitz.name">Mike Gerwitz</a> Copyright &copy; 2011 <a href="http://mikegerwitz.name">Mike Gerwitz</a>

View File

@ -4,63 +4,97 @@
* Inspired by Tango Icon Theme * Inspired by Tango Icon Theme
*/ */
html { html, body {
background-color: #eeeeec;
}
body {
background-color: white; background-color: white;
border-color: #babdb6;
border-width: 1px;
border-style: solid;
border-radius: 1em;
margin: 5em auto; margin: 0px 0px 1.5em 0px;
padding: 0.5em 1em 0.5em 1em; padding: 0;
width: 800px;
font-family: arial, serif; font-family: arial, serif;
font-size: 16px;
}
#header {
position: relative;
background-color: #2e3436;
border-bottom: 2px solid #295301;
height: 150px;
color: #babdb6;
}
#header h1 {
display: inline-block;
margin: 0.5em 0px 0px 0.5em;
font-size: 4em;
} }
#content { #content {
position: relative; position: relative;
background-color: white;
margin: 0px auto;
padding: 0.5em 1em 1em 1em;
width: 800px;
} }
h1 { #menu {
position: absolute; border-bottom: 2px solid #b1dd87;
top: -2.5em; background-color: #4e9a06;
} }
h2 { #menu ul {
position: absolute; padding: 0px;
top: -2.5em; height: 2.5em;
right: 0px;
margin: 0px auto;
width: 800px;
} }
ul { #menu ul li {
margin: 0;
padding: 0.25em;
height: 2em;
border-bottom: 1px solid #babdb6;
}
ul li {
list-style: none; list-style: none;
padding: 0px 1em 0px 0px; padding: 0px;
float: left; float: left;
line-height: 2em; line-height: 2em;
} }
#menu a, #menu a:link {
display: inline-block;
padding: 0.25em 1em;
color: #041c40;
text-decoration: none;
font-weight: bold;
}
#menu a:hover {
background-color: #b1dd87;
}
p.copyright { p.copyright {
position: fixed; position: fixed;
bottom: 0px; bottom: 0px;
left: 5em; left: 0px;
right: 5em; right: 0px;
margin: 0;
padding: 1em;
background-color: #2e3436;
border-top: 2px solid #babdb6;
color: #babdb6;
font-size: 0.8em; font-size: 0.8em;
text-align: center; text-align: center;
} }
p.copyright a, p.copyright a:link {
color: #babdb6;
}