NIHVIVO-641: Added accessibility, organized and cleaned up individual.css, Also, I have been themming individual display and wiring freemarker data
This commit is contained in:
mb863
parent
833b58cd19
commit
b636bf868c
6 changed files with 363 additions and 353 deletions
|
|
@ -1,359 +1,355 @@
|
|||
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
|
||||
@charset "UTF-8";
|
||||
/* CSS Document */
|
||||
|
||||
/* Style for individual display */
|
||||
|
||||
/* <------ INDIVIDUAL INTRO FOR ANY CLASS*/
|
||||
#individual-intro {
|
||||
width:920px;
|
||||
margin:0 auto;
|
||||
margin-top:35px;
|
||||
margin-bottom:30px;
|
||||
#individual-intro{
|
||||
width: 920px;
|
||||
margin: 0 auto;
|
||||
margin-top: 35px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
#individual-intro h1{
|
||||
font-size:22px;
|
||||
color:#2485ae;
|
||||
padding-bottom:24px;
|
||||
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 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 {
|
||||
#individual-intro-person{
|
||||
float:left;
|
||||
width:700px;
|
||||
margin-top:35px;
|
||||
border-right:1px solid #edf0ed;
|
||||
margin-bottom:30px;
|
||||
width: 700px;
|
||||
margin-top: 35px;
|
||||
border-right: 1px solid #edf0ed;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/* <------ INDIVIDUAL INTRO LEFT CONTENT */
|
||||
#individual-intro-left-content {
|
||||
width:166px;
|
||||
float:left;
|
||||
padding-left:27px;
|
||||
padding-right:34px;
|
||||
#left-side{
|
||||
width: 166px;
|
||||
float: left;
|
||||
padding-left: 27px;
|
||||
padding-right: 34px;
|
||||
}
|
||||
#individual-intro-left-content img.individual-photo2 {
|
||||
width:160px;
|
||||
height:160px;
|
||||
border:7px solid #ebebeb;
|
||||
#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;
|
||||
ul#individual-tools-people{
|
||||
margin-top: 5px;
|
||||
height: 27px;
|
||||
padding-bottom: 20px;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #e8ece9;
|
||||
color: #b2d15a;
|
||||
}
|
||||
ul#individual-tools-people li {
|
||||
position:relative;
|
||||
display:block;
|
||||
padding-right:14px;
|
||||
float:left;
|
||||
ul#individual-tools-people li{
|
||||
position: relative;
|
||||
display: block;
|
||||
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;
|
||||
ul#individual-tools{
|
||||
margin-top: -18px; /*not good adding negative margin*/
|
||||
height: 38px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
width: 150px;
|
||||
color: #b2d15a;
|
||||
}
|
||||
ul#individual-tools li {
|
||||
position:relative;
|
||||
display:block;
|
||||
padding-right:14px;
|
||||
float:left;
|
||||
line-height:27px;
|
||||
ul#individual-tools li{
|
||||
position: relative;
|
||||
display: block;
|
||||
padding-right: 14px;
|
||||
float:l eft;
|
||||
line-height: 27px;
|
||||
}
|
||||
ul#individual-tools li a{
|
||||
color: #b2d15a;
|
||||
|
||||
}
|
||||
.picto-font {
|
||||
.picto-font{
|
||||
font-family: 'Pictos';
|
||||
|
||||
}
|
||||
.picto-uri {
|
||||
font-size:27px;
|
||||
.picto-uri{
|
||||
font-size: 27px;
|
||||
}
|
||||
.picto-pdf {
|
||||
font-size:27px;
|
||||
.picto-pdf{
|
||||
font-size: 27px;
|
||||
}
|
||||
.picto-share {
|
||||
font-size:27px;
|
||||
.picto-share{
|
||||
font-size: 27px;
|
||||
}
|
||||
.icon-rdf {
|
||||
.icon-rdf{
|
||||
position:absolute;
|
||||
font-size:18px;
|
||||
top:16px;
|
||||
font-size: 18px;
|
||||
top: 16px;
|
||||
}
|
||||
.picto-email {
|
||||
font-size:22px;
|
||||
color:#aeb1b1;
|
||||
.picto-email{
|
||||
font-size: 22px;
|
||||
color: #aeb1b1;
|
||||
padding-right: 5px;
|
||||
}
|
||||
#individual-intro-left-content a.email {
|
||||
font-size:14px;
|
||||
#left-side a.email{
|
||||
font-size: 14px;
|
||||
color: #5f6464;
|
||||
display:block;
|
||||
margin-top:15px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
#individual-intro-left-content a.tel {
|
||||
font-size:14px;
|
||||
#left-side a.tel{
|
||||
font-size: 14px;
|
||||
color: #5f6464;
|
||||
display:block;
|
||||
margin-top:15px;
|
||||
display: block;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.icon-phone {
|
||||
.icon-phone{
|
||||
vertical-align:middle;
|
||||
padding-right:5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
ul#individual-urls {
|
||||
ul#individual-urls{
|
||||
list-style:url(../../images/individual/arrow-grey.gif);
|
||||
margin-left:10px;
|
||||
float:left;
|
||||
margin-left: 10px;
|
||||
float: left;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
ul#individual-urls li {
|
||||
font-size:14px;
|
||||
line-height:1.2em;
|
||||
ul#individual-urls li{
|
||||
font-size: 14px;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
ul#individual-urls li a {
|
||||
color:#2485ae;
|
||||
ul#individual-urls li a{
|
||||
color: #2485ae;
|
||||
}
|
||||
ul#individual-urls-people {
|
||||
margin-top:20px;
|
||||
list-style:url(../../images/individual/arrow-grey.gif);
|
||||
padding-left:24px;
|
||||
ul#individual-urls-people{
|
||||
margin-top: 20px;
|
||||
list-style: url(../../images/individual/arrow-grey.gif);
|
||||
padding-left: 24px;
|
||||
}
|
||||
ul#individual-urls-people li {
|
||||
font-size:14px;
|
||||
line-height:1.2em;
|
||||
ul#individual-urls-people li{
|
||||
font-size: 14px;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
ul#individual-urls-people li a {
|
||||
color:#2485ae;
|
||||
ul#individual-urls-people li a{
|
||||
color: #2485ae;
|
||||
}
|
||||
/* <------ INDIVIDUAL RIGHT CONTENT */
|
||||
#individual-intro-right-content {
|
||||
width:400px;
|
||||
float:left;
|
||||
padding:60px 0 0 10px;
|
||||
color:#5e6363;
|
||||
#individual-info{
|
||||
width: 400px;
|
||||
float: left;
|
||||
padding: 60px 0 0 10px;
|
||||
color: #5e6363;
|
||||
}
|
||||
#individual-intro-right-content h1.fn {
|
||||
font-size:22px;
|
||||
color:#2485ae;
|
||||
padding-bottom:24px;
|
||||
#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 #5e6363;
|
||||
font-size: 18px;
|
||||
color: #5e6363;
|
||||
padding-left: 10px;
|
||||
margin-left: 10px;
|
||||
border-left: 1px solid #a6b1b0;
|
||||
}
|
||||
#individual-intro-right-content h2 {
|
||||
font-size:18px;
|
||||
font-weight:normal;
|
||||
padding-bottom:18px;
|
||||
#individual-info h2{
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
padding-bottom: 18px;
|
||||
}
|
||||
ul#individual-positions {
|
||||
font-size:16px;
|
||||
padding-bottom:24px;
|
||||
list-style:url(../../images/individual/arrow-green.gif);
|
||||
padding-left:20px;
|
||||
ul#individual-positions{
|
||||
font-size: 16px;
|
||||
padding-bottom: 24px;
|
||||
list-style: url(../../images/individual/arrow-green.gif);
|
||||
padding-left: 20px;
|
||||
}
|
||||
ul#individual-positions li {
|
||||
line-height:1.2em;
|
||||
ul#individual-positions li{
|
||||
line-height: 1.2em;
|
||||
}
|
||||
ul#individual-positions li a {
|
||||
color:#2485ae;
|
||||
ul#individual-positions li a{
|
||||
color: #2485ae;
|
||||
}
|
||||
.individual-overview {
|
||||
font-size:16px;
|
||||
padding-bottom:32px;
|
||||
line-height:1.3em;
|
||||
.individual-overview{
|
||||
font-size: 16px;
|
||||
padding-bottom: 32px;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
ul#individual-roles {
|
||||
font-size:16px;
|
||||
padding-bottom:24px;
|
||||
ul#individual-areas{
|
||||
font-size: 16px;
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
ul#individual-roles li {
|
||||
float:left;
|
||||
border-right:1px solid #5e6363;
|
||||
padding-right:10px;
|
||||
padding-left:10px;
|
||||
ul#individual-areas li{
|
||||
float: left;
|
||||
border-right: 1px solid #5e6363;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
ul#individual-roles li:first-child {
|
||||
padding-left:0;
|
||||
ul#individual-areas li:first-child{
|
||||
padding-left: 0;
|
||||
}
|
||||
ul#individual-roles li:last-child {
|
||||
ul#individual-areas li: last-child{
|
||||
border-right:none;
|
||||
}
|
||||
ul#individual-roles li {
|
||||
ul#individual-areas li{
|
||||
float:left;
|
||||
border-right:1px solid #5e6363;
|
||||
padding-right:10px;
|
||||
padding-left:10px;
|
||||
border-right: 1px solid #5e6363;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
ul#individual-roles li a {
|
||||
color:#2485ae;
|
||||
ul#individual-areas li a{
|
||||
color: #2485ae;
|
||||
}
|
||||
/* <------ INDIVIDUAL VISUALIZATION */
|
||||
#publications-visualization {
|
||||
margin-top:35px;
|
||||
float:right;
|
||||
width:226px;
|
||||
#publications-visualization{
|
||||
margin-top: 35px;
|
||||
float: right;
|
||||
width: 226px;
|
||||
}
|
||||
/* <------ SPARKLINES */
|
||||
#sparklines-publications {
|
||||
width:184px;
|
||||
padding:0 20px 45px 20px;
|
||||
#sparklines-publications{
|
||||
width: 184px;
|
||||
padding: 0 20px 45px 20px;
|
||||
}
|
||||
#sparklines-publications h3 {
|
||||
padding-top:10px;
|
||||
font-size:20px;
|
||||
color:#2485ae;
|
||||
margin-bottom:10px;
|
||||
#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;
|
||||
.publication-year-range{
|
||||
display: block;
|
||||
padding-top: 5px;
|
||||
font-size: 14px;
|
||||
}
|
||||
a.all-vivo-publications {
|
||||
font-size:14px;
|
||||
color:#5e6363;
|
||||
a.all-vivo-publications{
|
||||
font-size: 14px;
|
||||
color: #5e6363;
|
||||
}
|
||||
|
||||
/* <------ COAUTHORS */
|
||||
#co-authors {
|
||||
padding:0 20px 30px 20px;
|
||||
#co-authors{
|
||||
padding: 0 20px 30px 20px;
|
||||
}
|
||||
img.co-author {
|
||||
border:2px solid #ebebeb;
|
||||
margin-right:5px;
|
||||
margin-bottom:5px;
|
||||
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 h3{
|
||||
font-size: 20px;
|
||||
color: #2485ae;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#co-authors ul {
|
||||
#co-authors ul{
|
||||
}
|
||||
#co-authors ul li {
|
||||
display:block;
|
||||
float:left;
|
||||
#co-authors ul li{
|
||||
display: block;
|
||||
float: left;
|
||||
}
|
||||
p.view-all-coauthors {
|
||||
clear:both;
|
||||
p.view-all-coauthors{
|
||||
clear: both;
|
||||
width: 200px;
|
||||
font-size:14px;
|
||||
text-align:left;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
}
|
||||
/* PROPERTY GROUP MENU------> */
|
||||
|
||||
#property-group-menus {
|
||||
#property-group-menus{
|
||||
clear:both;
|
||||
width:920px;
|
||||
height:46px;
|
||||
border:1px solid #dfebe5;
|
||||
margin:0 auto;
|
||||
margin-bottom:10px;
|
||||
background:#f1f2ee;
|
||||
width: 920px;
|
||||
height: 46px;
|
||||
border: 1px solid #dfebe5;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 10px;
|
||||
background: #f1f2ee;
|
||||
}
|
||||
#property-group-menus ul {
|
||||
#property-group-menus ul{
|
||||
display:block;
|
||||
color:#5e6363;
|
||||
font-size:16px;
|
||||
color: #5e6363;
|
||||
font-size: 16px;
|
||||
}
|
||||
#property-group-menus li {
|
||||
#property-group-menus li{
|
||||
float:left;
|
||||
line-height:46px;
|
||||
padding-right:15px;
|
||||
padding-left:15px;
|
||||
background:url(../../images/individual/separator-property-group-nav.jpg) right 10px no-repeat;
|
||||
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{
|
||||
color: #5e6363;
|
||||
}
|
||||
#property-group-menus a:hover {
|
||||
color:#002b44;
|
||||
#property-group-menus a:hover{
|
||||
color: #002b44;
|
||||
}
|
||||
#property-group-menus li:fisrt-child {
|
||||
padding-left:0;
|
||||
#property-group-menus li:fisrt-child{
|
||||
padding-left: 0;
|
||||
}
|
||||
#property-group-menus li:last-child {
|
||||
background:none;
|
||||
#property-group-menus li:last-child{
|
||||
background: none;
|
||||
}
|
||||
/* PROPERTY GROUPS------> */
|
||||
|
||||
.property-groups {
|
||||
clear:both;
|
||||
width:920px;
|
||||
border:1px solid #dfebe5;
|
||||
margin:0 auto;
|
||||
margin-bottom:10px;
|
||||
background:#fff;
|
||||
margin-bottom:20px;
|
||||
overflow:hidden;
|
||||
.property-groups{
|
||||
clear: both;
|
||||
width: 920px;
|
||||
border: 1px solid #dfebe5;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 10px;
|
||||
background: #fff;
|
||||
margin-bottom: 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
section.property-groups h2 {
|
||||
section.property-groups h2{
|
||||
padding: 20px 25px 12px 35px;
|
||||
font-size: 20px;
|
||||
color: #2485ae;
|
||||
font-weight:normal;
|
||||
font-weight: normal;
|
||||
/*background:url(../../images/individual/arrow-down.gif) 120px 24px no-repeat;*/
|
||||
}
|
||||
article.property-group-item {
|
||||
width:852px;
|
||||
margin:0 auto;
|
||||
border:1px solid #dfe6e5;
|
||||
margin-bottom:20px;
|
||||
article.property-group{
|
||||
width: 852px;
|
||||
margin: 0 auto;
|
||||
border: 1px solid #dfe6e5;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
article.property-group-item h3 {
|
||||
border-bottom:1px solid #dfe6e5;
|
||||
background:#fafaf9;
|
||||
font-size:17px;
|
||||
color:#8aa149;
|
||||
padding:10px 20px 10px 20px;
|
||||
article.property-group h3{
|
||||
border-bottom: 1px solid #dfe6e5;
|
||||
background: #fafaf9;
|
||||
font-size: 17px;
|
||||
color: #8aa149;
|
||||
padding: 10px 20px 10px 20px;
|
||||
}
|
||||
article.property-group-item .data-property {
|
||||
background:#fff;
|
||||
font-size:16px;
|
||||
color:#5e6363;
|
||||
padding:10px 20px 10px 20px;
|
||||
line-height:1.2em;
|
||||
article.property-group .data-property{
|
||||
background: #fff;
|
||||
font-size: 16px;
|
||||
color: #5e6363;
|
||||
padding: 10px 20px 10px 20px;
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
article.property-group-item ul.object-property {
|
||||
background:#fff;
|
||||
font-size:16px;
|
||||
color:#5e6363;
|
||||
padding:10px 20px 10px 20px;
|
||||
article.property-group ul.object-property{
|
||||
background: #fff;
|
||||
font-size: 16px;
|
||||
color:# 5e6363;
|
||||
}
|
||||
article.property-group-item ul.object-property li {
|
||||
line-height:1.2em;
|
||||
padding-bottom:10px;
|
||||
article.property-group ul.object-property li{
|
||||
line-height: 1.2em;
|
||||
padding-bottom: 10px;
|
||||
padding: 10px 20px 10px 20px;
|
||||
}
|
||||
article.property-group-item ul.object-property li a {
|
||||
article.property-group ul.object-property li a{
|
||||
color: #2485ae;
|
||||
}
|
||||
/* MISCELLANEOUS------> */
|
||||
.blue {
|
||||
color:#2485ae;
|
||||
.blue{
|
||||
color: #2485ae;
|
||||
}
|
||||
.grey {
|
||||
color:#5e6363;
|
||||
.grey{
|
||||
color: #5e6363;
|
||||
}
|
||||
.green {
|
||||
color:#b2d15a;
|
||||
.green{
|
||||
color: #b2d15a;
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
|
||||
|
||||
<section id="individual-intro-person" class="vcard">
|
||||
<div id="individual-intro-left-content"> <img class="individual-photo2" src="${urls.images}/individual/individual--foaf-person.png" /><!-- mb863 get rid off div-->
|
||||
<section id="left-side"> <img class="individual-photo2" src="${urls.images}/individual/individual--foaf-person.png" /><!-- mb863 get rid off div-->
|
||||
<nav>
|
||||
<ul id ="individual-tools-people">
|
||||
<li><a class="picto-font picto-uri" href="#">j</a></li>
|
||||
|
|
@ -21,9 +21,9 @@
|
|||
<li><a href="#"><core:URLLink></a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div id="individual-intro-right-content"><!-- mb863 get rid off div-->
|
||||
<section id="individual-info">
|
||||
<header>
|
||||
<h1 class="fn">Hayworth, Rita<span class="preferred-title">Actress, dancer</span></h1>
|
||||
|
||||
|
|
@ -37,9 +37,9 @@
|
|||
|
||||
<p class="individual-overview">Born Margarita Carmen Cansino in Brooklyn, New York City, she was the daughter of flamenco dancer Eduardo Cansino, Sr., who was himself a Sephardic Jewish Spaniard from Castilleja de la Cuesta (Seville), and Ziegfeld girl Volga Hayworth who was of Irish and English descent. She was raised as a Roman Catholic. Her father wanted her to become a dancer while her mother hoped she would become an actress. Her grandfather, Antonio Cansino [+]</p>
|
||||
|
||||
<h2>Roles</h2>
|
||||
<h2>Research Areas</h2>
|
||||
|
||||
<ul id ="individual-roles">
|
||||
<ul id ="individual-areas">
|
||||
<li><a href="#">Researcher (5)</a></li>
|
||||
<li><a href="#">Principal Investigator (3)</a></li>
|
||||
<li><a href="#">Teacher (2)</a></li>
|
||||
|
|
@ -91,27 +91,27 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="affiliations"></a>Affiliation</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">In ante neque, adipiscing ut aliquet in, dictum eu est. Suspendisse lobortis nulla at ligula dictum et tincidunt nunc accumsan. Integer molestie faucibus lacinia. Integer lacinia, nisl a lobortis vehicula, nisl turpis molestie tortor, nec commodo augue erat ac enim. Aenean ac mauris risus. Donec vehicula eleifend purus ac porta. Fusce quis massa eu urna dignissim consequat rutrum quis libero. Donec pellentesque orci ac massa ornare facilisis. Aenean fringilla sem at enim tristique at ultrices lorem dapibus. Nulla ultricies laoreet sem ut tincidunt. Donec sit amet eros at lorem suscipit ultricies. Suspendisse nunc sem, vestibulum ac gravida a, sodales non purus. Curabitur sodales ultricies lectus et auctor. In in mi vel eros tempor hendrerit volutpat eu libero. Curabitur aliquam adipiscing bibendum. Suspendisse vel nibh sit amet tortor gravida viverra a sed neque. Curabitur bibendum turpis vel dui gravida sed rhoncus magna euismod. Etiam euismod, dui non hendrerit varius, elit lorem interdum risus, ultricies rutrum elit felis ac ante. Phasellus porttitor tempus tortor id dictum. Vestibulum in nulla vitae lectus porta placerat quis vel dolor.</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
<ul class="object-property">
|
||||
<li><a href="#"><object property></a> | Moniker</li>
|
||||
|
|
@ -126,27 +126,27 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="research"></a>Research</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">In ante neque, adipiscing ut aliquet in, dictum eu est. Suspendisse lobortis nulla at ligula dictum et tincidunt nunc accumsan. Integer molestie faucibus lacinia. Integer lacinia, nisl a lobortis vehicula, nisl turpis molestie tortor, nec commodo augue erat ac enim. Aenean ac mauris risus. Donec vehicula eleifend purus ac porta. Fusce quis massa eu urna dignissim consequat rutrum quis libero. Donec pellentesque orci ac massa ornare facilisis. Aenean fringilla sem at enim tristique at ultrices lorem dapibus. Nulla ultricies laoreet sem ut tincidunt. Donec sit amet eros at lorem suscipit ultricies. Suspendisse nunc sem, vestibulum ac gravida a, sodales non purus. Curabitur sodales ultricies lectus et auctor. In in mi vel eros tempor hendrerit volutpat eu libero. Curabitur aliquam adipiscing bibendum. Suspendisse vel nibh sit amet tortor gravida viverra a sed neque. Curabitur bibendum turpis vel dui gravida sed rhoncus magna euismod. Etiam euismod, dui non hendrerit varius, elit lorem interdum risus, ultricies rutrum elit felis ac ante. Phasellus porttitor tempus tortor id dictum. Vestibulum in nulla vitae lectus porta placerat quis vel dolor.</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
@ -162,22 +162,22 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="teaching"></a>Teaching</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
@ -192,11 +192,11 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="publications"></a>Publications</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
|
|||
|
|
@ -34,27 +34,27 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="propertyGroup1"></a>propertyGroup1</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">In ante neque, adipiscing ut aliquet in, dictum eu est. Suspendisse lobortis nulla at ligula dictum et tincidunt nunc accumsan. Integer molestie faucibus lacinia. Integer lacinia, nisl a lobortis vehicula, nisl turpis molestie tortor, nec commodo augue erat ac enim. Aenean ac mauris risus. Donec vehicula eleifend purus ac porta. Fusce quis massa eu urna dignissim consequat rutrum quis libero. Donec pellentesque orci ac massa ornare facilisis. Aenean fringilla sem at enim tristique at ultrices lorem dapibus. Nulla ultricies laoreet sem ut tincidunt. Donec sit amet eros at lorem suscipit ultricies. Suspendisse nunc sem, vestibulum ac gravida a, sodales non purus. Curabitur sodales ultricies lectus et auctor. In in mi vel eros tempor hendrerit volutpat eu libero. Curabitur aliquam adipiscing bibendum. Suspendisse vel nibh sit amet tortor gravida viverra a sed neque. Curabitur bibendum turpis vel dui gravida sed rhoncus magna euismod. Etiam euismod, dui non hendrerit varius, elit lorem interdum risus, ultricies rutrum elit felis ac ante. Phasellus porttitor tempus tortor id dictum. Vestibulum in nulla vitae lectus porta placerat quis vel dolor.</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
@ -70,27 +70,27 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="propertyGroup2"></a>propertyGroup2</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">In ante neque, adipiscing ut aliquet in, dictum eu est. Suspendisse lobortis nulla at ligula dictum et tincidunt nunc accumsan. Integer molestie faucibus lacinia. Integer lacinia, nisl a lobortis vehicula, nisl turpis molestie tortor, nec commodo augue erat ac enim. Aenean ac mauris risus. Donec vehicula eleifend purus ac porta. Fusce quis massa eu urna dignissim consequat rutrum quis libero. Donec pellentesque orci ac massa ornare facilisis. Aenean fringilla sem at enim tristique at ultrices lorem dapibus. Nulla ultricies laoreet sem ut tincidunt. Donec sit amet eros at lorem suscipit ultricies. Suspendisse nunc sem, vestibulum ac gravida a, sodales non purus. Curabitur sodales ultricies lectus et auctor. In in mi vel eros tempor hendrerit volutpat eu libero. Curabitur aliquam adipiscing bibendum. Suspendisse vel nibh sit amet tortor gravida viverra a sed neque. Curabitur bibendum turpis vel dui gravida sed rhoncus magna euismod. Etiam euismod, dui non hendrerit varius, elit lorem interdum risus, ultricies rutrum elit felis ac ante. Phasellus porttitor tempus tortor id dictum. Vestibulum in nulla vitae lectus porta placerat quis vel dolor.</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
@ -106,22 +106,22 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="propertyGroup3"></a>propertyGroup3</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
@ -137,12 +137,12 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="propertyGroup4"></a>propertyGroup4</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
@ -158,12 +158,12 @@
|
|||
<section class="property-groups">
|
||||
<h2><a name="propertyGroupN"></a>propertyGroupN</h2>
|
||||
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<p class="data-property">data property</p>
|
||||
</article>
|
||||
<article class="property-group-item">
|
||||
<article class="property-group">
|
||||
<h3>property-label</h3>
|
||||
|
||||
<ul class="object-property">
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@
|
|||
<#-- Manolo, please do not remove this line. Thanks! -->
|
||||
<#assign propertyGroups = individual.propertyList>
|
||||
|
||||
<section id="individual-intro-person" class="vcard">
|
||||
<div id="individual-intro-left-content">
|
||||
<section id="individual-intro-person" class="vcard" role="region">
|
||||
<section id="left-side" role="region">
|
||||
<#-- Thumbnail -->
|
||||
<#if individual.thumbUrl??>
|
||||
<a href="${individual.imageUrl}"><img class="individual-photo2" src="${individual.thumbUrl}" title="click to view larger image" alt="${individual.name}" width="115" /></a>
|
||||
|
|
@ -25,32 +25,32 @@
|
|||
<img class="individual-photo2" src="${urls.images}/dummyImages/person.thumbnail.jpg" title = "no image" alt="placeholder image" width="115" />
|
||||
</#if>
|
||||
|
||||
<nav>
|
||||
<ul id ="individual-tools-people">
|
||||
<li><a class="picto-font picto-uri" href="#">j</a></li>
|
||||
<li><a class="picto-font picto-pdf" href="#">F</a></li>
|
||||
<li><a class="picto-font picto-share" href="#">R</a></li>
|
||||
<li><a class="icon-rdf" href="#">RDF</a></li>
|
||||
<nav role="navigation">
|
||||
<ul id ="individual-tools-people" role="list">
|
||||
<li role="listitem"><a class="picto-font picto-uri" href="#">j</a></li>
|
||||
<li role="listitem"><a class="picto-font picto-pdf" href="#">F</a></li>
|
||||
<li role="listitem"><a class="picto-font picto-share" href="#">R</a></li>
|
||||
<li role="listitem"><a class="icon-rdf" href="#">RDF</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<a class="email" href="#"><span class ="picto-font picto-email">M</span> email@cornell.edu</a> <a class="tel" href="#"><img class ="icon-phone" src="${urls.images}/individual/phone-icon.gif" />555 567 7878</a>
|
||||
<a class="email" href="#"><span class ="picto-font picto-email">M</span> email@cornell.edu</a> <a class="tel" href="#"><img class ="icon-phone" src="${urls.images}/individual/phone-icon.gif" alt="phone icon" />555 567 7878</a>
|
||||
|
||||
<#-- Links -->
|
||||
<nav>
|
||||
<ul id ="individual-urls-people">
|
||||
<nav role="navigation">
|
||||
<ul id ="individual-urls-people" role="list">
|
||||
<#if individual.links?has_content>
|
||||
<@l.firstLastList>
|
||||
<#list individual.links as link>
|
||||
<li><a href="${link.url}">${link.anchor}</a></li>
|
||||
<li role="listitem"><a href="${link.url}">${link.anchor}</a></li>
|
||||
</#list>
|
||||
</@l.firstLastList>
|
||||
</#if>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</sction>
|
||||
|
||||
<div id="individual-intro-right-content"><!-- mb863 get rid off div-->
|
||||
<section id="individual-info" role="region">
|
||||
<header>
|
||||
<#if relatedSubject??>
|
||||
<h2>${relatedSubject.relatingPredicateDomainPublic} for ${relatedSubject.name}</h2>
|
||||
|
|
@ -68,53 +68,67 @@
|
|||
|
||||
<h2>Current Positions</h2>
|
||||
|
||||
<ul id ="individual-positions">
|
||||
<li><a href="#">Consectetur adipiscing elit, sed est erat.</a></li>
|
||||
<li><a href="#">Mauris posuere dui quis massa.</a></li>
|
||||
<ul id ="individual-positions" role="list">
|
||||
<li role="listitem"><a href="#">Consectetur adipiscing elit, sed est erat.</a></li>
|
||||
<li role="listitem"><a href="#">Mauris posuere dui quis massa.</a></li>
|
||||
</ul>
|
||||
</header>
|
||||
|
||||
<p class="individual-overview">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed est erat, tristique non bibendum eu, mollis non est. Cras vehicula velit quis elit porta vel molestie tellus blandit. Donec eget magna dolor. Phasellus faucibus mollis lorem at dapibus. Sed ultricies lobortis mauris in volutpat. Cras mattis neque ut sapien pellentesque fringilla. Mauris posuere dui quis massa mattis id mollis nibh accumsan. [+]</p>
|
||||
|
||||
<h2>Roles</h2>
|
||||
<h2>Research Areas</h2>
|
||||
|
||||
<ul id ="individual-roles">
|
||||
<li><a href="#">Researcher (5)</a></li>
|
||||
<li><a href="#">Principal Investigator (3)</a></li>
|
||||
<li><a href="#">Teacher (2)</a></li>
|
||||
<ul id ="individual-areas" role="list">
|
||||
<li role="listitem"><a href="#">Researcher (5)</a></li>
|
||||
<li role="listitem"><a href="#">Principal Investigator (3)</a></li>
|
||||
<li role="listitem"><a href="#">Teacher (2)</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section id="publications-visualization">
|
||||
<section id="sparklines-publications">
|
||||
<section id="publications-visualization" role="region">
|
||||
<section id="sparklines-publications" role="region">
|
||||
<#include "individual-sparklineVisualization.ftl">
|
||||
|
||||
<header><img src="${urls.home}/images/individual/sparkline.gif" />
|
||||
<header><img src="${urls.home}/images/individual/sparkline.gif" alt="" />
|
||||
<h3><span class="grey">2</span> publications <span class="publication-year-range grey">within the last 10 years</span></h3>
|
||||
</header>
|
||||
|
||||
<p><a class="all-vivo-publications" href="#">All VIVO publications & co-author network.</a></p>
|
||||
</section>
|
||||
|
||||
<section id="co-authors">
|
||||
<section id="co-authors" role="region">
|
||||
<header>
|
||||
<h3><span class="grey">10 </span>Co-Authors</h3>
|
||||
</header>
|
||||
|
||||
<ul>
|
||||
<li><a href="#"><img class="co-author" src="${urls.images}/individual/Bacall.jpg" /></a></li>
|
||||
<li><a href="#"><img class="co-author" src="${urls.images}/individual/Bogart.jpg" /></a></li>
|
||||
<li><a href="#"><img class="co-author" src="${urls.images}/individual/Gable.jpg" /></a></li>
|
||||
<li><a href="#"><img class="co-author" src="${urls.images}/individual/Grant.jpg" /></a></li>
|
||||
<li><a href="#"><img class="co-author" src="${urls.images}/individual/Leigh.jpg" /></a></li>
|
||||
<li><a href="#"><img class="co-author" src="${urls.images}/individual/Welles.jpg" /></a></li>
|
||||
<ul role="list">
|
||||
<li role="listitem"><a href="#"><img class="co-author" src="${urls.images}/individual/Bacall.jpg" /></a></li>
|
||||
<li role="listitem"><a href="#"><img class="co-author" src="${urls.images}/individual/Bogart.jpg" /></a></li>
|
||||
<li role="listitem"><a href="#"><img class="co-author" src="${urls.images}/individual/Gable.jpg" /></a></li>
|
||||
<li role="listitem"><a href="#"><img class="co-author" src="${urls.images}/individual/Grant.jpg" /></a></li>
|
||||
<li role="listitem"><a href="#"><img class="co-author" src="${urls.images}/individual/Leigh.jpg" /></a></li>
|
||||
<li role="listitem"><a href="#"><img class="co-author" src="${urls.images}/individual/Welles.jpg" /></a></li>
|
||||
</ul>
|
||||
|
||||
<p class="view-all-coauthors"><a class="view-all-style" href="#">View All <span class="pictos-arrow-10">4</span></a></p>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<nav id="property-group-menus" role="navigation">
|
||||
<ul role="list">
|
||||
<li role="listitem"><a href="#propertyGroup1">Affiliations</a></li>
|
||||
<li role="listitem"><a href="#publications">Publications</a></li>
|
||||
<li role="listitem"><a href="#research">Research</a></li>
|
||||
<li role="listitem"><a href="#teaching">Teaching</a></li>
|
||||
<li role="listitem"><a href="#service">Service</a></li>
|
||||
<li role="listitem"><a href="#background">Background</a></li>
|
||||
<li role="listitem"><a href="#contact">Contact</a></li>
|
||||
<li role="listitem"><a href="#identity">Identity</a></li>
|
||||
<li role="listitem"><a href="#other">Other</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<#-- Ontology properties -->
|
||||
<#include "individual-properties.ftl">
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
<#-- RY Just a temporary fix to prevent classgroup heading from being pushed to the right edge of the page.
|
||||
Feel free to redo/remove. -->
|
||||
<div style="clear: both;" />
|
||||
<#--><div style="clear: both;" />-->
|
||||
|
||||
<#list propertyGroups as group>
|
||||
|
||||
|
|
@ -21,37 +21,39 @@ Feel free to redo/remove. -->
|
|||
<#assign groupName = "">
|
||||
</#if>
|
||||
|
||||
<div class="property-group" id="group-${groupName}">
|
||||
<section class="property-groups" role="region">
|
||||
|
||||
<#-- Display the group heading -->
|
||||
<#if groupName?has_content>
|
||||
<h3>${groupName}</h3>
|
||||
<h2><a name="${groupName}"></a>${groupName}</h2
|
||||
</#if>
|
||||
|
||||
<#-- Now list the properties in the group -->
|
||||
<div class="properties">
|
||||
|
||||
<#list group.properties as property>
|
||||
<div class="property" id="prop-${property.name}">
|
||||
<article class="property-group" role="article">
|
||||
<#-- Property display name -->
|
||||
<h4>${property.name}</h4>
|
||||
<h3>${property.name}</h3>
|
||||
|
||||
<#-- List the statements for each property -->
|
||||
<#if property.type == "data"> <#-- data property -->
|
||||
<#list property.statements as statement>
|
||||
<div class="data-prop-stmt-value">
|
||||
${statement.value}
|
||||
</div> <!-- end data-prop-stmt-value -->
|
||||
<p class="data-property">${statement.value}</p>
|
||||
<!-- end data-prop-stmt-value -->
|
||||
</#list>
|
||||
|
||||
<#else> <#-- object property -->
|
||||
<#if property.collatedBySubclass>
|
||||
<#include "objectPropertyList-collated.ftl">
|
||||
<#else>
|
||||
<ul class="object-property" role="list">
|
||||
<#include "${property.template}">
|
||||
</ul> <!-- end obj-prop-stmt-obj -->
|
||||
</#if>
|
||||
</#if>
|
||||
</div> <!-- end property -->
|
||||
<!-- end property -->
|
||||
</article>
|
||||
</#list>
|
||||
</div> <!-- end properties -->
|
||||
</div> <!-- end property-group -->
|
||||
<!-- end properties -->
|
||||
</section> <!-- end property-group -->
|
||||
</#list>
|
||||
|
|
@ -3,7 +3,5 @@
|
|||
<#-- Default object property list template -->
|
||||
|
||||
<#list property.statements as statement>
|
||||
<div class="obj-prop-stmt-obj">
|
||||
<a href="${statement.object.url}">${statement.object.name}</a> ${statement.object.moniker!}
|
||||
</div> <!-- end obj-prop-stmt-obj -->
|
||||
<li role="listitem"><a href="${statement.object.url}">${statement.object.name}</a> | ${statement.object.moniker!}</li>
|
||||
</#list>
|
||||
Loading…
Add table
Reference in a new issue