X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/8ee3d678319062d4f2f27918d3f98d3465d9eb36..7f611b295f39b8c42219a5ce6c84582db74ce8f7:/app/assets/stylesheets/common.scss?ds=sidebyside diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 69e82666f..c4391be2d 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -70,6 +70,18 @@ time[title] { } } +/* Utility for delayed loading spinner */ + +.delayed-fade-in { + animation: 300ms linear forwards delayed-fade-in; +} + +@keyframes delayed-fade-in { + 0% { opacity: 0 } + 66% { opacity: 0 } + 100% { opacity: 1 } +} + /* Rules for the header */ #menu-icon { @@ -119,7 +131,7 @@ header { } nav.primary { - & > .btn-group .btn-outline-primary { + #edit_tab .btn-outline-primary { @include button-outline-variant($green, $color-hover: $white, $active-color: $white); } @@ -197,9 +209,7 @@ body.small-nav { } } - #sidebar .search_forms, - #edit_tab, - #export_tab { + #sidebar .search_forms { display: none; } @@ -207,7 +217,7 @@ body.small-nav { margin-right: 0; padding: 0; - .btn-group { + #edit_tab { width: 100%; padding: 10px; } @@ -368,6 +378,14 @@ body.small-nav { .leaflet-marker-draggable { cursor: move; } + + .query-marker { + animation: 1500ms forwards query-marker-fade; + + @keyframes query-marker-fade { + to { opacity: 0 } + } + } } #map-ui { @@ -412,9 +430,12 @@ body.small-nav { .layers-ui { .base-layers > * { - height: 56px; + height: 3.5rem; > .btn { + box-sizing: content-box; + top: - map.get($border-widths, 4); + left: - map.get($border-widths, 4); --bs-btn-border-color: var(--bs-body-bg); } > .btn:hover { @@ -686,7 +707,7 @@ tr.turn { } .header-illustration { - background-position: 0 0; + background-position: right; background-repeat: no-repeat; position: relative; min-height: 200px; @@ -695,16 +716,16 @@ tr.turn { bottom: 0; &.new-user-main { - background-image: image-url("sign-up-illustration.png"); - background-position-x: 50px; + background-image: image-url("sign-up-illustration.svg"); + background-position-x: 70px; } &.confirm-main { - background-image: image-url("confirm-illustration.png"); + background-image: image-url("confirm-illustration.svg"); } &.new-user-terms { - background-image: image-url("terms-illustration.png"); + background-image: image-url("terms-illustration.svg"); } } @@ -901,6 +922,12 @@ div.secondary-actions { } } +/* Rules for block pages */ + +#block_list .username { + max-width: 20em; +} + /* Rules for tabs inside secondary background sections */ .bg-body-secondary .nav-tabs {