org.eclipse.osbp.themes/scss/external/_charts.scss

////
/// @group external/charts
//// 

/// Used for imported javascript dashboard elements.
/// @todo find out where it's used exactly
@mixin os-charts { 
	// cxOrgChartStyles
	.orgchart {
		background: #919293 url(img/sidebar-gradient.png) repeat-y top right;
		border: 1px solid grey;
		color: grey;
		font-weight: bold;
		font-family: Tahoma;
		padding: 10px;
	}
	
	.orgchartNode {
		background: #e1e2e3 url(img/sidebar-gradient.png) repeat-y top right;
		border-radius: 18px;
		border: 4px solid #9edbfb;
		padding: 10px!important;
	}
	
	.orgchartSelectedNode{
		background-color: #9edbfb;
		border: 4px solid #fbe99e;
		border-radius: 18px;
	}
	
	.v-caption-orgchart .v-captiontext {
		font-size: 16px;
		line-height: 1;
		font-weight: normal;
		padding: .5em .5em 1.0em;
		/*padding: .5em 0;*/
		-webkit-font-smoothing: antialiased;
		background: #414243 url(img/sidebar-gradient.png) repeat-y top right;
		overflow: visible;
		position: relative;
		z-index: 2;
		
		white-space: normal;
		color: #fff;
		text-shadow: 0 2px 2px rgba(0,0,0,.5);
		
		display: block !important;
	}
	
	.v-gridlayout-orgchartUser {
		color: grey;
		font-family: Tahoma;
		font-weight: bold;
	//	border-radius: 18px;
	//	border: 4px solid #9edbfb;
		margin: 10px;
		padding: 10px;
	//	margin-left: 30px;
		text-align: center;
	}
	
	.v-horizontallayout-orgchartUser {
		color: grey;
		font-family: Tahoma;
		font-weight: bold;
		border-radius: 18px;
		border: 4px solid #9edbfb;
		margin: 10px;
		padding: 10px;
		text-align: center;
	}
	
	.v-gridlayout-orgchartUser div {
		 margin-left: auto;
		 margin-right: auto;
	}
	
	.v-gridlayout-orgchartUser div > div {
		padding: 3px;
		text-align: center;
	}
	
	.orgchart-multipos {
		color: red;
		font-style: italic;
	}
	
	.orgchart-classic {
		color: red;
		font-style: italic;
	}
	
	.orgchart-modern {
		color: red;
		font-style: italic;
	}
	
	.orgchart-compex {
		color: blue;
		font-style: italic;
	}
	
	//cxd3TreeMapStyles
	.node {
		cursor: pointer;
		border: solid 1px white;
		font: 10px sans-serif;
		line-height: 12px;
		overflow: hidden;
		position: absolute;
		text-indent: 2px;
	}
	
	//cxd3CollapsibleTreeStyles
	.node circle {
		fill: #fff;
		stroke: steelblue;
		stroke-width: 1.5px;
	}
	
	.node text {
		font: 10px sans-serif;
	}
	
	.link {
		fill: none;
		stroke: #ccc;
		stroke-width: 1.5px;
	}
	
	//cxd3Topo
	.subunit-label {
		fill: #777;
		fill-opacity: .5;
		font-size: 20px;
		font-weight: 300;
		text-anchor: middle;
	}
	
	.place,
	.place-label {
		fill: #444;
	}
	
	text.place-label {
		font-size: 10px;
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
		/*pointer-events: none;*/
	}
	
	text.place-label:hover {
		fill: #6699FF;
		font-size: 20px;
	}
	
	
	//cxd3USTopo 
	path.usa {
	  	fill: #60a060;
	  	stroke: #fff;
		stroke-width: .5px;
	}
	
	path.usa:hover {
		fill: #80e080;
	}
	
	
	//cxd3ESTopo 
	path.world {
		stroke: white;
		stroke-width: 0.25px;
		fill: black;
	}
	
	path.world:hover {
		fill: red;
	}
	
	
	//cxd3DETopo
	path.subunit.DEU:hover {
		fill: #80e080;
	}
	
	path.subunit.DEU {
		fill: #60a060;
		stroke: #fff;
		stroke-width: .5px;
	}
	
	path.deu {
		fill: #60a060;
		stroke: #fff;
		stroke-width: .5px;
	}
	
	path.deu:hover {
		fill: #80e080;
	}
	
	
	//cxd3WorldTopo 
	path.world {
		stroke: white;
		stroke-width: 0.25px;
		fill: black;
	}
	
	path.world:hover {
		fill: red;
	}
}