Carsten Ziegeler wrote:
Looks really nice - apart from the colors; personally I would prefer
some "lighter" colors but I guess tweaking colors is much simpler than
doing the rest of the layout.
Just a quick change, might need some polishing. Replace the portal.css
in "files" with the one attached and add the gif to "files".
Have fun. ;-)
Bye, Helma
/*
* Copyright 1999-2005 The Apache Software Foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http: //www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/* general settings */
body {
background-color: white;
margin: 0;
font-family: Verdana, Helvetica, sans-serif;
font-size: 10pt;
line-height: 12pt;
color: black;
border-left: 5px solid white;
border-right: 5px solid white;
}
p, li {
/* letter-spacing: 0.2mm; */
/* word-spacing: 0.8mm; */
}
h1 {
font-size: 13pt;
}
/* portal styling */
.cocoon-portal-header {
width: 100%;
height: 42px;
background-color: #0076a3;
}
#cocoon-portal-header-logo {
display: none;
}
#cocoon-portal-header-logout {
position: relative;
float: right;
right: 0px;
bottom: -20px;
padding-right: 0.5em;
vertical-align: middle;
}
#cocoon-portal-header-logout img {
display: none;
}
#cocoon-portal-header-logout a {
padding: 0.5em;
vertical-align: middle;
color: white;
font-weight: bold;
text-decoration: none;
}
.cocoon-portal-content {
overflow: auto;
}
.cocoon-portal-footer {
clear: both;
width: 100%;
height: 10px;
margin-top: 5px;
background-color: #0076a3;
}
.cocoon-portal-columns {
clear: both;
width: 100%;
overflow: auto;
border: 0;
}
.cocoon-portal-column {
float: left;
margin: 0 5px 0 5px;
}
.cocoon-portal-rows {
clear: both;
width: 100%;
overflow: auto;
border: 0;
}
.cocoon-portal-row {
clear: both;
margin: 5px 0 5px 0;
}
/* coplet styling */
.coplet {
background-color: white;
border-right: 1px solid white;
border-bottom: 1px solid white;
border-top: 0;
background: url("shadowAlpha.png") repeat bottom right;
padding: 0 0px 0px 0;
margin: 5px 0 0 5px;
}
.coplet .innerbox {
position: relative;
bottom: 5px;
right: 5px;
border: 1px solid #787878;
}
.coplet-borderless {
/* border: 1px dotted #eee; */
border-top: 1px solid white;
background: url("shadowAlpha.png") bottom right repeat;
padding: 0 5px 5px 0;
}
.coplet-header {
width: 100%;
background: url("balk.gif") top left repeat-x;
height: 24px;
border: 1px 0 1px 0 solid #ffff00;
}
.coplet-borderless .coplet-header {
border: 0;
}
.coplet-title {
float: left;
color: white;
margin: 0px;
padding: 0.2em;
font-size: 10pt;
font-weight: bold;
line-height: 12pt;
}
.coplet-icons {
float:right;
width: auto;
padding: 0.2em;
}
.coplet-icon {
float: left;
padding: 0px;
padding-left: 1px;
}
.coplet-content {
padding: 0 0.5em 0.5em 0.5em;
background-color: white;
border: 0;
border-top: 1px solid white;
/*
border-left: 1px solid #787878;
border-top: 1px solid white;
*/
}
.coplet-borderless .coplet-content {
border: 0;
border-top: 1px solid white;
}
/* tabbed menu styling */
.tab-layout {
width: 100%;
height: 24px;
padding: 0;
border: 0;
background: url("balk.gif") repeat-x top left;
}
.tab-layout ul {
display: block;
list-style: none outside;
margin: 0 0 0 10px;
padding: 0;
height: 24px;
font-size: 10pt;
}
.tab-layout li {
display: block;
float: left;
position: relative;
height: 24px;
border-left: 1px solid #E1E3EB;
border-right: 1px solid #7B81A9;
color: white;
font-weight: bold;
vertical-align: middle;
}
.tab-layout a {
height: 24px;
text-decoration: none;
padding: 0 1.5em 0 1.5em;
color: white;
vertical-align: middle;
}
.tab-layout li:hover {
color: black;
background: url("nav_tab_bg_on.jpg") top left repeat-x;
}
.tab-layout a:hover {
height: 24px;
color: black;
background: url("nav_tab_bg_on.jpg") top left repeat-x;
}
.tab-layout li.tab-selected {
height: 24px;
padding: 0 1.5em 0 1.5em;
vertical-align: middle;
background: url("nav_tab_bg_on.jpg") top left repeat-x;
color: black;
}
.tab-layout li.tab-selected a {
color: black;
}
div.tab-layout-clear {
clear: both;
font-size: 0px;
line-height: 5px;
height: 5px;
}
