X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/c343f3ed3eca34bd3520b00ff8e55757f59d0866..bb868e0b11b25eb000a2c71cc993db86e383e0f3:/app/assets/stylesheets/common.scss

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 87f262ff0..1f80a9b5b 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -55,30 +55,28 @@ small, aside {
 .icon.clipboard   { /* no-r2 */ background-position: -160px 0; }
 .icon.link        { /* no-r2 */ background-position: -180px 0; }
 .icon.close       { /* no-r2 */ background-position: -200px 0; }
-.close-wrap:hover .icon.close,
 .icon.close:hover { /* no-r2 */ background-position: -200px -20px; }
 .icon.check       { /* no-r2 */ background-position: -220px 0; }
 .icon.note        { /* no-r2 */ background-position: -240px 0; }
 .icon.note.grey   { /* no-r2 */ background-position: -240px -20px; }
 .icon.query       { /* no-r2 */ background-position: -260px 0; }
 
-/* Rules for links */
-
-a {
-  color: #24d;
-  text-decoration: none;
-  outline: 0;
-  &:hover {
-    text-decoration: underline;
-  }
-}
-
 /* Utility for de-emphasizing content */
 
 .text-muted a {
   color: $blue;
 }
 
+/* Rules for borders */
+/* These add additional colours to those provided by bootstrap */
+.border-grey {
+  border-color: $grey !important;
+}
+
+.border-lightgrey {
+  border-color: $lightgrey !important;
+}
+
 /* Rules for the header */
 
 #menu-icon {
@@ -192,7 +190,7 @@ nav.secondary {
 
   .login-menu {
     .btn-outline-secondary {
-      @include button-outline-variant($darkgrey);
+      @include button-outline-variant($darkgrey, $white, null, null, $white);
     }
   }
 
@@ -216,11 +214,6 @@ nav.secondary {
     }
   }
 
-  img.user_thumbnail_tiny {
-    border: 0;
-    border-radius: 3px;
-  }
-
   #inboxanchor {
     display: inline-block;
     height: 25px;
@@ -364,47 +357,6 @@ body.compact-nav {
       clear: both;
       width: 100%;
     }
-
-    h2 {
-      font-size: 1.5rem;
-    }
-
-    h3, h4 {
-      font-size: 1.25rem;
-    }
-
-    .close-wrap {
-      cursor: pointer;
-      position: absolute;
-      top: 0;
-      right: 0;
-      width: 60px;
-      height: 60px;
-
-      .icon.close {
-        pointer-events: none;
-        position: absolute;
-        right: 20px;
-        top: 20px;
-      }
-    }
-
-    .icon.close {
-      float: right;
-      cursor: pointer;
-    }
-
-    .flash {
-      padding: 15px;
-
-      picture {
-        margin-right: -25px;
-      }
-
-      div.message {
-        margin-left: 30px;
-      }
-    }
   }
 
   .overlay-sidebar #sidebar {
@@ -656,11 +608,6 @@ body.compact-nav {
   padding: $lineheight/2 $lineheight;
   // background: $offwhite;
   // border-bottom: 1px solid $grey;
-  > .close {
-    float: right;
-    margin-top: 2px;
-    cursor: pointer;
-  }
 }
 
 #browse_status {
@@ -698,6 +645,28 @@ form {
   }
 }
 
+/* Stop bootstrap 5 from floating legends when they don't need to be */
+legend {
+  float: none;
+}
+
+/* Override the text colour for primary and secondary buttons, to match our
+   bootstrap 4 colours. Note this has accessibility issues, which is why
+   bootstrap 5 calculates black as the appropriate colour, and we should
+   reconsider our colours at some point with that in mind. */
+
+.btn-primary {
+  @include button-variant($primary, $primary, $white, null, null, $white, null, null, $white, null, null, $white);
+}
+
+.btn-secondary {
+  @include button-variant($secondary, $secondary, $white, null, null, $white, null, null, $white, null, null, $white);
+}
+
+.btn-outline-secondary {
+  @include button-outline-variant($secondary, $white, null, null, $white);
+}
+
 /* Rules for the search and direction forms */
 
 header .search_forms,
@@ -819,38 +788,8 @@ tr.turn:hover {
     border-bottom: none;
   }
 
-  .paginate {
-    float: right;
-    padding: 1px 6px;
-    border: 1px solid $lightgrey;
-    border-radius: 3px;
-  }
-
-  .browse-field {
-    margin-bottom: 10px;
-
-    h4 {
-      padding: 5px 0 5px 10px;
-      font-size: 12px;
-      border: 1px solid $grey;
-      border-radius: 4px 4px 0 0;
-      background-color: $offwhite;
-    }
-
-    p {
-      padding: 7px 10px;
-      font-size: 12px;
-      background-color: #FFF;
-      border: 1px solid $grey;
-      border-top: 0;
-      border-radius: 0 0 4px 4px;
-    }
-  }
-
   .browse-tag-list {
     background-color: $offwhite;
-    border: 1px solid $grey;
-    border-radius: 3px;
     table-layout: fixed;
     border-collapse: separate;
     border-spacing: 0;
@@ -902,16 +841,6 @@ tr.turn:hover {
     }
   }
 
