docs: switch to new website banner

Use a dark banner whose color matches the dark green used in
the logo. Introduce a newly rendered version of the header
logo derived from new SVG file, instead of old one from
(now lost) Adobe Illustrator file.

The top banner logo now links to the front page as is common
practice for most websites.

Signed-off-by: Daniel P. Berrange <berrange@redhat.com>
This commit is contained in:
Daniel P. Berrange 2016-10-25 16:16:29 +02:00
parent 8c6e2867c3
commit 2d35438bc6
6 changed files with 72 additions and 54 deletions

View File

@ -85,8 +85,6 @@ logofiles = \
png = \
32favicon.png \
libvirt-header-bg.png \
libvirt-header-logo.png \
libvirtLogo.png \
libvirt-net-logical.png \
libvirt-net-physical.png \

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

View File

@ -2,12 +2,66 @@ h1, h2, h3, h4, h5, h6 {
color: #3c857c;
}
#header {
margin: 0px;
height: 104px;
#nav {
position: absolute;
top: 0px;
left: 0px;
height: 100px;
background: rgb(0, 95, 97);
border-bottom: 3px solid rgb(60, 133, 124);
width: 100%;
background: url(libvirt-header-bg.png);
display: table;
}
#home {
background-image: url(logos/logo-banner-light-256.png);
background-repeat: no-repeat;
background-position: left center;
height: 100px;
width: 269px;
margin-left: 1em;
text-indent: 100%; white-space: nowrap; overflow: hidden;
}
#home a {
color: rgb(0, 95, 97);
height: 100px;
width: 269px;
display: block;
}
#search {
display: table-cell;
vertical-align: middle;
width: 20em;
text-align: right;
padding: 1em;
}
#search input {
border: 0px;
height: 2em;
}
#search input[type=text] {
background: rgb(230, 230, 230);
color: rgb(0, 0, 0);
width: 10em;
padding: 0px;
padding-left: 2px;
padding-right: 2px;
}
#search input[type=submit] {
background: rgb(60, 133, 124);
color: rgb(255, 255, 255);
width: 3em;
font-weight: bold;
}
#search input[type=submit]:active,
#search input[type=submit]:hover {
color: rgb(255, 230, 0);
}
#body {
@ -16,6 +70,7 @@ h1, h2, h3, h4, h5, h6 {
border: 0px;
left: 0px;
margin: 0px;
margin-top: 120px;
}
#content {
@ -96,39 +151,6 @@ h1, h2, h3, h4, h5, h6 {
padding-left: 3em;
}
#headerLogo {
position: absolute;
top: 0px;
left: 0px;
height: 104px;
width: 400px;
background: url(libvirt-header-logo.png);
}
#headerSearch {
position: absolute;
top: 0px;
right: 0px;
padding: 2em;
z-index: 10;
}
#headerSearch input {
border: 1px solid #999999;
color: #999999;
background: white;
padding: 3px;
font-size: 1em;
}
#headerSearch #submit {
border: 1px solid #999999;
background: #eeeeee;
color: black;
padding: 3px;
font-size: 1em;
}
#sitemap ul li {
list-style: none;
}

View File

@ -141,17 +141,6 @@
<meta name="description" content="libvirt, virtualization, virtualization API"/>
</head>
<body>
<div id="header">
<div id="headerLogo"/>
<div id="headerSearch">
<form action="{$href_base}search.php" enctype="application/x-www-form-urlencoded" method="get">
<div>
<input id="query" name="query" type="text" size="12" value=""/>
<input id="submit" name="submit" type="submit" value="Search"/>
</div>
</form>
</div>
</div>
<div id="body">
<div id="menu">
<xsl:apply-templates select="exsl:node-set($sitemap)/html:ul" mode="menu">
@ -163,6 +152,19 @@
<xsl:apply-templates select="/html:html/html:body/*" mode="content"/>
</div>
</div>
<div id="nav">
<div id="home">
<a href="{$href_base}index.html">Home</a>
</div>
<div id="search">
<form action="{$href_base}search.php" enctype="application/x-www-form-urlencoded" method="get">
<div>
<input name="query" type="text" size="12" value=""/>
<input name="submit" type="submit" value="Go"/>
</div>
</form>
</div>
</div>
</body>
</html>
</xsl:template>

View File

@ -6,10 +6,6 @@
<div id="sitemap">
<ul>
<li>
<a href="index.html">Home</a>
<span>Front page of the libvirt website</span>
</li>
<li>
<a href="news.html">News</a>
<span>Details of new features and bugs fixed in each release</span>