Files
iD/css/60_mapillary.css

116 lines
2.3 KiB
CSS

/* Mapillary Image Layer */
.layer-mapillary-images {
pointer-events: none;
}
.layer-mapillary-images .viewfield-group {
pointer-events: visible;
cursor: pointer; /* Opera */
cursor: url(img/cursor-select-mapillary.png) 6 1, pointer; /* FF */
}
.layer-mapillary-images .viewfield-group * {
stroke-width: 1;
stroke: #444;
fill: #ffc600;
z-index: 50;
}
.layer-mapillary-images .viewfield-group:hover * {
stroke-width: 1;
stroke: #333;
fill: #ff9900;
z-index: 60;
}
.layer-mapillary-images .viewfield-group.selected * {
stroke-width: 2;
stroke: #222;
fill: #ff5800;
z-index: 60;
}
.layer-mapillary-images .viewfield-group:hover path.viewfield,
.layer-mapillary-images .viewfield-group.selected path.viewfield,
.layer-mapillary-images .viewfield-group path.viewfield {
stroke-width: 0;
fill-opacity: 0.6;
}
/* Mapillary Sign Layer */
.layer-mapillary-signs {
pointer-events: none;
}
.layer-mapillary-signs .icon-sign .icon-sign-body {
min-width: 20px;
height: 24px;
width: 24px;
outline: 2px solid transparent;
pointer-events: visible;
cursor: pointer; /* Opera */
cursor: url(img/cursor-select-mapillary.png) 6 1, pointer; /* FF */
z-index: 70;
overflow: visible;
}
.layer-mapillary-signs .icon-sign:hover .icon-sign-body {
outline: 2px solid rgba(255,198,0,0.8);
z-index: 80;
}
.layer-mapillary-signs .icon-sign.selected .icon-sign-body {
outline: 2px solid rgba(255,0,0,0.8);
z-index: 80;
}
/* Mapillary viewer */
#mly .domRenderer .TagSymbol {
font-size: 10px;
background-color: rgba(0, 0, 0, 0.4);
padding: 0 4px;
border-radius: 4px;
transform: translate(-50%, -120%) !important;
}
#mly .domRenderer .Attribution {
width: 100%;
font-size: 10px;
text-align: right;
}
.mapillary-wrap {
position: absolute;
bottom: 30px;
width: 330px;
height: 250px;
padding: 5px;
background-color: #fff;
}
.mapillary-wrap.hidden {
visibility: hidden;
}
.mapillary-wrap button.thumb-hide {
border-radius: 0;
padding: 5px;
position: absolute;
right: 0;
top: 0;
z-index: 500;
}
.mly-wrapper {
visibility: hidden;
width: 100%;
height: 100%;
}
.mly-wrapper.active {
visibility: visible;
}