X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/ae0177fbe61d7d02e3c6b441bd395fff6fd96a18..45d9e051f52c4c61a6510bfd74897d60bf15f1cf:/vendor/assets/iD/iD.css.erb diff --git a/vendor/assets/iD/iD.css.erb b/vendor/assets/iD/iD.css.erb index 6463f2f1c..a79d63b4b 100644 --- a/vendor/assets/iD/iD.css.erb +++ b/vendor/assets/iD/iD.css.erb @@ -386,10 +386,6 @@ path.stroke.tag-leisure-park { stroke: #8cd05f; } -path.stroke.tag-landuse-residential { - stroke: #e06e5f; -} - path.stroke.tag-landuse-retail, path.stroke.tag-landuse-commercial { stroke: #eab056; @@ -1195,12 +1191,17 @@ text.point { /* GPX Paths */ path.gpx { - stroke: #6AFF25; + stroke: #FF26D4; stroke-width: 2; fill: none; pointer-events: none; } +/* GPS Labels */ +text.gpx { + fill:#FF26D4; +} + /* Modes */ .mode-draw-line .vertex.active, @@ -1395,7 +1396,6 @@ input[type=email] { width: 100%; border-radius:4px; text-overflow: ellipsis; - overflow: hidden; -webkit-transition: all 200ms; -moz-transition: all 200ms; -o-transition: all 200ms; @@ -1463,17 +1463,11 @@ table.tags, table.tags td, table.tags th { ul li { list-style: none;} -.toggle-list { - border-radius: 4px; - border: 1px solid #CCC; -} - .toggle-list > label { position: relative; padding: 5px 10px; - display:block; + display: block; height: 30px; - border-bottom: 1px solid #ccc; background-color: white; color: #7092FF; cursor: pointer; @@ -1486,34 +1480,21 @@ ul li { list-style: none;} background-color: #ececec; } -.toggle-list > label:first-child { - border-radius: 3px 3px 0 0; +.toggle-list > label:not(:last-child) { + border-bottom: 1px solid #ccc; } .toggle-list > label:last-child { border-radius: 0 0 3px 3px; - border-bottom-width: 0; -} - -.toggle-list > label:only-child { - border-radius: 3px; } -.toggle-list label > span { +.toggle-list label > span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } -.toggle-list > label.remove span.icon { - display: block; - width: 14px; - float: left; - margin-right: 5px; - background-position: -204px 0; -} - .toggle-list > label.active { background: #E8EBFF; } @@ -1780,6 +1761,7 @@ button.save.has-count .count::before { .icon.relation { background-position: -520px 0;} .icon.relation.route { background-position: -540px 0;} .icon.relation.multipolygon { background-position: -560px 0;} +.icon.vertex { background-position: -580px 0;} .icon.inspect.light { background-position: -220px -20px;} .icon.plus.light { background-position: -240px -20px;} @@ -1814,6 +1796,18 @@ button[disabled] .icon.layers { background-position: -300px -40px;} button[disabled] .icon.avatar { background-position: -320px -40px;} button[disabled] .icon.nearby { background-position: -340px -40px;} +.icon.point.deleted { background-position: -302px -80px;} +.icon.line.deleted { background-position: -320px -80px;} +.icon.area.deleted { background-position: -340px -80px;} + +.icon.point.created { background-position: -302px -100px;} +.icon.line.created { background-position: -320px -100px;} +.icon.area.created { background-position: -340px -100px;} + +.icon.point.modified { background-position: -24px 0; } + +.icon.modified { opacity: .5; } + /* Out link is special */ .icon.out-link { height: 14px; width: 14px; background-position: -500px 0;} @@ -1958,6 +1952,10 @@ a:hover .icon.out-link { background-position: -500px -14px;} top: 60px; } +.selection-list-pane .inspector-body { + top: 60px; +} + .inspector-inner { padding: 20px; position: relative; @@ -2103,6 +2101,15 @@ a:hover .icon.out-link { background-position: -500px -14px;} height: 100%; border: 1px solid #CCC; border-radius: 0 3px 3px 0; + position: absolute; + top: 0; + right: 0; + width: 10%; + background: #fafafa; +} + +.preset-list-item button.tag-reference-button .icon { + opacity: .5; } .current .preset-list-button, @@ -2231,26 +2238,39 @@ a:hover .icon.out-link { background-position: -500px -14px;} background: #f6f6f6; display: block; border-radius: 4px 4px 0 0; + overflow: hidden; } -.form-label button { - border-left: 1px solid #CCC; +.form-label-button-wrap { + position: absolute; + top: 0; + right: 0; + height: 100%; + width: 100%; + background: transparent; + text-align: right; } -.form-label .modified-icon { - border-right: 0; - opacity: 0; - z-index: -10; - right: 10%; +.form-label-button-wrap .icon { + opacity: .5; } -.modified .form-label .modified-icon { - opacity: 1; - z-index: 1; +.form-label button { + border-left: 1px solid #CCC; + width: 10%; + height: 100%; + border-radius: 0; + background: #fafafa; } -.form-label button.tag-reference-button { - border-top-right-radius: 3px; +.form-label .modified-icon, +.form-field .remove-icon { + display: none; +} + +.modified .form-label .modified-icon, +.present .form-label .remove-icon { + display: inline-block; } .form-field > input, @@ -2260,17 +2280,12 @@ a:hover .icon.out-link { background-position: -500px -14px;} min-height: 30px; border-top: 0; border-radius: 0 0 4px 4px; - overflow: hidden; } .form-field textarea { height: 65px; } -.form-field button.remove { - border-radius: 0 0 4px 0; -} - .inspector-border { border-bottom: 1px solid #CCC } @@ -2293,7 +2308,7 @@ a:hover .icon.out-link { background-position: -500px -14px;} .inspector-hidden, .inspector-hover label input[type="checkbox"], .inspector-hover label input[type="radio"], -.inspector-hover .toggle-list label:not(.active), +.inspector-hover .toggle-list label, .inspector-hover .toggle-list label span, .inspector-hover .inspector-inner .add-tag, .inspector-hover .inspector-inner .add-relation, @@ -2308,13 +2323,14 @@ a:hover .icon.out-link { background-position: -500px -14px;} } /* hide but preserve in layout */ -.inspector-hover .modified .form-label .modified-icon, .inspector-hover .entity-editor-pane button.minor, -.inspector-hover .combobox-carat, +.inspector-hover .combobox-caret, .inspector-hover .entity-editor-pane .header button, .inspector-hover .spin-control, .inspector-hover .hide-toggle:before, .inspector-hover .more-buttons, +.inspector-hover .form-label-button-wrap, +.inspector-hover .tag-reference-button, .inspector-hover .view-on-osm { opacity: 0; } @@ -2402,9 +2418,8 @@ input, transition: opacity 200ms 200ms, width 200ms 200ms, margin-right 200ms 200ms; } -.modified .form-label .modified-icon, .entity-editor-pane button.minor, -.combobox-carat, +.combobox-caret, .entity-editor-pane .header button, .toggle-list label span, .spin-control, @@ -2633,7 +2648,7 @@ input[type=number] { padding-right: 10%; } -.form-field .wiki-title ~ .combobox-carat { +.form-field .wiki-title ~ .combobox-caret { margin-left: -18%; margin-right: 9%; } @@ -2679,13 +2694,13 @@ input[type=number] { vertical-align: top; } +.form-field .localized-wrap { + padding: 0 10px; +} + .form-field .localized-wrap .entry { position: relative; overflow: hidden; - background: #f1f1f1; - border: 1px solid #ccc; - border-width: 0; - border-radius: 4px; } .form-field .localized-wrap .entry::before { @@ -2707,11 +2722,14 @@ input[type=number] { } .form-field .localized-wrap .entry .localized-value { - padding-right: 10%; border-top-width: 0; border-radius: 0 0 4px 4px; } +.form-field .localized-wrap .form-label button { + border-top-right-radius: 3px; +} + /* Preset form address */ .form-field .addr-housename { @@ -2781,10 +2799,21 @@ div.combobox { border-top: 0; } -.combobox-carat { - margin-left: -20px; - margin-right: 10px; - display:inline-block; +.combobox-caret { + display: inline-block; + position: relative; + height: 30px; + width: 30px; + margin-left: -30px; + vertical-align: top; +} + +.combobox-caret::after { + content:""; + height: 0; width: 0; + position: absolute; + left: 0; right: 0; bottom: 0; top: 0; + margin: auto; border-top: 5px solid #ccc; border-left: 5px solid transparent; border-right: 5px solid transparent; @@ -2870,6 +2899,10 @@ div.combobox { .tag-row .tag-reference-button { right: 0; + border-radius: 0; + width: 10%; + top: 0; + background: #fafafa; } /* Adding form fields to tag editor */ @@ -2977,6 +3010,10 @@ img.wiki-image { padding-left: 10px; } +.member-incomplete .member-delete { + display: none; +} + .member-row-new .member-entity-input { border-radius: 4px 4px 0 0; border: 1px solid #cfcfcf; @@ -3037,16 +3074,10 @@ img.wiki-image { /* Background Settings */ - -.toggle-list.layer-list { - margin-bottom: 10px; -} - .background-control button { border-radius: 4px 0 0 0; } - .background-control button.active { border-radius: 0; } @@ -3073,6 +3104,56 @@ img.wiki-image { padding-bottom: 10px; } +.layer-list { + margin-bottom: 10px; + border: 1px solid #CCC; + border-radius: 4px; +} + +.layer-list li { + position: relative; + height: 30px; + background-color: white; + color: #7092FF; +} + +.layer-list > li:first-child { + border-radius: 3px 3px 0 0; +} + +.layer-list > li:last-child { + border-radius: 0 0 3px 3px; +} + +.layer-list > li:only-child { + border-radius: 3px; +} + +.layer-list li:not(:last-child) { + border-bottom: 1px solid #ccc; +} + +.layer-list li:hover { + background-color: #ececec; +} + +.layer-list li.active { + background: #E8EBFF; +} + +.layer-list label { + display: block; + padding: 5px 10px; + cursor: pointer; +} + +.layer-list label > span { + display: block; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + .hide-toggle { display: block; padding-left:12px; @@ -3145,7 +3226,7 @@ img.wiki-image { .opacity-options { background: url(<%= asset_path("iD/img/background-pattern-opacity.png") %>) 0 0 repeat; height:20px; - width:62px; + width:82px; position: absolute; right: 10px; top: 10px; @@ -3184,13 +3265,20 @@ img.wiki-image { height:18px; } -.background-control .layer-toggle-gpx .layer-extent { +.background-control .layer-toggle-gpx button { + float: right; + height: 100%; + width: 10%; border-left: 1px solid #CCC; - border-radius: 0 4px 4px 0; + border-radius: 0; } -.background-control .layer-toggle-gpx.selected .layer-extent { - display:inline-block; +.background-control .layer-toggle-gpx button .icon { + opacity: 0.5; +} + +.background-control .layer-toggle-gpx button.layer-extent { + border-radius: 0 3px 3px 0; } /* Geolocator */ @@ -3360,12 +3448,24 @@ img.wiki-image { } /* Attribution overlay */ -.attribution { +.base-layer-attribution, +.overlay-layer-attribution { position: absolute; bottom: 35px; - left:10px; - color:#888; - font-size:10px; + color: #888; + font-size: 10px; +} + +.base-layer-attribution { + left: 10px; +} + +.overlay-layer-attribution { + right: 10px; +} + +.overlay-layer-attribution .attribution:not(:last-child):after { + content: '; '; } .source-image { @@ -3488,11 +3588,11 @@ img.wiki-image { ------------------------------------------------------- */ .modal-actions .restore:before { - background-position: -500px -220px; + background-position: -600px -220px; } .modal-actions .reset:before { - background-position: -600px -220px; + background-position: -700px -220px; } /* Success Modal @@ -3506,16 +3606,28 @@ img.wiki-image { padding-top: 15px; } +.save-success .button.social { + height: 80px; +} + +.save-success .button.social:before { + height: 50px; +} + .save-success .button.osm:before { background-position: 0px -220px; } .save-success .button.twitter:before { - background-position: -100px -220px; + background-position: -100px -245px; } .save-success .button.facebook:before { - background-position: -200px -220px; + background-position: -200px -245px; +} + +.save-success .button.google:before { + background-position: -300px -245px; } /* Splash Modal @@ -3523,11 +3635,11 @@ img.wiki-image { .modal-actions .walkthrough:before, .walkthrough a:before { - background-position: -300px -220px; + background-position: -400px -220px; } .modal-actions .start:before { - background-position: -400px -220px; + background-position: -500px -220px; } /* Commit Modal @@ -3545,6 +3657,8 @@ img.wiki-image { float: none; margin: auto; display: block; + color: white; + font-size: 14px; } .mode-save .user-info img { @@ -3565,12 +3679,15 @@ img.wiki-image { color:#fff; } +.mode-save .commit-info { + margin-bottom: 10px; +} + .mode-save .changeset-list { overflow: auto; border:1px solid #ccc; border-radius: 4px; background:#fff; - max-height: 160px; } .mode-save .warning-section .changeset-list button { @@ -3581,6 +3698,15 @@ img.wiki-image { position: relative; border-top:1px solid #ccc; padding:5px 10px; + cursor: pointer; +} + +.mode-save .changeset-list li:hover { + background-color: #ececec; +} + +.mode-save .changeset-list .alert { + opacity: 0.5; } .changeset-list li span.count { @@ -3588,6 +3714,10 @@ img.wiki-image { color:#555; } +.mode-save .commit-section .changeset-list button { + border-left: 1px solid #CCC; +} + .changeset-list li span.count:before { content: '('; } .changeset-list li span.count:after { content: ')'; } @@ -3825,7 +3955,7 @@ img.wiki-image { } /* Move over tooltips that are near the edge of screen */ .add-point .tooltip { - left: 33.3333% !important; + left: 33.3333% !important; } .curtain-tooltip.intro-points-add .tooltip-arrow, @@ -4007,7 +4137,7 @@ img.wiki-image { .huge-modal-button .illustration { height: 100px; width: 100px; - background: rgba(0, 0, 0, 0) url(<%= asset_path("iD/img/sprite.svg") %>) no-repeat -301px -220px; + background: rgba(0, 0, 0, 0) url(<%= asset_path("iD/img/sprite.svg") %>) no-repeat -400px -220px; margin: auto; } /* This file is generated by make. Do NOT edit manually. */