Browse Source

improve kit extra info display

axolotle 2 years ago
parent
commit
991526e701
1 changed files with 9 additions and 15 deletions
  1. 9 15
      src/components/nodes/NodeViewBody.vue

+ 9 - 15
src/components/nodes/NodeViewBody.vue

@@ -176,12 +176,10 @@ export default {
     white-space: pre-wrap;
   }
 
+  // Kit atelier
   &-wrapper ul:first-child {
     background-color: $black;
     color: $white;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
     font-family: $font-family-base;
     font-size: 1rem;
     list-style: none;
@@ -189,18 +187,8 @@ export default {
     margin-top: 1rem;
 
     li {
-      flex-basis: 100%;
-
-      @include media-breakpoint-up(sm) {
-        flex-basis: 50%;
-      }
-
-      @include media-breakpoint-up(xl) {
-        flex-basis: 25%;
-      }
-
-      strong {
-        display: block;
+      &:not(:last-of-type) {
+        margin-bottom: .25rem;
       }
 
       p {
@@ -259,6 +247,12 @@ export default {
     @include line-clamp(4, 1.5em);
   }
 
+  // To avoid weird ul rendering of kits extra infos
+  .node-view-kit #{&}-card#{&}-prod &-wrapper {
+    display: block;
+    text-overflow: unset;
+  }
+
   .footnote-link {
     display: inline-block;
     text-align: center;