Commit 618dff00 authored by Martin Kuban's avatar Martin Kuban Committed by Markus Scheidgen
Browse files

design updates for similarity finder

parent 62fb27c5
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -917,11 +917,13 @@ navTreeWrapper
.similar-materials-panel-unfolded{
text-align: left;
border: 1px solid #DDD;
padding: 10px 12px;
padding: 10px 0px;
border-radius: 4px;
position: absolute; top:0; left:0;
margin-right: -11px;
position: absolute; top:0; right:0;
background-color: white; z-index: 10;
}
.view-reset-tooltip{
position:absolute;
display: none;
......
......@@ -166,7 +166,7 @@ class Overview {
Spin <span style='font-size: 1.1em'>⇩</span>
</td>
<td class = "similarity-data-field">
<div style="float: right; padding: 6px 60px 10px 30px; " class="similarity-finder">
<div style="float: right; padding: 0px 40px 10px 0px; margin-top: 1px;" class="similarity-finder">
</div>
</td>
</tr>
......
......@@ -7,13 +7,13 @@ class SimilarityFinder {
this.element = document.createElement('div');
//this.element.className = className;
this.element.style = "float : right;"
this.element.style = "float : right; border: 2px solid #DDD; padding: 2px 2px 0px 3px;"
this.element.innerHTML+=`
<span style=" vertical-align: 30%;" info-sys-data="similar-materials">Similar materials</span>
<span style=" vertical-align: 30%;" info-sys-data="similar-materials"><b>Similar materials</b></span>
<img style="cursor: pointer" src="${util.IMAGE_DIR}folded.png" />
<div class="vr-download-panel" style="position: relative; display: none">
<div class="vr-download-panel" style="position: relative; display: none;">
</div>
`;
......@@ -65,19 +65,19 @@ class SimilarityFinder {
const container = document.createElement('table')
container.setAttribute('class','similar-materials-panel-unfolded')
container.style='width: 200px;'
container.style='width: 230px; padding-left: 5px;'
this.foldingPanel.appendChild(container)
const sim_table_header = document.createElement('tr')
sim_table_header.style = "padding: 5px; "
sim_table_header.innerHTML = `<th style = "text-align: left;">Formula (Space group)</th><th>:</th><th style = "text-align: left;">Tc</th>`
sim_table_header.innerHTML = `<th style = "text-align: left;">Formula (space group)</th><th>:</th><th style = "text-align: left;">Tc</th>`
container.appendChild(sim_table_header)
slicedData.forEach(function(item) {
const material_id = item.key.split(':')[0]
const element = document.createElement('tr')
element.style = "padding: 5px; "
element.style = "padding: 5px; font-family: 'Arimo', sans-serif; font-size: 10pt; "
const url = `${window.location.toString().replace(/#.*$/, "")}#/material/${material_id}`
element.innerHTML = `<td><a href="${url}" target="_${material_id}">${item.data.formula} (${item.data.space_group_number})</a></td><td>:</td> <td>${item.data.Tc.toPrecision(3)}</td>`
element.innerHTML = `<td><a href="${url}" target="_${material_id}" style="color:#777; font-family: 'Arimo', sans-serif; font-size: 10pt;">${util.getSubscriptedFormula(item.data.formula)} (${item.data.space_group_number})</a></td><td>:</td> <td>${item.data.Tc.toPrecision(3)}</td>`
container.appendChild(element)
})
......
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