Commit c7ec4677 authored by HERBERT Ryan's avatar HERBERT Ryan Committed by Vidjil Team

css, builder.js shaping up the annotations

Annotations now display two lines by default and do not displace other elements when being expanded
parent 91baf080
......@@ -1621,11 +1621,19 @@ table.log textarea {
overflow-wrap: break-word;
overflow-y: hidden;
max-width: 457px;
min-height: 17px;
height: 17px;
min-height: 32px;
max-height: 32px;
position: fixed;
width: 100%;
background-color: #000000;
-webkit-transition: max-height 0.8s;
-moz-transition: max-height 0.8s;
transition: max-height 0.8s;
z-index: 0;
}
.info_container:hover {
height: auto;
max-height: 400px;
z-index: 1;
}
.patient_info_text {
margin-bottom: 5px;
......@@ -1634,9 +1642,8 @@ textarea#edit_value {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: block;
width: 100%;
min-height: 50px;
min-height: 45px;
}
#top_info {
display: inline-flex;
......@@ -1650,3 +1657,6 @@ textarea#edit_value {
margin-top: 5px;
margin-bottom: 5px;
}
.locus_line {
margin-top: 44px;
}
......@@ -1621,11 +1621,19 @@ table.log textarea {
overflow-wrap: break-word;
overflow-y: hidden;
max-width: 457px;
min-height: 17px;
height: 17px;
min-height: 32px;
max-height: 32px;
position: fixed;
width: 100%;
background-color: #ffffff;
-webkit-transition: max-height 0.8s;
-moz-transition: max-height 0.8s;
transition: max-height 0.8s;
z-index: 0;
}
.info_container:hover {
height: auto;
max-height: 400px;
z-index: 1;
}
.patient_info_text {
margin-bottom: 5px;
......@@ -1634,9 +1642,8 @@ textarea#edit_value {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: block;
width: 100%;
min-height: 50px;
min-height: 45px;
}
#top_info {
display: inline-flex;
......@@ -1650,3 +1657,6 @@ textarea#edit_value {
margin-top: 5px;
margin-bottom: 5px;
}
.locus_line {
margin-top: 44px;
}
......@@ -2,6 +2,8 @@
/* base Vidjil style */
/* @default, @background, @highlight, @select, @secondary and @border have to be defined */
@infoContainerHeight : 32px;
@locusSpacingMargin : 12px;
/* default tag color */
@tagColor0 : #DC322F;
......@@ -1842,12 +1844,20 @@ flex-grow : 1;
overflow-wrap: break-word;
overflow-y: hidden;
max-width: 457px;
min-height: 17px;
height: 17px;
min-height: @infoContainerHeight;
max-height: @infoContainerHeight;
position: fixed;
width: 100%;
background-color: @background;
-webkit-transition: max-height 0.8s;
-moz-transition: max-height 0.8s;
transition: max-height 0.8s;
z-index: 0;
}
.info_container:hover {
height: auto;
max-height: 400px;
z-index: 1;
}
.patient_info_text {
......@@ -1858,9 +1868,9 @@ textarea#edit_value {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display:block;
//display:block;
width: 100%;
min-height: 50px;
min-height: 45px;
}
#top_info {
......@@ -1877,3 +1887,7 @@ textarea#edit_value {
margin-top: 5px;
margin-bottom: 5px;
}
.locus_line {
margin-top: @infoContainerHeight + @locusSpacingMargin;
}
......@@ -643,7 +643,7 @@ Builder.prototype = {
build_multi_system: function () {
var div = document.createElement('div');
div.className = "info_line";
div.className = "info_line locus_line";
var span1 = document.createElement('span');
span1.appendChild(document.createTextNode("locus"));
......
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