Make sure declarations come before nested rules

This fixes sass deprecations.
EreMaijala · Sep 20, 2024 · 9406efa · 9406efa
1 parent 388a8a5
commit 9406efa
Show file tree

Hide file tree

Showing 46 changed files with 284 additions and 220 deletions.
diff --git a/themes/finna2/less/finna/accordion.less b/themes/finna2/less/finna/accordion.less
@@ -106,16 +106,16 @@
     outline: 1px solid @gray-lighter;
     box-shadow: 1px 1px 1px 1px @gray-lighter;
     background-color: @gray-ultralight;
-    @media(min-width: @screen-md) {
-      display: none;
-    }
     color: @text-color;
     display: flex;
     align-items: center;
     overflow: hidden;
     text-overflow: ellipsis;
     line-height: @content-headings-line-height;
     width: 100%;
+    @media(min-width: @screen-md) {
+      display: none;
+    }
     .feed-accordion-anchor {
       display: inline-flex;
       align-items: center;

diff --git a/themes/finna2/less/finna/advanced-search.less b/themes/finna2/less/finna/advanced-search.less
@@ -101,14 +101,14 @@
     margin-top: 15px;
   }
   .adv-group {
+    position: relative;
+    margin-top: 5px;
+    margin-bottom: .5em;
     h3 {
       font-size: 16px;
       margin-top: 0;
       margin-bottom: 16px;
     }
-    position: relative;
-    margin-top: 5px;
-    margin-bottom: .5em;
     .add_search_link {
       display: inline-block;
       margin-top: 10px;
@@ -462,16 +462,16 @@
       position: relative;
 
       .option {
-        &.option-parent {
-          background-color: white;
-          z-index: 1;
-        }
         padding: 2px 0;
         position: relative;
         user-select: none;
         -moz-user-select: none;
         -ms-user-select: none;
         -webkit-user-select: none;
+        &.option-parent {
+          background-color: white;
+          z-index: 1;
+        }
         .value:before {
             content: '\f096';
             font-family: 'FontAwesome';

diff --git a/themes/finna2/less/finna/autocomplete.less b/themes/finna2/less/finna/autocomplete.less
@@ -16,10 +16,11 @@
         border-bottom: none;
         color: @gray;
         position: relative;
+        cursor: pointer;
+
         &:hover {
             text-decoration: none;
         }
-        cursor: pointer;
         &.first {border-top-left-radius: 10px; border-top-right-radius: 10px;}
         &.last {border: 0; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
         &.selected {

diff --git a/themes/finna2/less/finna/collection.less b/themes/finna2/less/finna/collection.less
@@ -4,11 +4,11 @@
   .filter-input {
     flex-grow: 1;
     white-space: nowrap;
+    display: flex;
+    align-items: center;
     span:not(.icon) {
       margin-right: 10px;
     }
-    display: flex;
-    align-items: center;
   }
   button.btn-primary {
     font-size: 20px;

diff --git a/themes/finna2/less/finna/combinedlist.less b/themes/finna2/less/finna/combinedlist.less
@@ -4,11 +4,12 @@
         margin-top: 70px;
     }
     .combined-titles {
+        border-bottom: 4px solid @gray-lighter;
+        padding-bottom: 10px;
+
         @media(min-width:@screen-sm-min) {
             margin-top: -50px;
         }
-        border-bottom: 4px solid @gray-lighter;
-        padding-bottom: 10px;
     }
     .combined-list-title {
         padding-bottom: 5px;
@@ -22,18 +23,18 @@
         font-size: 1.05em;
     }
     & h4 {
-        display: inline;   
+        display: inline;
     }
     .show-list-details {
         line-height: 25px;
         margin: 0px;
         color: @link-color;
         &:hover {
-            cursor: pointer;   
+            cursor: pointer;
         }
     }
     .sub-label {
-        margin-top: 10px;   
+        margin-top: 10px;
     }
     & .filters-active {
         & .fa {

diff --git a/themes/finna2/less/finna/common.less b/themes/finna2/less/finna/common.less
@@ -435,11 +435,12 @@ ol {
   }
   .cm--bar .cm__btn, .pm__btn {
     font-size: 14px;
+    padding: @padding-base-vertical @padding-base-horizontal;
+
     &:hover {
       color: @btn-primary-color;
       background: darken(@btn-primary-bg, 5%);
     }
-    padding: @padding-base-vertical @padding-base-horizontal;
   }
   .cm--bar .cm__btn {
     flex: none;

diff --git a/themes/finna2/less/finna/condensed-list.less b/themes/finna2/less/finna/condensed-list.less
@@ -120,13 +120,14 @@
     .condensed-collapse-data {
         display: none;
         padding: 10px 0;
+        margin-top: 0px;
+
         & .resultClassification {
             margin-bottom: 10px;
         }
         & .holding-details {
             margin-top: 0;
         }
-        margin-top: 0px;
         & .summary {
             line-height: 1.4em;
         }

diff --git a/themes/finna2/less/finna/date-range.less b/themes/finna2/less/finna/date-range.less
@@ -1,6 +1,11 @@
 .main.template-dir-search.template-name-home,
 .sidebar {
     & .list-group-item:not(.title).daterange.expand {
+        transition: box .3s linear;
+
+        .timeline_within {
+            margin-left: 10px;
+        }
         @media (min-width: @screen-sm-min) {
             box-shadow: -4px 0px 13px -5px #000;
             padding: 10px;
@@ -18,10 +23,6 @@
             width: 720px;
             margin-left: -562px;
         }
-        transition: box .3s linear;
-        .timeline_within {
-            margin-left: 10px;
-        }
     }
     & .daterange-facet {
         & .list-group-item:not(.title).daterange {
@@ -75,14 +76,14 @@
                 clear: both;
                 position: relative;
                 height: 114px;
+                border-radius: 5px 5px 5px 5px;
 
                 & .date-vis {
                     width: 100%;
                     height: 110px;
                     cursor: crosshair;
                     background: @body-bg;
                 }
-                border-radius: 5px 5px 5px 5px;
                 & .icon--spin {
                     display: none;
                     left: 45%;

diff --git a/themes/finna2/less/finna/external-data.less b/themes/finna2/less/finna/external-data.less
@@ -1,5 +1,6 @@
 .external-data {
     width: 100%;
+    border: 1px @gray-lighter solid;
 
     .fa-chevron-up, .fa-chevron-down {
         font-size: .80em;
@@ -108,7 +109,6 @@
             padding: 2px 5px;
         }
     }
-    border: 1px @gray-lighter solid;
     .format-info {
         margin-left: 15px;
     }

diff --git a/themes/finna2/less/finna/feed.less b/themes/finna2/less/finna/feed.less
@@ -178,12 +178,13 @@
             }
             .article-image {
                 flex-shrink: 0;
+                margin-right: 10px;
+
                 img {
                     object-fit: cover;
                     aspect-ratio: calc(3 / 2);
                     width: 150px;
                 }
-                margin-right: 10px;
             }
         }
     }
@@ -842,19 +843,6 @@ finna-feed.carousel.splide--ltr {
                 position: relative;
             }
             p {
-                .carousel-header-title {
-                    display: block;
-                }
-                &.title-bottom {
-                    position: initial;
-                    height: 100%;
-                    width: 100%;
-                    padding-bottom: 10px;
-                    .carousel-header-title {
-                        display: inline-block;
-                        width: 100%;
-                    }
-                }
                 position: relative;
                 bottom: 0;
                 width: 100%;
@@ -869,6 +857,20 @@ finna-feed.carousel.splide--ltr {
                 margin-bottom: 0;
                 letter-spacing: 0.2px;
                 text-shadow: @carousel-slide-header-text-shadow;
+
+                .carousel-header-title {
+                    display: block;
+                }
+                &.title-bottom {
+                    position: initial;
+                    height: 100%;
+                    width: 100%;
+                    padding-bottom: 10px;
+                    .carousel-header-title {
+                        display: inline-block;
+                        width: 100%;
+                    }
+                }
             }
             .carousel-slide-more {
                 top: 0;
@@ -890,6 +892,8 @@ finna-feed.carousel.splide--ltr {
 
 finna-feed.carousel-slider.splide--ltr {
     container-type: inline-size;
+    --background-color: transparent;
+
     .splide__arrows {
         width: 100%;
         left: 0;
@@ -904,7 +908,6 @@ finna-feed.carousel-slider.splide--ltr {
             }
         }
     }
-    --background-color: transparent;
     &.slider-with-background {
         &::before {
             content: '';

diff --git a/themes/finna2/less/finna/filters.less b/themes/finna2/less/finna/filters.less
@@ -57,11 +57,12 @@
       margin: 0;
       height: 40px;
       label {
+        display: inline-block;
+        padding: 10px 0px;
+
         @media (max-width: @screen-xxs) {
           font-size: 80%;
         }
-        display: inline-block;
-        padding: 10px 0px;
       }
     }
   }
@@ -118,10 +119,11 @@
 }
 .results .noresults {
   flex-direction: column;
+  padding: 10px;
+
   p {
     flex: 1;
   }
-  padding: 10px;
 }
 
 .finna-filters .title-value-pair {

diff --git a/themes/finna2/less/finna/forms.less b/themes/finna2/less/finna/forms.less
@@ -91,17 +91,18 @@ input, input.form-control {
   box-shadow: 0px 0px 3px rgba(100,100,100,0.5);
   .form-control.search-query {
     flex: 1 1 auto;
-    @media (max-width: @screen-xs-max) {
-      width: percentage((@finna-search-input-width - 0.06));
-      font-size: 1.1em;
-    }
     border: none;
     box-shadow: none;
     background: transparent;
     display: inline-block !important;
     color: @gray;
     padding-left: 10px;
     height: 48px;
+
+    @media (max-width: @screen-xs-max) {
+      width: percentage((@finna-search-input-width - 0.06));
+      font-size: 1.1em;
+    }
   }
   /* --- Autocomplete and form adjust accordingly --- */
   &.input-field-only .form-control.search-query {