X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/477b765c42aa63764c6548931def0993f733470a..a357bab334d562ee15cc707947a5ee5962415591:/app/assets/openlayers/theme/default/style.css.scss diff --git a/app/assets/openlayers/theme/default/style.css.scss b/app/assets/openlayers/theme/default/style.css.scss index 3dbc047b0..6c833aea8 100644 --- a/app/assets/openlayers/theme/default/style.css.scss +++ b/app/assets/openlayers/theme/default/style.css.scss @@ -1,3 +1,7 @@ +/* + *= require theme/default/SimpleLayerSwitcher + */ + div.olMap { z-index: 0; padding: 0 !important; @@ -23,16 +27,16 @@ div.olLayerDiv { } .olLayerGooglePoweredBy { left: 2px; - bottom: 15px; + bottom: 15px; } .olLayerGoogleV3.olLayerGooglePoweredBy { bottom: 15px !important; } .olControlAttribution { - font-size: smaller; - right: 3px; - bottom: 4.5em; - position: absolute; + font-size: smaller; + right: 3px; + bottom: 4.5em; + position: absolute; display: block; } .olControlScale { @@ -67,10 +71,10 @@ div.olLayerDiv { display: block; position: absolute; font-size: smaller; -} +} div.olControlMousePosition { - bottom: 0em; + bottom: 0; right: 3px; display: block; position: absolute; @@ -90,13 +94,10 @@ div.olControlMousePosition { -moz-border-radius: 1em 0 0 0; } -.olControlOverviewMapMinimizeButton { - right: 0; - bottom: 80px; - cursor: pointer; -} - +.olControlOverviewMapMinimizeButton, .olControlOverviewMapMaximizeButton { + height: 18px; + width: 18px; right: 0; bottom: 80px; cursor: pointer; @@ -136,7 +137,7 @@ div.olControlMousePosition { .olPopupContent { padding:5px; overflow: auto; -} +} .olControlNavigationHistory { background-image: image-url("theme/default/img/navigation_history.png"); @@ -145,25 +146,25 @@ div.olControlMousePosition { height: 24px; } -.olControlNavigationHistoryPreviousItemActive { +.olControlNavigationHistoryPreviousItemActive { background-position: 0 0; } -.olControlNavigationHistoryPreviousItemInactive { +.olControlNavigationHistoryPreviousItemInactive { background-position: 0 -24px; } -.olControlNavigationHistoryNextItemActive { +.olControlNavigationHistoryNextItemActive { background-position: -24px 0; } -.olControlNavigationHistoryNextItemInactive { +.olControlNavigationHistoryNextItemInactive { background-position: -24px -24px; } -div.olControlSaveFeaturesItemActive { +div.olControlSaveFeaturesItemActive { background-image: image-url("theme/default/img/save_features_on.png"); background-repeat: no-repeat; background-position: 0 1px; } -div.olControlSaveFeaturesItemInactive { +div.olControlSaveFeaturesItemInactive { background-image: image-url("theme/default/img/save_features_off.png"); background-repeat: no-repeat; background-position: 0 1px; @@ -184,12 +185,12 @@ div.olControlSaveFeaturesItemInactive { opacity: 0.50; font-size: 1px; filter: alpha(opacity=50); -} +} .olControlPanPanel { top: 10px; left: 5px; -} +} .olControlPanPanel div { background-image: image-url("theme/default/img/pan-panel.png"); @@ -224,7 +225,7 @@ div.olControlSaveFeaturesItemInactive { .olControlZoomPanel { top: 71px; left: 14px; -} +} .olControlZoomPanel div { background-image: image-url("theme/default/img/zoom-panel.png"); @@ -252,9 +253,9 @@ div.olControlSaveFeaturesItemInactive { background-position: 0 18px; } -/* +/* * When a potential text is bigger than the image it move the image - * with some headers (closes #3154) + * with some headers (closes #3154) */ .olControlPanZoomBar div { font-size: 1px; @@ -276,9 +277,7 @@ div.olControlSaveFeaturesItemInactive { } .olImageLoadError { - background-color: pink; - opacity: 0.5; - filter: alpha(opacity=50); /* IE */ + background: image-url("theme/default/img/missing-tile.png") no-repeat; } /** @@ -323,10 +322,8 @@ div.olControlSaveFeaturesItemInactive { padding-top: 5px; padding-left: 10px; padding-bottom: 5px; - padding-right: 75px; + padding-right: 10px; background-color: darkblue; - width: 100%; - height: 100%; } .olControlLayerSwitcher .layersDiv .baseLbl, @@ -343,6 +340,8 @@ div.olControlSaveFeaturesItemInactive { .olControlLayerSwitcher .maximizeDiv, .olControlLayerSwitcher .minimizeDiv { + width: 18px; + height: 18px; top: 5px; right: 0; cursor: pointer; @@ -431,3 +430,49 @@ span.olGoogleAttribution.hybrid a, span.olGoogleAttribution.satellite a { .olControlEditingToolbar .olControlDrawFeaturePolygonItemActive { background-position: -26px -24px; } + +div.olControlZoom { + position: absolute; + top: 8px; + left: 8px; + background: rgba(255,255,255,0.4); + border-radius: 4px; + padding: 2px; +} +div.olControlZoom a { + display: block; + margin: 1px; + padding: 0; + color: black; + font-size: 18px; + font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif; + font-weight: bold; + text-decoration: none; + text-align: center; + height: 22px; + width:22px; + line-height: 19px; + background: #ffffff; + border: 1px solid #cccccc; +} +div.olControlZoom a:hover { + background: #f5f5f5; +} +a.olControlZoomIn { + border-radius: 4px 4px 0 0; +} +a.olControlZoomOut { + border-radius: 0 0 4px 4px; +} + + +/** + * Animations + */ + +.olLayerGrid .olTileImage { + -webkit-transition: opacity 0.2s linear; + -moz-transition: opacity 0.2s linear; + -o-transition: opacity 0.2s linear; + transition: opacity 0.2s linear; +}