tab UI

zero.Web.UI/App/components/forms/property.vue

@@ -68,11 +68,11 @@
   .ui-property + .ui-split,
   .ui-split + .ui-property,
   .ui-property + .ui-property
-  {
+  { 
     margin-top: 50px;
-    //padding-top: 30px;
-    //margin-top: 30px;
-    //border-top: 1px solid var(--color-line);
+    /*padding-top: 30px;
+    margin-top: 30px;
+    border-top: 1px dashed var(--color-line-onbg);*/
   }
 
   .ui-property.is-vertical

zero.Web.UI/App/components/tabs/tabs.vue

@@ -116,7 +116,7 @@
   {
     display: inline-flex;
     align-items: center;
-    height: 54px;
+    height: 58px;
     //overflow: hidden;
     padding: 0 var(--padding);
     font-size: var(--font-size);
@@ -156,7 +156,7 @@
         background: var(--color-box-light);
       }
 
-      /*&:before
+      &:before
       {
         content: '';
         position: absolute;
@@ -168,7 +168,7 @@
         border-top-right-radius: 3px;
         background: var(--color-primary);
         display: inline-block;
-      }*/
+      }
     }
 
     &.has-errors

zero.Web.UI/App/navigation.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-nav theme-dark" :class="{'is-compact': compact }">
+  <div class="app-nav theme-light" :class="{'is-compact': compact }">
 
     <h1 class="app-nav-headline">
       <img src="/Assets/zero-2-light.png" class="show-light" v-localize:alt="'@zero.name'" />

zero.Web.UI/Sass/Canvas/_navigation.scss

@@ -9,6 +9,7 @@
   display: grid;  
   grid-template-rows: auto auto 1fr auto;  
   box-shadow: var(--shadow-short);
+  margin-right: 2px;
 
   .theme-rounded &
   {
@@ -106,6 +107,11 @@ a.app-nav-item, button.app-nav-item
       transform: rotate(180deg);
     }
 
+    .app-nav-item-text
+    {
+      color: var(--color-primary);
+    }
+
     &:before
     {
       content: '';
@@ -120,6 +126,11 @@ a.app-nav-item, button.app-nav-item
   }
 }
 
+.app-nav-item-text
+{
+  transition: color 0.2s ease;
+}
+
 .app-nav-item-icon
 {
   font-size: 18px;
@@ -147,7 +158,7 @@ a.app-nav-child
   align-items: center;
   font-size: var(--font-size);
   padding: 0 var(--padding) 0 calc(var(--padding) + 36px);
-  height: 34px;
+  height: 30px;
   color: var(--color-text-dim);
 
   &:hover, &.is-active