NIHVIVO-1316: Worked on making individual pages theme agnostic.

This commit is contained in:
mb863 2010-12-21 22:51:55 +00:00
parent 5ee3ecd89e
commit b6beba8380
2 changed files with 103 additions and 124 deletions

View file

@ -3,6 +3,68 @@
@charset "UTF-8";
/* CSS Document */
/* ADMIN PANEL------> */
div.admin{
color: #fff;
background: #aaa;
padding: 6px;
height: 1%; /* IE likes this */
width: 98%; /* and this */
}
div.panelContents{
color: #777;
background: #e5e3d5;
/*display: none;*/
padding: 12px;
}
div.top{
margin: 0;
padding: 0 24px 0 0;
position: relative;
top: -16px;
background: #e5e3d5;
}
div.bottom{
margin: 0 -12px;
position: relative;
bottom: -16px;
padding: 6px 12px 8px 12px;
}
.admin h3{
font-size: 1em;
text-transform: uppercase;
font-weight: bold;
color: #ddd;
background: #aaa;
line-height: 2em;
margin: 0 !important; /* fix for IE6 */
margin-right: -24px;
padding: 0 12px;
width: 100% !important; /* fix for IE6 */
width: auto;
}
.admin p{
margin-bottom: .25em;
}
.admin a:link,
.admin a:visited{
color: #fff;
}
.panelContents a:link,
.panelContents a:visited{
color: #777;
}
.admin a:hover,
.admin a:active {
color: #000;
}
#loginPanel ul {
margin: 0;
}
#loginPanel li {
list-style-type: none;
margin-bottom: .5em;
}
/* <------ INDIVIDUAL INTRO FOR ANY CLASS*/
#individual-intro{
width: 920px;
@ -11,23 +73,17 @@
margin-bottom: 30px;
}
#individual-intro h1{
font-size: 22px;
color: #2485ae;
padding-bottom: 24px;
}
#individual-intro span.preferred-title{
font-size: 18px;
color: #5e6363;
padding-left: 10px;
margin-left: 10px;
border-left: 1px solid #5e6363;
}
/* <------ INDIVIDUAL INTRO FOR PERSON*/
#individual-intro-person{
float:left;
width: 700px;
float: left;
width: 75%;
margin-top: 35px;
border-right: 1px solid #edf0ed;
margin-bottom: 30px;
}
/* <------ INDIVIDUAL INTRO LEFT CONTENT */
@ -40,15 +96,13 @@
#left-side img.individual-photo2{
width: 160px;
height: 160px;
border: 7px solid #ebebeb;
}
ul#individual-tools-people{
margin-top: 5px;
height: 27px;
padding-bottom: 20px;
overflow: hidden;
border-bottom: 1px solid #e8ece9;
color: #b2d15a;
list-style-type: none;
}
ul#individual-tools-people li{
position: relative;
@ -56,73 +110,65 @@ ul#individual-tools-people li{
padding-right: 14px;
float: left;
}
ul#individual-tools-people li a{
color: #b2d15a;
}
ul#individual-tools{
margin-top: -18px; /*not good adding negative margin*/
height: 38px;
overflow: hidden;
float: left;
width: 150px;
color: #b2d15a;
color: #8AA149
}
ul#individual-tools li{
position: relative;
display: block;
padding-right: 14px;
float:l eft;
float: left;
line-height: 27px;
}
ul#individual-tools li a{
color: #b2d15a;
}
.picto-font{
font-family: 'Pictos';
}
.picto-uri{
font-size: 27px;
font-size: 1.68em;
}
.picto-pdf{
font-size: 27px;
font-size: 1.68em;
}
.picto-share{
font-size: 27px;
font-size: 1.68em;
}
.icon-rdf{
position:absolute;
font-size: 18px;
position: absolute;
font-size: 1.125em;
top: 16px;
}
.picto-email{
font-size: 22px;
color: #aeb1b1;
font-size: 1.375em;
padding-right: 5px;
}
#left-side a.email{
font-size: 14px;
color: #5f6464;
display:block;
font-size: .875em;
display: block;
margin-top: 15px;
}
#left-side a.tel{
font-size: 14px;
color: #5f6464;
font-size: .875em;
display: block;
margin-top: 15px;
}
.icon-phone{
vertical-align:middle;
vertical-align: middle;
padding-right: 5px;
}
ul#individual-urls{
list-style:url(../../images/individual/arrow-grey.gif);
list-style: none;
list-style-type: circle;
margin-left: 10px;
float: left;
margin-bottom: 30px;
}
ul#individual-urls li{
font-size: 14px;
font-size: .875em;
line-height: 1.2em;
}
ul#individual-urls li a{
@ -130,73 +176,55 @@ ul#individual-urls li a{
}
ul#individual-urls-people{
margin-top: 20px;
list-style: url(../../images/individual/arrow-grey.gif);
list-style: none;
list-style-type: circle;
padding-left: 24px;
}
ul#individual-urls-people li{
font-size: 14px;
font-size: .875em;
line-height: 1.2em;
}
ul#individual-urls-people li a{
color: #2485ae;
}
/* <------ INDIVIDUAL RIGHT CONTENT */
#individual-info{
width: 400px;
width: 65%;
float: left;
padding: 60px 0 0 10px;
color: #5e6363;
}
#individual-info h1.fn{
font-size: 22px;
color: #2485ae;
padding-bottom: 24px;
}
h1.fn .preferred-title {
font-size: 18px;
color: #5e6363;
padding-left: 10px;
margin-left: 10px;
border-left: 1px solid #a6b1b0;
}
#individual-info h2{
font-size: 18px;
font-weight: normal;
padding-bottom: 18px;
padding-bottom: 10px;
}
ul#individual-positions{
font-size: 16px;
padding-bottom: 24px;
list-style: url(../../images/individual/arrow-green.gif);
list-style: none;
list-style-type: circle;
padding-left: 20px;
}
ul#individual-positions li{
line-height: 1.2em;
}
ul#individual-positions li a{
color: #2485ae;
line-height: 1em;
}
.individual-overview{
font-size: 16px;
padding-bottom: 32px;
font-size: 1em;
padding-bottom: 0;
line-height: 1.3em;
}
ul#individual-areas{
font-size: 16px;
padding-bottom: 24px;
}
ul#individual-areas li{
float: left;
border-right: 1px solid #5e6363;
padding-right: 10px;
padding-left: 10px;
}
ul#individual-areas li:first-child{
padding-left: 0;
}
ul#individual-areas li: last-child{
border-right:none;
}
ul#individual-areas li{
float:left;
border-right: 1px solid #5e6363;
@ -213,41 +241,29 @@ ul#individual-areas li a{
width: 226px;
}
/* <------ SPARKLINES */
#sparklines-publications{
#sparklines-publications{
width: 184px;
padding: 0 20px 45px 20px;
}
#sparklines-publications h3{
padding-top: 10px;
font-size: 20px;
color: #2485ae;
margin-bottom: 10px;
}
.publication-year-range{
display: block;
padding-top: 5px;
font-size: 14px;
}
a.all-vivo-publications{
font-size: 14px;
color: #5e6363;
}
/* <------ COAUTHORS */
#co-authors{
padding: 0 20px 30px 20px;
}
img.co-author{
border: 2px solid #ebebeb;
margin-right: 5px;
margin-bottom: 5px;
}
#co-authors h3{
font-size: 20px;
color: #2485ae;
margin-bottom: 10px;
}
#co-authors ul{
}
#co-authors ul li{
display: block;
float: left;
@ -255,53 +271,40 @@ img.co-author{
p.view-all-coauthors{
clear: both;
width: 200px;
font-size: 14px;
text-align: left;
}
/* PROPERTY GROUP MENU------> */
#property-group-menus{
clear:both;
width: 920px;
clear: both;
width: 95%;;
height: 46px;
border: 1px solid #dfebe5;
margin: 0 auto;
margin-bottom: 10px;
background: #f1f2ee;
margin-top: 20px;
}
#property-group-menus ul{
display:block;
display: block;
color: #5e6363;
font-size: 16px;
}
#property-group-menus li{
float:left;
float: left;
line-height: 46px;
padding-right: 15px;
padding-left: 15px;
background: url(../../images/individual/separator-property-group-nav.jpg) right 10px no-repeat;
}
#property-group-menus a{
color: #5e6363;
}
#property-group-menus a:hover{
color: #002b44;
}
#property-group-menus li:fisrt-child{
padding-left: 0;
}
#property-group-menus li:last-child{
background: none;
}
/* PROPERTY GROUP------> */
.property-group{
position: relative;
clear: both;
width: 920px;
border: 1px solid #dfebe5;
width: 95%;
margin: 0 auto;
margin-bottom: 10px;
background: #fff;
margin-bottom: 20px;
border: 1px solid #dfebe5;
}
.scroll-up{
position: absolute;
@ -312,52 +315,28 @@ p.view-all-coauthors{
}
section.property-group h2{
padding: 20px 25px 12px 35px;
font-size: 20px;
color: #2485ae;
font-weight: normal;
/*background:url(../../images/individual/arrow-down.gif) 120px 24px no-repeat;*/
}
article.property{
width: 852px;
width: 93%;
margin: 0 auto;
border: 1px solid #dfe6e5;
margin-bottom: 20px;
border: 1px solid #dfe6e5;
}
article.property h3{
border-bottom: 1px solid #dfe6e5;
background: #fafaf9;
font-size: 17px;
color: #8aa149;
padding: 10px 20px 10px 20px;
}
article.property .data-property-statement{
background: #fff;
font-size: 16px;
color: #5e6363;
padding: 10px 20px 10px 20px;
line-height: 1.2em;
margin-bottom: 0;
}
article.property ul.property-list{
background: #fff;
font-size: 16px;
color:# 5e6363;
}
article.property ul.property-list li{
line-height: 1.2em;
padding-bottom: 10px;
padding: 10px 20px 10px 20px;
}
article.property ul.property-list li a{
color: #2485ae;
}
/* MISCELLANEOUS------> */
.blue{
color: #2485ae;
}
.grey{
color: #5e6363;
}
.green{
color: #b2d15a;
}

View file

@ -7,7 +7,7 @@
<#assign groupname = group.name(nameForOtherGroup)>
<section class="property-group" role="region">
<nav class="scroll-up" role="navigation"><a href="#property-nav"><img src="${urls.images}/individual/scroll-up.png" /></a></nav>
<nav class="scroll-up" role="navigation"><a href="#property-nav"><img src="${urls.images}/individual/scroll-up.png" alt="scroll to property group menus" /></a></nav>
<#-- Display the group heading -->
<#if groupname?has_content>