Skip to content
Snippets Groups Projects
Commit a1ac2bf2 authored by baigner's avatar baigner
Browse files

Fixed some style issues in the vistoms package 

Former-commit-id: cfae84354b882cb4f696729d21e0390c9e214646
parent 7f680776
No related branches found
No related tags found
No related merge requests found
Checking pipeline status
Hide whitespace changes
Inline Side-by-side
kadmos/vistoms/static/lib/style.css
+ 24
− 17
View file @ a1ac2bf2
......@@ -434,24 +434,31 @@ stroke-width: 1.5px;
}
.button {
fill: #555555;
stroke: white;
stroke-width: 1.5;
background-color: #555555;
border-color: #555555;
fill: #555555;
stroke: white;
stroke-width: 1.5;
}
.button:hover{
background-color: #888888;
border-color: #555555;
}
.copyRightText {
font-family: Arial;
font-size: 12pt;
fill: #555555;
font-family: Arial;
font-size: 12pt;
fill: #555555;
}
.newDiv {
.navigationBarDiv {
position:relative;
top: -100px;
left: 220px;
background-color: none;
}
.newDiv a {
.navigationBarDiv a {
text-decoration: none;
color: white;
font-family: Arial;
......@@ -462,7 +469,7 @@ fill: #555555;
padding-left: 6px;
display:inline-block;
}
.newDiv o {
.navigationBarDiv o {
text-decoration: none;
color: white;
font-family: Arial;
......@@ -475,28 +482,28 @@ fill: #555555;
padding-left: 6px;
display:inline-block;
}
.newDiv ul {
.navigationBarDiv ul {
display: inline-block;;
margin: 0;
padding: 0;
background-color: #555555;
}
.newDiv ul li {display: inline-block;}
.newDiv ul li:hover {background: #888;}
.newDiv ul li:hover ul {display: block;}
.newDiv ul li ul {
.navigationBarDiv ul li {display: inline-block;}
.navigationBarDiv ul li:hover {background: #888;}
.navigationBarDiv ul li:hover ul {display: block;}
.navigationBarDiv ul li ul {
position: absolute;
min-width: 200px;
display: none;
}
.newDiv ul li ul li {
.navigationBarDiv ul li ul li {
background: #555;
display: block;
}
.newDiv ul li ul li a {
.navigationBarDiv ul li ul li a {
display:block !important
}
.newDiv ul li ul li:hover {background: #3399FF;}
.navigationBarDiv ul li ul li:hover {background: #3399FF;}
.dataModelDiv {
......
kadmos/vistoms/templates/VISTOMS.html
+ 41
− 13
View file @ a1ac2bf2
......@@ -154,8 +154,8 @@
//First of all, clear everything if it is already there
var visPackDiv = d3.select(".visPackDiv");
if(visPackDiv){visPackDiv.remove()};
var newDiv = d3.select(".newDiv");
if(newDiv){newDiv.remove()};
var navigationBarDiv = d3.select(".navigationBarDiv");
if(navigationBarDiv){navigationBarDiv.remove()};
var imageWidth = 200;
var imageHeight = 150;
......@@ -264,8 +264,16 @@
})
//##########################################################
var ul = d3.select("body").append("div").attr("class","newDiv").append("ul")
var navigationBarDiv = d3.select("body").append("div").attr("class","navigationBarDiv")
var ul = navigationBarDiv.append("ul")
navigationBarDiv.on("mouseover", function()
{
d3.select(this).style("z-index","1300");
})
.on("mouseout", function()
{
d3.select(this).style("z-index","");
})
var addButton_div = d3.select(".addButtonDiv")
if (addButton_div)
addButton_div.remove();
......@@ -348,7 +356,12 @@
function makeViewButtons(data,name, aView)
{
var numberOfGraphs = 0;
var dropdown1 = ul.append("li").on("mouseover", function(){d3.select(this).style("cursor", "default")})
var dropdown1 = ul.append("li")
.on("mouseover", function()
{
d3.select(this).style("cursor", "default")
})
dropdown1.append("a").text(name)
dropdown1.append("img").attr("src",fileReference.AGILE_Icon)
.attr("align","left")
......@@ -18752,7 +18765,7 @@
var saveButton = revertDiv.append("button")
.attr("class","btn btn-primary")
.attr("class","btn btn-primary button")
.attr("data-toggle","tooltip")
.attr("data-placement","top")
.attr("title","Save graph")
......@@ -18861,7 +18874,7 @@
var deleteButton = revertDiv.append("button")
.attr("class","btn btn-danger")
.attr("class","btn btn-danger button")
.attr("data-toggle","tooltip")
.attr("data-placement","top")
.attr("title","Delete graph")
......@@ -18927,7 +18940,7 @@
var backButton = revertDiv.append("button")
.attr("class","btn btn-warning")
.attr("class","btn btn-warning button")
.attr("data-toggle","tooltip")
.attr("data-placement","top")
.attr("title","Revert graph manipulation step")
......@@ -18991,7 +19004,7 @@
})
var fwdButton = revertDiv.append("button")
.attr("class","btn btn-warning")
.attr("class","btn btn-warning button")
.attr("data-toggle","tooltip")
.attr("data-placement","top")
.attr("title","Restore graph manipulation step")
......@@ -22618,9 +22631,11 @@
d.onMouseOver(elm,data,index);
if(d.childrenItems.length>0 )
{
var li = this
d3.select(this).selectAll("ul").remove();
d3.select(this)
.append("ul")
.style("top",String(li.offsetTop-5)+"px")
.selectAll("li")
.data(d.childrenItems)
.enter().append("li")
......@@ -22653,8 +22668,13 @@
.style('left', (d3.event.pageX - 2) + 'px')
.style('top', (d3.event.pageY - 2) + 'px')
.style('display', 'block');
//Prevent the default event, which is the left-click.
//This means, the context-menu will only appear on right mouse clicks
d3.event.preventDefault();
//Place context-menu always on top of everything esle
d3.select(".d3-context-menu").style("z-index",Number.MAX_SAFE_INTEGER);
};
};
......@@ -22898,7 +22918,7 @@
d3.select(".dataModelDiv").moveToBack()
headerDiv.moveToBack()
d3.select(".addButtonDiv").moveToBack()
d3.select(".newDiv").moveToBack()
d3.select(".navigationBarDiv").moveToBack()
d3.select(".visPackDiv").moveToBack()
......@@ -24710,6 +24730,7 @@
.attr("y2", yOffset)
.classed("remMinus",true)
}
//d3-context-menu for right-click-option
d3.contextMenu = function (menu, openCallback) {
 
// create the div element that will hold the context menu
......@@ -24745,9 +24766,11 @@
d.onMouseOver(elm,data,index);
if(d.childrenItems.length>0 )
{
var li = this
d3.select(this).selectAll("ul").remove();
d3.select(this)
.append("ul")
.style("top",String(li.offsetTop-5)+"px")
.selectAll("li")
.data(d.childrenItems)
.enter().append("li")
......@@ -24780,8 +24803,13 @@
.style('left', (d3.event.pageX - 2) + 'px')
.style('top', (d3.event.pageY - 2) + 'px')
.style('display', 'block');
//Prevent the default event, which is the left-click.
//This means, the context-menu will only appear on right mouse clicks
d3.event.preventDefault();
//Place context-menu always on top of everything esle
d3.select(".d3-context-menu").style("z-index",Number.MAX_SAFE_INTEGER);
};
};
 
......@@ -27481,7 +27509,7 @@
d3.select(".dataModelDiv").moveToBack()
headerDiv.moveToBack()
d3.select(".addButtonDiv").moveToBack()
d3.select(".newDiv").moveToBack()
d3.select(".navigationBarDiv").moveToBack()
d3.select(".visPackDiv").moveToBack()
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