Non puoi selezionare più di 25 argomenti
Gli argomenti devono iniziare con una lettera o un numero, possono includere trattini ('-') e possono essere lunghi fino a 35 caratteri.
402 righe
8.2 KiB
402 righe
8.2 KiB
body { |
|
padding-top: 56px; |
|
} |
|
.app-body-application { |
|
padding-top:5px !important; |
|
} |
|
.app-body-map { |
|
padding-right:0 !important; |
|
} |
|
.map-wrapper-front { |
|
height: calc(60vh - 0px); |
|
} |
|
.map-wrapper { |
|
height: calc(100vh - 0px); |
|
} |
|
.flex { |
|
display: flex; |
|
} |
|
.flex-sidebar { |
|
width: 250px; |
|
} |
|
.flex-content { |
|
flex: 1; |
|
} |
|
.sidebar-wrapper { |
|
position: relative; |
|
} |
|
|
|
.sidebar-title { |
|
padding: 10px 15px; |
|
border-bottom: 1px solid #dee2e6; |
|
height: 60px; |
|
} |
|
.sidebar-title .title { |
|
margin: 0; |
|
font-size: 20px; |
|
line-height: 38px; |
|
} |
|
.sidebar-wrapper.has-max-height { |
|
max-height: calc(100vh - 56px); |
|
overflow: auto; |
|
margin: 0 -15px 0 -10px; |
|
} |
|
.filter-wrapper { |
|
padding: 15px; |
|
border-bottom: 1px solid #dee2e6; |
|
height: 70px; |
|
} |
|
.sidebar-table { |
|
overflow: auto; |
|
height: calc(100vh - 186px); |
|
} |
|
.sidebar-table table { |
|
margin: 0; |
|
} |
|
|
|
/* Section II - Leaflet.js -related */ |
|
.leaflet-control-layers { |
|
overflow: auto; |
|
} |
|
|
|
.leaflet-control-layers label { |
|
font-weight: normal; |
|
margin-bottom: 0px; |
|
} |
|
|
|
.leaflet-control-layers-list input[type="radio"], input[type="checkbox"] { |
|
margin: 2px; |
|
} |
|
|
|
/* Section III - Plugin: Image Display */ |
|
#tdimgcontainer { |
|
display: inline-block; |
|
border: none; |
|
} |
|
img.thumbnailx { |
|
object-fit: cover; |
|
margin:0 5px 5px 5px; |
|
} |
|
|
|
#roadPropertyImg, |
|
#dataPropertyImg { |
|
border-radius: 5px; |
|
cursor: pointer; |
|
transition: 0.3s; |
|
} |
|
|
|
#roadPropertyImg:hover, |
|
#dataPropertyImg:hover { |
|
opacity: 0.7; |
|
} |
|
|
|
.roadPropertyModal, |
|
.dataPropertyModal { |
|
display: none; |
|
position: fixed; |
|
z-index: 1060; |
|
padding-top: 100px; |
|
left: 0; |
|
top: 0; |
|
width: 100%; |
|
height: 100%; |
|
overflow: auto; |
|
background-color: rgb(0,0,0); |
|
background-color: rgba(0,0,0,0.9); |
|
} |
|
|
|
.roadPropertyModalShown, |
|
.dataPropertyModalShown { |
|
display: block; |
|
position: fixed; |
|
z-index: 1060; |
|
padding-top: 100px; |
|
left: 0; |
|
top: 0; |
|
width: 100%; |
|
height: 100%; |
|
overflow: auto; |
|
background-color: rgb(0,0,0); |
|
background-color: rgba(0,0,0,0.9); |
|
} |
|
|
|
.roadPropertyModal-content, |
|
.dataPropertyModal-content { |
|
margin: auto; |
|
display: block; |
|
width: 80%; |
|
max-width: 700px; |
|
} |
|
|
|
#roadPropertyCaption, |
|
#dataPropertyCaption { |
|
margin: auto; |
|
display: block; |
|
width: 80%; |
|
max-width: 700px; |
|
text-align: center; |
|
color: #ccc; |
|
padding: 10px 0; |
|
height: 150px; |
|
} |
|
|
|
.roadPropertyModal-content, |
|
.dataPropertyModal-content, |
|
#roadPropertyCaption, |
|
#dataPropertyCaption { |
|
-webkit-animation-name: zoom-image-data; |
|
-webkit-animation-duration: 0.6s; |
|
animation-name: zoom-image-data; |
|
animation-duration: 0.6s; |
|
} |
|
@-webkit-keyframes zoom-image-data { |
|
from {-webkit-transform:scale(0)} |
|
to {-webkit-transform:scale(1)} |
|
} |
|
@keyframes zoom-image-data { |
|
from {transform:scale(0)} |
|
to {transform:scale(1)} |
|
} |
|
|
|
.roadPropertyClose, |
|
.dataPropertyClose { |
|
position: absolute; |
|
top: 15px; |
|
right: 35px; |
|
color: #f1f1f1; |
|
font-size: 40px; |
|
font-weight: bold; |
|
transition: 0.3s; |
|
} |
|
|
|
.roadPropertyClose:hover, |
|
.roadPropertyClose:focus, |
|
.dataPropertyClose:hover, |
|
.dataPropertyClose:focus { |
|
color: #bbb; |
|
text-decoration: none; |
|
cursor: pointer; |
|
} |
|
|
|
#thumb-wrapper .thumb { |
|
border: 1px solid #333; |
|
border-radius: 4px; |
|
color: #888; |
|
cursor: pointer; |
|
float: left; |
|
height: 75px; |
|
margin: 2px; |
|
padding: 2px; |
|
position: relative; |
|
width: 60px; |
|
} |
|
#thumb-wrapper .thumb small { |
|
bottom: 5px; |
|
position: absolute; |
|
right: 5px; |
|
} |
|
#thumb-wrapper .inset.img { |
|
background-size: cover; |
|
border-radius: 2px; |
|
display: block; |
|
height: 45px; |
|
width: 100%; |
|
} |
|
#thumb-wrapper .thumb .inset > span { |
|
display: block; |
|
font-size: 24px; |
|
line-height: 40px; |
|
margin: 0 auto; |
|
opacity: 0.5; |
|
text-align: center; |
|
width: 40px; |
|
} |
|
#view-pane img { |
|
transition: transform 0.25s ease-in-out; |
|
width: 100%; |
|
} |
|
|
|
/* Section IV - Plugin: Loader/Spinner */ |
|
/*! |
|
* Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/) |
|
* Copyright 2015 Daniel Cardoso <@DanielCardoso> |
|
* Licensed under MIT |
|
*/ |
|
.la-line-scale-pulse-out-rapid, |
|
.la-line-scale-pulse-out-rapid > div { |
|
position: relative; |
|
-webkit-box-sizing: border-box; |
|
-moz-box-sizing: border-box; |
|
box-sizing: border-box; |
|
} |
|
.la-line-scale-pulse-out-rapid { |
|
display: block; |
|
font-size: 0; |
|
color: #fff; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-dark { |
|
color: #333; |
|
} |
|
.la-line-scale-pulse-out-rapid > div { |
|
display: inline-block; |
|
float: none; |
|
background-color: currentColor; |
|
border: 0 solid currentColor; |
|
} |
|
.la-line-scale-pulse-out-rapid { |
|
width: 40px; |
|
height: 32px; |
|
} |
|
.la-line-scale-pulse-out-rapid > div { |
|
width: 4px; |
|
height: 32px; |
|
margin: 2px; |
|
margin-top: 0; |
|
margin-bottom: 0; |
|
border-radius: 0; |
|
-webkit-animation: line-scale-pulse-out-rapid .9s infinite cubic-bezier(.11, .49, .38, .78); |
|
-moz-animation: line-scale-pulse-out-rapid .9s infinite cubic-bezier(.11, .49, .38, .78); |
|
-o-animation: line-scale-pulse-out-rapid .9s infinite cubic-bezier(.11, .49, .38, .78); |
|
animation: line-scale-pulse-out-rapid .9s infinite cubic-bezier(.11, .49, .38, .78); |
|
} |
|
.la-line-scale-pulse-out-rapid > div:nth-child(3) { |
|
-webkit-animation-delay: -.9s; |
|
-moz-animation-delay: -.9s; |
|
-o-animation-delay: -.9s; |
|
animation-delay: -.9s; |
|
} |
|
.la-line-scale-pulse-out-rapid > div:nth-child(2), |
|
.la-line-scale-pulse-out-rapid > div:nth-child(4) { |
|
-webkit-animation-delay: -.65s; |
|
-moz-animation-delay: -.65s; |
|
-o-animation-delay: -.65s; |
|
animation-delay: -.65s; |
|
} |
|
.la-line-scale-pulse-out-rapid > div:nth-child(1), |
|
.la-line-scale-pulse-out-rapid > div:nth-child(5) { |
|
-webkit-animation-delay: -.4s; |
|
-moz-animation-delay: -.4s; |
|
-o-animation-delay: -.4s; |
|
animation-delay: -.4s; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-sm { |
|
width: 20px; |
|
height: 16px; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-sm > div { |
|
width: 2px; |
|
height: 16px; |
|
margin: 1px; |
|
margin-top: 0; |
|
margin-bottom: 0; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-2x { |
|
width: 80px; |
|
height: 64px; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-2x > div { |
|
width: 8px; |
|
height: 64px; |
|
margin: 4px; |
|
margin-top: 0; |
|
margin-bottom: 0; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-3x { |
|
width: 120px; |
|
height: 96px; |
|
} |
|
.la-line-scale-pulse-out-rapid.la-3x > div { |
|
width: 12px; |
|
height: 96px; |
|
margin: 6px; |
|
margin-top: 0; |
|
margin-bottom: 0; |
|
} |
|
@-webkit-keyframes line-scale-pulse-out-rapid { |
|
0% { |
|
-webkit-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
80% { |
|
-webkit-transform: scaley(.3); |
|
transform: scaley(.3); |
|
} |
|
90% { |
|
-webkit-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
} |
|
@-moz-keyframes line-scale-pulse-out-rapid { |
|
0% { |
|
-moz-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
80% { |
|
-moz-transform: scaley(.3); |
|
transform: scaley(.3); |
|
} |
|
90% { |
|
-moz-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
} |
|
@-o-keyframes line-scale-pulse-out-rapid { |
|
0% { |
|
-o-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
80% { |
|
-o-transform: scaley(.3); |
|
transform: scaley(.3); |
|
} |
|
90% { |
|
-o-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
} |
|
@keyframes line-scale-pulse-out-rapid { |
|
0% { |
|
-webkit-transform: scaley(1); |
|
-moz-transform: scaley(1); |
|
-o-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
80% { |
|
-webkit-transform: scaley(.3); |
|
-moz-transform: scaley(.3); |
|
-o-transform: scaley(.3); |
|
transform: scaley(.3); |
|
} |
|
90% { |
|
-webkit-transform: scaley(1); |
|
-moz-transform: scaley(1); |
|
-o-transform: scaley(1); |
|
transform: scaley(1); |
|
} |
|
} |
|
|
|
/* Media Queries */ |
|
@media only screen and (max-width: 767px){ |
|
.navbar-brand { |
|
font-size: 14px; |
|
} |
|
#feature-title { |
|
font-size: 14px; |
|
font-weight: bold; |
|
} |
|
.sidebar-wrapper.has-max-height { |
|
max-height: calc(100vh - 56px); |
|
overflow: auto; |
|
margin: inherit; |
|
} |
|
.roadPropertyModal-content, |
|
.dataPropertyModal-content { |
|
width: 100%; |
|
} |
|
img.thumbnailx { |
|
width:75px; |
|
} |
|
.content-text { |
|
max-width:100%; |
|
} |
|
} |