gradient for webkit, shadows, footer became header :)

This commit is contained in:
Karen 2011-07-07 20:37:44 +05:30
parent 1ad1f29815
commit 1a242269ad
3 changed files with 104 additions and 11 deletions

View File

@ -1,6 +1,63 @@
@charset "UTF-8"; @charset "UTF-8";
/* CSS Document */ /* CSS Document */
#footer {
position:fixed;
top: 0px;
width: 100%;
height: 50px;
background: #3B240B;
z-index:10;
font-weight:bold;
font-size:16px;
}
#footer a
{color: #fff;
font-weight: bold;
text-decoration:none;}
#footer a:hover {
color: #2E64FE;
}
#nav {
width: 70%;
margin-left: 100px;
margin-right: auto;
top: 50px;
}
#footer ul li {
float: left;
margin-right: 30px;
list-style:none;
}
#logo {
font-family: 'SG Grotesque', sans-serif;
font-size: 1.2em;
line-height: 1.3em;
letter-spacing: 0px;
font-weight: bold;
position: absolute;
top: 12px;
right: 10px;
}
#logo a {
text-align: bottom;
color: #fff;
text-decoration: none;
}
#logo a:hover {
color: #000;
}
.big { .big {
font-family: Verdana,Helvetica, sans-serif; font-family: Verdana,Helvetica, sans-serif;
font-size: 14px; font-size: 14px;
@ -11,10 +68,14 @@
float:left; float:left;
} }
#pagesWrapper
{position:absolute;
top:64px;}
.page { .page {
box-shadow: 0px 0px 1em; -moz-box-shadow: 0px 0px 1em #000;
-moz-box-shadow: 0px 0px 1em; -webkit-box-shadow: 0px 0px 1em #000;
-webkit-box-shadow: 0px 0px 1em; box-shadow: 0px 0px 1em #000 #000;
background: rgba(255,255,255,0.5); background: rgba(255,255,255,0.5);
clear:left; clear:left;
font-family: Helvetica, sans-serif; font-family: Helvetica, sans-serif;
@ -25,7 +86,7 @@
padding-right: 20px; padding-right: 20px;
padding-top: 20px; padding-top: 20px;
padding-bottom:20px; padding-bottom:20px;
/* /*
border-left:1px #CC6600 dotted; border-left:1px #CC6600 dotted;
border-bottom: #CC6600 1px dotted; border-bottom: #CC6600 1px dotted;
*/ */
@ -317,11 +378,14 @@ a img
.style1 {font-size: 16px} .style1 {font-size: 16px}
body { body {
font-family: "DejaVu Sans", Arial, Verdana, sans-serif;
background: #aaa; background: #aaa;
/* background-image: -moz-linear-gradient(left top, #ABAE71, #CDD535, #F4F6C7); /* background-image: -moz-linear-gradient(left top, #ABAE71, #CDD535, #F4F6C7);
background-image: -webkit-gradient(radial, 45px 45px 45deg, circle cover, background-image: -webkit-gradient(radial, 45px 45px 45deg, circle cover,
#ABAE71 0%, #CDD53F 100%, #F4F6C7 95%); */ #ABAE71 0%, #CDD53F 100%, #F4F6C7 95%); */
background-image: -moz-linear-gradient(left top, #666, #ccc, #333); background: -moz-linear-gradient(left top, #666, #ccc, #333);
background-image: -webkit-gradient(radial, 45px 45px 45deg, circle cover, background:-webkit-gradient(linear, left center, right center, from(#666666), to(#333333), color-stop(.5,#CCCCCC)) repeat;
#666 0%, #ccc 100%, #333 95%); background:linear-gradient(left top, #666, #ccc, #333)
/*background-image: -webkit-gradient(radial, 45px 45px 45deg, circle cover,
#666 0%, #ccc 100%, #333 95%);*/
} }

View File

@ -90,6 +90,7 @@ ul {
background: #3B240B; background: #3B240B;
} }
#footer a { #footer a {
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;

View File

@ -139,7 +139,7 @@ p {
</div> </div>
<div class="big" id="1"> <!--<div class="big" id="1">
<div id="lefttitle"><img src="/static/images/titlecard1.png" width="332" height="108" /> <div id="lefttitle"><img src="/static/images/titlecard1.png" width="332" height="108" />
</div> </div>
@ -167,10 +167,38 @@ p {
<div id="righttitle" class="english"> Vol. 0, July 2011</div> <div id="righttitle" class="english"> Vol. 0, July 2011</div>
<div id="righttitle1" class="arabic">ادجوار رود ، المجلد 1 يناير 2011</div> <div id="righttitle1" class="arabic">ادجوار رود ، المجلد 1 يناير 2011</div>
<div id="languageBtn"><span class="arabicBtn">االقائمة العربية</span> <span class="englishBtn">English Menu</span></div> <div id="languageBtn"><span class="arabicBtn">االقائمة العربية</span> <span class="englishBtn">English Menu</span></div>
</div> </div>-->
<div id="footer">
<ul id="nav">
<li>
<a href="archive" title="The Edgwareroad.org Archive">Archive</a>
</li>
<li>
<a href="upload" title="File Uploader">Upload</a>
</li>
<li>
<a href="publish" title="Publish!">Publish</a>
</li>
<li>
<a href="browse" title="Browse Publications">Browse</a>
</li>
<li>
<a href="contact" title="Contact Us">About/Contact</a>
</li>
<li>
<a href="faq" title="Frequently Asked Questions">FAQ</a>
</li>
<li> &nbsp;</li>
</ul>
<!--<div id="logo">
<a href="http://www.serpentinegallery.org/edgware_road_project.html" title="Serpentine Gallery Webpage">Serpentine <br />Gallery</a>
</div>-->
</div>
<div id="pagesWrapper">
{% autoescape off %} {% autoescape off %}
{% for p in pages %} {% for p in pages %}
<div class="page" id="page{{p.id}}"> <div class="page" id="page{{p.id}}">
@ -187,7 +215,7 @@ p {
</div> </div>
{% endfor %} {% endfor %}
{% endautoescape %} {% endautoescape %}
</div>
<p>&nbsp;</p> <p>&nbsp;</p>
<div id="contents"> <div id="contents">
<div class="english"> <div class="english">