Commit d27afe87 authored by Maxime Chaillet's avatar Maxime Chaillet

Merge branch 'issue31' into 'master'

Issue31 - New layout for the doi landing page leaving only authors on the left side

See merge request !26
parents b3f5df10 3cda16ba
......@@ -65,14 +65,40 @@ body {
padding-bottom:15px;
}
.padding-left-15{
padding-left:15px;
}
/* ######################## For doi landing page ######### */
.myBorder-left{
border-left-color: #132577;
border-left-width: 8px;
border-left-style: solid;
padding-left:10px;
}
.card-footer{
background-color: #FFFFFF;
border: 0;
}
hr{
margin-top: 30px;
margin-bottom: 30px;
}
label{
margin-bottom: 0px;
}
/* ######################## For welcome page ############# */
.padding10{
padding:10px;
}
.padding-0{
padding-right:0;
padding-left:0;
padding-right:0;
padding-left:0;
}
.whiteBackground{
......@@ -120,6 +146,7 @@ body {
.btn-primary.disabled{
background-color: #132577;
border-color: #132577;
cursor: not-allowed;
}
.btn.disabled{
......
......@@ -3,7 +3,10 @@
<head>
<meta charset="UTF-8">
<title>ESRF</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"> -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" href="/min/output.min.css" >
</head>
......
html{position:relative;min-height:100%}body{margin-bottom:60px}.footer{position:absolute;bottom:0;width:100%;height:60px;line-height:60px;background-color:#f4f4f4}.container{width:auto;max-width:680px;padding:0 15px}.flex{display:flex}.doiTitle{font-size:30px}.blueBackground{background-color:#132577!important}.lightRedBackground{background-color:#ffcaca!important}.grayBackground{background-color:#dcdee2}.whiteVCenteredFont{color:#fff;margin-top:auto;margin-bottom:auto}.padding-top-15{padding-top:15px}.padding-bottom-15{padding-bottom:15px}.padding10{padding:10px}.padding-0{padding-right:0;padding-left:0}.whiteBackground{background-color:#fff}.welcomeBanner{heigth:100px}.whiteFont{color:#fff}.flexCentered{display:flex;justify-content:center;align-items:center}.height100p{height:100%}.btn{white-space:normal}.btn-primary:hover{}.btn-primary{border-color:#132577;background-color:#132577}.btn-primary.disabled{background-color:#132577;border-color:#132577}.btn.disabled{opacity :.50}label{font-weight:700}#logo{height:50px}.card-header{background-color:#CFD1D2}.modal{display:none;position:absolute;z-index:1000;top:82px;bottom:60px;background:rgba(0,0,0,.05) url(../src/images/ajax-loader.gif) 50% 50% no-repeat}body.loading{overflow:hidden}body.loading .modal{display:block}
\ No newline at end of file
html{position:relative;min-height:100%}body{margin-bottom:60px}.footer{position:absolute;bottom:0;width:100%;height:60px;line-height:60px;background-color:#f4f4f4}.container{width:auto;max-width:680px;padding:0 15px}.flex{display:flex}.doiTitle{font-size:30px}.blueBackground{background-color:#132577!important}.lightRedBackground{background-color:#ffcaca!important}.grayBackground{background-color:#dcdee2}.whiteVCenteredFont{color:#fff;margin-top:auto;margin-bottom:auto}.padding-top-15{padding-top:15px}.padding-bottom-15{padding-bottom:15px}.padding-left-15{padding-left:15px}.myBorder-left{border-left-color:#132577;border-left-width:8px;border-left-style:solid;padding-left:10px}.card-footer{background-color:#FFF;border:0}hr{margin-top:30px;margin-bottom:30px}label{margin-bottom:0}.padding10{padding:10px}.padding-0{padding-right:0;padding-left:0}.whiteBackground{background-color:#fff}.welcomeBanner{heigth:100px}.whiteFont{color:#fff}.flexCentered{display:flex;justify-content:center;align-items:center}.height100p{height:100%}.btn{white-space:normal}.btn-primary:hover{}.btn-primary{border-color:#132577;background-color:#132577}.btn-primary.disabled{background-color:#132577;border-color:#132577;cursor:not-allowed}.btn.disabled{opacity :.50}label{font-weight:700}#logo{height:50px}.card-header{background-color:#CFD1D2}.modal{display:none;position:absolute;z-index:1000;top:82px;bottom:60px;background:rgba(0,0,0,.05) url(../src/images/ajax-loader.gif) 50% 50% no-repeat}body.loading{overflow:hidden}body.loading .modal{display:block}
\ No newline at end of file
This diff is collapsed.
<div class="container-fluid">
<br />
<div class="row">
<br />
<div class="row padding-top-15">
<div class="col-8">
<label>Title</label>
<div class="alert alert-dark" role="alert">
{data.title}
</div>
<label> Abstract </label>
<div class="alert alert-warning alert-dismissible fade show text-center align-middle" role="alert">
There is no abstract for this DOI
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<div class="row">
<div class="col-12 h2 text-center text-uppercase font-weight-bold">{data.title}</div>
</div>
<label> Experimental report </label>
<div class="row padding10">
<div class="col-12 alert-warning padding-top-15 padding-bottom-15">
<button type="button" class="btn btn-primary btn-lg btn-block disabled">Download experimental report</button>
</div>
</div>
<hr>
<label> Download data </label>
<div class="row padding10">
<div class="col-12 alert-warning padding-top-15 padding-bottom-15">
<p> The data is currently only available to download if you are a member of the proposal team. </p>
<form action="https://icat.esrf.fr/#/browse/facility/ESRF/proposal/{data.proposalNumber}/investigation/{data.investigationId}/dataset">
<button type="submit" class="btn btn-primary btn-lg btn-block">Download data</button>
</form>
</div>
</div>
</div>
<div class="col-4">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header text-center">
<label>Authors </label>
</div>
<div class="card-body text-center">
{#data.author} {?.given} {.given} {.family} </br> {:else} {.literal} </br> {/.given} {/data.author}
</div>
<div class="col-3">
<div class="myBorder-left">
<label> Proposal </label>
<div class="padding-left-15">{data.proposalNumber}</div>
</div>
</div>
<div class="col-3">
<div class="myBorder-left">
<label> Release year </label>
<div class="padding-left-15">{data.issued.date-parts}</div>
</div>
</div>
<div class="col-6">
<div class="myBorder-left">
<label> Beamline </label>
{@eq key=data.beamlineUrl value="noLink"}
<div class="padding-left-15">{data.beamline}</div>
{:else}
<div class="padding-left-15">
<a href="{data.beamlineUrl}"> {data.beamline} </a>
</div>
{/eq}
</div>
</div>
</div>
<br/>
<div class="row">
<div class="padding-top-15"></div>
<div class="row">
<div class="col-6">
<div class="myBorder-left">
<label>Category </label>
<div class="padding-left-15">{data.proposalType}</div>
</div>
</div>
<div class="col-6">
<div class="myBorder-left">
<label>Publisher </label>
<div class="padding-left-15"><a href="http://www.esrf.fr"> {data.publisher} </a> </div>
</div>
</div>
</div>
<hr>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header text-center">
<label>Beamline </label>
<div class="myBorder-left">
<label> Abstract </label>
<div class="padding-left-15">
There is no abstract for this DOI
</div>
{@eq key=data.beamlineUrl value="noLink"}
<div class="card-body text-center"> {data.beamline} </div>
{:else}
<div class="card-body text-center"><a href="{data.beamlineUrl}"> {data.beamline} </a> </div>
{/eq}
</div>
</div>
</div>
</div>
<br/>
<hr>
<div class="row">
<div class="col-lg-6">
<div class="card">
<div class="card-header text-center">
<label>Proposal number </label>
<div class="col-12">
<div class="card-deck">
<div class="card">
<div class="card-header text-center">
<label>Experimental report </label>
</div>
<div class="card-body padding10">
</div>
<div class="card-footer">
<button type="button" class="btn btn-primary btn-lg btn-block disabled"> <span class="fa fa-download whiteFont"></span> Download</button>
</div>
</div>
<div class="card-body text-center height100p">{data.proposalNumber}</div>
</div>
</div>
<div class="col-lg-6">
<div class="card">
<div class="card-header text-center">
<label>Proposal type </label>
<div class="card">
<div class="card-header text-center">
<label>Experimental data </label>
</div>
<div class="card-body padding10">
<p class="card-text" >The data is currently only available to download if you are a member of the proposal team.</p>
</div>
<div class="card-footer">
<form action="https://icat.esrf.fr/#/browse/facility/ESRF/proposal/{data.proposalNumber}/investigation/{data.investigationId}/dataset">
<button type="submit" class="btn btn-primary btn-lg btn-block"> <span class="fa fa-download whiteFont"></span> Download </button>
</form>
</div>
</div>
<div class="card-body text-center height100p">{data.proposalType}</div>
</div>
</div>
</div>
<br/>
</div>
<div class="col-4">
<div class="row">
<div class="col-lg-6">
<div class="col-12">
<div class="card">
<div class="card-header text-center">
<label>Release year </label>
<label>Authors </label>
</div>
<div class="card-body text-center" style="height: 100%;">{data.issued.date-parts}</div>
</div>
</div>
<div class="col-lg-6">
<div class="card">
<div class="card-header text-center">
<label>Publisher </label>
<div class="card-body text-center">
{#data.author} {?.given} {.given} {.family} </br> {:else} {.literal} </br> {/.given} {/data.author}
</div>
<div class="card-body text-center">{data.publisher}</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment