Update to iD v2.5.0

[rails.git] / vendor / assets / iD / iD.css.erb

diff --git a/vendor/assets/iD/iD.css.erb b/vendor/assets/iD/iD.css.erb
index fbc19869e943f5710777fcacf6da9b8fad49c322..9ce30a05b387a816f5155137f108f41e14ad1814 100644 (file)
--- a/vendor/assets/iD/iD.css.erb
+++ b/vendor/assets/iD/iD.css.erb
@@ -1943,120 +1943,238 @@ path.fill.tag-amenity-shelter {
 .turn circle {
     cursor: pointer;
 }
 .turn circle {
     cursor: pointer;
 }

-/* Mapillary Image Layer */
+/* photo viewer div */
+#photoviewer {
+    position: absolute;
+    bottom: 30px;
+    width: 330px;
+    height: 250px;
+    padding: 5px;
+    background-color: #fff;
+}

 
 

-.layer-mapillary-images {
-    pointer-events: none;
+#photoviewer button.thumb-hide {
+    border-radius: 0;
+    padding: 5px;
+    position: absolute;
+    right: 0;
+    top: 0;
+    z-index: 500;

 }
 
 }
 

-.layer-mapillary-images .viewfield-group {
+.photo-wrapper,
+.photo-wrapper img {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+}
+
+/* markers and sequences */
+.viewfield-group {

     pointer-events: visible;
     pointer-events: visible;

-    cursor: pointer; /* Opera */
-    cursor: url(<%= asset_path("iD/img/cursor-select-mapillary.png") %>) 6 1, pointer; /* FF */
+    cursor: pointer;

 }
 
 }
 

-.layer-mapillary-images .viewfield-group * {
-    stroke-width: 1;
-    stroke: #444;
-    fill: #ffc600;
+.viewfield-group * {

     z-index: 50;
 }
     z-index: 50;
 }

-
-.layer-mapillary-images .viewfield-group:hover * {
-    stroke-width: 1;
-    stroke: #333;
-    fill: #ff9900;
+.viewfield-group.selected * {
+    fill: #ffee00 !important;
+    z-index: 60;
+}
+.viewfield-group.hovered * {
+    fill: #eebb00 !important;
+    z-index: 70;
+}
+.viewfield-group.highlighted * {

     z-index: 60;
 }
 
     z-index: 60;
 }
 

-.layer-mapillary-images .viewfield-group.selected  * {
+.viewfield-group circle {
+    stroke: #555;
+    stroke-width: 1;
+    stroke-opacity: 0.4;
+    fill-opacity: 0.4;
+}
+.viewfield-group.highlighted circle {
+    stroke: #222;
+    stroke-opacity: 0.9;
+    fill-opacity: 0.9;
+}
+.viewfield-group.highlighted.hovered circle {
+    stroke: #222;

     stroke-width: 2;
     stroke-width: 2;

+    stroke-opacity: 0.9;
+    fill-opacity: 0.9;
+}
+.viewfield-group.highlighted.selected circle {

     stroke: #222;
     stroke: #222;

-    fill: #ff5800;
-    z-index: 60;
+    stroke-width: 2;
+    stroke-opacity: 1;
+    fill-opacity: 1;

 }
 
 }
 

-.layer-mapillary-images .viewfield-group:hover path.viewfield,
-.layer-mapillary-images .viewfield-group.selected path.viewfield,
-.layer-mapillary-images .viewfield-group path.viewfield {
+.viewfield-group .viewfield {

     stroke-width: 0;
     stroke-width: 0;

-    fill-opacity: 0.6;
+    stroke: #222;
+    fill-opacity: 0.4;
+}
+.viewfield-group.highlighted .viewfield {
+    stroke-width: 1;
+    fill-opacity: 0.8;
+}
+.viewfield-group.highlighted.hovered .viewfield {
+    stroke-width: 1;
+    fill-opacity: 0.8;
+}
+.viewfield-group.highlighted.selected .viewfield {
+    stroke-width: 1;
+    fill-opacity: 0.9;

 }
 
 }
 

-/* Mapillary Sign Layer */
+.viewfield-group.selected .viewfield-scale {
+    transform: scale(2,2);
+}

 
 

-.layer-mapillary-signs {
+.sequence {
+    fill: none;
+    stroke-width: 2;
+    stroke-opacity: 0.4;
+}
+.sequence.highlighted,
+.sequence.selected {
+    stroke-width: 4;
+    stroke-opacity: 1;
+}
+
+
+/* Mapillary Image Layer */
+.layer-mapillary-images {

     pointer-events: none;
 }
     pointer-events: none;
 }

+.layer-mapillary-images .viewfield-group * {
+    fill: #55ff22;
+}
+.layer-mapillary-images .sequence {
+    stroke: #55ff22;
+}
+

 
 

+/* 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;
 .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(<%= asset_path("iD/img/cursor-select-mapillary.png") %>) 6 1, pointer; /* FF */
-    z-index: 70;
+    cursor: pointer;
+    z-index: 30;

     overflow: visible;
 }
     overflow: visible;
 }

-

 .layer-mapillary-signs .icon-sign:hover .icon-sign-body {
 .layer-mapillary-signs .icon-sign:hover .icon-sign-body {

-    outline: 2px solid rgba(255,198,0,0.8);
-    z-index: 80;
+    outline: 5px solid #eebb00;
+    background-color: #eebb00;
+    z-index: 70;

 }
 }

-

 .layer-mapillary-signs .icon-sign.selected .icon-sign-body {
 .layer-mapillary-signs .icon-sign.selected .icon-sign-body {

-    outline: 2px solid rgba(255,0,0,0.8);
-    z-index: 80;
+    outline: 5px solid #ffee00;
+    background-color: #ffee00;
+    z-index: 40;
+}
+
+
+/* OpenStreetCam Image Layer */
+.layer-openstreetcam-images {
+    pointer-events: none;
+}
+.layer-openstreetcam-images .viewfield-group * {
+    fill: #77ddff;
+}
+.layer-openstreetcam-images .sequence {
+    stroke: #77ddff;

 }
 
 
 /* Mapillary viewer */
 #mly .domRenderer .TagSymbol {
     font-size: 10px;
 }
 
 
 /* Mapillary viewer */
 #mly .domRenderer .TagSymbol {
     font-size: 10px;

-    background-color: rgba(0, 0, 0, 0.4);
+    background-color: rgba(0,0,0,0.4);

     padding: 0 4px;
     border-radius: 4px;
     top: -25px;
 }
     padding: 0 4px;
     border-radius: 4px;
     top: -25px;
 }

-

 #mly .domRenderer .Attribution {
     width: 100%;
     font-size: 10px;
     text-align: right;
 }
 
 #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;
+/* OpenStreetCam viewer */
+.osc-wrapper {
+    position: relative;
+    background-color: #000;
+    background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+    background-position: center;
+    background-repeat: no-repeat;

 }
 
 }
 

-.mapillary-wrap button.thumb-hide {
-    border-radius: 0;
-    padding: 5px;
+.osc-wrapper .osc-attribution {
+    width: 100%;
+    font-size: 10px;
+    text-align: right;

     position: absolute;
     position: absolute;

+    bottom: 0;

     right: 0;
     right: 0;

-    top: 0;
-    z-index: 500;
+    padding: 4px 2px;
+    z-index: 10;
+}
+
+.osc-attribution a,
+.osc-attribution a:visited,
+.osc-attribution span {
+    padding: 4px 2px;
+    color: #fff;
+}
+.osc-attribution a:active,
+.osc-attribution a:hover {
+    color: #77ddff;

 }
 
 }
 

-.mly-wrapper {
-    visibility: hidden;
+.osc-controls-wrap {
+    text-align: center;
+    position: absolute;
+    top: 10px;

     width: 100%;
     width: 100%;

-    height: 100%;
+    z-index: 10;
+}
+
+.osc-controls {
+    display: inline-block;
+    z-index: 10;

 }
 
 }
 

-.mly-wrapper.active {
-    visibility: visible;
+.osc-controls button {
+    height: 18px;
+    width: 18px;
+    background: rgba(0,0,0,0.65);
+    color: #eee;
+    border-radius: 0;
+}
+.osc-controls button:first-of-type {
+    border-radius: 3px 0 0 3px;
+}
+.osc-controls button:last-of-type {
+    border-radius: 0 3px 3px 0;
+}
+.osc-controls button:hover,
+.osc-controls button:active,
+.osc-controls button:focus {
+    background: rgba(0,0,0,0.85);
+    color: #fff;

 }
 /* Fill Styles */
 
 }
 /* Fill Styles */
 


@@ -5072,8 +5190,13 @@ img.tile-removing {
     border-radius: 2px;
     padding: 0 4px;
     margin-top: 10px;
     border-radius: 2px;
     padding: 0 4px;
     margin-top: 10px;

+    margin-right: 10px;

     color: white;
 }
     color: white;
 }

+[dir='rtl'] .panel-content .button {
+    margin-right: auto;
+    margin-left: 10px;
+}

 
 .panel-content-history .links a {
     margin-left: 10px;
 
 .panel-content-history .links a {
     margin-left: 10px;


@@ -5770,8 +5893,7 @@ img.tile-removing {
 
 .notice {
     position: absolute;
 
 .notice {
     position: absolute;

-    top: 50%;
-    bottom: 50%;
+    top: 45px;

     left: 0;
     right: 0;
     text-align: center;
     left: 0;
     right: 0;
     text-align: center;


@@ -5780,7 +5902,7 @@ img.tile-removing {
 .notice .zoom-to {
     margin: auto;
     width: 300px;
 .notice .zoom-to {
     margin: auto;
     width: 300px;

-    height: 80px;
+    height: 70px;

     font-size: 150%;
     border-radius: 8px;
 }
     font-size: 150%;
     border-radius: 8px;
 }