From cd93e174941f9ef98c2d985344cb2006fdb71bc7 Mon Sep 17 00:00:00 2001
From: Tobias Klika <cee@live.at>
Date: Thu, 21 Sep 2017 13:15:58 +0200
Subject: [PATCH] improve fieldset list layout and spacing

---
 app/less/archetype.less | 34 +++++++++++++++++++++++-----------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/app/less/archetype.less b/app/less/archetype.less
index 190b47f..f6303e1 100644
--- a/app/less/archetype.less
+++ b/app/less/archetype.less
@@ -35,7 +35,7 @@
 
     .fieldsetIcon {
         float: left;
-        padding: 0 4px 0 0;
+        padding: 0 10px 0 0;
         color: #333;
         vertical-align: text-bottom;
     }
@@ -54,7 +54,6 @@
     fieldset {
         border-bottom: 1px dashed #dddddd;
         padding: 0;
-        margin-bottom: 5px;
         clear: both;
         display: inline-block;
         width: 100%;
@@ -93,10 +92,9 @@
         .archetypeFieldsetLabel {
             position: relative;
             width: 100%;
-            min-height: 42px;
 
             .label-sub {
-                padding: 8px 0 8px 0;
+                padding: 18px 0;
                 display: inline-block;
                 min-height: 20px; /* this makes the header clickable when there's no icon and no text */
                 &.module-label {
@@ -106,9 +104,9 @@
                     cursor: pointer;
     
                     label  {
-                        span {
-                            text-decoration: underline;
-                        }
+                        // span {
+                        //     text-decoration: underline;
+                        // }
                         &:hover {
                             cursor: pointer;
                         }
@@ -129,7 +127,7 @@
             }
 
             span {
-                font-weight: bold;
+                // font-weight: bold;
 
                 &.menu-label { font-weight: normal; }
             }
@@ -165,12 +163,22 @@
                 float: none;
                 position: absolute;
                 right: 15px;
-                top: 0;
+                top: 50%;
+                margin-top: -15px;
+                padding: 0;
 
                 .icon {
-                    color: #ddd;
-                    padding: 2px;
+                    display: inline-block;
+                    height: 28px;
+                    width: 28px;
+                    line-height: 28px;
+                    border-radius: 14px;
+                    border: 1px solid #b6b6b6;
+                    color: #5f5f5f;
+                    background: white;
                     font-size: 16px;
+                    text-align: center;
+                    margin-left: 4px;
                     &:hover {
                         color: #333;
                     }
@@ -216,6 +224,7 @@
             padding: 12px 0 0 20px;
             background-color: #fff;
             border-radius: 0 0 0 5px;
+            line-height: 20px;
 
             form {
                 margin-left:20px;
@@ -275,6 +284,9 @@
         list-style: none;
         margin-left: 0;
     }
+    li {
+        line-height: 0;
+    }
 
     .show-validation.ng-invalid .control-group.error .control-label {
         span {