doc/en_US.ISO8859-1/htdocs/layout/css/layout.css
Warren Block bf0a6a755e Embiggen fonts and emwiden display. Adjust the main web site CSS so
that fonts are not tiny and the site uses more than the middle third of
the monitor.  Discussed in -doc.

Differential Revision:	https://reviews.freebsd.org/D3215
2015-09-09 00:30:44 +00:00

515 lines
7.6 KiB
CSS

/*
* FreeBSD.org - Layout Styles
*
* $FreeBSD$
*/
/* Container Definitions */
/* Page Container */
#containerwrap {
text-align: center; /* Win IE5 */
}
#container {
margin: 0em auto;
width: 90%;
padding: 0;
padding-top: 0px;
padding-bottom: 15px;
text-align: left; /* Win IE5 */
}
/* Header */
#headercontainer {
padding-bottom: 2px;
}
#header {
position: relative;
height: 15%;
margin: 0;
padding: 0;
clear: both;
}
#headerlogoleft {
position: relative;
border: 0px;
padding: 0px;
top: 0px;
float: left;
}
#headerlogoleft img {
border: 0px;
}
#headerlogoright {
position: relative;
border: 0px;
padding-left: 0px;
margin-right: -4%;
float: right;
}
#headerlogoright img {
border: 0px;
}
/* Search */
#search {
position: relative;
text-align: right;
padding: 0;
margin: 0;
margin-top: 6px;
color: #666;
}
#search form {
position: relative;
top: 5px;
right: 0;
margin: 0; /* need for IE Mac */
text-align: right; /* need for IE Mac */
white-space: nowrap; /* for Opera */
}
#search form label {
color: #666;
}
#search form #submit {
background: transparent;
color: #fff;
border-right: 1px solid #DADADA;
border-bottom: 1px solid #DADADA;
border-top: 1px solid #DADADA;
border-left: 1px solid #DADADA;
padding: 1px 5px 1px 5px;
}
#search form #words {
width: 50%;
border: 1px solid #DADADA;
background: #FFFFFF;
color: #666;
padding: 2px 2px 2px 5px;
}
/* Mirror Select */
#mirror {
text-align: right;
padding: 0;
margin: 0;
margin-top: 6px;
color: #666;
}
#mirror form {
padding-top: 5px;
right: 0;
margin: 0; /* need for IE Mac */
text-align: right; /* need for IE Mac */
white-space: nowrap; /* for Opera */
}
#mirror form label {
color: #666;
font-size: 0.8em;
}
#mirror form select {
font-size: 0.8em;
}
#mirror form #mirrorsel {
font-size: 0.8em;
width: 150px;
border: 1px solid #DADADA;
background: #FFFFFF;
color: #666;
}
#mirror input {
font-size: 0.8em;
background: transparent;
color: #666;
border: 1px solid #DADADA;
}
/* Content */
#content {
clear: both;
display: block;
}
#frontcontainer {
width: 100%;
}
#frontfeaturecontainer {
clear: both;
}
#frontfeatureleft{
width: 30%;
margin: 0;
padding: 0;
float: left;
}
#frontfeatureleft h2 {
border: none;
margin-top: 0;
}
#frontfeatureleft p {
margin: 0 0 1em 0;
}
#frontfeaturecontent {
margin: 10px 10px 10px 13px;
}
#frontfeaturemiddle {
float: left;
margin-top: 20px;
background: url(../images/beastie.png) no-repeat top left;
min-height: 196px;
width: 30%;
}
#frontfeatureright {
position: relative;
border: 0px;
padding: 0px;
margin: 0px;
width: 30%;
float: right;
}
/* News/Events/Media/Security Box */
#frontnemscontainer {
width: 100%;
background: #eee;
display: inline;
float: left;
margin-top: 8px;
margin-bottom: 8px;
}
#frontnews {
width: 24%;
margin: 0;
padding: 0;
float: left;
}
#frontnewscontent {
margin: 17px 15px 24px 18px;
}
#frontevents {
width: 24%;
margin: 0;
padding: 0;
float: left;
}
#fronteventscontent {
margin: 17px 15px 24px 14px;
}
#frontmedia {
width: 24%;
margin: 0;
padding: 0;
float: left;
}
#frontmediacontent {
margin: 17px 15px 24px 14px;
}
#frontsecurity {
width: 24%;
margin: 0;
padding: 0;
float: left;
}
#frontsecuritycontent {
margin: 17px 15px 24px 14px;
}
/* No way to get equal columns in pure CSS - setting height is a temporary hack */
.frontseparator {
width: 0.5%;
height: 500px;
margin: 0;
padding: 0;
background-color: #fff;
float: left;
}
.newseventswrap {
padding-left: 5px;
}
.newseventslist {
list-style: none;
margin: 0;
padding: 0;
display: inline;
}
.newseventslist img.rssimage {
display: inline;
border: 0;
vertical-align: bottom;
}
.newseventslist li {
padding: 0 0.3em 0 0.5em;
display: inline;
border-right: 1px solid #E1E1E1;
}
.newseventslist li a {
}
.newseventslist li.last-child {
border-right: 0;
padding-right: 0;
}
.newseventslist li.first-child {
padding-left: 0;
}
.newseventslist li.only-child {
border-right: 0;
padding-left: 0;
}
/* Shortcuts */
#frontshortcuts {
margin: 0;
padding: 0;
color: #666;
}
#frontshortcutscontent {
float: right;
margin: 0;
padding: 0;
padding-left: 15px;
padding-top: 20px;
}
#frontshortcutslist {
margin: 0;
padding: 0;
margin-left: 5px;
margin-top: 5px;
list-style: none;
}
#frontshortcutslist li {
margin: 0;
padding-left: 12px;
background-image: url(../images/blt_red_arrow.png);
background-repeat: no-repeat;
background-position: 0px 0.5em;
}
/* Latest Releases */
#frontreleases {
padding: 0;
margin: 8px;
margin-left: 190px;
margin-top: 5px;
padding-bottom: 20px;
color: #666;
width: 85%;
}
#frontreleasescontent {
margin: 0;
padding: 0;
}
#frontreleaseslist {
margin: 0;
padding: 0;
margin-left: 5px;
margin-top: 5px;
list-style: none;
}
#frontreleaseslist li {
margin: 0;
padding-left: 12px;
background-image: url(../images/blt_red_arrow.png);
background-repeat: no-repeat;
background-position: 0px 0.5em;
}
/* New User Box */
/* height and width details */
.frontnewtop div, .frontnewtop, .frontnewbot div, .frontnewbot {
width: 100%;
height: 12px;
}
.frontnewcontent {
margin: 0;
padding: 0;
margin-top: -4px;
margin-bottom: -4px;
text-align: center;
font-size: 1.1em;
font-weight: bold;
}
.frontnewcontent a, .frontnewcontent a:link, .frontnewcontent a:visited, .frontnewcontent a:hover, .frontnewcontent a:active {
color: #990000;
text-decoration: none;
}
.frontnewroundbox {
float: left;
margin: 0;
margin-top: 30px;
padding: 0;
width: 130px;
background-color: #D8D8D8;
border-radius: 10px;
}
/* Donate Button */
/* height and width details */
.frontdonatetop div, .frontdonatetop, .frontdonatebot div, .frontdonatebot {
width: 20%;
height: 10px;
font-size: 1px;
text-align: center;
}
.frontdonatecontent {
margin: 0;
padding: 0;
margin-top: -4px;
margin-bottom: -4px;
text-align: center;
font-size: 1.1em;
font-weight: bold;
}
.frontdonatecontent a, .frontdonatecontent a:link, .frontdonatecontent a:visited, .frontdonatecontent a:hover, .frontdonatecontent a:active {
color: #990000;
text-decoration: none;
}
.frontdonateroundbox {
margin-top: 10px;
padding: 0;
width: 180px;
background-color: white;
border-radius: 10px;
}
/* Get FreeBSD Box */
/* height and width details */
.frontgettop div, .frontgettop, .frontgetbot div, .frontgetbot {
width: 100%;
height: 18px;
font-size: 1px;
}
.frontgetcontent {
margin: 0;
padding: 0;
margin-top: -8px;
margin-bottom: -8px;
text-align: center;
font-size: 1.4em;
font-weight: bold;
}
.frontgetcontent a, .frontgetcontent a:link, .frontgetcontent a:visited, .frontgetcontent a:hover, .frontgetcontent a:active {
color: #990000;
text-decoration: none;
}
.frontgetroundbox {
margin-top: 50px;
margin-left: 160px;
padding: 0;
width: 190px;
background-color: #FACC2E;
border-radius: 15px;
}
/* Secondary Pages */
#sidewrap {
float: left;
width: 166px;
margin-top: 15px;
margin-right: -170px;
}
#rightwrap {
float: right;
width: 166px;
margin-left: 15px;
}
#contentwrap {
margin-left: 170px;
padding-top: 15px;
}
/* Footer */
#footer {
font-size: 0.9em;
text-align: center;
color: #737373;
line-height: 1.3em;
padding-top: 5px;
clear: both;
}
/* Misc Classes */
.clearboth {
clear: both;
margin: 0;
padding: 0;
}
.blockhide {
display: none;
height: 0;
width: 0;
overflow: hidden;
position: absolute; /* IE5 Mac */
}
img {
border: 0;
}