@asd20/ui 3.2.804 → 3.2.806

package/package.json

@@ -5,7 +5,7 @@
     "*.scss",
     "*.vue"
   ],
-  "version": "3.2.804",
+  "version": "3.2.806",
   "private": false,
   "license": "MIT",
   "repository": {

package/src/components/templates/Asd20ArticleDigestTemplate/index.vue

@@ -132,6 +132,7 @@
                   transparent
                   centered
                   opposite
+                  :disabled="counter === 1"
                 />
                 <p>
                   Page {{ Math.ceil(counter2 / numberToShow) }} of
@@ -147,6 +148,7 @@
                   horizontal
                   transparent
                   centered
+                  :disabled="cards.length < counter2"
                 />
               </div>
             </div>
@@ -187,6 +189,7 @@
                     transparent
                     centered
                     opposite
+                    :disabled="counter === 1"
                   />
                 </a>
                 <p>
@@ -204,6 +207,7 @@
                     horizontal
                     transparent
                     centered
+                    :disabled="cards.length < counter2"
                   />
                 </a>
               </div>
@@ -431,7 +435,7 @@ export default {
     margin: space(1) 0 0 space(1);
   }
   .asd20-card {
-    margin-bottom: space(0.5);
+    margin: space(1) space(1) space(2) space(1);
     // &__date-time {
     //   display: none;
     // }
@@ -462,10 +466,11 @@ export default {
           padding: 0;
           > .asd20-button__label {
             margin: 0;
+            padding: 0.5rem;
           }
         }
         p {
-          margin: 0;
+          margin: 0 space(0.25);
         }
       }
     }
@@ -479,17 +484,32 @@ export default {
   }
 
   .asd20-search-field {
-    border: 2px solid var(--color__accent);
     margin: space(0.5) 0;
     .asd20-icon {
       margin-left: space(0.5);
     }
+    input {
+      border: 2px solid var(--color__accent);
+      font-family: var(--website-typography__font-family-headlines);
+      font-size: 1rem;
+    }
   }
-  .asd20-multiselect-input span {
-    padding-left: 1rem;
+  .asd20-multiselect-input {
+    line-height: 1;
+    .multiselect__placeholder {
+      padding-left: space(0.5);
+      font-size: 1rem;
+    }
   }
 }
 
+@media (min-width: 768px) {
+  .asd20-template-article-digest {
+    .asd20-card {
+      margin: space(1) space(1) space(2) space(1);
+    }
+  }
+}
 @media (min-width: 1024px) {
   .asd20-template-article-digest {
     @include template-desktop;
@@ -533,7 +553,7 @@ export default {
       grid-gap: space(1);
       margin-bottom: space(1);
       .asd20-card {
-        margin-bottom: 0;
+        margin: 0;
       }
     }
     .search-header,
@@ -544,6 +564,17 @@ export default {
       display: flex;
       flex-basis: 100%;
       justify-content: space-between;
+      .asd20-search-field {
+        margin: space(0.5) space(0.5);
+        flex-basis: 50%;
+        .asd20-icon {
+          margin-left: 0;
+        }
+      }
+      .asd20-multiselect-input {
+        margin-bottom: 0;
+        flex-basis: 50%;
+      }
     }
     .article-pagination {
       flex-direction: row;
@@ -551,12 +582,6 @@ export default {
     .article-digest {
       // flex-basis: 100%;
       margin: space(1) space(3) space(1) space(3);
-      .asd20-search-field {
-        border: none;
-        .asd20-icon {
-          margin-left: 0;
-        }
-      }
     }
   }
 }

package/src/components/templates/Asd20ArticleListTemplate/index.vue

@@ -170,6 +170,7 @@
                     transparent
                     centered
                     opposite
+                    :disabled="counter === 1"
                   />
                   <p>
                     Page {{ Math.ceil(counter2 / numberToShow) }} of
@@ -185,6 +186,7 @@
                     horizontal
                     transparent
                     centered
+                    :disabled="cards.length < counter2"
                   />
                 </div>
               </div>
@@ -224,6 +226,7 @@
                       transparent
                       centered
                       opposite
+                      :disabled="counter === 1"
                     />
                   </a>
                   <p>
@@ -241,6 +244,7 @@
                       horizontal
                       transparent
                       centered
+                      :disabled="cards.length < counter2"
                     />
                   </a>
                 </div>
@@ -499,10 +503,11 @@ export default {
           padding: space(0.25);
           > .asd20-button__label {
             margin: 0;
+            padding: 0.5rem;
           }
         }
         p {
-          margin: 0;
+          margin: 0 space(0.25);
         }
       }
     }
@@ -516,20 +521,28 @@ export default {
     // --website-icon__fill-color: #436c74;
     margin: 0 space(1);
     .asd20-card {
-      margin-bottom: space(-0.5);
+      // margin-bottom: space(-0.5);
       .asd20-card__content:hover {
         background: rgba(200, 200, 200, 0.2);
       }
     }
     .asd20-search-field {
-      border: 2px solid var(--color__accent);
       margin: space(0.5) 0;
       .asd20-icon {
         margin-left: space(0.5);
       }
+      input {
+        border: 2px solid var(--color__accent);
+        font-family: var(--website-typography__font-family-headlines);
+        font-size: 1rem;
+      }
     }
-    .asd20-multiselect-input span {
-      padding-left: 1rem;
+    .asd20-multiselect-input {
+      line-height: 1;
+      .multiselect__placeholder {
+        padding-left: space(0.5);
+        font-size: 1rem;
+      }
     }
     .asd20-card__content {
       padding: space(1) space(1);
@@ -586,8 +599,16 @@ export default {
       display: flex;
       flex-basis: 100%;
       justify-content: space-between;
+      .asd20-search-field {
+        margin: space(0.5) space(0.5);
+        flex-basis: 50%;
+        .asd20-icon {
+          margin-left: 0;
+        }
+      }
       .asd20-multiselect-input {
         margin-bottom: 0;
+        flex-basis: 50%;
       }
     }
     .article-pagination {
@@ -596,12 +617,6 @@ export default {
     .article-list {
       flex-basis: 50%;
       margin: space(0) space(0) space(1) space(3);
-      .asd20-search-field {
-        border: none;
-        .asd20-icon {
-          margin-left: 0;
-        }
-      }
     }
     .asd20-card {
       margin-bottom: space(1);