:root{
--pad: 20px;
--loading-background-color: #f1f1f19e;
--loading-background-color-darker: #e6e4e49e;
}
/******************************************
** General Styling ***
******************************************/
a:hover{
cursor: pointer;
}
.center{
text-align: center;
}
.subtle{
color: #999;
}
.btn-disabled{
pointer-events: none;
opacity: .8;
}
.footnote{
font-size: .7em;
}
.underline{
text-decoration: underline;
}
.alert .footnote{
font-size: .9em;
margin-top: 10px;
}
.badge{
margin-right: 10px;
text-shadow: none;
font-weight: normal;
}
.danger,
.error{
color: #dc0000;
}
.tooltip-error .tooltip-inner{
background-color: #960303;
}
.tooltip-error .tooltip .tooltip-arrow{
border-top-color: #960303;
}
.strong{
font-weight: bold;
}
.emphasis{
font-style: italic;
}
.large{
font-size: 1.5em;
padding: 1em;
}
.large .btn{
font-size: 1em;
padding: .5em;
}
.success{
color: green;
}
.icon.warning{
color: #ffbc00;
}
.list-group-item.success {
background-color: #dff0d8;
}
.list-group-item.warning{
background-color: #fcf8e3;
color: #c09853;
}
.list-group-item.danger {
background-color: #f2dede;
}
.list-group-item.info{
background-color: #d9edf7;
color: #3a87ad;
}
.tooltip{
font-size: 12px;
pointer-events: none;
z-index: 9999;
}
[contenteditable]{
cursor: text;
}
.row-striped{
border: 1px solid #e5e5e5;
margin-bottom: 40px;
border-radius: 4px;
}
.row-striped > .row-fluid{
padding: 20px;
}
.row-striped > .row-fluid:nth-child(even){
background-color: #EFEFEF;
}
td.center{
text-align: center;
}
/******************************************
** General Structure ***
******************************************/
html{
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
min-height: 100%;
width: 100%;
margin: 0;
padding: 0;
position: relative;
}
article > .container,
article.container {
padding: 2%;
width: 96%;
}
#Content{
padding: 40px 40px 40px 40px;
min-height: 200px;
}
.DataCatalog #Content{
box-sizing: border-box;
}
.mapMode #Content{
width: 100%;
margin: 0px;
padding: 0px;
}
footer{
background-color: #FFFFFF;
height: 3em; /** Keeps the footer down **/
position: absolute; /** Keeps the footer down **/
bottom: 0px; /** Keeps the footer down **/
}
.mapMode footer{
position: relative;
height: auto;
}
.hide-in-map-mode{
display: block;
}
.show-in-map-mode{
display: none;
}
.mapMode .show-in-map-mode{
display: block;
}
.mapMode .hide-in-map-mode{
display: none;
}
.annotator-wrapper{
/** Keeps the footer down **/
min-height: 100%;
}
/******************************************
** Navigation ***
******************************************/
.breadcrumb{
width: 100%;
box-sizing: border-box;
font-size: .9em;
}
.breadcrumb>li+li:before {
padding: 0 5px;
color: #ccc;
content: "/\00a0";
}
.breadcrumb>li>a{
font-weight: normal;
}
.breadcrumb>li>a.inactive{
color: #999;
}
.breadcrumb .back{
margin-right: 20px;
display: inline;
border-right: 1px solid #999;
padding-right: 20px;
}
.nav-tabs li i{
margin-right: 5px;
}
.nav > li > form{
margin-bottom: 0px;
}
.nav .input > form > label,
.header .input > form > label{
display: inline-block;
top: 5px;
position: relative;
margin-right: 10px;
}
.nav .input > form > input[type="text"],
.header .input > form > input[type="text"]{
display: inline-block;
width: 60px;
}
.nav .input > form > .btn,
.header .input > form > .btn {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
background: none;
display:inline-block;
cursor:pointer;
text-decoration:none;
}
.nav .right .dropdown-menu {
left: -50%;
}
#nav-trigger{
color: white;
float: right;
margin-top: 15px;
font-size: 2em;
display: none;
}
#nav-trigger:hover{
text-decoration: none;
}
#Navbar .home{
display: inline-block;
}
#Navbar a .title{
color: #FFF;
vertical-align: middle;
}
#Navbar .logo{
max-height: 30px;
margin-right: 10px;
margin-top: 5px;
}
/******************************************
** Titles ***
******************************************/
h3{
font-size: 1.5em;
font-weight: normal;
}
header .citation {
margin-bottom: 20px;
display: block;
}
/******************************************
** Buttons ***
******************************************/
.btn, .btn-primary{
background-image: none;
}
.inline-buttons {
margin-bottom: 20px;
margin-top: 20px;
clear: both;
}
.inline-buttons > .btn:not(:last-child){
margin-right: 10px;
}
.inline-buttons > .text-btwn-btns{
margin-right: 10px;
margin-left: 10px;
}
.btn-large{
font-size: 1.2em;
line-height: 1.5em;
}
.btn-large.center{
margin-bottom: 20px;
display: block;
max-width: 30%;
}
.orcid-signin.btn-large.center{
max-width: 45%;
margin-bottom: 0px;
}
#Content > .login{
max-width: 300px;
margin-top: 50px;
margin-bottom: 20px;
display: grid;
align-self: center;
}
#Content > .login .btn{
font-size: 1.5em;
}
.login > span {
top: -.2em;
position: relative;
}
#Content > .login > .alert-container{
font-size: inherit;
}
/******************************************
** Download Buttons ***
******************************************/
.btn.download{
-webkit-transition: color 500ms;
transition: color 500ms;
}
.btn.download.in-progress{
font-size: .9em;
}
.btn.download.complete{
color: rgb(17, 162, 17);
}
.btn.download.complete.btn-primary{
color: white;
}
.downloading.icon-spin.hidden{
display: none;
}
.download.btn.error {
border-color: #960303;
color: #960303;
}
/******************************************
** Notifications and Alerts ***
******************************************/
.notification.loading .icon{
font-size: 40px;
margin-left: 43%;
margin-left: calc(50% - 23px);
margin-top: 40px;
color: #333;
}
.notification.loading.page .icon{
margin-top: 10px;
}
.panel-body .notification.loading .icon {
margin-top: 10px;
}
.accordion-inner .notification.loading .icon {
margin-left: 0px;
}
.notification.loading p{
font-size: 1em;
text-align: center;
width: 100%;
margin: 20px auto;
display: block;
color: #333;
}
.filter-contain .notification.loading i{
color: #999;
font-size: .5em;
}
.filter-contain .notification.loading p{
font-size: .3em;
line-height: 3em;
text-align: center;
width: auto;
color: #999;
margin: 0;
}
#results .notification.loading .icon{
margin-top: 20px;
}
.alert h4{
margin-top: 10px;
margin-bottom: 20px;
}
.alert .icon-left{
float: left;
margin-right: 10px;
}
.alert.plain{
background-color: #FFF;
border-color: #DDD;
color: #333;
}
.alert .close{
font-size: 3em;
position: absolute;
right: 20px;
top: 20px;
}
.alert-error .close{
color: #FF0000;
}
.notification.success,
.icon.success{
color: #008000;
}
.notification.error{
color: #a94442;
}
.notification.warning{
color: rgb(197, 166, 0);
}
.notification.success,
.notification.error{
font-weight: bold;
}
.notification.error .icon,
.notification.success .icon{
margin-right: 10px;
}
.input-append .notification{
font-size: 15px;
}
.notification > .msg {
width: 90%;
display: inline;
white-space: normal;
}
.form-feedback{
min-height: 30px;
}
#Content > .alert-container {
max-width: 90%;
margin-left: 5%;
margin-top: 2rem;
}
body > .alert-container.important-app-message{
bottom: 0px;
top: auto;
width: 100%;
/* required for IE11: */
z-index: 1000;
}
body > .alert-container.important-app-message > .alert{
margin-bottom: 0px;
display: grid;
}
.temporary-message{
margin-bottom: 0px;
position: relative;
}
.alert.subtle{
background-color: #f9f7f7;
border-color: #CCC;
color: #999;
border-width: 0px;
}
/******************************************
** Icons ***
******************************************/
.btn > i{
margin-left: 5px;
}
h3 > .icon,
h4 > .icon{
margin-right: 10px;
max-height: 1em;
}
.provenance-statement-container i{
font-size: 1.2em;
}
.icon-on-right{
margin-left: 5px;
}
.icon-on-left{
margin-right: 5px;
}
.icon-no-margin{
margin: 0 !important;
}
.filter-contain img.icon{
float: left;
height: 20px;
}
img.icon{
max-height: 1.4em;
}
svg.icon {
max-height: 19px;
max-width: 19px;
fill: #555;
}
.icon-positive{
color: green;
}
.icon-negative{
color: #F15959;
}
.icon-warning{
color: #c09853;
}
.icon-circle-badge{
background-color: #999;
padding: 6px;
border-radius: 7px;
color: #FFF;
}
.icon-text{
font-family: inherit;
font-weight: bold;
font-size: .9em;
}
.private.icon-stack .icon-circle{
color: #FF7600;
}
.private.icon-stack .icon-stack-top{
color: #FFF;
margin-top: -1px;
font-size: 1.1em;
}
.icon.hidden{
display: none;
}
.dataone-plus-icon{
height: 1em;
vertical-align: text-top;
}
.pill{
border-radius: 5px;
width: auto;
display: inline;
padding: .25em .5em;
text-shadow: none;
}
/* Data Tag Icons */
.data-tag{
height: 1.25em;
width: auto;
}
.data-tag-icon.blue g{
fill: #3FA9F5;
}
.data-tag-icon.green g{
fill: #00CE01;
}
.data-tag-icon.yellow g{
fill: #ead10a;
}
.data-tag-icon.orange g{
fill: #F38D08;
}
.data-tag-icon.red g{
fill: #FE0300;
}
.data-tag-icon.crimson g{
fill: #800000;
}
/******************************************
** CatalogSearchView ***
******************************************/
.catalog-search-view .catalog-search-inner{
display: grid;
justify-content: stretch;
align-items: stretch;
grid-template-columns: auto 1fr 1fr;
}
.catalog-search-view .filter-groups-container {
width: 215px;
padding: var(--pad)
}
.catalog-search-view .search-results-container,
.catalog-search-view .map-container {
}
.catalog-search-body.mapMode{
height: 100vh;
width: 100vw;
padding-bottom: 0px;
display: grid;
align-items: stretch;
justify-content: stretch;
overflow: hidden;
}
.catalog-search-body.mapMode #Content{
padding: 40px 0px 0px 0px;
}
.catalog-search-body.mapMode .search-results-view .result-row:last-child{
margin-bottom: 100px;
}
.catalog-search-body.mapMode .search-results-view {
overflow-y: scroll;
height: 100vh;
padding-bottom: 200px; /* Leaving room for the last row to show */
padding-right: 15px; /* Padding for the scrollbar */
}
.catalog-search-body.mapMode .search-results-panel-container .map-toggle-container{
display: none;
}
.catalog-search-body.listMode .map-panel-container{
display: none;
}
.catalog-search-body.listMode .catalog-search-inner{
grid-template-columns: auto 1fr 0;
}
.catalog-search-view .cesium-widget-view {
width: inherit;
margin-left: 0;
}
.search-results-view .result-row{
padding: var(--pad);
}
.catalog-search-view .no-search-results{
padding: var(--pad);
text-align: center;
}
/******************************************
** Results and Result Rows ***
******************************************/
.result-row{
padding: 10px 20px;
width: 95%;
width: calc(100% - 15px);
border-top: 1px solid #EEE;
}
.result-row-loading .citation-loading{
width: 100%;
height: 3em;
background-color: var(--loading-background-color-darker);
border-radius: 6px;
}
.result-row-loading .circles-loading{
display: flex;
justify-items: left;
column-gap: 1em;
}
.result-row-loading .circle-loading{
background-color: var(--loading-background-color-darker);
height: 1em;
width: 1em;
margin-top: var(--pad);
}
.result-row .info-icons .icons{
float: left;
margin-right: 1em;
position: relative;
}
.result-row .info-icons .icon{
font-size: 1.1em;
}
.result-row .info-icons .icon.inactive{
visibility: hidden;
}
.result-row .info-icons .icons.resource-map{
width: 20px;
height: 1em;
}
.result-row .info-icons .icons.download .icon{
font-size: 1.2em;
}
.result-row .info-icons .icons.download .tooltip{
width: 120px;
}
.info-icons .download.disabled-download {
color: inherit;
cursor: default;
}
.result-row .info-icons .icon.views{
margin-left: 5px;
color: inherit;
}
.result-row .icons.provenance i{
font-size: 1.5em;
}
.result-row .info-icons img.icon{
height: 1em;
}
.info-icons .icon.private{
color: #FF7600;
}
.result-row .info-icons .label{
background-color: #5E8497;
}
.search-results.loading .notification{
margin-top: 20px;
min-height: 700px;
}
.search-results #no-results-found {
margin: 20px;
}
.result-row .route-to-metadata{
cursor: pointer;
}
.result-row .logo {
width: 50px;
float: left;
margin-right: 10px;
}
.result-row > .logo.ORNLDAAC,
.result-row > .logo.CDL,
.result-row > .logo.ONEShare,
.result-row > .logo.CLOEBIRD,
.result-row > .logo.EDACGSTORE,
.result-row > .logo.GLEON{
width: 90px;
}
.result-row > .logo.KNB{
width: 30px;
}
.result-row > .logo.IARC,
.result-row > .logo.LTER{
width: 40px;
}
.result-row .tooltip{
z-index: 99999;
min-width: 100px;
}
.result-row .info-icons .label {
background-color: #FFF;
color: inherit;
text-shadow: none;
padding: 1px 5px;
border: 1px solid #CCC;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
margin-top: -2px;
}
.result-row .tooltip-inner{
font-size: 1.2em;
}
.result-row .download-icon-placeholder{
width: 16px;
display: inline-block;
}
.result-row.collection .info-icons{
display: none;
}
.result-row.collection .logo{
width: auto;
max-width: 100px;
}
/* Don't italicize the title in the citation in search results */
.result-row .title i {
font-style: normal;
}
/******************************************
** Provenance flow-charts ***
******************************************/
.prov-chart{
width: 60px;
padding-left: 20px;
padding-right: 20px;
margin-top: 67px;
display: inline-block;
vertical-align: top;
position: relative;
}
.prov-chart.sources{
margin-right: 15px;
padding-right: 10px;
border-right-width: 1px;
border-right-style: solid;
}
.prov-chart.derivations{
margin-left: 17px;
padding-left: 16px;
border-left-width: 1px;
border-left-style: solid;
}
.sources-programs{
padding-left: 0px;
padding-right: 0px;
margin-left: 77px;
}
.derivations-programs{
padding-left: 0px;
padding-right: 0px;
margin-left: -84px;
}
.prov-chart.derivations.has-programs{
margin-left: 17px;
}
.prov-chart.sources .programs .connecter {
margin-left: 15px;
width: 10px;
}
.prov-chart.derivations .programs .connecter {
left: -76px;
width: 9px;
}
.prov-chart .node.program{
fill: #FFFFFF;
}
.prov-chart polygon.program.editor.node{
stroke: grey;
stroke-width: 1px;
stroke-dasharray: 2px,2px;
}
.prov-chart .programs svg{
position: absolute;
}
.prov-chart .node{
border-width: 1px;
border-style: solid;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
background-color: #FFF;
width: 25px;
height: 25px;
padding: 15px;
font-size: 25px;
margin-bottom: 10px;
color: #666;
position: absolute;
cursor: pointer;
}
.prov-chart .node:focus{
outline: none;
}
.prov-chart .node.active,
#article-container.active,
.entitydetails.active{
box-shadow: 0 0 5px rgb(50, 161, 19),0 0 12px rgb(0, 255, 213);
-webkit-box-shadow: 0 0 5px rgb(50, 161, 19),0 0 12px rgb(0, 255, 213);
}
.prov-chart .node.previous{
border-width: 1px;
}
.prov-chart .node .icon.remove,
.prov-chart .programs .icon.remove{
color: #960303;
fill: #960303;
position:absolute;
display: block;
font-size: 20px;
}
.prov-chart .node .icon.remove:hover,
.prov-chart .programs .icon.remove:hover{
color: #FF0000;
fill: #FF0000;
}
.prov-chart .node .data.icon.remove{
top: 0px;
right: -5px;
}
.prov-chart .connecter{
border-top-width: 1px;
border-top-style: solid;
position: absolute;
top: 0px;
height: 10px;
width: 15px;
left: 0px;
}
.prov-chart.expand-collapse .collapsed{
display: none;
}
.prov-chart.expand-collapse .expand-control,
.prov-chart.expand-collapse .collapse-control{
font-size: .9em;
position: absolute;
top: 100%;
top: calc(100% + 30px);
left: 10px;
width: 90px;
cursor: pointer;
}
.prov-chart.expand-collapse .control .icon{
margin-left: 5px;
font-size: 1.5em;
vertical-align: sub;
}
.prov-chart.derivations .connecter{
width: 17px;
left: 0px;
top: 50%;
}
.prov-chart.sources .connecter{
left: 45px; /* fallback */
left: calc(100% - 15px);
}
.prov-chart .prov-pointer{
width: 15px;
height: 15px;
position: absolute;
top: 50%; /* fallback */
top: calc(50% - 7px);
}
.prov-chart.sources .prov-pointer{
right: -15px;
}
.prov-chart.derivations .prov-pointer{
left: -17px;
}
.prov-chart.derivations.one-derivation .connecter{
margin-left: -17px;
}
.prov-chart.derivations.one-derivation .prov-pointer{
left: 0px;
}
.prov-chart > .title{
font-size: .9em;
font-weight: normal;
width: 90px;
line-height: 1em;
top: -70px;
position: absolute;
}
.prov-chart.derivations > .title{
left: 0px;
text-align: center;
}
.prov-chart .node > i{
vertical-align: text-top;
}
.prov-chart .metadata.node i{
margin-left: 5px;
}
.provenance-statement a{
/*Keep the icons and links right by each other */
display: inline;
word-break: break-word;
}
.provenance-statement .currently-viewing{
font-weight: bold;
}
.prov-chart .image.node{
background-size: cover;
background-position: 50% 50%;
}
.prov-chart .node.editor{
border-color: #999999;
border-style: dashed;
text-align: center;
line-height: 16px;
font-size: 14px;
color:#C0C0C0;
}
.prov-chart i.icon.icon-plus{
color:#C0C0C0;
}
.prov-chart.editor.empty .prov-pointer{
-webkit-filter: saturate(0);
filter: saturate(0);
}
/*
.node .editor.icon {
margin-left: 3px;
}
*/
.prov-chart .program.node.active{
stroke: #00eb89;
stroke-width: 2px;
transition: stroke 200ms;
}
.prov-chart .program-icon{
font-size: 25px;
}
.prov-chart .node .pdf.icon {
margin-left: 5px;
}
/* Program editor node text */
.prov-chart .editor text {
fill: #C0C0C0;
}
#select-prov-entity{
width: 100%;
}
.prov-entity-select .help-text a{
display: block;
}
/********* The Prov Chart colors *******/
.prov-chart .node.uniqueNode1,
.entitydetails.uniqueNode1{
border-color: #FF0000;
stroke: #FF0000;
}
.prov-chart .uniqueNode1 .icon,
.provenance-statement .node-link.uniqueNode1 .icon,
.prov-chart .uniqueNode1 + .program-icon{
color: #FF0000;
fill: #FF0000;
}
.prov-chart .uniqueNode2,
.entitydetails.uniqueNode2{
border-color: #878700;
stroke: #878700;
}
.prov-chart .uniqueNode2 .icon,
.provenance-statement .node-link.uniqueNode2 .icon,
.prov-chart .uniqueNode2 + .program-icon{
color: #878700;
fill: #878700;
}
.prov-chart .uniqueNode3,
.entitydetails.uniqueNode3{
border-color: #00EAFF;
stroke: #00EAFF;
}
.prov-chart .uniqueNode3 .icon,
.provenance-statement .node-link.uniqueNode3 .icon,
.prov-chart .uniqueNode3 + .program-icon{
color: #00EAFF;
fill: #00EAFF;
}
.prov-chart .uniqueNode4,
.entitydetails.uniqueNode4{
border-color: #AA00FF;
stroke: #AA00FF;
}
.prov-chart .uniqueNode4 .icon,
.provenance-statement .node-link.uniqueNode4 .icon,
.prov-chart .uniqueNode4 + .program-icon{
color: #AA00FF;
fill: #AA00FF;
}
.prov-chart .node.uniqueNode5,
.entitydetails.uniqueNode5{
border-color: #FF7F00;
stroke: #FF7F00;
}
.prov-chart .uniqueNode5 .icon,
.provenance-statement .node-link.uniqueNode5 .icon,
.prov-chart .uniqueNode5 + .program-icon{
color: #FF7F00;
fill: #FF7F00;
}
.prov-chart .node.uniqueNode6,
.entitydetails.uniqueNode6{
border-color: #739900;
stroke: #739900;
}
.prov-chart .uniqueNode6 .icon,
.provenance-statement .node-link.uniqueNode6 .icon,
.prov-chart .uniqueNode6 + .program-icon{
color: #739900;
fill: #739900;
}
.prov-chart .node.uniqueNode7,
.entitydetails.uniqueNode7{
border-color: #0095FF;
stroke: #0095FF;
}
.prov-chart .uniqueNode7 .icon,
.provenance-statement .node-link.uniqueNode7 .icon,
.prov-chart .uniqueNode7 + .program-icon{
color: #0095FF;
fill: #0096FF;
}
.prov-chart .node.uniqueNode8,
.entitydetails.uniqueNode8{
border-color: #FF00AA;
stroke: #FF00AA;
}
.prov-chart .uniqueNode8 .icon,
.provenance-statement .node-link.uniqueNode8 .icon,
.prov-chart .uniqueNode8 + .program-icon{
color: #FF00AA;
fill: #FF00AA;
}
.prov-chart .node.uniqueNode9,
.entitydetails.uniqueNode9{
border-color: #FFD400;
stroke: #FFD400;
}
.prov-chart .uniqueNode9 .icon,
.provenance-statement .node-link.uniqueNode9 .icon,
.prov-chart .uniqueNode9 + .program-icon{
color: #FFD400;
fill: #FFD400;
}
.prov-chart .node.uniqueNode10,
.entitydetails.uniqueNode10{
border-color: #6AFF00;
stroke: #6AFF00;
}
.prov-chart .uniqueNode10 .icon,
.provenance-statement .node-link.uniqueNode10 .icon,
.prov-chart .uniqueNode10 + .program-icon{
color: #6AFF00;
fill: #6AFF00;
}
.prov-chart .node.uniqueNode11,
.entitydetails.uniqueNode11{
border-color: #0040FF;
stroke: #0040FF;
}
.prov-chart .uniqueNode11 .icon,
.provenance-statement .node-link.uniqueNode11 .icon,
.prov-chart .uniqueNode11 + .program-icon{
color: #0040FF;
fill: #0040FF;
}
.prov-chart .node.uniqueNode12,
.entitydetails.uniqueNode12{
border-color:#EDB9B9;
stroke:#EDB9B9;
}
.prov-chart .uniqueNode12 .icon,
.provenance-statement .node-link.uniqueNode12 .icon,
.prov-chart .uniqueNode12 + .program-icon{
color: #EDB9B9;
fill: #ED89B9;
}
.prov-chart .node.uniqueNode13,
.entitydetails.uniqueNode13{
border-color: #B9D7ED;
stroke: #B9D7ED;
}
.prov-chart .uniqueNode13 .icon,
.provenance-statement .node-link.uniqueNode13 .icon,
.prov-chart .uniqueNode13 + .program-icon{
color: #B9D7ED;
fill: #B9D7ED;
}
.prov-chart .node.uniqueNode14,
.entitydetails.uniqueNode14{
border-color:#E7E9B9;
stroke:#E7E9B9;
}
.prov-chart .uniqueNode14 .icon,
.provenance-statement .node-link.uniqueNode14 .icon,
.prov-chart .uniqueNode14 + .program-icon{
color: #E7E9B9;
fill: #E7E9B9;
}
.prov-chart .node.uniqueNode15,
.entitydetails.uniqueNode15{
border-color: #DCB9ED;
stroke: #DCB9ED;
}
.prov-chart .uniqueNode15 .icon,
.provenance-statement .node-link.uniqueNode15 .icon,
.prov-chart .uniqueNode15 + .program-icon{
color: #DCB9ED;
fill: #DCB9ED;
}
.prov-chart .node.uniqueNode16{
border-color:#B9EDE0;
stroke:#B9EDE0;
}
.prov-chart .uniqueNode16 .icon,
.provenance-statement .node-link.uniqueNode16 .icon,
.prov-chart .uniqueNode16 + .program-icon{
color: #B9EDE0;
fill: #B9EDE0;
}
.prov-chart .node.uniqueNode17,
.entitydetails.uniqueNode17{
border-color:#8F2323;
stroke:#8F2323;
}
.prov-chart .uniqueNode17 .icon,
.provenance-statement .node-link.uniqueNode17 .icon,
.prov-chart .uniqueNode17 + .program-icon{
color: #8F2323;
fill: #8F2323;
}
.prov-chart .node.uniqueNode18,
.entitydetails.uniqueNode18{
border-color:#23628F;
stroke:#23628F;
}
.prov-chart .uniqueNode18 .icon,
.provenance-statement .node-link.uniqueNode18 .icon,
.prov-chart .uniqueNode18 + .program-icon{
color: #23628F;
fill: #23628F;
}
.prov-chart .node.uniqueNode19,
.entitydetails.uniqueNode19{
border-color:#8F6A23;
stroke:#8F6A23;
}
.prov-chart .uniqueNode19 .icon,
.provenance-statement .node-link.uniqueNode19 .icon,
.prov-chart .uniqueNode19 + .program-icon{
color: #8F6A23;
fill: #8F6A23;
}
.prov-chart .node.uniqueNode20,
.entitydetails.uniqueNode20{
border-color:#6B238F;
stroke:#6B238F;
}
.prov-chart .uniqueNode20 .icon,
.provenance-statement .node-link.uniqueNode20 .icon,
.prov-chart .uniqueNode20 + .program-icon{
color: #6B238F;
fill: #6B238F;
}
.prov-chart .node.uniqueNode21,
.entitydetails.uniqueNode21{
border-color:#4F8F23;
stroke:#4F8F23;
}
.prov-chart .uniqueNode21 .icon,
.provenance-statement .node-link.uniqueNode21 .icon,
.prov-chart .uniqueNode21 + .program-icon{
color: #4F8F23;
fill: #4F8F23;
}
.prov-chart .node.uniqueNode22,
.entitydetails.uniqueNode22{
border-color:#000000;
stroke:#000000;
}
.prov-chart .uniqueNode22 .icon,
.provenance-statement .node-link.uniqueNode22 .icon,
.prov-chart .uniqueNode22 + .program-icon{
color: #000000;
fill: #000000;
}
.prov-chart .node.uniqueNode23,
.entitydetails.uniqueNode23{
border-color:#737373;
stroke:#737373;
}
.prov-chart .uniqueNode23 .icon,
.provenance-statement .node-link.uniqueNode23 .icon,
.prov-chart .uniqueNode23 + .program-icon{
color: #737373;
fill: #737373;
}
/*The context sections gets narrowed when there is one prov chart next to it*/
.gutters .entitydetails{
width: 60%; /* IE fallback */
width: calc(100% - 215px); /* 100% - prov-chart width - (padding + borders)*/
display: inline-block;
margin-left: 105px;
box-sizing: border-box;
}
.form-horizontal .controls.entitydetails{
margin-left: 100px;
}
.form-horizontal .controls.entitydetails.hasProvLeft{
margin-left: 0px;
width: calc(100% - 305px);
display: inline-block;
}
.form-horizontal .controls.entitydetails.hasProvRight{
width: calc(100% - 278px);
display: inline-block;
}
.form-horizontal .controls.entitydetails.hasProgramsRight.hasProvRight {
width: calc(100% - 336px);
}
.form-horizontal .controls.entitydetails.hasProgramsRight{
margin-right: 58px;
}
.form-horizontal .controls.entitydetails.hasProgramsLeft {
margin-left: 58px;
}
.form-horizontal .controls.entitydetails.hasProvLeft .thumbnail.pdf{
margin-left: 60px;
}
#article-container.hasProvLeft table.download-contents .name,
#article-container.hasProvRight table.download-contents .name{
min-width: 100px;
max-width: 350px;
}
#article-container.hasProvLeft.hasProvRight table.download-contents .name{
min-width: 100px;
max-width: 250px;
}
.downloads-this-version{
font-size: 12px;
}
/*The metadata gets narrowed even more when there are two prov charts next to it */
.hasProvLeft.hasProvRight,
.entitydetails.hasProvLeft.hasProvRight{
margin-left: 0px;
width: calc(100% - 230px);
}
#article-container.hasProvLeft,
#article-container.hasProvRight{
width: 80%;
width: calc(100% - 110px);
padding: 20px;
box-sizing: border-box;
display: inline-block;
border-width: 1px;
border-style: solid;
border-radius: 4px;
}
#article-container.hasProvLeft.hasProvRight{
width: 70%;
width: calc(100% - 214px);
}
/* The metadata is narrowed even more when there are programs */
.form-horizontal .entitydetails.hasPrograms.hasProvLeft{
margin-left: 57px;
width: calc(100% - 272px); /* When there is a program column on one side */
}
.form-horizontal .entitydetails.hasPrograms.hasProvRight{
margin-right: 57px;
width: calc(100% - 362px); /* When there is a program column on one side */
}
.form-horizontal .entitydetails.hasProvLeft.hasProvRight.hasPrograms{
width: calc(100% - 334px); /* When there are program columns on both sides */
}
/* MDQ */
#mdqResult .alert [data-toggle="collapse"]:after
{
/*content: "\e072"; "play" icon */
content: "-";
float: right;
color: #b0c5d8;
font-size: 18px;
line-height: 22px;
}
#mdqResult .alert [data-toggle="collapse"].collapsed:after
{
content: "+";
}
.mdq .popover {
max-width: 50%;
}
#mdqResult .progress {
margin-bottom: 10px;
margin-top: 0px;
}
#mdqResult .progress-bar-success {
opacity: 0.50;
}
.list-group-item.success .icon-caret-right,
.list-group-item.success .icon-caret-down,
.list-group-item.warning .icon-caret-right,
.list-group-item.warning .icon-caret-down,
.list-group-item.info .icon-caret-right,
.list-group-item.info .icon-caret-down,
.list-group-item.danger .icon-caret-down,
.list-group-item.danger .icon-caret-right{
color: #333;
}
.list-group-item .icon-caret-right,
.list-group-item.collapsed .icon-caret-down{
display: none;
}
.list-group-item .icon-caret-down,
.list-group-item.collapsed .icon-caret-right{
display: inline;
}
.list-group-item.collapse {
padding: 0px;
border: 0px;
margin-bottom: 0px;
}
.list-group-item.collapse.in{
padding: 10px 15px;
border: 1px solid #DDD;
margin-bottom: -1px;
}
.check.fail .icon{
color: #960303;
}
.fail.check .icon-remove{
font-size: 1em;
color: #FFF;
}
.check.fail .icon-sign-blank{
font-size: 1.3em;
}
.check .icon{
font-size: 1.3em;
max-width: 20px;
}
.check .icon-stack{
max-width: 20px;
}
.check.warn .icon {
color: #c09853;
font-size: 1.6em;
}
.check.warn .icon-exclamation{
font-size: .9em;
}
.check.info-check .icon{
color: #3a87ad;
}
.check.info-check .icon-info{
font-size: .8em;
}
.check .icon.subtle{
color: #999;
font-size: 1em;
}
#mdqTypeSummary {
float: right;
width: 70%;
}
#mdqResult #data-chart {
height: 220px;
width: 250px;
margin:0px;
}
/* different colors for each pie slice */
#mdqResult .donut.data > g:nth-child(1) .donut-arc {
fill: #b3e69f;
}
#mdqResult .donut.data > g:nth-child(1) .donut-arc-label,
#mdqResult .donut.data > g:nth-child(1) .donut-arc.active {
fill: #468847;
}
#mdqResult .donut.data > g:nth-child(2) .donut-arc {
fill: #fff0a1;
}
#mdqResult .donut.data > g:nth-child(2) .donut-arc-label,
#mdqResult .donut.data > g:nth-child(2) .donut-arc.active {
fill: #c09853;
}
#mdqResult .donut.data > g:nth-child(3) .donut-arc {
fill: #fbb0b0;
}
#mdqResult .donut.data > g:nth-child(3) .donut-arc-label,
#mdqResult .donut.data > g:nth-child(3) .donut-arc.active {
fill: #b94a48;
}
#mdqResult .donut.data > g:nth-child(4) .donut-arc {
fill: #91d7fb;
}
#mdqResult .donut.data > g:nth-child(4) .donut-arc-label,
#mdqResult .donut.data > g:nth-child(4) .donut-arc.active {
fill: #3a87ad;
}
#mdqResult .donut-labels{
opacity: 0.0;
}
#mdqResult .donut-arc.active + .donut-labels,
#mdqResult .donut-arc.active + .donut-labels .donut-arc-count.rotated{
opacity: 1;
font-weight: bold;
}
/* MDQ boxplot */
#mdq-score{
margin-left: 0%;
}
#mdq-score-num {
font-weight: bold;
font-size: 1.5em;
}
#mdq-score .icon{
margin-left: 10px
}
#mdq-box-plot{
margin-bottom: 0px;
margin-top: 0px;
}
#mdq-box {
width: 0%;
height: 20px;
margin-left: 0%;
}
#mdq-repo-score{
margin-left: 0%;
}
#mdq-repo-score .icon{
margin-left: 10px
}
/* Prov chart popovers */
.prov-chart .popover{
min-width: 300px;
}
.prov-chart .popover-content{
padding: 0px;
}
.popover-content .provenance-statement.list-group{
margin: 10px;
}
.popover-content .well.header{
margin-bottom: 0px;
border-radius: 0px;
padding-bottom: 0px;
padding-top: 0px;
}
.prov-chart .popover-content .header > .name{
font-size: 1.2em;
word-wrap: break-word;
}
.prov-chart .popover-content .header > .subtle{
margin-bottom: 0px;
}
.prov-chart .popover .citation{
font-size: 1em;
line-height: 1.7em;
}
.prov-chart .popover .btn{
display: block;
margin-bottom: 10px;
}
.prov-chart .popover-title{
font-size: 1em;
}
.prov-chart .popover-title i{
font-size: 1.2em;
}
.prov-chart .popover .thumbnail{
margin-bottom: 20px;
height: auto;
width: 100%;
padding: 0px;
}
.prov-chart .popover h7{
font-style: italic;
margin-bottom: 10px;
display: block;
color: #888;
}
.popover-content > div > h6 {
margin-bottom: 0px;
margin-top: 0px;
font-size: .9em;
}
.popover-content > div > .name {
margin-top: 0px;
font-size: 1em;
}
#Metadata .popover-content .citation{
font-size: 1em;
font-weight: normal;
}
/******************************************
** Collapsable Lists (ExpandCollapseView) **
******************************************/
.expand-collapse .collapsed{
display: none;
}
.expand-collapse .control{
margin-right: 2px;
border-bottom: 1px dotted #999;
}
.expand-collapse .control,
.expand-collapse .expanded{
display: inline-block;
}
.expand-collapse .control.collapse{
overflow: visible;
margin-left: 5px;
display: inline;
}
.provenance-statement .expand-collapse{
display: block;
}
.expand-collapse .control.hidden{
display: none;
}
.expand-collapse .spacer{
margin-right: 10px;
}
/******************************************
************ Popup Login **************
******************************************/
.nav.list-group > .list-group-item img.icon{
width: 32px;
height: auto;
padding: 16px;
}
.scroll-y{
overflow-y: scroll;
-webkit-transform: translate3d(0,0,0);
}
.inline input,
.inline label{
float: left;
display: inline;
font-size: .9em;
}
.inline input{
margin-right: 10px;
margin-left: 30%;
}
#signInPopup .orcid-signin {
margin-top: 10%;
}
.sign-in-ldap select{
width: 220px;
}
.modal.container{
padding: 20px 20px 40px 20px;
}
.modal .container{
width: auto;
margin-bottom: 20px;
}
.sign-in.modal .close {
font-size: 2em;
}
.sign-in-btns .notification,
.login .notification{
margin-top: 20px;
}
#Navbar .sign-in-btns .notification{
display: none;
}
/** The ORCID Sign In button **/
.orcid-btn{
border: 1px solid #aacf14;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
background-color: #FFF;
padding: 15px 20px;
color: #aacf14;
text-decoration: none;
margin-bottom: 10px;
margin-top: 10px;
display: inline-block;
font-weight: bold;
}
.orcid-btn img {
height: 1.5em;
margin-right: 5px;
}
.orcid-btn:hover{
background-color: #aacf14;
transition: all 500ms;
text-decoration: none;
}
.orcid-btn:hover > span{
color: #FFF;
text-decoration: none;
}
/* MAIN CONTENT
--------------------------------- */
#mainContent{
padding: 20px;
}
#mainContent h1{
font-size: 2em;
text-align: center;
display: inline-block;
width: 100%;
margin-bottom: 20px;
}
#mainContent .form-input{
display: grid;
grid-template-columns: 90% 10%;
width: 100%;
}
#mainContent input{
border-radius: 8px 0px 0px 8px;
-moz-border-radius: 20px 0px 0px 20px;
font-size: 2em;
padding-left: 20px;
width: 100%;
height: 100%;
}
#mainContent input::-webkit-input-placeholder{
padding-top: 7px;
}
#mainContent input:-moz-placeholder{ /* Firefox 18- */
padding-top: 7px;
}
#mainContent input::-moz-placeholder{ /* Firefox 19+ */
padding-top: 7px;
}
#mainContent input:-ms-input-placeholder{
padding-top: 7px;
}
#search_btn_main{
-webkit-border-radius: 0 8px 8px 0;
-moz-border-radius: 0 15px 15px 0;
border-left: 0px;
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
height: 100%;
padding: 4px;
align-content: center;
display: grid;
font-size: 1.5em;
}
#search_btn_main > i{
color: #FFF;
}
/******************************************
** The Metadata and MetadataIndex View **
******************************************/
#metadata-index-details .General .title,
#metadata-index-details .Other .text,
#metadata-index-details .Other .attributeDescription,
#metadata-index-details .Other .checksum,
#metadata-index-details .Other .dataUrl,
#metadata-index-details .Other .fileID,
#metadata-index-details .Other .size,
#metadata-index-details .Other .resourceMap,
#metadata-index-details .Other .presentationCat,
#metadata-index-details .Other .checksumAlgorithm,
#metadata-index-details .Other .author,
#metadata-index-details .Other .authorGivenName,
#metadata-index-details .Other .authorGivenNameSort,
#metadata-index-details .Other .authorSurName,
#metadata-index-details .Other .authorSurNameSort,
#metadata-index-details .Other .authorLastName,
#metadata-index-details .Other .replicaVerifiedDate,
#metadata-index-details .Other .sku,
#metadata-index-details .Other .identifier,
#metadata-index-details .Other [class*=" prov_"],
#metadata-index-details .Other [class*=" geohash_"],
#metadata-index-details .Other [class^="geohash_"]
{
display: none;
}
#metadata-index-details .entitydetails .size{
display: inherit;
}
#Metadata .citation,
#Content.no-stylesheet .citation,
#Metadata > .container > .row-fluid > .citation,
#Metadata > .container > .row-fluid > form > .citation{
font-size: 1.4em;
line-height: 1.7em;
margin-bottom: 20px;
border: 0px;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
padding: 0px;
background-color: transparent;
display: block;
font-weight: lighter;
width: 100%;
float: none;
}
#Metadata .citation-container.has-data-source,
#Content.no-stylesheet .citation-container.has-data-source,
#Metadata > .container > .row-fluid > .citation-container.has-data-source,
#Metadata > .container > .row-fluid > form > .citation-container.has-data-source{
width: 83%;
width: calc(100% - 130px);
float: left;
margin-bottom: 0px;
}
.citation-container.has-data-source {
width: calc(100% - 130px);
float: left;
}
#Metadata .citation .title,
#Content.no-stylesheet .citation .title{
font-weight: bold;
}
#Metadata{
padding-left: 0px;
padding-right: 0px;
width: 100%;
}
.entitydetails.controls-well > .thumbnail{
margin-left: 180px;
}
.citation ~ .inline-input-group > .input-append{
float: right;
margin-bottom: 0px;
}
.input-append.inline input[type='text']{
margin-right: 0px;
margin-left: 0px;
}
.metadata-view .controls-container{
margin-bottom: 20px;
padding: 10px;
}
.metadata-view .controls-container > .controls{
display: inline-block;
float: right;
margin-top: 0px;
margin-bottom: 0px;
}
.metadata-view .controls-container > .controls .inline-buttons{
margin-top: 0px;
margin-bottom: 0px;
}
.controls-well.annotations-container{
box-shadow: none;
border: 0px;
}
body > .alert-container {
position: fixed;
top: 115px;
left: 50%;
min-width: 75%;
z-index: 1;
transform: translateX(-50%);
}
/* Hide the elements from the view service that we don't need to display */
#Metadata form > .citation,
#Metadata #downloadPackage{
display: none;
}
/* Used in metadata view for metadata format types without stylesheet */
#Content > pre,
#Metadata pre {
background-color: #EEE;
color: #333;
font-family: inherit;
font-size: 1em;
}
#Metadata table .copy{
min-width: 50px;
}
#Content.no-stylesheet.container{
width: 86%;
}
#Content.no-stylesheet.container > .breadcrumb{
width: 100%;
margin-top: 20px;
}
#Content.no-stylesheet > .breadcrumb~.citation{
margin-top: 20px;
}
/* Padding at the bottom to avoid scrollbar overlap */
#attributeTabs{
padding-bottom: 25px;
}
.attributeList > .row-fluid > .span2 {
max-width: 300px;
max-height: 700px;
overflow: scroll;
width: 25%;
}
.attributeList > .row-fluid > .span10{
width: 72%;
}
.attributeListTable tr td:last-child a{
white-space: nowrap;
max-width: 100%;
font-weight: 600;
font-size: .9em;
}
.attributeListTable {
table-layout: fixed;
width: 100%;
}
/* Make the icon column 16px wide */
.attributeListTable tr td:first-child {
width: 19px;
}
/* The active attribute in the attribute name list */
.attributeListTable tr.active{
background-color: #166194;
}
.attributeListTable tr.active a{
color: #FFF;
}
.controls-well > .party{
margin-bottom: 30px;
border-bottom: 1px solid #DDD;
}
/* ---- Taxonomic range ---- */
.taxonomicCoverage .control-group{
margin-bottom: 20px;
width: auto;
}
.taxonomicCoverage > .control-group{
margin-left: 180px;
}
.taxonomicCoverage .control-label{
width: auto;
padding: 0px 10px;
}
.taxonomicCoverage .controls > .control-group:nth-child(2n){
margin-left: 107px;
}
.taxonomicCoverage .control-label{
color: #999;
}
.taxonomicCoverage .controls {
margin-left: 0px;
}
/* ---- Analyze Button ---- */
div.dropdown.btn.btn-secondary.dropdown-toggle .icon-bar-chart
{
margin-right: 10px;
}
#metadata-controls-container > div.controls.btn-toolbar > div > button > span.analyze-text {
margin-right:10px;
font-weight: 600;
}
div.analyze.dropdown{
display: inline-block;
}
div.analyze.dropdown.open button.dropdown.btn.btn-secondary.dropdown-toggle{
display: inline-block;
color:white;
text-shadow: 0;
background-color: #1C6E84;
border-width: 0px;
}
.controls.btn-toolbar{
font-size: 1em;
}
.analyze.dropdown-menu {
border: none;
border-radius: 4px;
padding: 0px;
margin: 0px;
}
/**----------------------------------------**/
.metadata-view .citation{
margin-bottom: 20px;
display: inline-block;
font-size: 1.2em;
line-height: 1.5em;
}
.citation-container + .data-source{
max-width: 125px;
display: inline-block;
float: right;
margin-bottom: 10px;
}
.controls-container .info-icons{
display: inline-block;
margin-left: 10px;
margin-right: 20px;
vertical-align: top;
position: relative;
font-size: 30px;
}
.controls-container .info-icons .icon-stack{
width: 1.25em;
height: 1.25em;
vertical-align: top;
}
.controls-container .info-icons .icon-stack .icon {
margin-top: -15px;
}
.controls-container .info-icons .icon-stack .icon-stack-top{
color: #FFF;
font-size: .75em;
margin-top: -15px;
}
.controls-container .info-icons .icon-stack .icon-stack-base{
font-size: 1.25em;
}
.metadata-controls-container{
position: relative;
}
/* .metadata-controls-container>.copy-success{
position: absolute;
top: -24px;
left: 17px;
font-size: .9em;
} */
.citation-container ~ .data-source .ORNLDAAC,
.citation-container ~ .data-source .CDL,
.citation-container ~ .data-source .PISCO,
.citation-container ~ .data-source .ONEShare,
.citation-container ~ .data-source .KUBI,
.citation-container ~ .data-source .CLOEBIRD,
.citation-container ~ .data-source .EDACGSTORE,
.citation-container ~ .data-source .NKN{
max-width: 175px;
}
.citation-container ~ .data-source .KNB,
.citation-container ~ .data-source .LTER{
max-height: 90px;
}
/******************************************
* Metrics Controller Styling
********************************************/
.metrics-container{
display: inline-block;
margin-top: 0px;
margin-bottom: 0px;
}
/***********
Defult button styling for Metrics views
***********/
a.btn.metrics {
min-width: 164px;
margin-bottom: 0px;
}
.metric-value > .icon.metric-icon {
font-size: 18px;
}
.metric-value.badge {
float: right;
background-color: #333;
margin-top: 2px;
margin-left: 10px;
}
.metric-icon {
margin-right: 10px;
float: left;
padding-top: 1px;
}
.metric-name {
float: left;
}
.metric-value {
float: right;
}
i.icon.icon-cloud-download {
font-size: 1.2em !important;
}
i.icon.icon-eye-open {
font-size: 1.2em !important;
}
.btn-group+.btn-group, .btn-toolbar>.btn+.btn,
.btn-toolbar>.btn+.btn-group, .btn-toolbar>.btn-group+.btn {
margin-left: 15px;
}
i.icon.metric-icon.icon-spinner.icon-spin {
margin-top: 2px;
margin-right: 15px;
}
/* Style for the toolbars that contains buttons in the well on either side. */
.metric-toolbar {
float: left;
width: auto;
}
.controls-container .controls {
border-left: 1px solid #E3E3E3;
float: right;
padding-left: 10px;
}
.controls .btn{
margin-bottom: 0px;
}
/* Making the publish button consistent size as the downloads all*/
#owner-controls-container > .btn {
margin-right: 10px;
}
#owner-controls-container > .btn[disabled]{
cursor: not-allowed;
}
.edit-toolbar > #owner-controls-container #publish {
width: 138px;
}
#metric-modal {
z-index: 1050;
top: 15%;
width: 90%;
height: 500px;
left: 5%;
margin-left: 0px;
}
#metric-modal .modal-content {
width: auto;
}
#metric-modal .modal-header {
height: 25px;
}
#metric-modal .modal-body {
width: 100%;
height: 400px;
max-height: 400px;
padding: 1em;
padding-bottom: 100px;
background-color: #FFFFFF;
box-sizing: border-box;
display: grid;
grid-template-columns: 80fr 20fr;
column-gap: 40px;
}
#metrics-modal #metrics-chart{
width: 100%;
}
#metric-modal .modal-footer {
height: 25px;
padding-top: 18px;
}
#metric-modal .modal-header .icon {
padding: 0px 9px;
}
#metric-modal .modal-header .left-header-section {
float: left;
width: 90%;
margin-top: 3px;
}
#metric-modal .modal-header .right-header-section {
float: right;
width: 10%;
}
#metric-modal .modal-body .modal-description p {
margin: 0 0 25px;
}
.empty-citation-list {
grid-template-rows: 3em 100fr;
grid-template-columns: 100fr;
justify-items: center;
align-items: start;
justify-content: stretch;
padding: 1em;
grid-row-gap: 20px;
display: grid;
background-color: #f5f5f5;
width: calc(120% + 40px); /*Stretch across both columns in grid*/
}
.register-citation-modal-header{
height: 25px;
}
.register-citation-modal-header > .left-header-section{
width: 90%;
float: left;
margin-top: 3px;
}
.register-citation-modal-header > .right-header-section{
width: 10%;
float: right;
margin-top: 3px;
}
.register-citation-element {
display: grid;
align-items: center;
justify-content: center;
}
.register-citation-element .btn{
justify-self: center;
}
#publication-identifier.register-citation-doi-validation {
border: 1px solid red;
}
/******************************************
* Search Page / Data Catalog Page Metrics
******************************************/
.catalog-metrics{
float: right;
margin-right: 0px;
}
.catalog-metrics .badge {
background-color: #dedede;
color: #666;
min-width: 47px;
text-align: center;
}
i.catalog-metric-icon {
margin-right: 3px;
}
/**********************************************************
* Metric Modal / Profile Chart (Views, Downloads, Citations) *
***********************************************************/
#user-views-chart,
#user-downloads-chart {
width: 90%;
}
.metric-chart-loading {
display: flex;
box-sizing: border-box;
position: relative;
max-height: 390px;
justify-content: center;
}
.metric-chart-loading .message{
text-align: center;
padding: rem 1.2rem;
font-size: 1.1rem;
box-shadow: 0 1px 3px -1px rgba(0,0,0,0.15), 0 1px 14px -6px rgba(0,0,0,0.28);
}
.metric-chart-loading .message strong {
display: block;
font-weight: 600;
margin-top: 0.3rem;
}
/*
============ GENERAL CHART TEXT STYLE =========== [metric modal / profile chart]
*/
#metric-modal .metric-chart text,
.views-metrics .metric-chart text,
.downloads-metrics .metric-chart text {
fill: #565656;
font-size: 10px;
font-family: Helvetica, Arial, "sans serif";
}
/*
============ WHEN THERE IS NO DATA: =========== [metric modal / profile chart]
*/
#metric-modal .metric-chart text.no-data,
.views-metrics .metric-chart text.no-data,
.downloads-metrics .metric-chart text.no-data {
font-size: 16px;
font-weight: 100;
fill:#555555;
}
#metric-modal .metric-chart rect.no-data,
.views-metrics .metric-chart rect.no-data,
.downloads-metrics .metric-chart rect.no-data {
fill: #f5f5f5;
}
/*
============ WHEN THERE IS DATA: =========== [metric modal / profile chart]
*/
/*
--- AXES --- [metric modal / profile chart]
*/
/* --- x axis focus --- */
#metric-modal .metric-chart .focus .axis,
.views-metrics .metric-chart .focus .axis,
.downloads-metrics .metric-chart .focus .axis {
shape-rendering: crispEdges;
}
#metric-modal .metric-chart .focus .x.axis,
.views-metrics .metric-chart .focus .x.axis,
.downloads-metrics .metric-chart .focus .x.axis {
clip-path: url(#clip);
}
#metric-modal .metric-chart .focus .x.axis line,
.views-metrics .metric-chart .focus .x.axis line,
.downloads-metrics .metric-chart .focus .x.axis line {
display: none;
}
#metric-modal .metric-chart .focus .x.axis .tick:hover,
.views-metrics .metric-chart .focus .x.axis .tick:hover,
.downloads-metrics .metric-chart .focus .x.axis .tick:hover {
cursor: default;
}
/* --- x axis context --- */
#metric-modal .metric-chart .context .x.axis line,
.views-metrics .metric-chart .context .x.axis line,
.downloads-metrics .metric-chart .context .x.axis line {
display: none;
}
#metric-modal .metric-chart .context .x.axis,
.views-metrics .metric-chart .context .x.axis,
.downloads-metrics .metric-chart .context .x.axis {
clip-path: url(#clip);
}
#metric-modal .metric-chart .context .x.axis .domain,
.views-metrics .metric-chart .context .x.axis .domain,
.downloads-metrics .metric-chart .context .x.axis .domain {
display:none;
}
/* --- focus y-axis --- */
#metric-modal .metric-chart .focus .y.axis .domain,
.views-metrics .metric-chart .focus .y.axis .domain,
.downloads-metrics .metric-chart .focus .y.axis .domain {
display: none;
}
#metric-modal .metric-chart .y.axis.title,
.views-metrics .metric-chart .y.axis.title,
.downloads-metrics .metric-chart .y.axis.title {
font-size: 13px;
font-weight: 100;
}
/* horizontal focus gridlines */
#metric-modal .metric-chart .y.axis line,
.views-metrics .metric-chart .y.axis line,
.downloads-metrics .metric-chart .y.axis line {
stroke: #565656;
stroke-dasharray: 2,2;
stroke-opacity: 0.3;
}
/*
--- BRUSH --- [metric modal / profile chart]
*/
/* --- brush window --- */
#metric-modal .metric-chart .brush .extent,
.views-metrics .metric-chart .brush .extent,
.downloads-metrics .metric-chart .brush .extent {
fill-opacity: .07;
shape-rendering: crispEdges;
clip-path: url(#clip);
fill: #70706c;
}
/* --- brush handles --- */
#metric-modal .metric-chart .resize .handle,
.views-metrics .metric-chart .resize .handle,
.downloads-metrics .metric-chart .resize .handle {
fill: #555;
}
#metric-modal .metric-chart .resize .handle-mini,
.views-metrics .metric-chart .resize .handle-mini,
.downloads-metrics .metric-chart .resize .handle-mini {
fill: white;
stroke-width: 1px;
stroke: #555;
}
/*
--- ZOOM TO BUTTONS --- [metric modal / profile chart]
*/
#metric-modal .metric-chart .scale_button rect,
.views-metrics .metric-chart .scale_button rect,
.downloads-metrics .metric-chart .scale_button rect {
fill: #eaeaea;
}
#metric-modal .metric-chart .scale_button:hover text,
.views-metrics .metric-chart .scale_button:hover text,
.downloads-metrics .metric-chart .scale_button:hover text {
fill: white;
transition: all 0.1s cubic-bezier(.25,.8,.25,1);
}
#metric-modal .metric-chart .scale_button:hover rect,
.views-metrics .metric-chart .scale_button:hover rect,
.downloads-metrics .metric-chart .scale_button:hover rect {
fill: grey; /* change for each theme */
transition: all 0.1s cubic-bezier(.25,.8,.25,1);
}
/*
--- EXPLANATORY TEXT (# views/downloads) --- [metric modal / profile chart]
*/
#metric-modal .metric-chart text#totalCount,
.views-metrics .metric-chart text#totalCount,
.downloads-metrics .metric-chart text#totalCount {
font-size: 15px;
font-weight: bold;
}
#metric-modal .metric-chart text#displayDates,
.views-metrics .metric-chart text#displayDates,
.downloads-metrics .metric-chart text#displayDates {
font-weight: bold;
}
/*
--- BARS --- [metric modal / profile chart]
*/
#metric-modal .metric-chart .bar,
#metric-modal .metric-chart .bar_context,
.views-metrics .metric-chart .bar,
.views-metrics .metric-chart .bar_context,
.downloads-metrics .metric-chart .bar,
.downloads-metrics .metric-chart .bar_context {
fill: black; /* change for each theme */
stroke-width: 0;
clip-path: url(#clip);
}
#metric-modal .metric-chart .bar,
.views-metrics .metric-chart .bar,
.downloads-metrics .metric-chart .bar {
stroke: black; /* change for each theme */
cursor: default;
}
/* --- context bars --- */
/*
--- PANE CURSORS --- [metric modal / profile chart]
*/
#metric-modal .metric-chart rect.pane,
.views-metrics .metric-chart rect.pane,
.downloads-metrics .metric-chart rect.pane {
cursor: move; /* fallback if grab cursor is unsupported */
cursor: grab;
fill: #FAFAFA;
pointer-events: all;
}
#metric-modal .metric-chart rect.pane:active,
.views-metrics .metric-chart rect.pane:active,
.downloads-metrics .metric-chart rect.pane:active {
cursor: move; /* fallback if grab cursor is unsupported */
cursor: grabbing;
}
/*
--- TOOLTIPS --- [metric modal / profile chart]
*/
#metric-modal div.metric_tooltip,
.views-metrics div.metric_tooltip,
.downloads-metrics div.metric_tooltip {
position: fixed;
text-align: center;
height: 25px;
padding: 2px;
font: 10px sans-serif;
background: white;
color: #565656;
border: 0px;
border-radius: 2px;
pointer-events: none;
box-shadow: 0 0px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.views-metrics div.metric_tooltip,
.downloads-metrics div.metric_tooltip {
position: relative;
}
/* ====== END: Metrics modal / profile chart ====== */
.metric-table.table.table-striped.table-condensed {
width: 100%;
}
.metric-table.table.table-striped.table-condensed td {
padding: 1em 1em 1em 2em;
}
.metric-table.table.table-striped.table-condensed td > .citation {
margin-left: -1em;
}
button.modal-btn.btn.btn-default {
all: unset;
cursor: pointer;
}
/***********
Non-clickable (Disabled) button styling for metrics views
***********/
a.btn.metrics-button-disabled {
width: 164px;
color: #777;
border-color: #CCC;
background-color: #efefef;
cursor: default;
}
a.btn.metrics-button-disabled:hover{
background-color: transparent;
}
.metrics-button-disabled> .metric-value.badge {
float: right;
color: #FFF;
margin-left: 20px;
background-color: #777;
margin-top: 2px;
}
.metrics-button-disabled.metric-icon {
margin-right: 10px;
float: left;
}
.metrics-button-disabled.metric-name {
float: left;
margin-right: 10px;
}
.metrics-button-disabled.metric-value {
float: right;
}
.metrics-button-disabled:hover, .metrics-button-disabled:click {
color: #888888;
background-color: #F5F5F5;
border-color: #C3C3C3;
}
/******************************************
* Repository + User Profile Metrics
********************************************/
section#user-citations {
min-height: 300px;
}
#user-summary .charts{
display: flex;
}
#user-summary .summary-container{
flex: 1;
}
.metrics-title > h3 {
display: inline-block;
margin-bottom: 15px;
}
.metric-description {
margin-bottom: 40px;
}
.views-metrics .metric-chart,
.downloads-metrics .metric-chart {
margin: 0 auto;
}
.citations-metrics-list {
overflow-y: auto;
max-height: 300px;
content: " ";
display: block;
clear: both;
}
.citations-metrics-list > .metric-table.table.table-striped.table-condensed {
width: 90%;
height: 5%;
max-height: 240px;
overflow-y: scroll;
top: unset;
margin: 0 auto;
}
.citations-metrics-list > .empty-citation-list {
width: 66%;
height: 5%;
top: unset;
left: 25%;
margin: 0 auto;
}
.citations-metrics-list > .metric-table.table.table-striped.table-condensed td {
padding: 5px 15px 5px 85px;
background-color: #f9f9f9;
}
.citations-metrics-list > .metric-table.table.table-striped.table-condensed td > .citation {
margin-left: -70px;
}
/******************************************
* The Data Details box in the Metadata View
********************************************/
.entitydetails{
border-width: 1px;
border-style: solid;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
margin-bottom: 20px;
margin-left: 0px;
padding: 20px;
width: 85%;
width: calc(100% - 180px);
}
.entitydetails tr,
.entitydetails table,
.entitydetails tbody,
.entitydetails td {
word-wrap: break-word;
box-sizing: border-box;
}
.entitydetails > h4 > *{
float: left;
margin-bottom: 20px;
}
.entitydetails > h4 > i{
font-size: 1.5em;
}
.entitydetails > h4 > .title{
width: 80%;
width: calc(100% - 175px);
margin-left: 20px;
word-wrap: break-word;
}
.entitydetails > h4 > .btn{
float: right;
}
.entitydetails > .control-group{
clear: both;
}
.entitydetails a.download{
margin-left: 180px;
margin-bottom: 20px;
}
.form-horizontal .entitydetails > label{
text-align: left;
font-weight: bold;
width: 98%;
width: calc(100% - 5px);
background-color: #CCCCCC;
padding: 5px;
color: white;
margin-bottom: 20px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
margin-left: -5px;
margin-top: -5px;
padding-left: 10px;
}
/******************************************
* Annotations
********************************************/
.annotator-adder, .annotator-outer, .annotator-notice {
z-index: 999;
}
.annotation-container{
margin-left: 180px;
}
.annotation-container .add-tag{
margin-left: 10px;
margin-top: 10px;
margin-bottom: 20px;
text-shadow: none;
}
.annotation-attribute-name{
font-size: 0px;
}
.annotation-target{
height: 0px;
margin-left: 180px;
}
.annotator-listing > .annotator-checkbox:nth-child(2n),
.annotator-listing > .annotator-checkbox:nth-child(3n) {
display: none;
}
#annotator-field-0,
#annotator-field-5{
display: none;
}
.annotator-widget span{
padding: 7px;
display: inline-block;
}
.annotator-widget .annotator-resize{
display: none;
}
.annotator-filter{
display: none;
}
.annotator-field p{
padding: 10px;
}
.annotation.tag {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
font-style: normal;
font-weight: 400;
text-shadow: none;
box-shadow: none;
text-align: center;
}
.annotation-viewer-container .annotation.tag{
display: inline-block;
}
.annotator-tags,
.annotator-viewer .annotator-item,
.annotator-viewer div{
border-top: 0px;
}
.annotator-tags > .annotator-tag,
.annotator-annotation .annotator-tag{
display: none;
}
.annotator-viewer div:first-of-type{
padding-top: 0px;
padding-bottom: 0px;
}
.annotator-widget * {
font-style: normal;
color: #333;
}
.annotator-widget .subtle{
color: #999;
}
.annotator-widget .smaller{
font-size: .9em;
}
.annotator-widget .tag-date{
display: block;
padding-left: 0px;
}
.annotator-viewer .container {
padding-top: 10px;
margin-top: 10px;
}
.annotator-viewer .annotator-controls{
display: none;
}
.annotation-flag.btn,
.annotation-delete.btn {
border-width: 0px;
margin-bottom: 0px;
margin-right: 10px;
margin-left: -7px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
border: 0px;
padding: 6px;
font-size: 1em;
line-height: 0em;
margin-top: -3px;
}
.annotation-flag.btn:hover,
.annotation-delete.btn:hover{
border-width: 0px;
}
.annotation-delete.btn-warning,
.annotation-flag.btn-warning {
background-image: inherit;
background-color: #da4f49;
color: white;
}
.annotation-delete.btn-warning:hover,
.annotation-flag.btn-warning:hover{
background-color: #f73f3f;
}
.annotation-flag.btn-success {
background-color: #5bb75b;
color: #FFF;
}
.annotation-flag.btn-success:hover{
background-color: #66ce66;
}
.annotation-viewer-container .warning{
color: #d00000;
}
.annotator-editor .annotator-controls{
background-image: none;
background-color: #FFF;
padding-top: 10px;
}
.annotator-editor .annotator-checkbox,
.annotator-editor #annotator-field-4,
.annotator-editor .annotator-item label[for="annotator-field-4"]{
display: none !important;
}
.ui-autocomplete.annotator{
z-index: 9999;
}
.popover-title {
text-transform: capitalize;
}
.popover-title code {
text-transform: none;
margin-left: 20px;
margin-top: -3px;
}
/* Don't force capitalization on annotation popover titles */
.annotation > .popover-title {
text-transform: none;
}
.annotation {
cursor: pointer;
}
.annotation-viewer-container .concept a{
white-space: pre-wrap;
}
.annotation.tag.warning {
background-color: #999;
color: #DDD;
}
/* Force hyperlinks in popovers to wrap */
.annotation .popover .popover-content a {
white-space: normal;
}
/* Annotation pill stuff */
.annotations-container {
display: flex;
flex-wrap: wrap;
box-shadow: none;
border: 0px;
}
.annotation {
display: inline-flex;
margin: 0 6px 6px 0;
}
/** Annotation icon **/
.annotation-icon{
display: inline-block;
height: 1em;
line-height: 1em;
font-size: .9em;
}
.attributeListTable .annotation-icon{
width: .6em;
line-height: .9em;
margin-left: -5px;
font-size: 2.5em;
}
.attributeListTable .annotation-icon .icon{
font-size: .5em;
}
.attributeListTable .annotation-icon .icon-ok{
font-size: .25em;
}
.annotation-icon .icon{
color: #FFF;
}
.annotation-icon .icon.icon-stack-base{
color: #337ab7;
}
.icons.annotations .icon-stack {
vertical-align: -15%;
}
.icons.annotations .icon.icon-stack-base {
font-size: 1.25em;
}
.icons.annotations .icon.icon-ok {
font-size: 0.65em;
}
/** Annotation pills **/
.annotation .annotation-property,
.annotation .annotation-value {
padding: 3px 6px;
}
.annotation .annotation-property {
background-color: #EEE;
border-width: 1px 0 1px 1px;
border-style: solid;
border-color: #CCC;
border-radius: 3px 0px 0px 3px;
}
.annotation .annotation-value {
background-color: #337ab7;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #337ab7;
border-radius: 0px 3px 3px 0px;
}
.annotation .annotation-value .annotation-value-text {
color: white;
}
.annotation .annotation-remove {
padding: 3px 10px;
}
.annotation .annotation-remove {
padding: 3px 10px;
}
.annotation-popover-definition {
padding: 0.5rem 0;
margin: 0.5rem 0;
}
.annotation-popover-definition {
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
}
/* MeasurementTypeView */
.measurement-type-browse {
display: grid;
grid-template-columns: 2fr 1fr;
max-height: 12em;
overflow-y: scroll;
}
/* MeasurementTypeView */
.measurement-type-browse {
display: grid;
grid-template-columns: 2fr 1fr;
max-height: 12em;
overflow-y: scroll;
}
.measurement-type-browse-tree {
border: 1px solid #ccc;
border-radius: 5px;
padding: 0.5rem;
box-sizing: border-box;
}
.measurement-type-browse-tree > ul {
list-style-type: none;
}
.measurement-type-browse-tree input.ncboAutocomplete {
border: 1px solid #ccc;
border-radius: 3px;
width: 100%;
}
.measurement-type-browse-side {
border-collapse: collapse;
}
.measurement-type-browse-side button {
border-radius: 0px 5px 5px 0px;
border-left: none;
margin-bottom: 0.25rem;
}
/** Hide the search when in the dropdown menu **/
.dropdown-menu .ncboAutocomplete {
display: none;
}
#bioportal-tree-annotator {
max-height: 200px;
overflow-y: scroll;
}
#bioportal-tree-label .annotation.tag.btn {
margin-left: 10px;
margin-top: -20px;
margin-bottom: 10px;
}
.ncboAutocomplete .ui-menu .ui-menu-item a.ui-state-focus, .ncboAutocomplete .ui-menu .ui-menu-item a.ui-state-hover, .ncboAutocomplete .ui-menu .ui-menu-item a.ui-state-active, .ui-menu-item a {
text-shadow: none;
font-size: 14px;
width: 100%;
}
.ncboAutocomplete .jsonSuggest {
overflow-x: scroll;
}
.ncboAutocomplete > .ui-autocomplete .ui-menu-item {
overflow: visible;
}
.ncboTree {
width: auto;
max-height: 300px;
}
ul.ncboTree {
overflow: scroll;
}
.ncbo-tree-buttons-container {
position: absolute;
top: 0;
right: 0;
}
/** hide the tree until we have it where we want it **/
#bioportal-tree {
display: none;
}
.dropdown-menu #bioportal-tree {
display: block;
}
#bioportal-popover #bioportal-tree {
display: block;
}
#sidebar .input-append {
font-size: 1em;
}
#bioportal-popover .popover{
max-width: 500px;
width: 500px;
}
#bioportal-popover .popover-content{
width: 95%;
}
#bioportal-popover #bioportal-tree{
max-height: 400px;
}
#jumpUp {
float: right;
}
#resetTree {
float: right;
}
/* --- multiselect annotation filter */
.annotation-filter .searchable-select #bioportal-tree {
display: block;
margin-top: 0.5rem;
overflow-x: auto;
}
.annotation-filter .searchable-select .menu {
min-height: 10rem;
}
/* We use the input in the semantic UI input interface to search */
/* instead of the NCBO tree interface */
.annotation-filter .searchable-select input.ncboAutocomplete {
display: none;
}
/* The contents of the dropdown menu is replaced with the annotation tree */
/* Hide all of the menu items that semantic UI inserets */
.annotation-filter .searchable-select .item,
.annotation-filter .searchable-select .message {
display: none !important;
}
/******************************************
* Images, Maps, and Media
********************************************/
.thumbnail{
height: auto;
max-width: 100%;
padding: 20px;
margin-bottom: 20px;
box-sizing: border-box;
}
.entitydetails .thumbnail{
margin-left: 180px;
margin-top: 40px;
padding: 20px;
width: 350px;
}
.entitydetails .thumbnail.pdf{
width: 500px;
}
.entitydetails .thumbnail.pdf .zoom-in{
width: 500px;
display: block;
height: 2em;
background-color: rgba(0,0,0,0.5);
color: white;
font-weight: normal;
text-align: center;
line-height: 2em;
}
.thumbnail img{
min-width: 100%;
height: auto;
}
.thumbnail.map{
width: auto;
max-width: 700px;
}
.control-group ~ .thumbnail{
margin-left: 180px;
}
img[src*="gstatic.com/"].georegion-map,
img[src*="googleapis.com/"].georegion-map{
max-width: 100%;
}
.figure{
margin-top: 20px;
margin-bottom: 20px;
max-width: 100%;
margin-right: auto;
margin-left: auto;
}
.media {
margin-top: 15px;
}
.media:first-child {
margin-top: 0;
}
.media,
.media-body {
overflow: hidden;
}
.media-body {
width: 10000px;
}
.media-body h5 a{
color: inherit;
}
.media-object {
display: block;
max-width: inherit;
}
.media-object.img-thumbnail {
max-width: none;
}
.media-right,
.media > .pull-right {
padding-left: 10px;
}
.media-left,
.media > .pull-left {
padding-right: 10px;
}
.media-left,
.media-right,
.media-body {
display: table-cell;
vertical-align: top;
}
.media-middle {
vertical-align: middle;
}
.media-bottom {
vertical-align: bottom;
}
.media-heading {
margin-top: 0;
margin-bottom: 5px;
}
.media-list {
padding-left: 0;
list-style: none;
}
/******************************************
* EML Party display
********************************************/
.eml-party .name{
font-weight: bold;
}
/******************************************
* Image Uploader
********************************************/
/* Image upload error formatting (including validation) */
.dropzone .dz-error {
color: #960303;
}
.dropzone.error {
border-color: #960303;
}
.dropzone.error .dz-message {
background-color: rgba(255,0,0,0.1);
}
.dz-image-preview div.dz-error-message{
top: 0;
bottom: 0;
position: absolute;
color: #960303;
box-sizing: border-box;
padding: 4px;
width: 100%;
white-space: normal;
min-height: 100%;
max-height: 100%;
display: flex;
align-items: center;
z-index: 0; /* make sure it's below clickable dropzone items */
line-height: 100%;
}
.port-editor-md .dz-image-preview div.dz-error-message {
align-items: flex-start;
padding-top: 19px;
justify-content: center;
}
.remove-preview .dz-image-preview div.dz-error-message{
opacity: 0.2;
}
/* Image upload drag and drop zone */
.dropzone {
background: #f6f6f6;
border-radius: 3px;
cursor: pointer;
height:100%;
width:100%;
text-align: center;
position: relative;
box-sizing: border-box;
}
.dropzone .dz-message{
position: absolute;
top: 0;
bottom: 0;
align-items: center;
box-sizing: border-box;
padding: 8px;
width: 100%;
justify-content: center;
z-index: 2; /* make sure it's above .dz-error message because this element must be clickable */
}
.dz-image-preview {
white-space: nowrap;
text-align: center;
box-sizing: border-box;
padding-bottom: 3px; /* to account for a 1.5px top border and 1.5px bottom border*/
}
.vertical-align-image-helper {
display: inline-block;
height: 100%;
vertical-align: middle;
}
/* when images are displayed as image elements */
.dz-image-preview img{
max-height: 100%;
}
/* when images are displayed as background of divs */
.dz-image-preview div{
background-repeat: no-repeat;
background-position-x: 50%;
background-position-y: 50%;
background-size: cover;
min-height: 296px; /* 300px - 4px for top and bottom border*/
color: #FFF;
}
/* the remove image button */
.dz-preview i {
position: absolute;
bottom: 0;
right: 0;
box-sizing: border-box;
opacity: 0;
font-size: 17px;
padding:1px;
margin: 2px;
color: #ababab;
cursor: pointer;
}
.dropzone:hover i {
opacity:0.8;
}
/* show dashed outline when no image is uploaded, or when image is uploaded and user hovers */
.dropzone{
background-image: url(../img/transp_bg.png);
}
.dropzone.dz-started {
border-color: #ededed;
background: transparent;
}
.dropzone.dz-started .dz-message{
opacity: 0;
}
.dropzone,
.dropzone.dz-started:hover,
.dropzone.dz-started.dz-drag-hover {
border: dashed 1.5px #999;
}
.dz-message{
transition: all .2s ease;
}
.dropzone{
transition: all .2s ease;
}
/* Hide help text if image is already uploaded, show when user hovers */
.dropzone:hover .dz-message,
.dropzone.dz-started:hover .dz-message,
.dropzone.dz-drag-hover .dz-message {
background-color: rgba(0, 0, 0, 0.5);
color: #FFF;
opacity: 1;
}
.portal-display-image .dropzone .dz-message{
padding-top: 230px;
}
.portal-display-image .image-uploader.remove-preview .image-container{
opacity: .3;
}
.portal-display-image p.notification.error {
text-align: center;
}
.logos-container .dropzone .icon-upload {
font-size: 2.5em;
margin-bottom: 10px;
margin-top: 10px;
}
.dropzone .icon-upload{
display: block;
font-size: 1.5em;
}
/******************************************
* Markdown Editor - Woofmark
********************************************/
/* The markdown editor is used in the portal editor markdown section. */
/* It uses the imageUploader view, and the woofdown component (prefixed with wk-). */
/* See https://github.com/bevacqua/woofmark */
/* and https://github.com/bevacqua/woofmark/blob/master/dist/woofmark.css */
/* markdown editor container - contains editor buttons & markdown textarea */
.wk-container {
position: relative;
margin: 5px 0;
border: 1px solid #e5e5e5;
border-radius: 2px;
display: flex;
flex-direction: column;
}
/* the markdown editor textarea field */
textarea.markdown {
width: 100%;
height: 50vh;
overflow-y: scroll;
overflow-x: hidden;
margin: 5px 0 10px;
line-height: 1.6em;
font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace;
/* so that the textarea is below any and all editor buttons/controls */
order: 99;
}
.wk-container textarea.markdown{
box-shadow: none;
border: none;
border-radius: 2px;
margin: 0;
}
.wk-hide {
display: none !important;
}
.wk-commands-divider{
display: inline-block;
width: 1px;
height: 21px;
background-color: #ddd;
margin: 10px 6px -7px 6px;
}
.wk-commands{
border-bottom: 1px solid #e5e5e5;
background: #fafafa;
padding-left: 0.5rem;
}
/* markdown editor button */
.wk-command {
background-color: transparent;
color: #333;
border: 0;
padding: 7px 10px;
cursor: pointer;
outline: none;
margin: 2px;
border-radius: 6px;
transition: all 0.2s ease-in-out;
}
.wk-command svg {
transition: fill 0.2s ease-in-out;
fill: #333;
}
.wk-command:hover{
background-color: white;
color: #2c7e90;
}
.wk-command:hover svg {
fill: #2c7e90;
}
/* ---- Markdown editor modal ---- */
/* The modal type dialogs to add image or link */
.wk-prompt {
position: fixed;
top: 10%;
left: 2%;
right: 2%;
z-index: 1050;
width: fit-content;
max-width: 95vw;
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.3);
border-radius: 6px;
box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
background-clip: padding-box;
color: #555;
padding: 0px;
margin: 0 auto;
display: table; /* works like width:fit-content in firefox */
}
/* The close button is an empty link (a.wk-prompt-close),
add font awesome close icon */
.wk-prompt-close::before {
content: "×";
font-size: 25px;
position: absolute;
right: 10px;
top: 10px;
color: #000;
text-shadow: 0 1px 0 #fff;
opacity: .2;
}
.wk-prompt-close::before:hover {
opacity: .3;
}
.wk-prompt-header{
padding: 9px 15px;
border-bottom: 1px solid #eee;
}
.wk-prompt-title {
margin: 0;
line-height: 30px;
font-size: 24px;
}
.wk-prompt-body {
position: relative;
max-height: 400px;
padding: 15px;
overflow-y: auto;
color: #999;
}
.wk-prompt .image-uploader{
position: relative;
margin: 5px auto 15px;
}
.wk-prompt .dropzone .dz-message{
display: flex;
flex-direction: column;
justify-content: center;
padding-bottom: 0px;
}
.wk-prompt-input{
width: 100%;
max-width: 292px;
border: 1px solid #ccc;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
display: inline-block;
height: 20px;
padding: 4px 6px;
margin-bottom: 10px;
font-size: 14px;
line-height: 20px;
color: #555;
vertical-align: middle;
border-radius: 4px;
}
.wk-prompt-buttons{
padding: 14px 15px 15px;
margin-bottom: 0;
text-align: right;
background-color: #f5f5f5;
border-top: 1px solid #ddd;
border-radius: 0 0 6px 6px;
box-shadow: inset 0 1px 0 #ffffff;
height: auto;
position: relative;
text-align: center;
}
.wk-prompt-buttons > button {
font-weight: 400;
border: 1px solid #CCC;
border-radius: 4px;
font-size: 14px;
line-height: 20px;
color: #333;
padding: 4px 12px;
}
.wk-prompt-buttons > .wk-prompt-ok {
background-color: #2c7e90;
background-color: var(--portal-secondary-color);
color: white;
margin-left: 10px;
}
.wk-container .tooltip{
/* ensure the tooltip is not hidden within markdown editor container */
position: fixed;
}
/******************************************
* Table Editor View
********************************************/
.table-editor .spreadsheet {
margin: 1rem 2rem 2rem 0.5rem;
}
.table-editor .table {
/* undo bootstrap margin */
margin-bottom: 0;
}
.table-editor td {
min-width: 5rem;
}
.table-editor th {
background: #fafafa;
padding: 0.5rem;
vertical-align: middle;
}
/* Row numbers */
.table-editor tbody th {
min-width: 2.5rem;
}
/* Dropdown Button */
.table-editor .dropbtn {
background-color: #e2e2e2d0;
color: rgba(0, 0, 0, 0.5);
padding: 0rem 0.3rem;
border: none;
cursor: pointer;
transition: ease 0.4s;
border-radius: 3px;
}
.table-editor .dropbtn .icon{
pointer-events: none;
margin: 0;
}
/* Dropdown button on hover & focus */
.table-editor .dropbtn:hover,
.table-editor .dropbtn:focus {
background-color: #d0d0d0;
}
/* The container
- needed to position the dropdown content */
.table-editor .dropdown {
position: relative;
float: right;
width: 1rem;
}
/* Dropdown Content (hidden by default) */
.table-editor .dropdown-content {
display: none;
position: absolute;
background-color: white;
min-width: 7rem;
box-shadow: 0 0.5rem 0.8rem 0 rgba(0, 0, 0, 0.1);
z-index: 1;
border: 1px solid rgba(0,0,0,.05);
}
.table-editor .dropdown-content .icon {
pointer-events: none;
}
/* position row menus to the right of the row number */
.table-editor .row-header .dropdown-content{
left: 1.2rem;
top: 0;
}
/* So the drop down doesn't go into overeflow space */
.table-editor .column-header:last-of-type .dropdown-content {
right: 0;
}
/* Buttons inside the dropdown */
.table-editor .row-dropdown-option,
.table-editor .col-dropdown-option {
white-space: nowrap;
display: block;
width: 100%;
text-align: left;
background-color: transparent;
color: #2c6f90;
color: var(--portal-primary-color);
padding: 0.2rem 0.8rem;
margin: 0.2rem 0;
text-decoration: none;
border: none;
cursor: pointer;
transition: background 100ms ease-in-out;
}
.table-editor .row-dropdown-option:hover,
.table-editor .col-dropdown-option:hover {
background-color: #f7f7f7;
color: #555;
}
/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.table-editor .show {
display: block;
}
.table-editor .column-header-span {
width: calc(100% - 1.1rem);
min-width: 1.5rem;
float: left;
display: inline-block;
margin-left: 0;
line-height: 120%;
color: #555;
}
.table-editor .spreadsheet-controls {
margin-left: 0.5rem;
}
/******************************************
** AccessPolicy editor view ***
******************************************/
.access-rule .subject .orcid.icon{
vertical-align: top;
}
.access-policy-view-container .modal {
width: 80%;
margin-left: -40%;
display: grid;
grid-template-rows: 60px 1fr 60px;
max-height: 80%;
}
.access-policy-view-container .modal .modal-body {
max-height: 1000px;
}
.access-policy-view:not(.modal) .modal-header{
border-bottom-width: 0px;
padding: 0px;
}
.access-policy-view:not(.modal) .modal-body{
padding: 0px;
max-height: none;
}
.access-policy-view:not(.modal) .modal-header .close{
display: none;
}
.access-policy-control.disabled,
.replace.disabled {
cursor: not-allowed;
}
.access-policy-view.modal h4{
font-size: 1em;
font-weight: bold;
}
.access-policy-view:not(.modal) h4 .icon{
display: none;
}
.access-policy-view .popover li h5 {
display: inline;
}
.access-policy-view .popover{
min-width: 50%;
}
.access-rule td {
padding-top: 12px;
padding-bottom: 12px;
}
.access-rule select{
width: 100%;
min-width: 100px;
margin-bottom: 0px;
}
.access-rule.new input{
width: calc(100% - 16px);
margin-bottom: 0px;
}
.access-rule.new label{
font-size: .9em;
}
.access-rule.new select{
margin-top: 25px;
}
.access-rule .remove.icon{
font-size: 2em;
color: #CCC;
}
.access-rule .remove-rule{
width: 2em;
}
.access-policy-view .access-rule .add.icon{
margin-top: 25px;
display: block;
font-size: 2em;
cursor: pointer;
}
.access-rule .add.icon:hover{
color: #006699;
}
.access-rule .ui-autocomplete .ui-menu-item {
padding-top: 5px;
padding-bottom: 5px;
}
.access-policy-view .public-toggle-container{
margin-bottom: 20px;
position: relative;
display: inline-block;
}
.access-policy-view .public-toggle-disabled-text.public{
color: #005300; /*dark green*/
}
.access-policy-view .public-toggle-disabled-text.private{
color: #A04A01; /*dark orange*/
}
.access-policy-view .can-toggle{
width: 200px;
}
.access-policy-view p{
margin-bottom: 20px;
}
.access-policy-view:not(.modal) .modal-footer{
display: none;
}
.access-policy-view.unauthorized .alert{
margin-top: 20px;
min-height: 100px;
line-height: 100px;
text-align: center;
}
/******************************************
* Portal Editor
********************************************/
.Portal.Editor textarea.auto-resize{
overflow-y: hidden;
}
.Portal.Editor #Content{
padding-top: 0px;
width: 100%;
box-sizing: border-box;
overflow-y: auto;
}
/* Portal editor login page */
.portal-login-page{
display: grid;
grid-template-columns: 100%;
grid-template-rows: auto;
justify-items: center;
gap: 1rem;
}
.portal-login-page .portal-image {
max-width: 900px;
margin: auto;
}
.portal-login-page .portal-login-title {
margin-top: 3rem;
font-weight: 300;
line-height: 1.4;
}
.portal-login-page .portal-login-title strong {
font-weight: 600;
}
.portal-login-page .portal-login-button {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
max-width: 230px; /* for firefox */
}
#portals-list-container .portals-list-title {
color: #999;
}
.portals-list-entry {
display: grid;
grid-template-columns: 70px 100fr 50px;
column-gap: 20px;
margin-bottom: 20px;
width: 100%;
}
.portals-list-entry .portal-title {
margin-bottom: 0px;
}
.portals-list-entry .portal-edit-link {
}
.portals-list-entry .portal-description{
}
.portals-list-entry .portal-description p{
margin: 0;
color: #888;
}
.portals-list-entry.pager {
border: 0px;
margin: 10px 0px;
}
#portals-list-container .no-results {
grid-column-start: 2;
text-align: center;
}
/* Editor navigation (tabs) */
.section-links-container{
margin-bottom: 0px;
}
.section-links-toggle-container{
padding-left: 40px;
padding-right: 40px;
}
.port-editor-sections .section-link-container {
border-right: 1px solid #CCC;
}
.port-editor-sections .section-link-container .handle {
color: #FFF;
float: left;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
padding: 1px 3px 0 10px;
opacity: 0.7;
cursor: grab;
}
.port-editor-sections .section-link-container.sortable-chosen,
.port-editor-sections .section-link-container.sortable-chosen .handle {
cursor: grabbing;
}
.port-editor-sections .section-link-container.sortable-ghost,
.port-editor-sections .section-link-container.sortable-chosen {
background-color: #006dcc !important;
}
.port-editor-sections .section-link-container.sortable-ghost > * {
opacity: 0.3 !important;
}
.port-editor-sections .section-link-container .handle + .portal-section-link {
padding-left: 0;
}
.port-editor-sections .section-link-container .handle i:nth-of-type(2) {
margin-left: -3px;
}
.port-editor-sections .section-menu-link:hover ~ .menu,
.port-editor-sections .section-link-container .menu:hover{
display: block;
margin-top: 0px;
margin-left: -1px;
box-shadow: inset 0 5px 7px -6px rgba(0,0,0,0.3);
border-top: 1px solid #CCC;
}
.port-editor-sections .portal-section-link{
display: inline-block;
}
.port-editor-sections .section-link-container .portal-section-link[contenteditable=true]{
box-shadow: 0 0 5px #00689d;
padding: 5px 10px;
margin: 5px 1px 3px 0px;
border: 1px solid #00689d;
margin-left: 10px;
margin-right: 10px;
}
.port-editor-sections .section-link-container .portal-section-link,
.port-editor-sections .section-link-container.active .portal-section-link,
.port-editor-sections .section-link-container.active .portal-section-link:hover,
.port-editor-sections .section-link-container.active .section-menu-link,
.port-editor-sections .section-link-container.active .section-menu-link:hover{
border-color: transparent;
}
.port-editor-sections .section-link-container .portal-section-link:hover,
.port-editor-sections .section-link-container .section-menu-link:hover{
background-color: transparent;
}
.port-editor-sections .section-link-container .dropdown-menu{
width: 100%;
padding: 0px;
}
.section-link-container.error .portal-section-link{
color: #960303;
}
#portal-section-tabs .section-link-container .dropdown-menu>li>a.remove-section.disabled{
background: #f9f9f9;
color: #c4c4c4;
}
/* 'Add new section' icon */
.portal-section-link > .icon.icon-plus {
margin: 0 1px 0 1px;
}
/* `Settings` link */
.nav .page-Settings{
float: right;
}
/* The Delete confirmation popover */
.section-link-container .popover{
min-width: 300px;
}
.section-link-container .popover .inline-buttons{
margin-bottom: 0px;
}
.section-link-container .popover .inline-buttons .btn{
width: calc(50% - 5px);
}
.section-link-container .popover-title{
color: #960303;
}
/* Portal editor sections */
.port-editor-section{
padding: 20px 40px;
}
.port-editor-section.port-editor-md{
padding: 0px;
}
.port-editor-description {
max-width: 1400px;
margin-left: 1rem;
}
.port-editor-subtitle {
margin-top: 0;
margin-left: 1rem;
}
/* Portal Editor notifications */
.portal-editor .alert:empty {
display: none;
}
/* Portal Editor header (contains logo and title) */
.portal-editor #editor-header {
display: flex;
padding-bottom: 20px;
flex-wrap: wrap;
width: 100%;
align-items: center;
}
.logo-editor-container {
margin-right: 20px;
}
.logo-editor-container .dropzone .dz-message{
font-size: .87em;
line-height: 1em;
}
.logo-editor-container p.notification.error {
width: 100px;
text-align: center;
line-height: 102%;
padding-top: 5px;
font-size: 0.9em;
}
.logo-editor-container p.notification.error:empty{
display: none;
}
.portal-editor .logo-editor-container > h5,
.portal-editor .title-container > h5{
margin-top: 0px;
}
.portal-editor .title-container {
flex-grow: 2;
}
.portal-editor textarea.portal-title{
width: 100%;
padding: 0px;
background: transparent;
border: none;
border-radius: 0;
border-bottom: 1px solid #ccc;
box-shadow: none;
align-self: center;
font-size: 28px;
line-height: 40px;
min-height: 40px;
margin-top: 20px;
}
.portal-editor textarea.portal-title:focus{
padding-left: 10px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(82,168,236,.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
}
/* Portal Editor settings */
/* The width of each input element next to the remove button */
.port-editor-settings-container textarea{
width: calc(100% - 20px - 1em);
}
.port-editor-logos {
display: flex;
width: 100%;
overflow-x: auto;
padding-top: 20px;
padding-bottom: 20px;
}
.image-uploader .toggle-remove-preview{
display: none;
}
.image-uploader.remove-preview{
opacity: .5;
}
.image-uploader .dropzone .remove-message{
display: none;
}
.image-uploader.remove-preview{
opacity: 1;
}
.image-uploader.remove-preview .dz-image-preview img{
opacity: .3;
}
.image-uploader.remove-preview .dropzone .dz-message{
background-color: transparent;
}
.image-uploader.remove-preview .dropzone .dz-message > *{
display: none;
}
.image-uploader.remove-preview .dropzone .remove-message{
display: block;
font-weight: bold;
font-size: 1.25em;
margin-top: 20px;
color: #333;
}
.image-uploader .dz-image-preview .remove{
top: 0px;
color: #fb5656;
font-size: 1.25em;
height: 2em;
z-index: 5; /* should be ontop of all other dropzone elements */
}
.port-editor-logos .edit-image{
border: 1px solid #dedede;
margin-right: 10px;
padding: 10px;
border-radius: 4px;
position: relative;
background-color: #fafafa;
}
.port-editor-logos .edit-image .dropzone{
height: 150px;
width: 150px;
margin-left: auto;
margin-right: auto;
display: block;
overflow: hidden;
}
.port-editor-logos p.notification.error {
text-align: center;
margin: 0;
}
.port-editor-settings {
padding-left: 40px;
padding-right: 40px;
}
.port-editor-settings .edit-image .remove{
font-size: 1.5em;
display: block;
}
/* hide the remove message for logo images since we can remove the entire logo instead */
.port-editor-settings .logos-container .edit-image .dropzone .remove-message,
.port-editor-settings .logos-container .edit-image .dropzone .remove {
display: none;
}
.port-editor-settings > .row-fluid{
padding: 20px 40px;
box-sizing: border-box;
}
.port-editor-settings > .row-fluid:nth-child(odd){
background-color: #EEE;
}
.port-editor-settings .description-container textarea{
width: 100%;
}
.port-editor-section .editable-subsection {
box-shadow: 0 1px 6px rgb(0 0 0 / 16%), 0 1px 8px -3px rgb(0 0 0 / 23%);
padding: 2rem 1.5rem;
border-radius: 3px;
border: 2px dashed #419ecc;
margin-top: 1rem;
margin-bottom: 2rem;
}
.port-editor-section.port-editor-data #sidebar > *{
padding-left: 0px;
padding-right: 0px;
box-sizing: border-box;
width: 100%;
}
.port-editor-section.port-editor-data .result-header{
padding-right: 0px;
box-sizing: border-box;
width: 100%;
}
/* Filter Editor */
/* custom portal search filter editor modal */
.filter-editor.new {
display: flex;
align-self: center;
padding: 3rem 2rem 1rem 2rem;
}
.filter-editor:not(.new){
margin-bottom: 1rem;
}
.filter-editor .modal {
width: 100%;
max-width: 800px;
margin: auto;
left: 0;
right: 0;
}
.filter-editor .btn-filter-editor {
margin: 0;
padding: 4px 12px;
}
.filter-editor .delete-button {
float: left;
}
/* hide the delete button for new filters */
.filter-editor.new .delete-button {
display: none;
}
.filter-editor .modal-body {
padding: 2rem;
max-height: 600px;
}
.filter-editor .modal-instructions {
font-weight: 500;
font-size: 1.1rem;
margin: 0;
text-align: left;
}
.filter-editor .fields-container {
display: grid;
grid-template-columns: max-content auto;
gap: 2rem;
align-items: center;
margin-bottom: 2rem;
}
.filter-editor .fields-container .modal-instructions {
margin-top: 1rem;
}
/* the list of filter UI types to choose from */
.ui-builder-choices-container {
display: grid;
grid-template-columns: max-content auto;
gap: 2rem;
align-items: center;
margin-bottom: 2rem;
}
.ui-builder-choices {
margin-top: 1rem;
margin-bottom: 1rem;
}
.ui-builder-choice {
margin: 0 .6em;
display: inline-block;
cursor: pointer;
}
/* the icon representing the interface type */
.ui-builder-choice svg {
width: 3rem;
height: 100%;
max-height: 3.5rem;
vertical-align: middle;
fill: #b5c4ca;
}
/* the label for the interface type */
.ui-builder-choice-label {
color: #b5c4ca;
text-transform: uppercase;
font-weight: 500;
font-size: 0.6rem;
margin: 0;
}
.ui-builder-choice:hover svg {
fill: #419ecc;
}
.ui-builder-choice:hover .ui-builder-choice-label{
color: #419ecc;
}
.ui-builder-choice.selected svg {
fill: #2c6f90;
}
.ui-builder-choice.selected .ui-builder-choice-label{
color: #2c6f90;
}
.ui-builder-choice.disabled {
cursor: not-allowed;
}
.ui-builder-choice.disabled svg {
fill: #EEF3F8;
}
.ui-builder-choice.disabled .ui-builder-choice-label{
color: #EEF3F8;
}
/* Modify the filter styles for editing */
.filter-group .filter.ui-build {
margin: auto;
}
.filter-group .filter.ui-build:not(.date) label {
padding-right: 30px;
}
.filter.ui-build .icon-on-left {
margin: 8px;
}
.filter.ui-build input[type='text'],
.filter.ui-build select {
height: 44px;
box-sizing: border-box;
}
.filter.ui-build .filter-input-contain {
/* width: unset; */
max-width: 350px;
min-width: 300px;
}
.ui-build.choice .ui-build-input.placeholder {
max-width: 91%;
}
.choices-editor .modal-instructions {
margin: 2rem 0;
}
.filter.ui-build .btn {
height: 44px;
width: 44px;
}
/* value input in filter editor, where user can select icon, label, placeholder, etc */
.ui-build .ui-build-input {
display: block;
font-size: 0.95rem;
box-sizing: border-box;
border: 1px dashed #419ecc;
color: #555555;
border-radius: 4px;
line-height: 1;
padding: 0.42rem;
padding-left: 0.6rem;
min-height: 1rem;
min-width: 1rem;
width: 100%;
min-width: 280px;
max-width: 320px;
background-color: transparent;
/* width: 100%; */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: var(--fw-bold,500);
text-shadow: none;
box-shadow: 0 3px 5px #77797a17,0 1px 3px #77797a17;
transition: background-color .2s ease, box-shadow .2s ease;
}
.ui-build .ui-build-input::placeholder{
text-shadow: none;
}
.ui-build .ui-build-input:focus{
background-color: #d1e8f3;
outline: none;
box-shadow: 0 6px 13px #77797a24,0 2px 5px #77797a24;
}
.ui-build .ui-build-input:hover{
/* background-color: #d1e8f3; */
/* outline: none; */
box-shadow: 0 6px 13px #77797a24,0 2px 5px #77797a24;
}
.ui-build input[disabled],
.ui-build button[disabled],
.ui-build select[disabled]{
cursor: default;
}
.ui-builder-container-label {
font-size: 0.8rem;
margin: 0 0 3px 2px;
}
/* Position the placeholder element over the input */
.ui-build .ui-build-input.placeholder {
position: absolute;
left: .5rem;
top: 5px;
min-width: 100px;
max-width: 265px
}
/* Choice editor is where use selects a value and label for elements */
.choice-editor {
display: grid;
grid-template-columns: [handle] 0.8rem [label] 1fr [value] 1fr [remove] 1.2rem;
grid-gap: 0.4rem;
margin-bottom: 0.3rem;
}
.choice-editor .handle {
grid-area: handle;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
cursor: grab;
}
.choice-editor.sortable-chosen,
.choice-editor.sortable-chosen .handle {
cursor: grabbing;
}
.choice-editor .handle {
color: #b5c4ca;
}
.choice-editor .handle i:nth-of-type(2) {
margin-left: 2px;
}
.choice-editor .ui-builder-container-text {
width: 234px;
margin-left: 3px;
margin-bottom: 0;
font-size: 0.8rem;
}
.choice-editor .choice-label {
grid-area: label;
}
.choice-editor .choice-value {
grid-area: value;
}
.choice-editor input {
border-radius: 3px;
color: rgba(0,0,0,.87);
border: 1px solid rgba(34,36,38,.15);
line-height: 1em;
padding: .4rem .8rem;
}
.choice-editor input.choice-label {
font-weight: 560;
}
.choice-editor input.choice-value {
font-weight: 400;
}
.choice-editor input:focus {
border-color: #96c8da;
outline: none;
}
.choice-editor .remove-choice {
grid-area: remove;
font-size: 1.2rem;
cursor: pointer;
opacity: 0.2;
display: grid;
align-content: center;
justify-self: flex-end;
}
/* In a date filter where a user selects a minRange and maxRange */
.filter-group .ui-build.filter.date,
.filter-group .ui-build.filter.choice {
max-width: unset;
min-width: unset;
padding-right: 0;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
}
.ui-build .slider-container {
display: grid;
grid-template-columns: 2.5rem minmax(300px, 400px) 2.5rem;
grid-template-rows: min-content min-content;
justify-items: center;
grid-gap: 1rem;
}
.ui-build .slider-arrow {
margin-top: 20px;
fill: #419ecc;
max-width: 40px;
}
.ui-build .year-slider{
margin-right: 4px;
}
.ui-build .range-inputs {
width: 100%;
grid-column: 1 / span 3;
display: flex;
justify-content: space-between;
}
.ui-build .range-input {
min-width: unset;
width: 90px;
min-height: 2.2rem;
}
.ui-build .range-inputs > * {
display: flex;
flex-direction: column;
}
.ui-build .range-inputs .notification.error {
max-width: 15rem;
}
.ui-build .range-inputs .range-input-min {
align-items: start;
}
.ui-build .range-inputs .range-input-max .notification.error {
text-align: right;
}
.ui-build .range-inputs .range-input-max {
align-items: end;
}
/* toggle builder in UI build mode */
.toggle.ui-build .modal-instructions {
margin: 2rem 0 1rem;
}
.filter-editor .can-toggle-switch:before {
opacity: 0
}
.filter-editor .can-toggle label .can-toggle-switch:after {
color: white;
}
.ui-build .ui-build-input.true-label,
.ui-build .ui-build-input.false-label{
font-size: 0.95em;
box-sizing: border-box;
position: absolute;
top: 0;
text-align: center;
line-height: 1.9em;
margin: 0.3em;
width: calc(100px - 0.6em);
padding: 0 12px;
min-width: unset;
max-width: unset;
}
.ui-build .ui-build-input.true-label {
left: 100px;
}
/* Validation errors for Filters in UI Build mode */
.ui-build .ui-build-input.error {
border: 1px dashed #e0b4b4;
color: #9f3a38;
background-color: #fff6f6;
}
.ui-build .ui-build-input.error::placeholder{
color: #9f3a38;
}
/* Portal Editor markdown section
* SEE ALSO: .portal-display-image{} and .portal-display-text{} from portal styles
*/
.port-editor-section.port-editor-md {
float: left;
position: relative;
width: 100%
}
.port-editor-section.port-editor-md .dropzone{
width: calc(100% - 2px);
margin:1px;
}
.port-editor-section.port-editor-md .dropzone .dz-message{
flex-direction: column;
justify-content: flex-end;
padding-bottom: 0px;
}
.portal-editor .portal-display-image{
padding-top: 0px;
padding-bottom: 0px;
margin-top: -1px;
}
.portal-editor h2,
.portal-view h2 {
font-size: 2em;
font-weight: normal;
}
.port-editor-md .portal-display-image .dropzone .icon-upload{
z-index: 1;
}
.portal-display-image .image-uploader .dz-image-preview .remove {
font-size: 2em;
margin-right: 10px;
margin-top: 10px;
color: red;
z-index: 5; /* should be above all other elements in the dropzone area */
}
/* for the cs-message: calc(100% - 1px) */
.Portal.Editor .portal-display-text {
position: absolute;
width: calc(100% - 6px); /* so it doesn't overlap the dropzone border */
top: 0;
box-sizing: border-box;
left: 0;
margin: 60px 0px 0px 3px;
padding: 20px 40px;
z-index: 10; /* so it's above all the dropzone stuff */
}
.port-editor-md > *{
padding-left: 40px;
padding-right: 40px;
}
.port-editor-md > .portal-display-image{
padding-left: 0px;
padding-right: 0px;
}
.port-editor-md .title,
.port-editor-md .introduction {
width: 100%;
padding: 0px;
background: transparent;
color: white;
border: none;
border-radius: 0;
border-bottom: 1.5px solid white;
box-shadow: none;
}
.port-editor-md .title {
font-weight: 300;
font-size: 31.5px;
line-height: 44px;
margin: 15px 0;
min-height: 44px;
}
.port-editor-md .introduction{
font-weight: 400;
font-size: 14px;
line-height: 1.5em;
margin: 0 0 10px;
min-height: 1.6em;
}
.port-editor-md .title::placeholder,
.port-editor-md .introduction::placeholder {
color: white;
opacity: 0.4;
}
.port-editor-md .markdown-help{
display: flex;
justify-content: space-around;
align-items: stretch;
align-content: stretch;
flex-wrap: wrap;
}
.port-editor-md .markdown-help table {
width: 100%;
border-collapse: collapse;
}
.port-editor-md .markdown-help-column {
box-shadow: 0 0px 4px 0 rgba(0, 0, 0, 0.15);
padding: 15px;
background-color: #fbfbfb;
border-radius: 3px;
margin: 10px
}
.port-editor-md .markdown-help-column td {
padding: 2px 1px;
border-top: 1px solid #ececec;
}
.port-editor-md .markdown-help-column th {
padding-bottom: 9px;
font-weight: 600;
font-size: 13px;
}
.port-editor-md .markdown-help-column .more-help {
font-weight: 600;
font-size: 13px;
margin: 5px 0 0 0;
color: #555555;
}
.port-editor-md .markdown-help-column code,
.port-editor-md .markdown-help-column pre {
color: #999999;
background-color: transparent;
border: none;
padding: 0px;
font-size: 12px;
margin: 0px;
}
.port-editor-md .markdown-help-column h1{
font-weight: 300;
font-size: 21px;
margin: 0;
}
.port-editor-md .markdown-help-column h2{
font-weight: 700;
font-size: 16px;
margin: 0;
}
.port-editor-md .markdown-help-column blockquote{
margin: 0;
}
/*** Portal Editor Data Visualization Sections **/
.port-editor-section.port-editor-viz{
padding-top: 40px;
}
/* Portal editor metrics page */
.editor-view.portal-editor div#Metrics svg{
width: 100%;
height: 400px;
margin-top: 40px;
}
/* Add section options */
#section-options-container{
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
}
.section-option {
padding: 12px 13px;
background-color: white;
border: 1px solid #DEDEDE;
border-radius: 4px;
cursor: pointer;
width: 175px;
margin: 15px;
transition: box-shadow 250ms, transform 250ms;
}
.section-option:hover{
box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 2px 5px rgba(0,0,0,0.06);
transform: translate(0.2px,-0.2px);
transition: box-shadow 200ms, transform 200ms;
}
.section-option.disabled{
background-color: #FAFAFA;
cursor: not-allowed;
color: #DCDCDC;
}
.section-option.disabled:hover{
box-shadow: none;
transform: none;
transition: none;
}
.section-option.disabled .subtle{
color: #DCDCDC;
}
.section-option p.description {
font-weight: 300;
line-height: 1.25;
margin-block-end: 0;
}
.section-option h5 {
margin: 11px 0 6px 0;
}
.section-option svg{
display: block;
margin: auto;
}
.port-editor-section svg .theme-primary-fill{
fill: #05446A
}
.port-editor-section svg .theme-secondary-fill{
fill: #118AD5
}
.port-editor-section svg .theme-accent-fill{
fill: #05ab8f
}
.port-editor-section svg .skintone-fill{
fill: #72351c
}
.port-editor-section svg .skintone2-fill{
fill: #9f7766
}
/* Disabled add section image fill color */
.port-editor-section .disabled svg .theme-primary-fill{
fill: #3d3d3d
}
.port-editor-section .disabled svg .theme-secondary-fill{
fill: #ebebeb
}
.port-editor-section .disabled svg .theme-accent-fill{
fill: #d6d6d6
}
.port-editor-section .disabled svg .skintone-fill{
fill: #575757
}
.port-editor-section .disabled svg .skintone2-fill{
fill: #828282
}
/******************************************
* Portals & Portal Editor (styles shared between both)
********************************************/
#editPortal.btn{
height: 2em;
min-width: 180px;
text-align: center;
line-height: 2em;
font-size: 1.1em;
}
.portal-editor #editor-header{
border-bottom: 0px;
padding: 20px 40px;
box-sizing: border-box;
position: relative;
display: flex;
align-items: flex-start;
}
/* Top level app navigation in the PortalView and EditorView */
.Portal.Editor #Navbar,
.PortalView #Navbar{
position: relative;
width: 100%;
left: 0px;
margin: 0px;
}
.Portal.Editor .navbar,
.PortalView .navbar{
margin: 0px;
}
.Portal.Editor .navbar-inner,
.PortalView .navbar-inner{
background-image: none;
box-shadow: none;
background-color: #f2f2f2;
padding-top: 5px;
padding-bottom: 5px;
min-height: 0px;
}
.Portal.Editor .navbar .nav > li > a.brand,
.PortalView .navbar .nav > li > a.brand{
font-size: 25px;
letter-spacing: -2px;
}
.Portal.Editor .navbar .nav > li > a,
.Portal.Editor .nav .input > form > label,
.PortalView .navbar .nav > li > a,
.PortalView .nav .input > form > label{
font-size: 12px;
}
.Portal.Editor #Navbar a.brand,
.Portal.Editor #Navbar a.brand {
margin-left: 20px;
}
.Portal.Editor #Navbar .minimal-nav > a,
.Portal.Editor #Navbar .minimal-nav > .icon,
.Portal.Editor #Navbar .minimal-nav > a > .icon,
.Portal.Editor #Navbar .minimal-nav > a,
.PortalView #Navbar .minimal-nav > .icon,
.PortalView #Navbar .minimal-nav > a > .icon{
color: inherit;
}
.Portal.Editor #Navbar .nav > li,
.PortalView #Navbar .nav > li {
display: none;
}
.Portal.Editor #Navbar .nav .minimal-nav,
.PortalView #Navbar .nav .minimal-nav {
display: block;
}
.Portal.Editor #Navbar .nav .minimal-nav:not(:last-child),
.PortalView #Navbar .nav .minimal-nav:not(:last-child) {
margin-right: 20px;
}
.Portal.Editor #Navbar .nav .minimal-nav a,
.PortalView #Navbar .nav .minimal-nav a {
font-size: .9em;
text-transform: none;
text-shadow: none;
}
.Portal.Editor #Navbar .nav .minimal-nav > a:not(.btn),
.PortalView #Navbar .nav .minimal-nav > a:not(.btn) {
margin-bottom: 0px;
padding: 0px;
}
.Portal.Editor #Navbar .nav .minimal-nav.subtle a,
.PortalView #Navbar .nav .minimal-nav.subtle a {
color: #999;
}
.Portal.Editor #Navbar .nav,
.PortalView #Navbar .nav {
margin-top: 0px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.PortalView #Navbar #editPortal{
margin-top: 0px;
margin-bottom: 0px;
padding: 7px;
}
/******************************************
* Table of Contents
********************************************/
/* The TOC is used optionally in both the markdown view and the preview portion
of the markdown editor view. Markdown & markdown editor views are used in the
portal editor and portal views. */
.toc-view.affix{
top: 20px;
}
.toc-view.affix-bottom{
top: 20px;
position: fixed;
}
.toc-view.span3.affix + .span9,
.toc-view.span3.affix-bottom + .span9 {
margin-left: 26.5%;
}
.toc-ul{
position: sticky;
position: -webkit-sticky;
padding: 0px;
}
.toc-ul > li > a {
text-shadow: none;
padding-left: 20px;
padding-right: 20px;
margin: 0px;
}
.toc-ul a{
line-height: 2em;
}
.toc-ul > li > ul{
margin-left: 0px;
list-style: none;
}
.toc-ul > li > ul > li > a{
padding-left: 40px;
}
.toc-ul li,
.toc-ul a {
background-color: transparent;
color: #FFF;
border:0px;
border-radius: 0px;
text-shadow: none;
}
.toc-ul a:hover {
color: #FFF;
background-color: transparent;
}
.toc .icon{
color: #069;
}
i.toc-sub-item {
margin-left: 18px;
visibility: hidden;
}
/* hide mobile TOC by default */
.toc .mobile {
display: none;
}
.submenu.hidden{
display: none;
}
/* end of markdown section table of contents */
/******************************************
* Portals
********************************************/
.portal-view{
width: calc(100% + 80px);
margin-left: -40px;
}
.portal-view #sidebar {
display: none;
}
.PortalView #Content{
padding-top: 0px;
}
#portal-header-container{
margin-top: 30px;
margin-bottom: 30px;
padding-left: 40px;
box-sizing: border-box;
}
#portal-header-container > .row {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
width: 100%;
}
#portal-section-tabs{
margin-bottom: 0px;
}
#portal-section-tabs .portal-section-link {
background-color: transparent;
border-radius: 0px;
text-align: center;
box-sizing: border-box;
}
.section-link-container{
position: relative;
}
.portal-section-content{
padding: 20px;
}
.portal-section-content .toc-ul {
margin-left: -20px;
}
.portal-display-image{
background-repeat: no-repeat;
background-position-x: 50%;
background-position-y: 50%;
background-size: cover;
min-height: 200px;
padding-top: 60px;
padding-bottom: 60px;
color: #FFF;
margin-bottom: 40px;
}
.portal-display-text{
box-sizing: border-box;
padding: 20px;
}
.portal-display-image .portal-display-text,
.portal-editor .portal-display-text{
background-color: rgba(44, 111, 144, .5);
background-color: var(--portal-primary-color-transparent);
}
.portal-display-image .portal-display-text *,
.portal-editor .portal-display-text *{
color: #FFF;
}
.portal-editor .portal-display-text .notification.error{
color: #a70704;
margin-bottom: 0px;
}
.portal-editor .portal-display-text textarea{
padding-left: 10px;
}
.logo-container{
height: 100px;
white-space: nowrap;
width: 100%;
display: table;
padding-top:10px;
}
.logo-image{
vertical-align: middle;
padding: 10px;
display: table-cell;
}
.portal-view .portal-logo{
max-height: 80px;
display: inline-block;
margin-right: 30px;
}
.portal-view #results-container{
width: 100%;
margin-left:0px;
}
.portal-view .mapMode #results-container,
.portal-view .mapMode #map-container{
width: 50%;
}
.portal-view .data-catalog,
.portal-view .data-catalog #results-container,
.portal-view .data-catalog #map-container,
.portal-view .data-catalog #map-canvas{
min-height: 700px;
}
.portal-view .data-catalog #clear-all{
display: none;
}
.portal-view .portal-title{
line-height: 1.5em;
margin: 0px;
font-size: 2em;
display: inline-block;
flex: 2;
}
.portal-view .portal-description{
margin-top: 10px;
margin-right: 20px;
color: #666;
}
.portal-view .portal-member-since {
margin-left: -20px;
margin-top: 10px;
}
.portal-logos-view{
padding-top: 6em;
padding-left: 20px;
padding-right: 20px;
}
.portal-logos-view .img-logo{
margin: auto;
display: flex;
justify-content: center;
align-items: center;
min-height: 100px;
width: auto;
max-height: 125px;
}
.well.awards-info {
background: inherit;
margin: 20px;
}
.portal-view .portal-section-link {
width: 100%;
}
.portal-view .logo-row{
margin-bottom: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.portal-view .profile .profile-title,
.portal-view .profile .charts-container > p{
padding-left: 20px;
}
.portal-view .profile .profile-title{
font-size: 1.5em;
}
.profile h4 {
margin-top: 2rem;
}
.portal-view #Members .row-fluid{
padding: 20px;
box-sizing: border-box;
}
.portal-view #Members .row-fluid:nth-child(odd) {
background-color: #EEE;
}
/*** Colors used in the TOC in the portal view & portal editor view ***/
.portal-view .toc .icon,
.portal-editor .toc .icon{
color: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
}
.portal-view .toc li.active > a,
.portal-editor .toc li.active > a {
background-color: #2c7e90; /* Back-up color for IE */
background-color: var(--portal-secondary-color);
}
.portal-editor .toc-ul,
.portal-view .toc-ul {
background-color: #2c6f90; /* Back-up color for IE */
background-color: var(--portal-primary-color);
}
.portal-view .toc-ul li > a:hover,
.portal-editor .toc-ul li > a:hover{
background-color: #2c7e90; /* Back-up color for IE */
background-color: var(--portal-secondary-color);
color: white;
}
.portal-editor .toc-view a,
.portal-view .toc-view a {
color: #FFF;
}
/*** Colors used in the Portal View ***/
.portal-view a:not(.btn):hover,
.portal-editor a:not(.btn):hover{
color: #2c7e90; /* Back-up color for IE */
color: var(--portal-secondary-color);
}
#portal-section-tabs{
display: flex;
flex-wrap: wrap;
align-items: stretch;
border-bottom: 0px;
}
.portal-editor #portal-section-tabs{
display: block;
border-bottom: 1px solid #CCC;
max-width: 100%;
box-sizing: border-box;
}
.portal-editor #portal-section-tabs,
.portal-editor #portal-section-tabs li:not(.active) {
box-shadow: inset 0 -10px 10px -10px rgba(0,0,0,0.05);
}
/* hide black border below active tabs */
.portal-editor #portal-section-tabs .section-link-container.active::after {
content: "";
width: 100%;
border-bottom: 1px solid white;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
#portal-section-tabs .section-link-container{
background-color: #2c6f90; /* Back-up color for IE */
background-color: var(--portal-primary-color);
border: 0px;
margin-bottom: 0px;
flex-grow: 1;
}
/* show toggle for showing/hiding section links on mobile only */
.Editor.Portal .show-sections-toggle,
.PortalView .show-sections-toggle{
visibility: hidden;
display: none;
}
.portal-editor #portal-section-tabs * {
transition: none;
}
.portal-editor #portal-section-tabs .section-link-container{
border-width: 1px 1px 0px 1px;
border-color: #FFF;
border-style: solid;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
height: 36px;
}
.portal-editor #portal-section-tabs .section-link-container.hidden-section{
background-color: #999;
border-color: #666;
}
.portal-editor #portal-section-tabs .section-link-container.hidden-section .hidden-section-icon{
display: inline;
}
.portal-editor #portal-section-tabs .section-link-container.active{
background-color: #FFF;
border-color: #CCC;
}
#portal-section-tabs .section-link-container.error{
border-color: #b94a48;
background-color: #f2dede;
}
.portal-editor #portal-section-tabs .section-link-container.error .portal-section-link{
color: #b94a48;
}
.portal-view #portal-section-tabs .section-link-container .portal-section-link,
.portal-view #portal-section-tabs .section-link-container.active .portal-section-link{
color: #FFF;
}
#portal-section-tabs .portal-section-link,
#portal-section-tabs .section-menu-link{
color: #FFF;
background-color: transparent;
margin-right: 0px;
float: left;
border: 0px;
cursor: pointer;
}
#portal-section-tabs .section-menu-link{
display: inline-block;
padding: 8px 10px;
box-sizing: border-box;
max-width: 44px;
}
#portal-section-tabs .portal-section-link[contenteditable="true"]{
width: calc(100% - 48px);
}
#portal-section-tabs .section-link-container.page-AddPage{
flex-grow: unset;
margin-right: 40px;
}
#portal-section-tabs .section-link-container.page-AddPage > a{
height: 36px;
}
#portal-section-tabs .section-link-container.page-AddPage .icon{
font-size: 1.75em;
}
#portal-section-tabs .section-link-container.page-AddPage .portal-section-link{
color: #FFF;
width: 100%;
}
#portal-section-tabs .section-link-container:hover .portal-section-link,
#portal-section-tabs .section-link-container.active:hover .section-menu-link,
#portal-section-tabs .section-link-container:hover .section-menu-link,
#portal-section-tabs .section-link-container:hover .handle {
border-radius: 0;
color: #FFF !important;
}
#portal-section-tabs .section-link-container .popover-content p {
color: #333;
margin: 10px 0px 0px 0px;
}
#portal-section-tabs .section-link-container.page-Settings{
flex-grow: unset;
}
#portal-section-tabs .section-link-container.page-Settings.error{
width: 120px;
}
#portal-section-tabs .section-link-container.page-Settings.error .portal-section-link{
color: #b94a48;
}
#portal-section-tabs .section-link-container .dropdown-menu>li>a{
color: #2c6f90; /* Back-up color for IE */
border-bottom: 1px solid #CCC;
line-height: 25px;
}
#portal-section-tabs .section-link-container .dropdown-menu>li:last-child>a{
border-bottom-width: 0px;
border-bottom-left-radius: 6px;
border-botttom-right-radius: 6px;
}
#portal-section-tabs .section-link-container .dropdown-menu>li>a:hover{
background-image: none;
background-color: #DDD;
}
/** --------------------------Portal colors -----------------------------***/
.portal-view #portal-section-tabs .section-link-container.active{
background-color: #2c7e90; /* Back-up color for IE */
background-color: var(--portal-secondary-color);
}
#portal-section-tabs .active .section-menu-link{
color: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
}
#portal-section-tabs .section-link-container.page-AddPage .portal-section-link:hover,
#portal-section-tabs .section-link-container.page-Settings .portal-section-link:hover{
background-color: transparent;
color: #2c7e90; /* Back-up color for IE */
color: var(--portal-secondary-color);
}
#portal-section-tabs .section-link-container.active .portal-section-link,
#portal-section-tabs .section-link-container.active .handle {
color: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
}
#portal-section-tabs .section-link-container.active:hover,
#portal-section-tabs .section-link-container:hover {
background-color: #2c7e90; /* Back-up color for IE */
background-color: var(--portal-secondary-color);
}
#portal-section-tabs .section-link-container .dropdown-menu>li>a{
color: var(--portal-primary-color);
}
.portal-editor #portal-section-tabs .section-link-container.active:hover::after {
border-bottom: 1px solid #2c7e90; /* Back-up color for IE */
border-bottom: 1px solid var(--portal-secondary-color);
}
.portal-view .result-row .citation .title,
.portal-editor .result-row .citation .title{
color: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
}
.portal-view .pagination ul > li > a:hover,
.portal-editor .pagination ul > li > a:hover{
background-color: var(--portal-primary-color);
color: #FFF;
}
.portal-view .applied-filter,
.portal-editor .applied-filter{
background-color: #2c6f90; /* Back-up color for IE */
background-color: var(--portal-primary-color);
}
.portal-view .filter-group-link a,
.portal-editor .filter-group-link a{
color: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
}
.portal-view .filter-group-link a:hover,
.portal-editor .filter-group-link a:hover{
color: #2c7e90; /* Back-up color for IE */
color: var(--portal-secondary-color);
}
.portal-view .filter-group-link.active a,
.portal-view .filter-group-link.active a:hover,
.portal-editor .filter-group-link.active a,
.portal-editor .filter-group-link.active a:hover{
color: inherit;
}
.portal-view .can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch,
.portal-view .can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle-switch,
.portal-editor .can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch,
.portal-editor .can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle-switch{
background-color: #2c6f90; /* Back-up color for IE */
background-color: var(--portal-primary-color);
}
.portal-view .can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle-switch,
.portal-editor .can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle-switch{
background-color: #2c7e90; /* Back-up color for IE */
background-color: var(--portal-secondary-color);
}
.portal-view .ui-slider-range,
.portal-editor .ui-slider-range{
background-color: #2c6f90; /* Back-up color for IE */
background-color: var(--portal-primary-color);
}
.portal-view .result-row .citation a:hover,
.portal-view .result-row .citation a:hover .title,
.portal-view .result-row .citation a:hover .id,
.portal-editor .result-row .citation a:hover,
.portal-editor .result-row .citation a:hover .title,
.portal-editor .result-row .citation a:hover .id{
color: #2c7e90; /* Back-up color for IE */
color: var(--portal-secondary-color);
}
.portal-view .result-row .icon,
.portal-editor .result-row .icon{
color: #666;
}
.portal-view .profile .quick-stats circle,
.portal-editor .profile .quick-stats circle{
stroke: #2c6f90; /* Back-up color for IE */
stroke: var(--portal-primary-color);
}
.portal-view svg .packages,
.portal-view .chart-title .packages,
.portal-editor svg .packages,
.portal-editor .chart-title .packages{
color: #2c6f90; /* Back-up color for IE */
fill: #2c6f90; /* Back-up color for IE */
stroke: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
fill: var(--portal-primary-color);
stroke: var(--portal-primary-color);
}
.portal-view svg circle.packages,
.portal-editor svg circle.packages{
fill: none;
}
.portal-view svg .metadata,
.portal-view .fallback.metadata,
.portal-editor svg .metadata,
.portal-editor .fallback.metadata{
color: #2c7e90; /* Back-up color for IE */
fill: #2c7e90; /* Back-up color for IE */
stroke: #2c7e90; /* Back-up color for IE */
color: var(--portal-secondary-color);
fill: var(--portal-secondary-color);
stroke: var(--portal-secondary-color);
}
.portal-view svg .data,
.portal-view .fallback.data,
.portal-editor svg .data,
.portal-editor .fallback.data{
color: var(--portal-accent-color);
fill: var(--portal-accent-color);
stroke: var(--portal-accent-color);
}
.portal-view #metric-modal .metric-chart .bar,
.portal-view .views-metrics .metric-chart .bar,
.portal-view .downloads-metrics .metric-chart .bar,
.portal-view #metric-modal .metric-chart .scale_button:hover rect,
.portal-view #metric-modal .metric-chart .bar,
.portal-view #metric-modal .metric-chart .bar_context,
.portal-view .views-metrics .metric-chart .scale_button:hover rect,
.portal-view .views-metrics .metric-chart .bar,
.portal-view .views-metrics .metric-chart .bar_context,
.portal-view .downloads-metrics .metric-chart .scale_button:hover rect,
.portal-view .downloads-metrics .metric-chart .bar,
.portal-view .downloads-metrics .metric-chart .bar_context {
stroke: var(--portal-primary-color);
fill: var(--portal-primary-color);
}
.portal-view .donut-title-count.data,
.portal-view .donut-title-count.metadata,
.portal-view .donut-title-text,
.portal-view .donut-title-text{
fill: #555;
}
.portal-view .line-chart .line,
.portal-editor .line-chart .line{
fill: none;
}
.portal-view .line-chart text.line-chart-label,
.portal-editor .line-chart text.line-chart-label{
fill: #FFF;
}
.portal-view #portal-members a,
.portal-editor #portal-members a{
color: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
}
.portal-section-content thead tr {
background-color: var(--portal-primary-color);
}
.portal-section-content a {
color: var(--portal-primary-color);
}
.portal-section-view a {
color: var(--portal-primary-color);
}
.portal-view .pagination ul > .active > a,
.portal-view .pagination ul > .active > a:hover {
background-color: var(--portal-primary-color);
}
.portal-view .info-icons .icon:hover {
color: var(--portal-primary-color);
}
.portal-view,
.portal-view .portal-section-content,
.portal-view h2,
.portal-view h3,
.portal-view h4,
.portal-view h5,
.portal-view h6 {
color: #555;
}
.portal-view .portal-title {
color: var(--portal-primary-color);
}
.my-portals-container table td {
vertical-align: middle;
}
.portal-list-container .logo img {
min-width: 70px;
width: 70px;
height: 70px;
object-fit: contain;
}
.portal-list-container .loading {
height: 50px;
text-align: center;
}
.my-portals-container table td.title > a {
font-size: 15px;
line-height: 0.9;
color: #3a3a3a;
}
.my-portals-container table td.title > a:hover {
color: #660000;
}
.my-portals-container table td.portal-label {
color: #a4a4a4;
}
.create-btn-container .btn{
float: right;
margin-bottom: 20px;
}
/** The Portal Visualization View **/
.portal-viz-section-view{
background-color: black;
}
.portal-viz-section-view iframe{
box-sizing: border-box;
border: 0px;
}
/******************************************
* HTML converted from Markdown
********************************************/
/* images in markdown */
.markdown img.thumbnail {
display: block;
}
/* the following two rules overwrite both:
i. the bootstrap `pre` rules
ii. individual theme `pre` rules
*/
div.markdown pre {
color: #383a42;
background: #fafafa;
border-radius: 3px;
}
/* markdown citations */
.markdown .inlineCitation {
}
.markdown .csl-entry {
text-indent: -15px;
margin-left: 15px;
margin-bottom: 10px;
}
.markdown #bibliography {
margin-top: 40px;
margin-bottom: 20px;
}
/******************************************
* Download / Resource Map contents table
********************************************/
#downloadContents .controls-well{
overflow-x: scroll;
-webkit-transform: translate3d(0,0,0);
}
.download-contents{
float: none;
clear: both;
}
.download-contents ~ .download-contents {
margin-top: 20px;
}
table.download-contents {
width: 100%;
margin-bottom: 0px;
}
table.download-contents.nested{
margin-left: 5%;
width: 95%;
}
.download-contents td{
overflow-wrap: break-word;
vertical-align: middle; /*Oh tables, good for one thing...*/
}
.download-contents th{
font-weight: normal;
}
.table-header.subtle{
font-size: .9em;
line-height: 0.8em;
border-top: 0px;
}
.table .table-header{
border-bottom: 1px solid #8DA2AA;
}
.table-header-link{
font-weight: normal;
}
.table tr > th .tooltip{
font-weight: normal;
}
.download-contents .btn .icon,
.download-contents .preview .icon{
font-size: 1em;
margin-left: 5px;
}
.download-contents a[href="tools/eml"]{
color: inherit;
}
.download .btn i{
margin-left: 5px;
}
.download-contents .format-type{
text-align: left;
}
.download-contents .file-type i {
color: #999;
margin-left: 5px;
}
.download-contents .ellipsis{
display: block;
max-width: 250px;
}
table.download-contents .name{
min-width: 325px;
max-width: 325px;
}
table.download-contents .btn-container,
table.download-contents .btn-container .btn{
width: 140px;
}
.download-contents.service .btn-container .btn{
width: 135px;
}
.download-contents.service .btn-container .btn span {
float: left;
width: 80%;
width: calc(100% - 20px);
}
.download-contents.service .btn-container .btn .icon {
float: right;
margin-top: 1em;
}
.download-contents th .btn-primary{
min-width: 138px;
}
.download-contents.nested .table-header.title a{
color: #FFF;
}
.parent-link{
font-size: .9em;
margin-bottom: 10px;
display: block;
}
/* The footer / expand-collapse control */
.table tfoot th{
text-align: center;
}
tfoot .control{
border-bottom-width: 1px;
border-bottom-style: dotted;
cursor: pointer;
}
tfoot .control i{
margin-left: 5px;
}
.download-contents ~ .expand-collapse-control{
line-height: 2em;
text-align: center;
font-weight: bold;
margin-top: 20px;
margin-bottom: 20px;
}
.expand-collapse-control > a > .icon{
margin-right: 5px;
}
/**----------------------------------------**/
/******************************************
/******************************************
* Service Registration table
********************************************/
.service-table {
margin-top: 2em;
}
.service-table td {
height: 1em;
vertical-align: middle;
}
.service-table td.service-name {
width: 150px;
}
.service-table td.service-description {
min-width: 200px;
max-width: 300px;
}
.service-description p {
display: inline;
margin-right: 5px;
}
.service-description .ellipsis {
width: 80%;
width: calc(100% - 48px);
display: inline-block;
margin: 0px;
}
.service-description .expand-collapse {
vertical-align: top;
}
.service-table thead{
font-weight: bold;
}
.service-table td.service-type {
width: 100px;
}
.service-table td.service-endpoint {
width: 200px;
}
.service-table td.service-endpoint input {
width: 120px;
margin-bottom: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border-color: #e6e6e6;
}
.service-table td.service-endpoint button {
margin-bottom: 0px;
border-left: 0px;
padding: 4px 7px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}
.service-table span.copy-success {
position: absolute;
margin-top: 4px;
margin-left: 10px;
}
/**----------------------------------------**/
/******************************************
* Citations and Citation Popovers
********************************************/
.popover .citation .id{
word-wrap: break-word;
word-break: break-all;
}
.popover .citation-container.multiple .citation{
padding-top: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #999;
}
.popover .citation-container a{
margin-top: 10px;
display: block;
}
.popover .citation-container a > i{
margin-left: 5px;
}
.citation .label{
display: inline;
font-weight: bolder;
text-shadow: none;
}
#results .popover{
min-width: 300px;
max-width: 300px;
font-size: .9em;
line-height: 1.3em;
}
.popover cite{
display: block;
margin-bottom: 20px;
}
.citation .id{
color: #888;
font-size: .9em;
}
.result-row .citation a {
color: inherit;
font-weight: normal;
}
.result-row .citation .title{
font-weight: bold;
}
.route-to-metadata{
cursor: pointer;
}
.citation.collection .title{
display: block;
}
.citation.collection .id{
display: none;
}
/******************************************
** User Profile ***
******************************************/
.user-view-section > section {
max-width: 1200px;
width: 90%;
margin-left: auto;
margin-right: auto;
}
#profile-content {
float: right;
}
#user-profile #data-list{
padding-bottom: 20px;
margin-bottom: 20px;
}
#user-profile #clear-all{
display: none;
}
.user-view-section > .section > .span12{
margin-left: 0px;
}
.user-view-section .hgroup{
margin-bottom: 20px;
}
.user-view-section .hgroup h2 a{
font-weight: lighter;
color: inherit;
}
.user-view-section .hgroup h6,
.user-view-section .hgroup h5{
font-weight: normal;
}
.user-view-section h5{
margin-bottom: 10px;
margin-top: 5px;
padding-bottom: 10px;
}
.user-view-section .hgroup .divided{
margin-top: 20px;
padding-top: 20px;
}
#token-generator-container .notification.loading{
min-height: 236px;
}
textarea.token{
width: 100%;
margin-top: 20px;
font-size: .9em;
}
.form-group{
clear: both;
}
.list-group-item .remove-identity-btn {
float: right;
line-height: 2.7em;
}
.list-group-item.identity.pending .details{
margin-left: 52px;
}
.list-group-item.identity .details .orcid-logo{
margin-left: 0px;
}
.list-group-item .confirm-request-btn,
.list-group-item .reject-request-btn{
margin-right: 5px;
}
.icon.is-owner{
color: #FFD700;
}
.member .has-member-controls{
float: left;
width: 85%;
}
.member .member-controls{
float: left;
width: 10%;
width: calc(15% - 10px);
}
.member .member-controls .remove-member{
float: right;
font-size: 1.3em;
line-height: 2em;
cursor: pointer;
}
.add-member label{
max-width: 100%;
word-break: break-word;
white-space: pre-wrap;
}
.add-member .notification{
margin-top: 10px;
line-height: 30px;
}
.list-group-item.add-member input{
max-width: 75%;
}
#data-list > p.center{
margin-top: 40px;
}
.orcid-logo{
height: 16px;
width: 16px;
vertical-align: middle;
}
#user-profile .logo{
max-width: 100px;
display: block;
margin-bottom: 30px;
}
#identity-request-container label,
.add-member label{
font-weight: bold;
}
#first-upload-year-container{
float: left;
max-width: 115px;
}
#first-upload-container{
font-size: .9em;
width: 50%;
width: calc(97% - 135px);
}
#total-replicas-wrapper{
display: none;
}
address.email-container{
display: inline;
}
address.email-container:after{
content: attr(data-domain);
}
address.email-container:before{
content: attr(data-user);
}
[data-username="ORNLDAAC"] #user-profile .user-info .logo,
[data-username="CDL"] #user-profile .user-info .logo,
[data-username="PISCO"] #user-profile .user-info .logo,
[data-username="ONEShare"] #user-profile .user-info .logo,
[data-username="KUBI"] #user-profile .user-info .logo,
[data-username="CLOEBIRD"] #user-profile .user-info .logo,
[data-username="EDACGSTORE"] #user-profile .user-info .logo,
[data-username="NKN"] #user-profile .user-info .logo,
[data-username="NRDC"] #user-profile .user-info .logo{
max-width: 200px;
width: 200px;
}
#quality-score, #quality-chart{
display: none;
}
.quality-report-view #suiteId {
position: relative;
width: auto;
margin-top: 10px;
margin-bottom: 10px;
}
.quality-report-view .metric-chart-loading {
margin: 50px auto;
}
.new-icon{
color: #d2a908;
}
/******************************************
** Stats ***
******************************************/
.no-activity h3,
.no-activity h4,
.no-activity h5,
.no-activity h6,
.no-activity p,
.no-activity .summary-container p,
.no-activity a,
.no-activity .message,
.no-activity svg .title,
.no-activity svg .bar-label,
.profile .no-activity .packages p{
color: #CCC;
stroke: #CCC;
fill: #CCC;
}
.no-activity svg.character {
display: none;
}
/*Moving the circle badge at the center of the div*/
.profile .circle-badge {
display: block;
margin: auto;
}
.profile .circle-badge circle.no-activity{
stroke: #CCC;
fill: transparent;
}
.profile .circle-badge text.no-activity{
fill: #CCC;
}
.profile .charts{
box-sizing: border-box;
display: flex;
justify-content: center;
}
.profile .chart{
float: left;
margin-left: 20px;
margin-right: 20px;
margin-top: 30px;
}
.profile .stripe{
clear: both;
min-height: 200px;
}
.profile .chart-title.uploads{
width: 100%;
}
.profile .downloads .chart-title,
.profile .uploads .chart-title{
width: 100%;
min-width: 250px;
}
.profile #downloads-title,
.profile #uploads-title{
float: left;
min-width: 200px;
}
.profile .chart.download-chart,
.profile .chart.upload-chart{
width: 1000px;
float: none;
clear: both;
}
.profile .stripe{
border-top: 1px dashed #CCC;
padding: 20px 20px 20px 20px;
}
.profile .packages p {
color: #333;
}
.no-activity .profile .packages p{
color: inherit;
}
.profile .circle-badge circle{
fill: transparent;
}
.profile .quick-stats .circle-badge .count{
font-size: 24px;
}
.profile .quick-stats .circle-badge .title{
font-size: 16px;
}
.profile .charts + p{
margin-top: 20px;
}
/**** Bar Charts ******/
.bar-chart .bar-label.bg{
fill: rgba(0,0,0,0.8);
stroke-width: 0px;
}
.bar-chart .bar-label.bg ~ text{
fill: #FFF;
}
.bar-chart.hide-labels .x.axis .tick:nth-child(even){
display: none; /* hide every other x-axis tick when there are too many bars */
}
.bar-chart.log-scale .tick line{
stroke: #EEE;
}
.profile .temporal-coverage-chart{
width: calc(100% - 40px);
}
/**** Default Chart Styles *****/
svg .default,
.fallback.default{
fill: #999;
stroke: #999;
color: #999;
}
.donut.default .donut-labels,
.donut.no-activity .donut-labels{
visibility: hidden;
}
.donut.default > g .donut-arc,
.donut.data.default > g .donut-arc,
.donut.metadata.default > g .donut-arc,
.donut.default .donut-title-count,
.donut.default .donut-title-text{
fill: #999;
}
.circle-badge.default circle{
stroke: #999;
}
.circle-badge.default text{
fill: #999;
}
/**** Static Image Chart Styles *****/
.profile .stripe img{
width: 100%;
max-width: 950px;
min-width: 600px;
max-height: 350px;
padding-top: 30px;
padding-left: 10px;
overflow-x: scroll;
}
.profile .stripe .static-img-container {
overflow-x: auto;
}
/**** No Activity Chart Styles (when Stats View is blank/ no activity found) *****/
svg .no-activity,
.fallback.no-activity{
fill: #CCCCCC;
stroke: #CCCCCC;
color: #CCCCCC;
}
.donut.default > g .donut-arc,
.donut.data.default > g .donut-arc,
.donut.metadata.default > g .donut-arc,
.donut.default .donut-title-count,
.donut.default .donut-title-text{
fill: #CCCCCC;
}
/******************************************
** Panels ***
******************************************/
.panel {
margin-bottom: 20px;
background-color: #fff;
border: 1px solid transparent;
border-radius: 4px;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
box-shadow: 0 1px 1px rgba(0,0,0,.05);
transition: box-shadow 2s ease-out;
-o-transition: box-shadow 2s ease-out;
-moz-transition: box-shadow 2s ease-out;
-webkit-transition: box-shadow 2s ease-out;
-ms-transition: box-shadow 2s ease-out;
-kthtml-transition: box-shadow 2s ease-out;
transition: box-shadow 2s ease-out;
}
.panel.highlight{
box-shadow: 0 0 5px rgb(50, 161, 19),0 0 12px rgb(0, 255, 213);
}
.panel-default {
border-color: #ddd;
}
.panel-default>.panel-heading {
background-color: #f5f5f5;
border-color: #ddd;
}
.panel-heading {
padding: 10px 15px;
border-bottom: 1px solid transparent;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.panel-title {
color: inherit;
}
.panel-body {
padding: 15px;
}
.panel-body .panel{
margin-top: 30px;
}
.panel-body form{
margin-bottom: 0px;
}
.panel>.list-group, .panel>.panel-collapse>.list-group {
margin-bottom: 0;
margin-left: 0px;
}
.list-group {
padding-left: 0;
margin-bottom: 20px;
margin-left: 0px;
list-style: none;
}
.panel>.list-group .list-group-item, .panel>.panel-collapse>.list-group .list-group-item {
border-width: 1px 0;
border-radius: 0;
}
.list-group-item:first-child {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.list-group-item {
position: relative;
display: block;
padding: 10px 15px;
margin-bottom: -1px;
background-color: #fff;
border: 1px solid #ddd;
}
.list-group-header.list-group-item{
background-color: #ECF1F5;
min-width: auto;
}
#profile-group-list-container > ul > .list-group-header.list-group-item:hover,
#profile-group-list-container > ul > .list-group-header.list-group-item.active{
background-color: #208095;
min-width: auto;
}
#profile-group-list-container > ul > li.list-group-item.member.current-page:hover{
background-color: #fff;
}
#profile-group-list-container > ul > .pager.list-group-item:hover {
background-color: #fff;
}
#profile-group-list-container > ul > .pager > .pager-link:hover {
background-color: #208095;
color: #fff;
}
.panel>.list-group .list-group-item.active{
border-left-width: 5px;
}
.list-group-item > .list-group {
margin-bottom: 10px;
margin-top: 10px;
}
.list-group-item > .list-group > .list-group-item:last-child{
border-bottom-width: 0px;
}
.list-group-item a > .icon{
margin-right: 5px;
}
.list-group-item:first-child {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.list-group-item {
position: relative;
display: block;
padding: 10px 15px;
margin-bottom: -1px;
background-color: #fff;
border: 1px solid #ddd;
box-sizing: border-box;
}
.list-group-item .badge{
margin-top: 10px;
}
.panel>.list-identity .list-group-item.active{
border-left-width: 5px;
}
.list-group-item > .list-identity {
padding-left: 20px;
margin-bottom: 0px;
}
.list-group-item > .list-identity > .list-identity-item:last-child{
border-bottom-width: 0px;
}
.list-group-item a > .icon{
margin-right: 5px;
}
.list-group-item .details {
font-size: .9em;
display: block;
color: #666;
}
.list-group-item.member .details{
margin-left: 18px;
}
.list-group-item.create-group a{
font-weight: normal;
}
/******************************************
** Searching and Map ***
******************************************/
#clear-all{
width: 95%;
width: calc(100% - 10px);
padding: 2px 5px;
margin-bottom: 0px;
display: block;
float: none;
cursor: pointer;
font-size: 1em;
color: #FFF;
font-weight: bold;
background-color: #006699
}
#clear-all .icon{
color: rgb(131, 131, 0);
margin: 0px 5px;
}
#map-container{
display: none;
}
body.mapMode{
overflow-y: hidden;
}
.mapMode #map-container{
position: relative;
display: block;
}
.map-toggle-container{
background-color: #333333;
background: -moz-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0.7) 37%, rgba(0,0,0,0.7) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,1)), color-stop(37%,rgba(0,0,0,0.7)), color-stop(100%,rgba(0,0,0,0.7))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0.7) 37%,rgba(0,0,0,0.7) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0.7) 37%,rgba(0,0,0,0.7) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0.7) 37%,rgba(0,0,0,0.7) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(0,0,0,1) 0%,rgba(0,0,0,0.7) 37%,rgba(0,0,0,0.7) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#b3000000',GradientType=0 ); /* IE6-9 */
padding: 5px;
top: 0px;
height: auto;
position: relative;
display: block;
width: 95%;
width: calc(100% - 10px);
}
.mapMode #results-view .map-toggle-container {
display: none;
}
.map-toggle-container > a{
font-size: 1em;
line-height: 1.3em;
color: white;
font-weight: normal;
}
.map-toggle-container > a:hover{
color: white;
font-weight: bold;
}
.map-toggle-container > a > .icon{
margin-left: 5px;
margin-right: 5px;
}
.map-toggle-container > label{
color: #FFF;
float: right;
}
.map-toggle-container > input[type="checkbox"]{
float: right;
margin-top: 2px;
height: 20px;
width: 20px;
}
/* For list mode only */
.list-only #sidebar{
display: none;
}
.list-only #results-container{
width: 100%;
overflow-y: visible;
overflow-x: visible;
}
.list-only .map-toggle-container{
display: none;
}
/******************************************
** Filters ***
******************************************/
.filter-container{
width: 187px;
}
.filter-contain{
border-bottom: 1px dashed #CCC;
padding: 10px 0px 5px 0px;
width: 100%;
height: auto;
max-height: 1.4em;
transition: max-height .5s ease-in-out;
-webkit-transition: max-height .5s ease-in-out;
-moz-transition: max-height .5s ease-in-out;
overflow: hidden;
}
.filter-input-contain{
position: relative;
width: 100%;
}
.filter.btn{
margin-bottom: 0px;
}
.filter-contain > label{
font-size: 13px;
font-weight: bold;
display: inline-block;
height: 2em;
}
.current-filters-container{
margin-bottom: 10px;
display: block;
clear: both;
border-bottom: 2px solid #DDD;
padding-left: 10px;
padding-right: 25px;
}
.current-filters > .current-filter,
.current-filters > .current-filter[class*="span"]{
padding: 0px 5px 0px 5px;
min-height: 1.5em;
line-height: 1.5em;
width: 100%;
width: calc(100% - 20px);
margin: 5px 0px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
font-size: 1em;
}
.current-filters,
.current-filters[class*="span"]{
list-style: none;
margin-left: 0px;
min-height: 0px;
}
.current-filter > span{
max-width: 85%;
max-width: calc(100% - 25px);
overflow: hidden;
white-space: normal;
word-break: break-word;
display: inline-block;
vertical-align: middle;
}
.current-filter .category{
font-weight: bold;
margin-right: 5px;
}
.current-filter > .icon{
margin-left: 5px;
}
.current-filters[data-category='resourceMap'] .current-filter .category{
margin-right: 0px;
}
#sidebar{
width: 225px;
height: auto;
overflow-y: visible;
overflow-x: visible;
float: left;
clear: left;
}
.mapMode #sidebar{
width: 215px;
height: 700px;
border-right: 1px solid #CCC;
overflow-x: hidden;
overflow-y: overlay;
-webkit-transform: translate3d(0,0,0);
}
#sidebar > *{
padding-left: 10px;
padding-right: 10px;
width: calc(100% - 30px);
}
#sidebar > .input-append{
margin-top: 10px;
border-bottom: 2px solid #DDD;
padding-bottom: 16px;
}
#sidebar > .input-append > label{
font-size: 15px;
font-weight: bold;
}
#sidebar > .input-append .btn {
margin-left: -6px;
}
#sidebar .tooltip-inner{
font-size: 1.2em;
font-weight: normal;
max-width: 181px;
}
#all_input {
width: 75%;
width: calc(100% - 60px);
margin-left: 0px;
margin-right: -3px;
}
.filter-input-contain input.filter{
margin-right: -3px;
margin-left: 0px;
border-radius: 5px 0px 0px 5px;
-webkit-border-radius: 5px 0px 0px 5px;
-moz-border-radius: 5px 0px 0px 5px;
border: 1px solid #AAAAAA;
border-right: 0px;
height: 20px;
width: 75%;
}
#filter-year{
width: 90%;
}
#filter-year input[type='text']{
max-width: 50px;
}
#sidebar .ui-helper-hidden-accessible{
display: none;
}
#filter-year .filter-input-contain{
margin-top: 10px;
}
.filter-contain input[type="checkbox"].filter{
width: 20px;
float: left;
margin-right: 5px;
}
/*-- Pagination and sort --*/
.sort-by{
float: right;
}
.sort-by label {
display: inline;
margin-right: 5px;
line-height: 30px;
vertical-align: top;
}
.sort-by select{
width: auto;
}
.pager-view li a{
min-height: 20px;
min-width: 12px;
}
.pager-view li a:not([href]){
pointer-events: none;
color: #CCC;
}
#results-container .pagination{
box-sizing: border-box;
}
/*-- The filter checkboxes --*/
#includes-files label{
margin-right: 4px;
float: left;
font-size: 13px;
width: auto;
}
.filter-contain .checkbox-list {
margin-left: 0px;
list-style: none;
}
.checkbox-list > li > input{
float: left;
margin-right: 10px;
margin-left: 3px;
}
.checkbox-list label{
font-size: .9em;
}
.checkbox-list .more-link,
.checkbox-list .less-link{
font-weight: normal;
font-size: .9em;
}
.checkbox-list .more-link .icon,
.checkbox-list .less-link .icon{
margin-left: 5px;
font-size: 1.2em;
vertical-align: text-bottom;
line-height: .9em;
}
/** Filter icons **/
.filter-contain > label > .icon{
color: #888;
font-size: 17px;
float: left;
margin: 0px;
margin-right: 8px;
}
.filter-contain .icon.more-info{
font-size: 14px;
line-height: 23px;
top: 5px;
float: left;
cursor: default;
}
.filter-contain .icon.expand,
.filter-contain .icon.collapse{
margin-right: 15px;
}
#filter-year > .icon,
#includes-files > .icon{
margin-top: 0px;
}
.filter-contain > .icon-sitemap{
font-size: 18px;
}
.filter-contain > .icon-map-marker{
font-size: 22px;
}
.current-filters.active {
background-color: inherit;
border-color: inherit;
display: inline-block;
float: none;
}
/** For "My Packages" filter **/
.keyword-search-link,
.current-filters > li.keyword-search-link {
display: none;
}
.keyword-search-link.active,
.current-filters > li.keyword-search-link.active{
border-color: inherit;
display: inline-block;
width: auto;
}
.btn-primary[disabled], .btn-primary[disabled]:hover, .btn[disabled], .btn[disabled]:hover {
border-color: #CCC;
background-color:#e6e6e6;
color: #333;
}
/********* Filter Views ***********/
.filter-groups .tab-content {
overflow: inherit;
}
.portal-view .filter-group{
padding: 0px 20px;
}
.filter-group .filters-container{
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: baseline;
}
.filter-group .filter {
flex-grow: 1;
padding-right: 20px;
max-width: 350px;
min-width: 200px;
}
.filter-groups.vertical .filter-group .filter{
padding-right: 0px;
min-width: 0px;
max-width: 100%;
margin-bottom: 10px;
}
.filter-groups .filter .btn:not(.btn-filter-editor){
box-shadow: none;
border-color: #ccc;
color: #999;
padding: 4px 10px;
}
.filter-groups.vertical .filter .btn{
margin-left: -5px;
padding: 4px 10px;
}
.filter-groups .filter .btn .icon{
line-height: 16px;
margin: 0px;
}
.filter-group .filter input{
box-shadow: none;
}
.filter-groups .filter label{
cursor: default;
margin-bottom: 13px;
display: flex;
align-items: center;
}
.filter-group-links{
border-top: 1px solid #DDD;
clear: both;
}
.edit-mode .filter-group-links {
margin-top: 2rem;
margin-left: 1rem;
}
.edit-mode .filters-container {
margin-top: 1rem;
margin-left: 1.5rem;
}
.filter-groups.vertical .filter-group-links {
border: 0px;
}
.filter-group-link a,
.nav-tabs .filter-group-link a,
.nav-tabs .filter-group-link.active a {
background-color: #eee;
border: 1px solid #ccc;
border-bottom: 0px;
border-top: 0px;
border-radius: 0px;
border-top-width: 0px;
margin-right: 0px;
border-right-width: 0px;
text-align: center;
}
.nav-tabs .filter-group-link.active a{
background-color: #FFF;
}
.nav-tabs .filter-group-link a:hover{
border-color: #CCC;
}
.filter-group-link{
background-color: #eee;
}
.filter-groups.vertical .filter-group-link {
float: none;
}
.filter-groups.vertical .filter-group-link a,
.filter-groups.vertical .nav-tabs .filter-group-link a,
.filter-groups.vertical .nav-tabs .filter-group-link.active a {
border: 0px;
text-align: left;
padding-left: 0px;
}
.filter .ui-slider{
position: relative;
height: 5px;
margin-top: 20px;
margin-bottom: 20px;
width: 90%;
width: calc(100% - 20px);
}
.filter .ui-slider-handle{
width: 7px;
height: 16px;
}
.filters-title{
text-transform: uppercase;
color: #999;
font-size: .9em;
font-weight: normal;
margin-top: 0px;
}
.filter-groups:not(.vertical) .filters-title{
display: none;
}
.filter-groups.vertical .filters-title{
display: none;
font-size: .85em;
}
.filter-groups.vertical .filters-title .clear-all{
margin-left: 10px;
}
.filter-groups.vertical .filters-title .clear-all .icon{
float: right;
margin-top: 2px;
font-size: 1.2em;
}
.filters-title .clear-all{
margin-left: 10px;
}
.filters-header label{
font-weight: bold;
}
.filters-header .applied-filters{
min-height: 25px;
}
.filters-header .applied-filters .applied-filter{
background-color: #166194;
color: #FFF;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
display: inline-block;
margin-bottom: 5px;
text-shadow: none;
font-size: 1em;
font-weight: normal;
padding: 5px;
margin-right: 10px;
}
.filter-groups.vertical .applied-filters .applied-filter{
display: block;
position: relative;
}
.filter-groups.vertical .filters-header .applied-filters .applied-filter > span{
width: calc(100% - 20px);
display: inline-block;
white-space: normal;
}
.filters-header .applied-filters .applied-filter .label{
font-weight: bold;
margin-right: 10px;
background-color: transparent;
}
.filter-groups.vertical .applied-filters .applied-filter .remove-filter{
font-size: 1.3em;
position: absolute;
right: 5px;
}
.filter-groups.vertical .filters-header .applied-filters{
min-height: 0px;
}
.filters-header > .filter{
float: left;
margin-right: 10px;
width: auto;
}
.filter-groups.vertical .filters-header > .filter{
float: none;
margin-right:0px;
}
.filter-groups:not(.vertical) .filters-header > .filter{
display: inline-block;
}
.filter-groups:not(.vertical) .filters-header > .filter input[type='text']{
width: auto;
}
.filter.date .min,
.filter.date .max,
.filter.numeric .min,
.filter.numeric .max{
max-width: 30%;
}
.filter.date .to,
.filter.numeric .to{
width: 30%;
width: calc(40% - 50px);
text-align: center;
display: inline-block;
}
.filter.date .min,
.filter.numeric .min{
float: left;
}
.filter.date .max,
.filter.numeric .max{
float: right;
margin-left: 10px;
}
.filter .ui-slider{
min-height: 6px;
border-radius: 4px;
border: 0px;
background: #CCC;
}
.filter.boolean input{
height: auto;
font-size: 3em;
margin-right: 10px;
}
.filter.boolean span{
display: inline;
white-space: normal;
}
.filter.numeric input{
max-width: 70px;
}
.filter.toggle .can-toggle > span{
margin-bottom: 5px;
display: block;
}
.filter input[type='text']{
width: 80%;
}
/*
Overrides for default Bootstrap styling for the searchable select
component when we use it as a Portal data search filter. These overrides make
the component look nearly identical to other filters (that use native form
elements)
*/
.filter-groups .filter.annotation-filter .ui.fluid.dropdown>.dropdown.icon {
top: 25%;
}
.filter-groups .filter.annotation-filter .dropdown.search {
padding: 0;
font-size: 100%;
box-sizing: border-box;
border-color: #ccc;
border-radius: 2px;
}
.filter-groups .filter.annotation-filter .dropdown.multiple.ui {
padding: 0;
}
.filter-groups .filter.annotation-filter .ui.multiple.search.dropdown > input.search {
font-size: inherit;
line-height: 20px;
margin: 4px 6px;
}
/* End Overrides for default Bootstrap styling for the searchable select */
.filter-group .filter select{
width: 100%;
}
.filter-group > .row-fluid:not(:first-child){
margin-top: 20px;
}
.applied-filter .icon.remove-filter{
opacity: .7;
margin-left: 10px;
color: inherit;
}
.applied-filters{
margin: 0px;
}
.filters-header{
margin: 10px;
}
.filter-groups.vertical .filters-header{
margin: 0px;
border-bottom: 1px dashed #CCC;
margin-bottom: 10px;
padding-bottom: 10px;
}
#portal-filters{
border: 1px solid #CCC;
box-sizing: border-box;
}
#portal-filters > .tab-content{
padding: 10px 20px;
}
#portal-filters > .nav-tabs{
margin-bottom: 0px;
border: 1px solid #CCC;
border-left: 0px;
border-right: 0px;
background-color: #eee;
}
#portal-filters > .nav-tabs > li:first-child > a{
border-left: 0px;
}
#portal-filters > .nav-tabs > li:last-child > a{
border-right: 0px;
}
/* Hide the Spatial Filter elements until we fully support spatial filters */
.portal-editor .filter-groups.vertical .applied-filter.label.custom{
display: none;
}
.portal-editor .toggle-map-filter {
display: none !important;
}
/******** Toggle Widget ************/
.can-toggle {
position: relative;
}
.can-toggle *, .can-toggle *:before, .can-toggle *:after {
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 1em;
}
.can-toggle input[type="checkbox"] {
opacity: 0;
position: absolute;
top: 0;
left: 0;
}
.can-toggle input[type="checkbox"][disabled] ~ label {
pointer-events: none;
}
.can-toggle input[type="checkbox"][disabled] ~ label .can-toggle-switch {
opacity: 0.4;
}
.can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch:before {
content: attr(data-unchecked);
left: 0;
}
.can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch:after {
content: attr(data-checked);
}
.can-toggle label {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: relative;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.can-toggle label .can-toggle__label-text {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
padding-left: 32px;
}
.can-toggle label .can-toggle-switch {
position: relative;
}
.can-toggle label .can-toggle-switch:before {
content: attr(data-checked);
position: absolute;
top: 0;
text-align: center;
}
.can-toggle label .can-toggle-switch:after {
content: attr(data-unchecked);
position: absolute;
z-index: 5;
text-align: center;
background: white;
-webkit-border-radius: 4px;
border-radius: 4px;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.can-toggle input[type="checkbox"][disabled] ~ label {
color: rgba(119, 119, 119, 0.5);
}
.can-toggle input[type="checkbox"]:focus ~ label .can-toggle-switch,
.can-toggle input[type="checkbox"]:hover ~ label .can-toggle-switch {
background-color: #777;
}
.can-toggle input[type="checkbox"]:focus ~ label .can-toggle-switch:after,
.can-toggle input[type="checkbox"]:hover ~ label .can-toggle-switch:after {
color: #5e5e5e;
}
.can-toggle input[type="checkbox"]:hover ~ label {
color: #6a6a6a;
}
.can-toggle input[type="checkbox"]:checked ~ label:hover {
color: #55bc49;
}
.can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch {
background-color: #00689d;
}
.can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch:after {
color: #00689d;
}
.can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle-switch,
.can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle-switch {
background-color: #00689d;
}
.can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle-switch:after,
.can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle-switch:after {
color: #00689d;
}
.can-toggle label .can-toggle__label-text {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.can-toggle label .can-toggle-switch {
-webkit-transition: background-color 0.3s cubic-bezier(0, 1, 0.5, 1);
transition: background-color 0.3s cubic-bezier(0, 1, 0.5, 1);
background: #848484;
}
.can-toggle label .can-toggle-switch:before {
color: rgba(255, 255, 255, 0.5);
}
.can-toggle label .can-toggle-switch:after {
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0, 1, 0.5, 1);
transition: transform 0.3s cubic-bezier(0, 1, 0.5, 1);
color: #777;
}
.can-toggle input[type="checkbox"]:focus ~ label .can-toggle-switch:after, .can-toggle input[type="checkbox"]:hover ~ label .can-toggle-switch:after {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}
.can-toggle input[type="checkbox"]:checked ~ label .can-toggle-switch:after {
-webkit-transform: translate3d(65px, 0, 0);
transform: translate3d(65px, 0, 0);
}
.can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle-switch:after, .can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle-switch:after {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}
.can-toggle label {
font-size: 1em;
}
.can-toggle label .can-toggle-switch {
height: 1.1em;
-webkit-flex: 0 0 134px;
-ms-flex: 0 0 134px;
flex: 0 0 134px;
border-radius: 4px;
}
.can-toggle label .can-toggle-switch:before {
left: 67px;
line-height: 1em;
width: 67px;
padding: 0 12px;
}
.can-toggle label .can-toggle-switch:after {
top: 2px;
left: 2px;
border-radius: 2px;
width: 65px;
line-height: 1.1em;
}
.can-toggle label .can-toggle-switch:hover:after {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}
.can-toggle.can-toggle-small input[type="checkbox"]:focus ~ label .can-toggle-switch:after, .can-toggle.can-toggle-small input[type="checkbox"]:hover ~ label .can-toggle-switch:after {
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
.can-toggle.can-toggle-small input[type="checkbox"]:checked ~ label .can-toggle-switch:after {
-webkit-transform: translate3d(98px, 0, 0);
transform: translate3d(98px, 0, 0);
}
.can-toggle.can-toggle-small input[type="checkbox"]:checked:focus ~ label .can-toggle-switch:after, .can-toggle.can-toggle-small input[type="checkbox"]:checked:hover ~ label .can-toggle-switch:after {
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
.can-toggle.can-toggle-small label {
font-size: 1em;
}
.can-toggle.can-toggle-small label .can-toggle-switch {
height: 2.5em;
-webkit-flex: 0 0 200px;
-ms-flex: 0 0 200px;
flex: 0 0 200px;
border-radius: 4px;
-webkit-border-radius: 4px;
}
.can-toggle.can-toggle-small label .can-toggle-switch:before {
left: 100px;
line-height: 2.5em;
width: 100px;
padding: 0 12px;
}
.can-toggle.can-toggle-small label .can-toggle-switch:after {
top: 1px;
left: 1px;
border-radius: 4px;
width: 100px;
line-height: calc(2.5em - 2px);
}
.can-toggle.can-toggle-small label .can-toggle-switch:hover:after {
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
/** Autocompletes **/
.ui-autocomplete{
width: 246px;
background-color: #FFFFFF;
border: 1px solid #999999;
padding: 10px;
list-style: none;
overflow-y: scroll;
-webkit-transform: translate3d(0,0,0);
max-height: 150px;
z-index: 99999;
overflow-x: hidden;
}
.ui-autocomplete .ui-menu-item{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 0px 5px;
width: 100%;
}
.ui-autocomplete .ui-menu-item:hover{
background-color: #DDD;
cursor: pointer;
}
/******************************************
** Edit Collection View ***
******************************************/
/* Make the sidebar a bit wider since filters will be used a lot while editing a collection */
.edit-collection #sidebar{
width: 0px;
border-right: none;
}
.edit-collection .map-toggle-container {
background: #ededed;
}
.edit-collection .map-toggle-container > a {
color: #333;
}
.edit-collection #results-container{
width: 100%;
overflow-y: auto !important;
overflow-x: hidden !important;
margin-left: 0;
}
.edit-collection .result-header-count {
font-size: 1rem;
font-weight: 500;
margin-bottom: 2rem;
}
.edit-collection .mapMode #results-container{
width: 49%;
}
.edit-collection .mapMode #map-container{
width: 49%;
}
/* The Save and Cancel buttons */
.collection-controls{
margin-top: 20px;
margin-bottom: 20px;
}
.collection-controls .save{
width: calc(50% - 10px);
box-sizing: border-box;
margin-right: 10px;
}
.collection-controls .cancel{
width: calc(50% - 10px);
box-sizing: border-box;
}
/*******************************************
Registry and Forms
******************************************/
/* Do not use the .label Bootstrap styles on labels in forms */
form .label,
#DynamicContent .label {
background-color: inherit;
color: inherit;
text-shadow: inherit;
font-size: inherit;
font-weight: inherit;
display: inherit;
padding: inherit;
line-height: inherit;
white-space: inherit;
vertical-align: inherit;
}
.has-error input,
input.has-error{
border-color: #a94442;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.has-error input:focus,
input.has-error:focus{
border-color: #843534;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;
}
.has-error label,
.has-error > div.text-left{ /* div.text-left is for Metacat-specific (2.4.X and before) login markup */
color: #a94442;
font-weight: bold;
}
.has-warning label{
color: #8a6d3b;
font-weight: bold;
}
.has-warning .help-block{
color: #8a6d3b;
}
.has-warning .form-control {
border-color: #8a6d3b;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
.has-warning .form-control:focus {
border-color: #66512c;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #c0a16b;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #c0a16b;
}
.has-warning .input-group-addon {
color: #8a6d3b;
background-color: #fcf8e3;
border-color: #8a6d3b;
}
.has-warning .form-control-feedback {
color: #8a6d3b;
}
form .text-left > .icon {
margin-left: 10px;
font-size: 1.1em;
}
.input-append .tooltip-inner {
white-space: normal;
}
.input-append .alert{
font-size: 14px;
margin-top: 10px;
}
.form-group input.control-group{
line-height: 30px;
}
.form-group input ~ .help-text,
.form-group input ~ .help-text ~ .form-feedback {
display: block;
margin-left: 24%;
}
.inline-input-group.controls-well{
margin-bottom: 20px;
padding: 10px 20px;
clear: both;
}
.inline-input-group label.inline{
line-height: 2em;
}
.inline-input-group > .input-append{
position: relative;
}
.input-append > .notification {
position: absolute;
right: 0;
top: -25px;
background-color: #FFF;
}
label.inline{
display: inline;
margin-right: 10px;
vertical-align: middle;
}
input.subtle{
width: 50px;
font-size: .9em;
-o-transition: width .2s ease-out;
-moz-transition: width .2s ease-out;
-webkit-transition: width .2s ease-out;
-ms-transition: width .2s ease-out;
-kthtml-transition: width .2s ease-out;
transition: width .2s ease-out;
}
.input-append input.subtle{
font-size: 13px;
}
input.subtle:focus
{
width: 200px;
}
.input-append .uneditable-input,
.input-append input,
.input-append select,
.input-prepend .add-on:first-child,
.input-prepend .btn:first-child{
-webkit-border-radius: 2px 0 0 2px;
-moz-border-radius: 2px 0 0 2px;
border-radius: 2px 0 0 2px;
}
.jump-width-input{
transition: width 1000s;
}
.nav
.input-submit{
margin-left: 10px;
height: 1em;
line-height: 1em;
border-color: #666;
color: #666;
}
#funding-group .ui-helper-hidden-accessible{
display: none;
}
#funding-group .ui-autocomplete{
width: 500px;
position: absolute;
top: 10px;
left: 10px;
}
#funding-group .ui-autocomplete .ui-menu-item{
width: 500px;
line-height: 1.4em;
}
#funding-group .ui-autocomplete .ui-menu-item a{
font-size: 1em;
}
.input-help-msg{
padding: .5em 0;
}
.cell-icon{
width: 1em;
}
.progress{
margin-top: 2em;
}
.ui-autocomplete-container.collapse.in{
overflow: visible;
}
#collapseParties .popover{
z-index: 0;
}
#RegistryGuide > div{
font-size: 1.8em;
}
.text-container input,
.text-container textarea{
width: 100%;
}
/*******************************************
Query builder & query rule view
******************************************/
.query-builder {
box-shadow: 0 1px 6px rgba(0,0,0,0.16), 0 1px 8px -3px rgba(0,0,0,0.23);
padding: 0;
margin: 2rem 1rem 2.5rem;
width: 100%;
max-width: 1400px;
border-radius: 3px;
box-sizing: border-box;
}
/* For query builders that are within a query rule row */
.query-builder.nested{
box-shadow: none;
margin: 0 0 0.3rem 0;
}
.query-builder-title {
font-weight: 500;
font-size: 1.1rem;
width: 100%;
margin: 0 0 1.2rem 0;
border-bottom: 1px solid #eee;
padding: 1.4rem 2rem 1.2rem;
box-sizing: border-box;
}
.query-builder.nested .query-builder-title{
padding: 1rem 1rem 1rem 0.1rem;
}
.query-builder .exclude-input,
.query-builder .operator-input {
display: inline-block;
}
.query-builder .buttons-container {
margin-left: 2rem;
}
.query-builder.nested .buttons-container {
margin-left: 0.1rem;
}
.query-builder .btn.add-rule,
.query-builder .btn.add-rule-group {
padding: 0.25rem 0.55rem 0.25rem 0.25rem;
margin-right: 0.5rem;
}
.rules-container {
display: grid;
grid-template-rows: auto;
grid-template-columns: 100%;
grid-gap: 1.5rem;
padding: 1.9rem 2rem;
}
.query-builder.nested .rules-container{
padding: 1.9rem 0 0.9rem 0.3rem;
}
.query-rule {
display: grid;
grid-template-columns: 3.9rem 0.9fr 0.65fr 0.9fr 1.5rem;
grid-template-rows: 1fr;
grid-template-areas: "info field operator value remove";
grid-gap: 1.5rem;
align-items: top;
}
/* For query rules that contain a query builder */
.query-rule.rule-group {
grid-template-columns: 3.9rem auto 1.5rem;
grid-template-areas: "info query-builder remove";
}
.query-rule .rule-info {
grid-area: info;
font-weight: 700;
font-size: 0.9rem;
color: #00689d;
color: var(--rule-color);
display: flex;
justify-content: space-between;
}
.query-rule .rule-info:after {
content:"";
float:right;
background: #00689d;
background: var(--rule-color);
width:3px;
height: calc(100% + 0.2rem);
border-radius: 1.5px;
}
.query-rule .field{
grid-area: field;
}
.query-rule .operator{
grid-area: operator;
}
.query-rule .value{
grid-area: value;
}
/* the button used to remove a rule */
.query-rule .remove-rule {
font-size: 1.5rem;
grid-area: remove;
cursor: pointer;
opacity: 0.2;
display: grid;
align-content: center;
justify-self: flex-end;
}
.query-rule.rule-group > .remove-rule {
align-content: top;
height: fit-content;
margin-top: 4.1rem;
}
.searchable-select-label {
margin: 0 0 3px 2px;
font-size: 0.8rem;
}
.search-select-tooltip {
/* one greater than the .modal z-index */
z-index: 1051
}
/* make the number & date filter inputs match the operator and field inputs */
.query-rule .filter input {
padding: .60em 1em;
border: 1px solid rgba(34,36,38,.15);
margin: 0;
}
.query-rule .slider-container {
text-align: center;
}
.query-rule .filter label {
display: none;
}
.query-rule .filter .ui-slider {
margin: 0.6rem 0 1rem;
}
.query-rule .filter.date .to,
.query-rule .filter.numeric .to {
width: 10%;
text-align: center;
}
.query-rule .filter.date .max,
.query-rule .filter.numeric .max {
margin-left: 0;
}
/* ---- Icons for the operator options not included in font-awesome ---- */
.icon-equal, .icon-not-equal, .icon-less-than, .icon-greater-than,
.icon-less-than-or-eq, .icon-greater-than-or-eq {
font-family: serif;
font-weight: 900;
font-size: larger;
line-height: 14px;
}
.icon-equal:before{
content: "="
}
.icon-not-equal:before{
content: "\2260"
}
.icon-less-than:before{
content: "<"
}
.icon-greater-than:before{
content: ">"
}
.icon-less-than-or-eq:before{
content: "≤"
}
.icon-greater-than-or-eq:before{
content: "≥"
}
/*******************************************
Editor View
******************************************/
.Editor #Footer{
display: none;
}
.Editor #Navbar{
padding-bottom: 0px;
}
.Editor #logo{
height: 40px;
margin-top: 5px;
}
.Editor .header .nav > li > a{
font-size: 1em;
}
.Editor .header .nav li a.btn{
font-size: .7em;
}
.Editor .header .border-image{
height: 15px;
margin-bottom: 5px;
}
.editor-view {
margin: 0px;
width: 100%;
max-width: 100%;
}
#editor-body{
padding-bottom: 100px;
}
.Editor #Content {
padding-top: 70px;
padding-left: 0px;
padding-right: 0px;
max-width: 100%;
}
#editor-header {
border-bottom: 1px solid #DDDDDD;
}
#editor-header .citation{
padding: 1em;
margin-bottom: 0px;
font-size: 1.1em;
line-height: 1.6em;
}
#editor-header .editor-controls{
min-height: 130px;
align-items: center;
display: flex;
margin-left: 40px;
height: 100%;
}
#editor-header .editor-controls:empty{
display: none;
}
#editor-header .editor-controls .btn{
align-self: center;
margin-top: 14px;
padding: 10px 15px;
}
.side-nav-item a {
width: 100%;
display: block;
height: 3em;
font-size: 1.3em;
line-height: 3em;
padding-left: 20px;
box-sizing: border-box;
}
.side-nav-item a:focus {
text-decoration: none;
}
.side-nav-item.error a{
color: #da4e4e;
}
.side-nav-item.error .active {
background-color: #da4e4e;
color: #FFFFFF;
}
.side-nav-item a .icon.hidden{
display: none;
}
ul.side-nav-items {
margin-left: 0px;
}
.side-nav-item {
list-style: none;
display: block;
}
.side-nav {
position: fixed;
background-color: #EEE;
height: 100%;
max-width: 160px;
min-width: 160px;
margin-left: 0px;
border-right: 1px solid #DDD;
}
.side-nav + .metadata-container{
margin-left: 160px;
padding-left: 20px;
}
.Editor #Footer {
left: 160px;
width: calc(100% - 160px);
margin-left: 0px;
margin-bottom: 0px;
}
.Editor.rendering #Footer{
margin-left: 0%;
width: 100%;
}
#editor-footer{
position: fixed;
display: grid;
box-sizing: border-box;
width: 100%;
bottom: 0px;
padding: 0.8rem;
z-index: 13;
height: 74px;
background-color: #333;
align-items: center;
grid-template-rows: auto;
grid-template-columns: auto auto;
grid-template-areas: "trial-message save-controls";
gap: 0.5rem;
}
#editor-footer .free-trial-message{
color: #FFF;
grid-area: trial-message;
}
#editor-footer .free-trial-message .icon{
height: 1.1em;
fill: #FFF;
}
.metadata-view #editor-footer{
display: none;
left: 0px;
}
#editor-footer a:not(.btn){
color: #FFF;
font-weight: bold;
}
/* The "view last saved version" and "save" button */
.editor-save-controls{
justify-self: right;
display: grid;
grid-template-columns: auto auto;
gap: 1rem;
grid-area: save-controls;
}
.editor-save-controls > a{
line-height: 1.5em;
font-size: 1.1em;
font-weight: bold;
margin: 0;
height: 1.5em;
align-self: center;
}
.editor-save-controls > a:not(.btn){
color: #FFF;
}
.editor-save-controls .metadata-container textarea{
width: 100%;
margin-bottom: 20px;
}
#cancel-metadata-prov{
margin-left: 30px;
}
/* Editor package table container */
#data-package-container {
overflow: auto;
position: relative;
}
/* Editor package table */
#data-package-table {
margin-bottom: 0px;
width: calc(100% - 2px);
}
/* Editor package table headers */
#data-package-table-share,
#data-package-table-guide-status {
text-align: center;
}
/* Editor package table row */
.data-package-item td {
vertical-align: middle;
white-space: nowrap;
position: relative;
}
.data-package-item td.name div {
padding: 8px;
width: fit-content;
cursor: not-allowed;
}
.data-package-item td.canRename div {
cursor: text;
}
.data-package-item td.error > [contenteditable]{
border: 2px solid red;
}
/* Editor package table column 1 */
.data-package-item td:first-of-type {
padding-left: 20px;
width: 100px;
}
/* Editor package table file name column */
.data-package-item td.name {
white-space: normal;
}
/* Editor package table size column */
.data-package-item td.size {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100px;
}
/* Editor package table type column */
.data-package-item td.type {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100px;
}
.data-package-item td.public {
width: 60px;
}
/* Editor package table sharing column */
.data-package-item td.sharing {
width: 60px;
}
.data-package-item td input[type='checkbox']{
margin-left: 30%;
height: auto;
}
.data-package-item .sharing .disabled{
opacity: .5;
}
/* Editor package table column 5 */
.data-package-item td:last-of-type {
text-align: right;
padding-right: 10px;
padding-left: 0px;
width: 100px;
}
/* Editor package table buttons */
.data-package-item td button {
text-align: center;
vertical-align: middle;
}
.data-package-item td button .icon{
margin-left: 0px;
}
.data-package-item .icon{
margin-right: 10px;
width: 1.4em;
}
.data-package-item .btn.edit{
width: 85px;
color: #19B36A;
}
.data-package-item .btn-group .btn{
background-color: white;
}
.data-package-item .btn.warning {
background-color: #FFF;
color: #ffbc00;
}
.data-package-item .btn.error,
.data-package-item .status .icon.danger,
.data-package-item .status .icon.error{
color: #FF0000;
}
.data-package-item .dropdown-menu{
border-color: #CCC;
border-width: 1px;
border-style: solid;
margin-top: 6px;
min-width: 100px;
}
.data-package-item .dropdown-menu .muted {
color: #CCC;
}
.data-package-item.error-saving .disable-layer{
width: 100%;
}
.data-package-item .btn-group .dropdown-toggle {
border-bottom-left-radius: 0px;
border-top-left-radius: 0px;
width: 25px;
}
.data-package-item button{
border-color: #CCC;
}
.data-package-item.remove-preview {
opacity: 1;
}
.data-package-item.remove-preview .name,
.data-package-item.remove-preview .status,
.data-package-item.remove-preview .size,
.data-package-item.remove-preview .type,
.data-package-item.remove-preview .type-icon{
opacity: .3;
}
.data-package-item.message-row td{
padding-top: 3%;
}
.data-package-item.message-row:hover td{
background-color: #FFF;
}
.data-package-item.message-row h2{
font-size: 2.1em;
}
.data-package-item.message-row button{
font-size: 1.2em;
margin-top: 10px;
display: block;
}
/* Editor package table status column */
.data-package-item .status{
width: 60px;
}
.data-package-item .progress{
margin: 0px;
}
.data-package-item .progress-striped .bar{
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
-webkit-background-size: 40px 40px;
-moz-background-size: 40px 40px;
-o-background-size: 40px 40px;
background-size: 40px 40px;
}
.data-package-item .status .icon{
display: block;
margin-left: auto;
margin-right: auto;
}
.data-package-item .status{
text-align: center;
}
.status-tooltip div{
white-space: normal;
}
.status-tooltip.error h6{
color: red;
}
.status-tooltip.error div{
color: white;
}
.data-package-item.loading{
opacity: .6;
}
.data-package-item .controls .btn.message{
font-size: 12px;
}
.data-package-item .controls .btn.message .icon{
margin-left: -5px;
margin-right: 5px;
}
border: none;
background-color: inherit;
width: auto;
}
/* Editor package table button dropdown */
.Editor #data-package-table td:last-of-type ul {
border-radius: 4px;
left: 0px;
width: 107px;
min-width: 85px;
}
#data-package-container + .ui-resizable-handle{
border: 1px solid #D5D5D5;
border-right-width: 0px;
border-left-width: 0px;
background-color: #FFF;
height: 10px;
width: 100%;
bottom: 1px;
}
#data-package-container + .ui-resizable-handle .icon{
font-size: 15px;
color: #D5D5D5;
z-index: 91;
margin: -3px auto 0px auto;
display: block;
width: 15px;
}
#data-package-container + .ui-resizable-handle:hover{
cursor:ns-resize;
}
textarea.xlarge{
min-height: 200px;
}
textarea.medium{
min-height: 50px;
}
/* Highlight drop zones with a dashed border */
.droppable {
border: 2px dashed #1F254F;
}
.Editor .disable-layer{
background-color: rgba(255, 255, 255, 0.6);
height: 100%;
width: 100%;
position: absolute;
top: 0px;
z-index: 2;
}
.Editor .dropdown-menu li a i {
vertical-align: middle;
}
#editor-body .alert {
position: relative;
}
.Editor #Content > .alert-container .alert{
position: fixed;
left: 0px;
min-width: 100%;
z-index: 14;
margin-left: 0px;
top: 0px;
max-width: 100%;
}
.Editor #Content > .alert-container .alert.non-fixed{
position: relative;
min-width: auto;
z-index: 0;
}
.Editor #Content > .alert-container .alert{
padding: 20px;
font-weight: bold;
box-sizing: border-box;
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
z-index: 999;
}
.Editor #Content > .alert-container .alert .container {
width: auto;
max-width: 940px;
text-align: center;
};
.Editor input,
.Editor select{
/*padding: .5em 1em;*/
height: 2.4em;
box-sizing: border-box;
font-size: 1em;
}
.Editor > #Navbar .navbar .navbar-inner .nav .input form input[type="text"]{
display: inline-block;
position: relative;
width: 75px;
height: 30px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 7px;
border-radius: 4px 0 0 4px;
font-size: 14px;
}
.Editor textarea{
padding: .5em 1em;
box-sizing: border-box;
font-size: 1em;
border-radius: 3px;
width: 100%;
}
.Editor .checkbox{
clear: both;
margin: 1em auto;
}
.Editor .checkbox input{
padding: 0px;
height: auto;
}
.checkbox .disabled,
.checkbox .disabled + .text{
opacity: .5;
}
.Editor input.error,
.Editor select.error,
.Editor textarea.error{
border: 1px solid red;
}
.Editor .input-logo{
height: 28px;
width: 28px;
margin-right: 5px;
vertical-align: top;
}
.Editor .input-logo + input{
width: calc(100% - 42px);
}
.Editor .required-icon{
color: red;
}
.Editor .required-icon:after{
content: "*";
}
.metadata-container *{
box-sizing: border-box;
}
.metadata-container h2{
margin-bottom: 30px;
}
.metadata-container h5 > .subtle{
margin-left: 20px;
font-weight: normal;
}
.metadata-container .section h2 + .subtle {
margin-top: -25px;
}
.metadata-container .section h4 + .subtle {
margin-top: -10px;
}
.metadata-container .section {
width: 100%;
clear: both;
}
.metadata-container .section > .row-striped:last-child {
margin-bottom: 0px;
}
.metadata-container .section .header{
font-weight: bold;
border-bottom: 1px solid #DDD;
padding-left: 10px;
background-color: #EEE;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
padding-top: 10px;
}
.metadata-container .section .header h5{
min-height: 1em;
}
.Editor .header-dropdown{
font-size: 1.3em;
width: 100%;
height: 2.4em;
}
.metdata-container .checkbox{
clear: both;
}
/* ---- Attributes ----*/
.eml-attribute {
padding-bottom: 20px;
padding-top: 20px;
}
.eml-attribute.error{
color: inherit;
}
.eml-attribute.error .accordion-heading{
background-color: rgba(255, 0, 0, 0.11);
}
.eml-attribute.error .accordion-heading a{
color: #960303;
font-weight: bold;
}
.eml-attribute .indent{
margin-left: 20px;
}
.enumerated-domain .table input {
margin-bottom: 0px;
}
.attribute-menu.side-nav-items{
overflow-y: overlay;
transform: translate3d(0,0,0);
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
overflow-y: auto;
position: fixed;
height: 400px;
background-color: #EEE;
border-right: 1px solid #DDD;
}
.attribute-list{
width: calc(100% - 170px - 60px);
float: right;
padding: 0px 20px;
overflow: scroll;
}
.attribute-menu-container .fill-button-container {
background-color: #EEE;
border-right: 1px solid #DDD;
width: 100%;
}
.attribute-menu-container .fill-button-container button {
width: calc(100% - 10px);
margin: 5px;
}
.eml-attribute .title{
margin-bottom: 20px;
}
.attribute-menu{
width: 170px;
}
.attribute-menu-item{
position: relative;
}
.attribute-menu-item a{
font-size: 1em;
}
.attribute-menu-item a.error{
color: #960303;
}
.attribute-menu-item.active a{
background-color: #1E254F;
color: white;
}
.attribute-menu-item .add{
display: none;
}
.attribute-menu-item .remove{
position: absolute;
top: 0px;
right: 0px;
font-size: 1.3em;
color: red;
display: none;
padding: 13px;
}
.attribute-menu-item:hover .remove{
display: block;
}
.attribute-menu-item.side-nav-item.remove-preview a,
.attribute-menu-item.side-nav-item.remove-preview a:hover{
background-color: #f7f7f7;
color: red;
}
.attribute-menu-item.side-nav-item.remove-preview .remove:hover{
background-color: rgba(247, 247, 247, .5);
}
.attribute-menu-item.new:hover .remove{
display: none;
}
.attributes .attribute-menu-container{
width: 170px;
}
.eml-attribute .non-numeric-domain.error{
color: inherit;
border-color: red;
}
.eml-attribute .category-container.error{
color: inherit;
border: 1px solid red;
padding: 10px;
width: 100%;
box-sizing: border-box;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
}
.code-row.new .remove{
display: none;
}
.code-row .remove{
width: 20px;
float: right;
margin-left: 10px;
line-height: 2.2em;
}
.code-row .definition{
width: calc(100% - 30px);
}
/* ---- Overview ---- */
.metadata-container .section.overview > div{
margin-bottom: 20px;
}
#data-sensitivity-container input:checked ~ .notification.hidden{
display: block;
}
/* ---- Funding ---- */
.metadata-container .funding-container{
padding-left: 0px;
}
.Editor input.funding{
padding-left: 35px;
}
.metadata-container .funding-row{
position: relative;
}
.Editor .funding-row .ui-autocomplete{
position: absolute !important;
font-size: 1.2em;
}
.Editor .funding-container .ui-autocomplete .ui-menu-item {
font-size: .7em;
}
.Editor .funding-container .ui-helper-hidden-accessible{
display: none;
}
.metadata-container .funding-container .autocomplete-container{
position: relative;
}
.Editor .funding-container .icon-spinner{
top: 5px;
left: 45px;
position: absolute;
font-size: 1.5em;
display: none;
}
.metadata-container #funding-visible{
padding-left: 30px;
}
/* ---- People / Parties ---- */
.Editor .eml-party{
position: relative;
}
.controls-well > .party{
margin-bottom: 30px;
border-bottom: 1px solid #DDD;
}
.row-striped > .eml-party {
padding-top: 10px;
}
.eml-party .notification{
height: 40px;
}
.metadata-container .section.people h4 {
margin-top: 2em;
margin-bottom: 1em;
}
.Editor .eml-party .phone{
font-size: .8em;
padding: 5px;
height: 3em;
}
.subtle-btn-group button,
.subtle-btn-group button:hover {
border-width: 0px;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
background-color: transparent;
}
.subtle-btn-group .icon-ellipsis-vertical {
font-size: 1.2em;
}
.subtle-btn-group .dropdown-toggle:hover,
.subtle-btn-group .dropdown-toggle:focus {
background-color: #DDD;
border-width: 0px;
}
.eml-party .party-menu {
position: absolute;
top: 5px;
right: 10px;
}
.eml-party.new .party-menu{
display: none;
}
.eml-party .party-menu .dropdown-menu {
margin-left: -142px;
width: 160px;
background-color: #FFF;
border: 1px solid #CCC;
box-shadow: 8px 6px 24px -1px #ccc;
-moz-box-shadow: 8px 6px 24px -1px #ccc;
-webkit-box-shadow: 8px 6px 24px -1px #ccc;
}
.eml-party .party-menu .dropdown-menu li {
border-bottom: 1px solid #ccc;
}
.eml-party .party-menu .dropdown-menu li:hover{
background-color: rgba(255, 255, 255, 0.57);
}
.eml-party .party-menu .dropdown-menu>li>a:hover {
color: white;
}
.eml-party .party-menu .remove,
.eml-party .party-menu .remove:hover,
.eml-party .party-menu .remove a,
.eml-party .party-menu .remove a:hover {
font-size: inherit;
position: relative;
margin: 0px;
color: red;
max-width: 100%;
}
/* ---- Keywords ---- */
.metadata-container .keywords .span2{
margin-left: 0px;
width: 16.893617%;
}
.metadata-container .keyword-row{
padding-top: 10px;
}
/* ---- Usage ---- */
.metadata-container .usage input{
float: left;
}
.metadata-container .usage{
max-width: 500px;
}
.metadata-container .usage .text{
min-width: 225px;
}
/* ---- Basic text ---- */
.metadata-container .section .text-container {
padding-left: 0px;
}
/* ---- Taxon Coverage ---- */
.root-taxonomic-classification-container .notification{
padding-left: 68px;
position: absolute;
margin-top: -31px;
}
.root-taxonomic-classification-container{
margin-top: 20px;
position: relative;
}
.row-striped,
.root-taxonomic-classification-container h6{
border-top: none;
border-left: none;
border-right: none;
}
.root-taxonomic-classification-container:first-child,
.taxonomic-coverage > .notification + .row-striped:nth-child(2){
margin-top: 0px;
}
.root-taxonomic-classification{
margin-bottom: 0px;
position: relative;
}
.root-taxonomic-classification th > .subtle {
font-weight: normal;
margin-bottom: 0px;
}
.taxon-rank-value{
width: calc(100% - 50px);
}
/* ---- Methods ---- */
.metadata-container .sampling{
margin-top: 20px;
}
/* ---- Remove icons in the Editor ---- */
.metadata-container .remove{
color: #cecece;
}
.metadata-container .remove{
position: absolute;
margin-left: 20px;
max-width: 1em;
font-size: 1.7em;
margin-top: .2em;
}
.Editor .remove:hover{
cursor: pointer;
color: #FF0000;
}
.Editor .dropdown-menu .remove:hover{
background-image: none;
background-color: transparent;
}
.taxonomic-coverage-row .remove{
position: relative;
line-height: 2.2em;
font-size: 1.1em;
float: right;
margin-right: 14px;
}
.taxonomic-coverage-row.new .remove,
.eml-geocoverage.new .remove{
visibility: hidden;
}
.root-taxonomic-classification-container > .remove{
right: 20px;
color: white;
z-index: 1;
}
.root-taxonomic-classification > .remove {
top: 10px;
right: 18px;
color: #999999;
}
.remove-preview,
.locations-table .eml-geocoverage.remove-preview{
opacity: .3;
}
.method-step.new + .remove{
display: none;
}
/* The width of each input element next to the remove button */
.metadata-container .basic-text-row input,
.metadata-container .keyword-row,
.metadata-container .funding-row,
.metadata-container .party-details,
.metadata-container .method-step{
width: calc(100% - 20px - 1em);
min-height: 30px;
}
.taxa input,
.pubDate input,
.party-details input{
min-height: 30px;
}
/** Locations section **/
.locations .coord{
width: 5em;
padding: 5px;
font-size: .9em;
min-height: 30px;
}
.locations-table{
border: 1px solid #DDD;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
}
.locations-table .header{
font-weight: bold;
border-bottom: 1px solid #DDD;
padding-bottom: 10px;
padding-left: 10px;
background-color: #EEE;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.locations-table .header .subtle{
font-size: .9em;
font-weight: normal;
}
.locations-table .header h5{
margin-bottom: 0px;
}
.locations-table .eml-geocoverage{
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
.locations-table .eml-geocoverage:nth-child(odd) {
background-color: #EEE;
}
.metadata-container .locations .remove {
position: relative;
margin-left: 0px;
margin-top: 50%;
display: block;
}
.locations-table .notification{
min-height: 1em;
font-size: .9em;
}
.locations-table textarea.error{
border-color: red;
}
.eml-geocoverage.error,
.locations-table .eml-geocoverage.error:nth-child(odd) {
background-color: rgba(251, 188, 188, 0.35);
}
/** Entity section **/
.eml-entity.modal{
height: 80%;
width: 80%;
left: 40%;
max-width: 1000px;
min-width: 300px;
transform: translate3d(0,0,0);
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
}
.eml-entity .modal-body{
max-height: calc(100% - 110px);
height: calc(100% - 110px);
padding: 0px;
overflow-y: hidden;
}
.eml-entity .entity-container > .nav-tabs{
position: fixed;
width: 100%;
background-color: white;
min-height: 30px;
margin-bottom: 0px;
}
.eml-entity .entity-container > .nav-tabs li {
width: 50%;
}
.eml-entity .entity-container > .nav-tabs li.active{
border-top: 0px;
}
.eml-entity .entity-container > .nav-tabs li a{
border-radius: 0px;
border-top: 0px;
text-align: center;
}
.eml-entity > .entity-container > .tab-content{
width: 100%;
box-sizing: border-box;
margin-top: 40px;
}
.eml-entity .overview-container{
padding: 20px;
margin-top: 0px;
width: calc(100% - 40px);
}
.eml-entity .preview-container{
box-sizing: border-box;
float: left;
}
.eml-entity .preview-container .thumbnail{
width: 100%;
box-sizing: border-box;
}
.eml-entity .preview-container + .description{
float: right;
width: 100%;
}
.preview-container .thumbnail-square{
height: 250px;
width: 250px;
overflow: hidden;
}
.preview-container .description textarea{
min-height: 175px;
}
.eml-attribute input {
height: auto;
}
.eml-measurement-scale .options{
box-sizing: border-box;
padding-top: 10px;
margin-top: 20px;
}
.eml-measurement-scale .hidden{
display: none;
}
.eml-measurement-scale .full-width{
width: 100%;
}
/*******************************************
Pager View
******************************************/
.pager .pager-link{
border: 1px solid #CCC;
padding: 5px;
}
.pager-link.unactive {
color: #999;
cursor: default;
}
.pager .current-page.pager-link{
background-color: #ECF1F5;
}
.pager .pager-link.first{
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pager .pager-link.last{
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.list-group-item.pager{
margin-top: 0px;
}
/*******************************************
D3 old style charts
*******************************************/
.line-chart-label.text {
color: white;
stroke: white;
fill: white;
}
/*******************************************
Documentation and Help Pages
******************************************/
.documentation h5{
display: inline;
}
.documentation h4{
margin-top: 20px;
}
.documentation > section{
margin-bottom: 30px;
}
.code_example {
display: block;
white-space: pre;
margin-top: 10px;
margin-bottom: 10px;
width: auto;
padding: 5px 20px;
border: 0px;
color: #1192DD;
}
code{
color: #1192DD;
}
.example{
margin-top: 20px;
margin-bottom: 20px;
}
table.api{
font-size: 1.1em;
}
table.api th {
background-color: #90B5CE;
color: white;
font-weight: normal;
font-size: 1.1em;
}
table.api th, table.api td {
padding: 10px;
}
table.api tr:nth-child(odd) {
background-color: #E7EAEA;
}
table.api tr td:nth-child(even) {
background-color: rgba(192, 218, 218, 0.2);
}
.example h3{
font-weight: lighter;
}
#slaask-input{
height: 100px;
word-break: break-word;
}
.slaask-widget-container{
}
/*******************************************
CSS library fixes
******************************************/
/* overflow-y:scroll fix for webkit browsers */
.pre-scrollable, /*Bootstrap */
.fancybox-lock .fancybox-overlay,
.modal-body{ /* Fancybox */
transform: translate3d(0,0,0);
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
}
/* make the modal appear a little faster */
.modal.fade {
--speed: 0.13s;
top: -8%;
-webkit-transition: opacity var(--speed) linear, top var(--speed) ease-out;
-moz-transition: opacity var(--speed) linear, top var(--speed) ease-out;
-o-transition: opacity var(--speed) linear, top var(--speed) ease-out;
transition: opacity var(--speed) linear, top var(--speed) ease-out;
}
/** Progress Bars from Bootstrap 3.3.6 **/
@-webkit-keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
@-o-keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
@keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
.progress {
height: 20px;
margin-bottom: 20px;
overflow: hidden;
background-color: #f5f5f5;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}
.progress-bar {
float: left;
width: 0;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background-color: #337ab7;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
}
.progress-striped .progress-bar,
.progress-bar-striped {
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
-webkit-background-size: 40px 40px;
background-size: 40px 40px;
}
.progress.active .progress-bar,
.progress-bar.active {
-webkit-animation: progress-bar-stripes 2s linear infinite;
-o-animation: progress-bar-stripes 2s linear infinite;
animation: progress-bar-stripes 2s linear infinite;
}
.progress-bar.progress-bar-success {
background-color: #5cb85c;
}
.progress-striped .progress-bar-success {
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.progress-bar-info {
background-color: #5bc0de;
}
.progress-striped .progress-bar-info {
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.progress-bar.progress-bar-warning {
background-color: #f0ad4e;
}
.progress-striped .progress-bar-warning {
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.progress-bar.progress-bar-danger {
background-color: #d9534f;
}
.progress-striped .progress-bar-danger {
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
/* Portal Citations Metric Chart */
#user-citations > .citations-metrics-list > .empty-citation-list {
width: 90%;
height: 5%;
top: unset;
left: 5%;
margin: 0 auto;
}
#user-citations > .citations-metrics-list > .alert-container {
width: 90%;
left: 5%;
margin: 0 auto;
}
/* Center Justify Metadata Assessment charts */
#metadata-assessment-graphic {
display: flex;
justify-content: center;
}
/* New Summary of Holdings design */
.summary-container {
flex: 1;
margin-right: 10px;
margin-left: 10px;
display: grid;
}
.summary-count-container {
width: 100%;
display: grid;
align-self: center;
ttext-ALIGN: center;
justify-self: center;
}
.summary-container.span3 > div {
margin-left: 17.02127659574468%;
}
.quick-stats-count{
color: #2c6f90; /* Back-up color for IE */
fill: #2c6f90; /* Back-up color for IE */
font-size: xx-large;
}
.portal-view .quick-stats-count{
color: #2c6f90; /* Back-up color for IE */
fill: #2c6f90; /* Back-up color for IE */
color: var(--portal-primary-color);
fill: var(--portal-primary-color);
font-size: xx-large;
}
/******* Loading styles *******/
.circle-loading{
border-radius: 50%;
background-color: var(--loading-background-color);
}
/** Browser extension element fixes **/
body > #extension-is-installed{
display: none;
}
/* TODO: Move citation CSS into its own file */
.citation.copiable {
font-size: 12px;
background-color: #fbfbfb;
border: 1px solid #e3e3e3;
padding: 4px 15px;
font-weight: 100;
border-radius: 8px;
/* Make it a 2x2 grid */
display: grid;
grid-template-columns: 1fr 84px;
grid-template-rows: auto 1fr;
grid-gap: 0px;
/* vertically center everything*/
align-items: center;
}
.cite-text {
font-size: 12px;
font-weight: 900;
letter-spacing: 0.01em;
margin-bottom: 3px;
}
.citation.header .top-info {
text-transform: uppercase;
font-size: 13px;
letter-spacing: 0.02em;
line-height: 1;
margin-top: 20px;
}
.citation.header .type {
color: #146660;
font-weight: 700;
letter-spacing: 0.035em;
}
.citation.header .title {
margin-top: 20px;
font-size: 29px;
color: #333333;
line-height: 1.26;
}
.citation.header .separator {
color: #e3e3e3;
padding: 0 5px;
}
.citation.header .authors {
color: #202424;
font-weight: 100;
font-size: 15px;
}
.citation.header .show-authors{
background: none;
border: 0;
border-radius: 15px;
color: #313d90;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
line-height: 15px;
font-size: 13px;
/* vertical-align: text-bottom; */
cursor: pointer;
padding: 0 5px;
letter-spacing: 0.02em;
}
.citation.header .show-authors:hover{
color: #166760;
background-color: #e4faf8;
}
.citation.header button.show-authors{
margin-left: 5px;
}