NIHVIVO-1316: Worked on making individual pages theme agnostic.
This commit is contained in:
parent
5ee3ecd89e
commit
b6beba8380
2 changed files with 103 additions and 124 deletions
|
@ -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;
|
||||
padding-left: 0;
|
||||
}
|
||||
/* 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;
|
||||
}
|
|
@ -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>
|
||||
|
|
Loading…
Add table
Reference in a new issue