/*
Late Harvest fixed-width variation
Produced by the Wikidot Rainbow Theme Factory
by Pieter Hintjens
Color chart:
* Primary: #978623
* Hilite: #f1cc01
* Header: #978c4c
*/
/*
Rainbow Theme Set by Pieter Hintjens,
based on a design by Gabrys
using elements by James Kanjo
and by Steven Heynderickx
and with help from many others.
(c) the Authors cc-by-sa
Changelog:
* 2009-10-31 - added table formatting for PageManager module
* 2009-10-27 - added classes for tab views, by Steven Heynderickx
* 2009-10-25 - added elegant code block design from Wikidot Community
* 2009-10-25 - added join-text class for Join module
* 2009-10-06 - uses link colors for span popup texts
* 2009-09-12 - hides the error boxes shown to site members on system:join page
* 2009-09-11 - added support for hover popups over images and links
* 2009-09-10 - removed underline on links, now appears on a:hover instead
* 2009-09-09 - moved search box out of nav:side to make it less cluttered
* 2009-09-06 - buttons have a more elegant shaded look (from Wikidot www theme)
* 2009-09-01 - rainbow-base CSS is included into each rainbow theme to reduce include levels
* 2009-08-30 - a.newpage no longer shows white-on-dark but hilite-on-white
* 2009-08-21 - use http://snippets.wikidot.com/code:quotes-in-blockquotes
* 2009-08-21 - use primary color for links (instead of blue)
* 2009-08-21 - removed lowercase transform on page title
* 2009-08-21 - created, as base theme for all Rainbow themes
*/
html,body {
min-height: 101%;
}
a {
text-decoration: none;
}
a:hover {
background-color: transparent;
text-decoration: underline;
}
#container-wrap {
background: url(/local--files/green-fresh/body-bg.png) repeat-x top;
}
/* Use 950 pixels width for normal screens, 100% for iPhones */
#container {
width: 950px;
margin: 0 auto;
padding-left: 8px;
background: url(/local--files/green-fresh/shadow-left.png) no-repeat 0 89px;
position: relative;
}
@media only screen and (max-device-width: 480px) {
#container {
width: 100%;
}
}
#header {
height: 118px;
padding-right: 8px;
background: url(/local--files/green-fresh/shadow-right.png) no-repeat right 89px;
}
#header h1 {
float: left;
padding: 43px 0 0 16px;
}
#header h1 span {
padding-right: 7px;
}
#header h1 a {
font-family: "Bitstream Charter", "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif;
font-size: 25px;
font-style: normal;
font-weight: bold;
letter-spacing: 1px;
line-height: 26px;
}
#header h2 {
padding: 49px 7px 0;
font-family: "Verdana", Arial, Helvetica, sans;
font-size: 16px;
line-height: 20px;
color: #fff;
}
#header h2:before {
content: "|";
}
#header h2 span {
padding-left: 7px;
font-size: 10px;
text-transform: uppercase;
color: #777;
}
#top-bar {
width: 100%;
height: 29px;
right: 0;
left: 0;
}
#top-bar li, #top-bar ul {
margin: 0;
padding: 0;
}
#top-bar ul {
margin-right: 8px;
height: 29px;
}
#top-bar ul ul {
margin-right: 0;
}
#top-bar li a {
border-right: 1px solid #fff;
color: #fff;
font-size: 13px;
font-weight: bold;
line-height: 29px;
padding: 0 15px;
text-decoration: none;
}
#top-bar li a:hover {
text-decoration: none;
}
#top-bar li ul {
border: none;
}
#top-bar li ul li a {
width: 18em;
color: #fff;
}
#top-bar li ul li a:hover {
color: #000;
}
#content-wrap {
padding-right: 8px;
background: url(/local--files/green-fresh/shadow-right.png) no-repeat right -29px;
overflow: hidden;
}
#side-bar {
border-left:1px dashed #DDDDDD;
float:right;
margin-top:10px;
overflow:hidden;
padding:0 15px 0;
width:200px;
}
#main-content {
margin: 20px 0 20px 0;
padding: 0 15px;
min-height: 150px;
overflow: hidden;
}
h1, h2, h3, #page-title {
padding: 0;
margin: 15px 0;
}
#page-content > *:first-child {
margin-top: 0;
}
#page-title {
padding-bottom: 2px;
border-bottom: 1px solid #eee;
margin-top: 0;
font-size: 180%;
}
#login-status {
right: 8px;
top: 8px;
}
#top-bar li a:hover {
background: white;
}
#search-top-box {
right:-53px;
top:50px;
}
#search-top-box .button {
visibility: hidden;
}
#search-top-box input.empty {
background-color:#EEEEEE;
color:#999999;
}
#search-top-box .text {
padding:2px 2px 2px 5px;
width:220px;
}
#login-status a {
text-decoration: none;
}
#login-status #account-topbutton, #account-options li a:hover, .change-textarea-size a {
color: #fff;
}
#login-status #account-topbutton:hover, .change-textarea-size a:hover {
color: #000;
}
div.buttons input, input.button, button, file, a.button {
background: #F4F4F4 url(http://themes.wikidot.com/local--files/rainbow-base/button_2.png) repeat-x;
border: 1px solid #DDD;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
height: 26px;
}
div.buttons input:hover, input.button:hover, button:hover, a.button:hover {
background-color: #DDD;
background-position: 0 -26px;
border: 1px solid #DDD;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
color: #000;
height: 26px;
}
div.page-calendar-box {
padding: 0;
}
/* Quotes in Blockquotes by James Kanjo */
/* http://snippets.wikidot.com/code:quotes-in-blockquotes */
blockquote {
background-image: url(http://snippets.wikidot.com/local--files/code:quotes-in-blockquotes/quote-right.gif);
background-repeat: no-repeat;
background-position: bottom right;
}
blockquote p {
background-image: url(http://snippets.wikidot.com/local--files/code:quotes-in-blockquotes/quote-left.gif);
background-repeat: no-repeat;
margin-top: 0;
padding: 1em 60px 0;
min-height: 37px;
}
blockquote p + p { padding-top: 0; background-image: none;}
#breadcrumbs {
margin-bottom: 1em;
}
.odate, .like-odate {
font-size: 85%;
font-weight: bold;
color: #666;
background: transparent;
margin: 0;
padding-top: 0;
padding-bottom: 0;
}
#membership-by-password-box error-block,
#membership-apply-box error-block,
.member .error-block {
display:none;
}
/* Pop-up hover text over images or links, based on James Kanjo's design, improved & simplified by Pieter Hintjens */
/* Use: [[span class="hover"]]Image or link[[span]]Hover text[[/span]][[/span]] */
.hover span {
display: none;
}
.hover:hover span {
position: absolute;
display: inline;
margin: 20px -20px 0 0;
height: auto;
width: auto;
background: #eee;
border: 1px solid #555;
color: #555;
padding: 1em;
font-size: 12px;
}
.hover:hover span span {
position: relative;
margin: auto;
height: auto;
width: auto;
border: none;
padding: 0;
}
.hover:hover {
background-color: transparent;
text-decoration: underline;
}
/* Text-only Join link by Ken Tsang */
.join-text a {
display: inline;
margin: 0;
padding: 0;
font-size: 100%;
background: none;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
text-decoration: none;
}
.join-text a:hover {
text-decoration: underline;
}
/* Use elegant code brackets from Wikidot Community */
.code {
-moz-box-shadow: 10px -5px 15px #ddd;
background-color:#E1E8E8;
background-image:url(http://community.wikidot.com/local--files/admin:css/brackets.png);
background-repeat:no-repeat;
border:2px dotted darkgrey;
font-family:monospace;
font-size:12px;
margin:0.4em 0 0.4em 40px;
min-height:65px;
overflow:auto;
padding: 0 1em 0 40px;
width:85%;
}
/* For PageManager module (http://modules.wikidot.com) */
/* Table style is layout, header/footer are top & bottom rows */
.layout {
border-collapse:collapse;
color:#3B485F;
width: 100%;
table-layout:fixed;
}
.layout tr {
background: #FCFFDF;
border-bottom:1px solid #EFEFEF;
}
.layout td {
padding-left: 1em;
}
.layout .truncate {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.layout .header {
height: 2em;
background: #AFCCFF;
border-bottom: 1px solid #9F9F9F;
font-weight: bold;
font-size: 13px;
}
.layout .footer {
background: #FCFFDF;
border-top: 1px solid #9F9F9F;
border-bottom: 1px solid #9F9F9F;
font-weight: bold;
}
body {
background: #fff url(http://themes.wdfiles.com/local--files/late-harvest/footer-bg.png) repeat-x bottom;
}
a {
color: #978623;
}
a:hover {
color: #978623;
}
a.newpage {
color: #f1cc01;
}
h1, h2, h3, #page-title {
color: #978623;
}
#header h1 a {
color: #978c4c;
}
#top-bar ul {
background: url(http://themes.wdfiles.com/local--files/late-harvest/menu-bg.png) repeat-x top;
}
#top-bar li a:hover {
background: url(http://themes.wdfiles.com/local--files/late-harvest/menu-hover.png);
}
#top-bar li ul li a {
background: #978623;
}
#top-bar li ul li a:hover {
background: #f1cc01;
}
#login-status a {
color: #978623;
}
#login-status #account-topbutton, #account-options li a:hover, .change-textarea-size a {
background: #978623;
}
#login-status #account-topbutton:hover, .change-textarea-size a:hover {
background: #f1cc01;
}
input.text, textarea {
border-color: #978623;
}
.hover {
color: #0a9200;
}
.hover:hover{
color: #0a9200;
}
/* Classes for tab views, by Steven Heynderickx */
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
border:solid #978623; /* color of the line between tab list and content */
border-width:0 0 3px; /*thickness of the line between tab list and content */
}
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
margin:0 1px 0 0; /* space between tabs */
}
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
margin:0 1px -1px 0; /* for overlap */
}
/* Settings for unselected tabs */
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
background:#978c4c url(http://themes.wikidot.com/local--files/rainbow-base/tabcolor.png) repeat-x -3px;
border-top:solid #978623 1px;
border-left:solid #978623 1px;
border-right:solid #978623 1px;
font-weight:600;
font-size:80%;
color:#000;/*tab text color*/
}
/* Settings for unselected tabs */
.yui-navset .yui-nav a:hover,
.yui-navset .yui-navset-top .yui-nav a:hover {
background:#f1cc01
}
/* Settings for unselected tabs */
.yui-navset .yui-nav a em,
.yui-navset .yui-navset-top .yui-nav a em {
border:solid #f00 0px;
}
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus, /* no focus effect for selected */
.yui-navset .yui-nav .selected a:hover { /* no hover effect for selected */
background:#978623 url(http://themes.wikidot.com/local--files/rainbow-base/tabcolor.png) repeat-x -3px;
color:#fff;border:1px solid #978623;
}
of this method of using a central depositry as this is that the auhor can make some edits to the css, that you might not wish for your own site.
Of course, he could also make some welcome additions/changes to it.
Just something to bear in mind :-)
This is the problem with all dynamic inheritance.
Indeed, I tweak the themes as people make suggestions that match my own observation and use.
We are going to need some more reliable place to make, discuss, and report on such changes.
Portfolio
Great comment pieterh!
Swag
great post
jjj