Skip to content

GitLab

vidjil
vidjil
Commit da97d2b9 authored by Mathieu Giraud's avatar Mathieu Giraud
Browse files
Options

merge -- Feature c/multiple scatterplots 

Great feature by @heto. When there is only one sample, shows two grids.
See merge request !87.
Closes #2244 and #2493.
parents e819af10 0a3b5a8c
Hide whitespace changes
Inline Side-by-side
Showing with 414 additions and 200 deletions
browser/css/dark.css
View file @ da97d2b9
......@@ -401,7 +401,6 @@ line {
overflow-x: hidden;
height: calc(100% - 30px);
/*100% - list_menu height */
padding: 2px;
}
#list_data {
......@@ -644,7 +643,6 @@ line {
font-size: 70%;
letter-spacing: .428em;
/* (1-.7) / .7 */
left: .214em;
}
.highlight {
......@@ -791,7 +789,7 @@ span .substitution {
transition-delay: 0s, 0s;
}
#add_clone_menu > #addclone_input.error {
border: 1px solid #8b0000;
border: 1px solid darkred;
}
.buttonSelector {
background: #000000;
......@@ -1063,25 +1061,18 @@ span.logo {
background: #3d24b6;
background: -moz-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #3d24b6), color-stop(10%, #2448b5), color-stop(20%, #2487b8), color-stop(30%, #24b7ab), color-stop(40%, #24b86e), color-stop(50%, #24b730), color-stop(60%, #55b824), color-stop(70%, #92b724), color-stop(80%, #b89f24), color-stop(90%, #b25f23), color-stop(100%, #b82424));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* IE10+ */
background: linear-gradient(to right, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* W3C */
filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d24b6', endColorstr='#b82424',GradientType=1 )";
/* IE6-9 */
width: 180px;
height: 8px;
margin-top: 4px;
......@@ -1185,20 +1176,40 @@ span.warningReads {
position: relative;
top: 0px;
left: 0px;
}
.visu2_menu_anchor {
position: absolute;
bottom: 6px;
right: 0px;
}
.sp_menu_anchor,
.visu2_menu_anchor {
width: 0px;
height: 0px;
}
.sp_menu {
min-width: 22px;
min-height: 18px;
border-bottom: solid;
border-right: solid;
}
.visu2_menu {
border-top: solid;
border-left: solid;
text-align: right;
position: absolute;
bottom: 0px;
right: 0px;
}
.sp_menu,
.visu2_menu {
min-width: 22px;
min-height: 18px;
border-color: #333333;
background: #000000;
display: inline-block;
padding: 2px;
}
.sp_menu_content {
.sp_menu_content,
.visu2_menu_content {
padding: 0px;
width: 0px;
height: 0px;
......@@ -1213,6 +1224,16 @@ span.warningReads {
padding: 8px 0px 0px 0px;
width: 180px;
height: 130px;
}
.visu2_menu:hover .visu2_menu_content,
.visu2_menu_content:focus {
width: 100px;
height: 45px;
}
.sp_menu:hover .sp_menu_content,
.visu2_menu:hover .visu2_menu_content,
.sp_menu_content:focus,
.visu2_menu_content:focus {
font-size: 100%;
opacity: 1;
}
......@@ -1270,6 +1291,7 @@ span.warningReads {
color: #fdf6e3;
}
#visu-separator {
position: relative;
height: 6px;
cursor: move;
cursor: -webkit-grab;
......@@ -1573,18 +1595,18 @@ span.warningReads {
.flash_1,
.log_1 {
font-weight: bold;
background-color: #dff0d8;
background-color: #DFF0D8;
}
.flash_2,
.log_2 {
font-weight: bold;
background-color: #f2deae;
background-color: #F2DEAE;
}
.flash_3,
.log_3 {
font-weight: bold;
border-color: darkred;
background-color: #f2dede;
background-color: #F2DEDE;
}
select > option:hover {
background-color: #333333;
......@@ -1685,7 +1707,7 @@ table.log textarea {
flex-grow: 1;
}
.tagColor0 {
background: #dc322f;
background: #DC322F;
}
.tagColor1 {
background: #cb4b16;
......@@ -1722,15 +1744,15 @@ table.log textarea {
text-align: center;
}
.urgent_message {
border: 2px solid #8b0000;
border: 2px solid darkred;
margin: 3px;
font-weight: bold;
background-color: #f2dede;
background-color: #F2DEDE;
}
.info_message {
border: 1px solid #333333;
margin: 4px;
background-color: #dff0d8;
background-color: #DFF0D8;
}
.notification {
padding: 3px;
......
browser/css/light.css
View file @ da97d2b9
......@@ -401,7 +401,6 @@ line {
overflow-x: hidden;
height: calc(100% - 30px);
/*100% - list_menu height */
padding: 2px;
}
#list_data {
......@@ -644,7 +643,6 @@ line {
font-size: 70%;
letter-spacing: .428em;
/* (1-.7) / .7 */
left: .214em;
}
.highlight {
......@@ -791,7 +789,7 @@ span .substitution {
transition-delay: 0s, 0s;
}
#add_clone_menu > #addclone_input.error {
border: 1px solid #8b0000;
border: 1px solid darkred;
}
.buttonSelector {
background: #ffffff;
......@@ -1063,25 +1061,18 @@ span.logo {
background: #3d24b6;
background: -moz-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #3d24b6), color-stop(10%, #2448b5), color-stop(20%, #2487b8), color-stop(30%, #24b7ab), color-stop(40%, #24b86e), color-stop(50%, #24b730), color-stop(60%, #55b824), color-stop(70%, #92b724), color-stop(80%, #b89f24), color-stop(90%, #b25f23), color-stop(100%, #b82424));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(left, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* IE10+ */
background: linear-gradient(to right, #3d24b6 0%, #2448b5 10%, #2487b8 20%, #24b7ab 30%, #24b86e 40%, #24b730 50%, #55b824 60%, #92b724 70%, #b89f24 80%, #b25f23 90%, #b82424 100%);
/* W3C */
filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d24b6', endColorstr='#b82424',GradientType=1 )";
/* IE6-9 */
width: 180px;
height: 8px;
margin-top: 4px;
......@@ -1185,20 +1176,40 @@ span.warningReads {
position: relative;
top: 0px;
left: 0px;
}
.visu2_menu_anchor {
position: absolute;
bottom: 6px;
right: 0px;
}
.sp_menu_anchor,
.visu2_menu_anchor {
width: 0px;
height: 0px;
}
.sp_menu {
min-width: 22px;
min-height: 18px;
border-bottom: solid;
border-right: solid;
}
.visu2_menu {
border-top: solid;
border-left: solid;
text-align: right;
position: absolute;
bottom: 0px;
right: 0px;
}
.sp_menu,
.visu2_menu {
min-width: 22px;
min-height: 18px;
border-color: #cccccc;
background: #ffffff;
display: inline-block;
padding: 2px;
}
.sp_menu_content {
.sp_menu_content,
.visu2_menu_content {
padding: 0px;
width: 0px;
height: 0px;
......@@ -1213,6 +1224,16 @@ span.warningReads {
padding: 8px 0px 0px 0px;
width: 180px;
height: 130px;
}
.visu2_menu:hover .visu2_menu_content,
.visu2_menu_content:focus {
width: 100px;
height: 45px;
}
.sp_menu:hover .sp_menu_content,
.visu2_menu:hover .visu2_menu_content,
.sp_menu_content:focus,
.visu2_menu_content:focus {
font-size: 100%;
opacity: 1;
}
......@@ -1270,6 +1291,7 @@ span.warningReads {
color: #002b36;
}
#visu-separator {
position: relative;
height: 6px;
cursor: move;
cursor: -webkit-grab;
......@@ -1573,18 +1595,18 @@ span.warningReads {
.flash_1,
.log_1 {
font-weight: bold;
background-color: #dff0d8;
background-color: #DFF0D8;
}
.flash_2,
.log_2 {
font-weight: bold;
background-color: #f2deae;
background-color: #F2DEAE;
}
.flash_3,
.log_3 {
font-weight: bold;
border-color: darkred;
background-color: #f2dede;
background-color: #F2DEDE;
}
select > option:hover {
background-color: #cccccc;
......@@ -1685,7 +1707,7 @@ table.log textarea {
flex-grow: 1;
}
.tagColor0 {
background: #dc322f;
background: #DC322F;
}
.tagColor1 {
background: #cb4b16;
......@@ -1722,15 +1744,15 @@ table.log textarea {
text-align: center;
}
.urgent_message {
border: 2px solid #8b0000;
border: 2px solid darkred;
margin: 3px;
font-weight: bold;
background-color: #f2dede;
background-color: #F2DEDE;
}
.info_message {
border: 1px solid #cccccc;
margin: 4px;
background-color: #dff0d8;
background-color: #DFF0D8;
}
.notification {
padding: 3px;
......
browser/css/segmenter_page.css
View file @ da97d2b9
......@@ -789,7 +789,7 @@ span .substitution {
transition-delay: 0s, 0s;
}
#add_clone_menu > #addclone_input.error {
border: 1px solid #8b0000;
border: 1px solid darkred;
}
.buttonSelector {
background: #ffffff;
......@@ -1176,20 +1176,40 @@ span.warningReads {
position: relative;
top: 0px;
left: 0px;
}
.visu2_menu_anchor {
position: absolute;
bottom: 6px;
right: 0px;
}
.sp_menu_anchor,
.visu2_menu_anchor {
width: 0px;
height: 0px;
}
.sp_menu {
min-width: 22px;
min-height: 18px;
border-bottom: solid;
border-right: solid;
}
.visu2_menu {
border-top: solid;
border-left: solid;
text-align: right;
position: absolute;
bottom: 0px;
right: 0px;
}
.sp_menu,
.visu2_menu {
min-width: 22px;
min-height: 18px;
border-color: #cccccc;
background: #ffffff;
display: inline-block;
padding: 2px;
}
.sp_menu_content {
.sp_menu_content,
.visu2_menu_content {
padding: 0px;
width: 0px;
height: 0px;
......@@ -1204,6 +1224,16 @@ span.warningReads {
padding: 8px 0px 0px 0px;
width: 180px;
height: 130px;
}
.visu2_menu:hover .visu2_menu_content,
.visu2_menu_content:focus {
width: 100px;
height: 45px;
}
.sp_menu:hover .sp_menu_content,
.visu2_menu:hover .visu2_menu_content,
.sp_menu_content:focus,
.visu2_menu_content:focus {
font-size: 100%;
opacity: 1;
}
......@@ -1261,6 +1291,7 @@ span.warningReads {
color: #002b36;
}
#visu-separator {
position: relative;
height: 6px;
cursor: move;
cursor: -webkit-grab;
......@@ -1564,18 +1595,18 @@ span.warningReads {
.flash_1,
.log_1 {
font-weight: bold;
background-color: #dff0d8;
background-color: #DFF0D8;
}
.flash_2,
.log_2 {
font-weight: bold;
background-color: #f2deae;
background-color: #F2DEAE;
}
.flash_3,
.log_3 {
font-weight: bold;
border-color: darkred;
background-color: #f2dede;
background-color: #F2DEDE;
}
select > option:hover {
background-color: #cccccc;
......@@ -1676,7 +1707,7 @@ table.log textarea {
flex-grow: 1;
}
.tagColor0 {
background: #dc322f;
background: #DC322F;
}
.tagColor1 {
background: #cb4b16;
......@@ -1713,15 +1744,15 @@ table.log textarea {
text-align: center;
}
.urgent_message {
border: 2px solid #8b0000;
border: 2px solid darkred;
margin: 3px;
font-weight: bold;
background-color: #f2dede;
background-color: #F2DEDE;
}
.info_message {
border: 1px solid #cccccc;
margin: 4px;
background-color: #dff0d8;
background-color: #DFF0D8;
}
.notification {
padding: 3px;
......@@ -1997,6 +2028,13 @@ textarea {
float: right;
padding: 0.4% 1.4%;
}
#copyright {
font-size: 0.7em;
position: absolute;
bottom: 0.4%;
right: 1.2%;
text-align: right;
}
.vidjil_view {
border-radius: 0.1em;
/*border: 1px solid silver;*/
......@@ -2026,12 +2064,3 @@ textarea {
left: 50%;
top: 50%;
}
.big-icon {
font-size: 250%;
}
#btn_exportfasta {
position: absolute;
right: 10px;
}
\ No newline at end of file
browser/css/svg.css
View file @ da97d2b9
......@@ -47,12 +47,12 @@ ul {
height: 100%;
margin: auto;
overflow: hidden;
background: #ffffff;
background: #FFFFFF;
}
#top-container {
height: 32px;
width: 100%;
background: #ffffff;
background: #FFFFFF;
position: fixed;
z-index: 1;
}
......@@ -70,7 +70,7 @@ ul {
position: relative;
right: 200px;
z-index: 10;
background-color: #ffffff;
background-color: #FFFFFF;
}
.upload_field {
width: 100%;
......@@ -95,7 +95,7 @@ ul {
width: -webkit-calc(100% - 12px);
width: calc(100% - 12px);
overflow: hidden;
background: #ffffff;
background: #FFFFFF;
margin: 6px;
}
#right-container {
......@@ -139,7 +139,7 @@ line {
#info {
font-size: 13px;
padding: 3px;
background: #ffffff;
background: #FFFFFF;
display: table-cell;
}
.info_line {
......@@ -168,10 +168,10 @@ line {
}
/*Style polyline / graph*/
.background_graph {
fill: #ffffff;
fill: #FFFFFF;
}
.background_graph2 {
fill: #ffffff;
fill: #FFFFFF;
}
.graph_line {
stroke-width: 2.5px;
......@@ -229,7 +229,7 @@ line {
fill: #777777;
}
#resolution1 {
fill: #ffffff;
fill: #FFFFFF;
opacity: 1;
}
#resolution5 {
......@@ -271,7 +271,7 @@ line {
border-bottom: solid;
border-left: solid;
border-color: #333333;
background: #ffffff;
background: #FFFFFF;
}
.graph_list {
display: none;
......@@ -284,7 +284,7 @@ line {
}
/*style scatterPlot element*/
.background_sp {
fill: #ffffff;
fill: #FFFFFF;
}
.circle {
cursor: pointer;
......@@ -400,7 +400,6 @@ line {
overflow-x: hidden;
height: calc(100% - 30px);
/*100% - list_menu height */
padding: 2px;
}
#list_data {
......@@ -498,7 +497,7 @@ line {
text-align: center;
border: solid;
border-width: 1px;
border-color: #ffffff;
border-color: #FFFFFF;
border-radius: 5px;
margin: 0px 1px;
}
......@@ -643,7 +642,6 @@ line {
font-size: 70%;
letter-spacing: .428em;
/* (1-.7) / .7 */
left: .214em;
}
.highlight {
......@@ -668,7 +666,7 @@ span .substitution {
width: 220px;
border: solid;
display: none;
background: #ffffff;
background: #FFFFFF;
}
.dataMenu {
padding: 5px;
......@@ -678,7 +676,7 @@ span .substitution {
width: 220px;
border: solid;
display: none;
background: #ffffff;
background: #FFFFFF;
}
.tagElem {
margin: 1px;
......@@ -741,7 +739,7 @@ span .substitution {
margin: -2px 0px 0px 5px;
}
.menu-selector {
background: #ffffff;
background: #FFFFFF;
color: #657B83;
height: 18px;
width: 60px;
......@@ -762,7 +760,7 @@ span .substitution {
left: 50%;
font-size: 13px;
padding: 10px;
background: #ffffff;
background: #FFFFFF;
display: none;
}
#add_clone_menu {
......@@ -790,10 +788,10 @@ span .substitution {
transition-delay: 0s, 0s;
}
#add_clone_menu > #addclone_input.error {
border: 1px solid #8b0000;
border: 1px solid darkred;
}
.buttonSelector {
background: #ffffff;
background: #FFFFFF;
cursor: pointer;
font-size: 13px;
margin: 2px;
......@@ -818,7 +816,7 @@ span .substitution {
max-width: 80%;
font-size: 13px;
padding: 10px;
background: #ffffff;
background: #FFFFFF;
display: none;
position: fixed;
left: 50%;
......@@ -853,7 +851,7 @@ a.tag-link {
left: 495px;
font-size: 13px;
padding: 10px;
background: #ffffff;
background: #FFFFFF;
display: none;
max-width: -moz-calc(100% - 535px);
max-width: -webkit-calc(100% - 535px);
......@@ -876,7 +874,7 @@ a.tag-link {
#bot-container,
#segmenter_axis_menu,
.seq-fixed {
background: #ffffff;
background: #FFFFFF;