-  .comments-header {
-    float: left;
-  }
-
-  .subscribe-buttons {
-    float: left;
-    margin: 0 10px;
-    min-width: 80px;
-  }
-
   .subscribe-buttons input {
     font-size: 90%;
     line-height: 15px;
@@ -973,8 +902,6 @@ tr.turn:hover {
 
   .export_boxy {
     background: $lightgrey;
-    border: 1px solid $grey;
-    border-radius: 3px;
 
     #maxlat { margin-top: -1px; }
     #minlon {
@@ -1082,7 +1009,6 @@ tr.turn:hover {
 
 .content_map {
   height: 200px;
-  border: 1px solid $grey;
   margin-bottom: $lineheight;
 }
 
@@ -1124,26 +1050,9 @@ tr.turn:hover {
   padding-bottom: $lineheight/2;
   border-top: 1px solid $grey;
 
-  &:first-of-type {
-    margin-top: $lineheight/2;
-  }
-
   &.deleted {
     background-color: #fee;
   }
-
-  .post_heading {
-    margin-bottom: $lineheight;
-
-    h2 {
-      margin-top: 0;
-      margin-bottom: $lineheight/2;
-    }
-  }
-
-  img.user_thumbnail {
-    float: left;
-  }
 }
 
 /* Rules for the diary entry page */
@@ -1151,7 +1060,6 @@ tr.turn:hover {
 .diary_entries {
   #map {
     height: 400px;
-    border: 1px solid $grey;
     display: none;
     margin-bottom: $lineheight;
   }
@@ -1180,10 +1088,6 @@ tr.turn:hover {
   }
 }
 
-.diary_entries-show img.user_thumbnail {
-  float: left;
-}
-
 /* Rules for the log in page */
 
 #login_auth_buttons {
@@ -1199,7 +1103,6 @@ tr.turn:hover {
 
 .users-terms {
   .legale {
-    border: 1px solid $grey;
     padding: $lineheight;
     margin-bottom: $lineheight;
     overflow: auto;
@@ -1260,8 +1163,9 @@ tr.turn:hover {
 /* Rules for messages pages */
 
 .messages {
-  input[type="submit"] {
+  button[type="submit"] {
     margin: auto;
+    white-space: nowrap;
   }
 
   .inbox-row {
@@ -1395,13 +1299,11 @@ tr.turn:hover {
 img.user_image {
   max-width: 100px;
   max-height: 100px;
-  border: 1px solid $grey;
 }
 
 img.user_thumbnail {
   max-width: 50px;
   max-height: 50px;
-  border: 1px solid $grey;
 }
 
 img.user_thumbnail_tiny {
@@ -1409,7 +1311,6 @@ img.user_thumbnail_tiny {
   height: auto;
   max-width: 25px;
   max-height: 25px;
-  border: 1px solid $grey;
 }
 
 /* Rules for geo microformats */
@@ -1516,13 +1417,6 @@ dl.dl-inline {
   }
 }
 
-/* Customise the background colour of striped tables */
-
-.table-striped > tbody > tr:nth-child(2n+1) > td,
-.table-striped > tbody > tr:nth-child(2n+1) > th {
-   background-color: $offwhite;
-}
-
 /* Rules for OpenID logo */
 
 .openid_logo {
@@ -1535,13 +1429,11 @@ dl.dl-inline {
 .richtext,
 .prose {
   code {
-    font-size: 13px;
     background: $lightgrey;
     padding: 2px 3px;
   }
 
   pre {
-    font-size: 13px;
     background: $lightgrey;
     padding: 2px 3px;
     white-space: pre-wrap;
@@ -1584,19 +1476,10 @@ dl.dl-inline {
 
 /* Rules for the "Welcome" page */
 .site-welcome, .site-fixthemap {
-  .center {
-    text-align: center;
-    .sprite {
-      float: none;
-      margin: auto;
-    }
-  }
-
   .sprite {
     background-image: image-url("welcome-sprite.png");
     background-size: 500px 250px;
     display: block;
-    float: left;
   }
 
   .icon-list {
@@ -1646,15 +1529,6 @@ dl.dl-inline {
     /* no-r2 */ background-position: -350px 0;
   }
 
-  .start-mapping {
-    margin: auto;
-    cursor: pointer;
-    border: none;
-    padding: 20px 40px;
-    font-size: 30px;
-    text-decoration: none;
-  }
-
   .icon.note {
     background-color: #333;
     border-radius: 4px;