Author
Supported Browsers
 |
 |
Screenshots
|
Download
This theme requires images to render properly, so it has been bundled as a Stylesheet Theme. You can install the JAR file to use this stylesheet as a theme:
See Creating a Stylesheet Theme for more information about this theme, including how to package your own theme in the same way.
CSS
You cannot simply drop the CSS for this theme into Confluence. It requires images to work properly. See the Download instructions above for more information.
The stylesheet used by this theme is provided below for example purposes.
/* Global styles */
body {
/* font-family: "Optima", Helvetica, Arial, sans-serif; */
font-size: 13px;
}
#main {
padding: 0 10px 20px;
margin: 0 -10px;
}
h1, h2, h3, h4, h5, h6, .blogHeading, .calendarhead {
/* font-family: "Optima", Helvetica, Arial, sans-serif; */
}
.wiki-content,
.wiki-content p,
.wiki-content table,
.wiki-content tr,
.wiki-content td,
.wiki-content th,
.wiki-content ol,
.wiki-content ul,
.wiki-content li {
font-size: 13px;
}
/* Tab navigation */
li.tab a {
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
background-image: url(gradient-light.png);
background-repeat: repeat-x;
background-position: 0 0;
background-color: #1c5994;
font-weight: normal;
}
li.tab a:hover {
background-image: url(gradient-dark.png);
border-color: #1c5994;
}
.tab-navigation .current a,
.tab-navigation .current a:hover {
background-image: none;
}
/* Menus */
.ajs-drop-down {
-webkit-box-shadow: 0px 4px 8px #ccc;
box-shadow: 0px 4px 8px #ccc;
}
#navigation .ajs-menu-bar .ajs-button a:hover,
.ajs-menu-bar li.ajs-menu-item.opened,
.ajs-menu-bar .ajs-menu-item li.active,
.ajs-menu-bar li.ajs-menu-item.opened .ajs-drop-down li.active,
#header .ajs-menu-bar li.ajs-menu-item.opened .ajs-drop-down li.active,
.ajs-menu-bar li.ajs-menu-item.opened a.trigger {
background-image: url(gradient-light.png);
background-repeat: repeat-x;
background-position: 0 0;
background-color: transparent;
}
#navigation .ajs-menu-bar .ajs-button a:hover,
.ajs-menu-bar li.ajs-menu-item a:hover,
.ajs-menu-bar .ajs-menu-item li.active,
.ajs-menu-bar li.ajs-menu-item.opened .ajs-drop-down li.active,
#header .ajs-menu-bar li.ajs-menu-item.opened .ajs-drop-down li.active,
.ajs-menu-bar li.ajs-menu-item.opened a.trigger {
text-shadow: 0px 1px 2px #013;
}
.ajs-menu-bar .ajs-menu-item li.active a,
.ajs-menu-bar li.ajs-menu-item.opened .ajs-drop-down li.active a,
#header .ajs-menu-bar li.ajs-menu-item.opened .ajs-drop-down li.active a {
background-color: transparent;
}
.ajs-drop-down {
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
/* Hide some ugly stuff */
#children-section,
.page-metadata,
.blogcalendar {
display: none;
}
/* Header, header menus */
#header {
background-image: url(gradient-dark.png);
background-repeat: repeat-x;
background-position: 0 0;
background-color: #036;
min-height: 32px;
line-height: 28px;
}
#header .ajs-menu-bar li.ajs-menu-item.opened,
#header .ajs-menu-bar li.ajs-menu-item.opened a.trigger {
background-image: url(gradient-dark-invert.png);
background-repeat: repeat-x;
background-position: 0 0;
background-color: #1c5994;
border: none;
}
#breadcrumbs,
#header .ajs-menu-bar li.ajs-menu-item a.trigger {
color: #fff;
text-shadow: 0px 1px 2px #013;
font-size: 0.9em;
font-weight: bold;
}
#header .ajs-menu-bar li.ajs-menu-item,
#header .ajs-menu-bar li.ajs-menu-item.opened,
#header .ajs-menu-bar li.ajs-button {
padding: 3px 0;
}
/* Max width */
.view .wiki-content {
max-width: 60em;
}
#content.view {
padding-left: 56px;
}
#content.view .pageSection {
margin-left: -56px;
}
/* Breadcrumbs */
#breadcrumbs li {
padding: 0 .5em 0 1.2em;
background-image: url(divider.png);
background-repeat: no-repeat;
background-position: 0 50%;
}
#breadcrumbs li span {
display: block;
overflow: hidden;
line-height: 32px;
height: 32px;
}
#breadcrumbs li:first-child {
display: inline;
padding: 0;
background-image: none;
}
#breadcrumbs li:first-child a {
background: none;
}
#breadcrumbs li:first-child a {
display: block;
text-indent: -9999em;
background-image: url(home-16.png);
background-repeat: no-repeat;
background-position: 0 50%;
height: 30px;
width: 20px;
}
#breadcrumbs a {
text-decoration: none;
}
#header-menu-bar {
margin-top: 3px;
}
/* Section headers: labels, comments, etc. */
.section-header {
background-image: url(gradient-dark.png);
color: #fff;
height: 32px;
line-height: 32px;
margin: 25px -10px 5px;
padding: 0 10px;
text-shadow: 0px 1px 1px #013;
}
h2.section-title, .pageSectionTitle,
.section-header li {
color: #fff;
}
.section-header a:link,
.section-header a:active,
.section-header a:hover,
.section-header a:visited,
#default-labels-header a.add {
color: #fff;
text-decoration: none;
padding: 0 5px;
}
.section-header li:before {
content: '\B7';
}
.section-header li {
padding: 0;
border: none;
}
.section-header li:first-child:before {
content: '';
}
.section-header h2 a,
.section-header h2 a:hover {
padding: 0;
}
#labels-section-title.hidden {
display:inline;
visibility:visible;
}
/* Comments */
.comment img.userLogo {
width: 48px;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}
.comment-header {
display: none;
}
.comment .comment-user-logo {
width: 58px;
background-image: url(gradient-comment-side.png);
background-position: 100% 0;
background-repeat: no-repeat;
}
.comment.odd .comment-user-logo {
background-image: url(gradient-comment-side-light.png);
}
.comment.odd .comment-body {
background-image: url(gradient-comments-light.png);
border: 1px solid #f5f5f5;
}
.comment-body {
background-image: url(gradient-comments.png);
background-repeat: repeat-x;
overflow: visible;
margin-left: 58px;
padding: .7em;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #e2e2e2;
}
#comments-section .comment.odd,
#comments-section .comment.focused,
#comments-section .comment.edit {
background-color: white;
}
#comments-section .comment {
border: none;
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
padding: 0;
}
.comment .date {
color: #333;
margin: .5em;
}
.comment-content p:first-child {
margin-top: 0;
}
.comment-actions {
font-size: .8em;
}
.comment-actions a {
color: #666;
}
#comments-expand-collapse {
display: none;
}
td.comment { /* fix for attachments macro in 2.8, 2.9 */
background: transparent;
}