changed colors
This commit is contained in:
parent
6d382a6333
commit
13c1c9d049
@ -101,7 +101,6 @@
|
|||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-6">
|
<div class="col-md-6">
|
||||||
<p id="legend_title">Map legend</p>
|
|
||||||
|
|
||||||
<div class="map_legend">
|
<div class="map_legend">
|
||||||
<div id="box1" onclick="popup_bg(120)"></div> <p>Folklore literature</p>
|
<div id="box1" onclick="popup_bg(120)"></div> <p>Folklore literature</p>
|
||||||
|
@ -11,19 +11,30 @@ body {
|
|||||||
overflow: scroll;
|
overflow: scroll;
|
||||||
font-size: .8em;
|
font-size: .8em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.container-fluid {
|
.container-fluid {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg {
|
.bg {
|
||||||
/* background-image: url("/static/images/book.jpeg");*/
|
|
||||||
/* background-image: linear-gradient(#CDCEC9, #9494A0, #652A2E); */
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.bg::before {
|
||||||
|
content: "";
|
||||||
|
background-image: url("/static/images/poster1.png");
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
|
position: absolute;
|
||||||
}*/
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
opacity: 0.2;
|
||||||
|
filter: blur(20px);
|
||||||
|
}
|
||||||
/*Main areas*/
|
/*Main areas*/
|
||||||
.map_area {
|
.map_area {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -31,8 +42,7 @@ body {
|
|||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
margin-left: 20px;
|
margin-left: 20px;
|
||||||
z-index: -1 !important;
|
position: relative;
|
||||||
position: relative;
|
|
||||||
}
|
}
|
||||||
.media_area {
|
.media_area {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
@ -42,7 +52,6 @@ position: relative;
|
|||||||
|
|
||||||
.media_area img {
|
.media_area img {
|
||||||
width: 400px;
|
width: 400px;
|
||||||
/*height: 150px;*/
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -70,7 +79,7 @@ cursor: pointer;
|
|||||||
/* Node styling */
|
/* Node styling */
|
||||||
|
|
||||||
.group2 {
|
.group2 {
|
||||||
fill: #92817a ;
|
fill: #ffbc42;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-family: 'Vesper Libre', serif;
|
font-family: 'Vesper Libre', serif;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
@ -79,14 +88,14 @@ cursor: pointer;
|
|||||||
|
|
||||||
|
|
||||||
.group1 {
|
.group1 {
|
||||||
fill: #bedbbb;
|
fill: #d81159;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-family: 'Vesper Libre', serif;
|
font-family: 'Vesper Libre', serif;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.group4 {
|
.group4 {
|
||||||
fill: #8db956;
|
fill: #73d2de;
|
||||||
font-family: 'Vesper Libre', serif;
|
font-family: 'Vesper Libre', serif;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
z-index: 4;
|
z-index: 4;
|
||||||
@ -94,7 +103,7 @@ z-index: 4;
|
|||||||
}
|
}
|
||||||
|
|
||||||
.group3 {
|
.group3 {
|
||||||
fill: #707070;
|
fill: #218380;
|
||||||
font-family: 'Vesper Libre', serif;
|
font-family: 'Vesper Libre', serif;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
@ -124,7 +133,6 @@ stroke-dasharray:6px;
|
|||||||
margin:auto;
|
margin:auto;
|
||||||
height:500px;
|
height:500px;
|
||||||
width:700px;
|
width:700px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* map legend */
|
/* map legend */
|
||||||
@ -135,8 +143,7 @@ stroke-dasharray:6px;
|
|||||||
margin-left : 10px;
|
margin-left : 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
background-color: #d81159;
|
||||||
background-color: #bedbbb;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#box2 {
|
#box2 {
|
||||||
@ -144,7 +151,7 @@ stroke-dasharray:6px;
|
|||||||
width: 15px;
|
width: 15px;
|
||||||
margin-left : 10px;
|
margin-left : 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
background-color: #92817a;
|
background-color: #ffbc42;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -154,7 +161,7 @@ stroke-dasharray:6px;
|
|||||||
width: 15px;
|
width: 15px;
|
||||||
margin-left : 10px;
|
margin-left : 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
background-color: #707070;
|
background-color: #218380;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -165,7 +172,7 @@ stroke-dasharray:6px;
|
|||||||
margin-left : 10px;
|
margin-left : 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background-color: #8db956;
|
background-color: #73d2de;
|
||||||
}
|
}
|
||||||
|
|
||||||
.map_legend p {
|
.map_legend p {
|
||||||
|
2
wells/static/js/d3_map.js
vendored
2
wells/static/js/d3_map.js
vendored
@ -4,7 +4,7 @@ var width = 700,
|
|||||||
var svg = d3.select(".map_area").append("svg")
|
var svg = d3.select(".map_area").append("svg")
|
||||||
.attr("width", width)
|
.attr("width", width)
|
||||||
.attr("height", height)
|
.attr("height", height)
|
||||||
.attr("viewBox", `${-width/1.3} ${-height/1.6} ${width*2.3} ${height*2.3}`);
|
.attr("viewBox", `${-width/1.7} ${-height/1.6} ${width*2.3} ${height*2.2}`);
|
||||||
|
|
||||||
var force = d3.layout.force()
|
var force = d3.layout.force()
|
||||||
.gravity(0.009)
|
.gravity(0.009)
|
||||||
|
Loading…
Reference in New Issue
Block a user