Placeholder improved.

src/Squidex/app/features/assets/pages/assets-page.component.scss

@@ -14,13 +14,15 @@
     &.active {
         font-weight: bold;
     }
-    
+
     &.active,
     &:hover {
         background: $color-background;
     }
 }
 
-a.tag {
+a {
-    cursor: pointer !important;
+    &.tag {
+        cursor: pointer !important;
+    }
 }

src/Squidex/app/features/content/shared/array-editor.component.scss

@@ -8,7 +8,7 @@
         position: relative;
         margin-bottom: 1rem;
     }
-    
+
     &-item {
         & {
             background: $panel-light-background;

src/Squidex/app/framework/angular/forms/tag-editor.component.scss

@@ -1,6 +1,8 @@
 @import '_mixins';
 @import '_vars';
 
+$focus-color: #b3d3ff;
+
 .form-control {
     & {
         cursor: text;
@@ -9,10 +11,10 @@
     &.disabled {
         cursor: inherit;
     }
-    
+
     &.focus {
-        @include box-shadow-raw(0 0 0 0.2rem rgba(51, 137, 255, 0.25));
+        @include box-shadow-raw(0 0 0 .2rem rgba(51, 137, 255, .25));
-        border-color: #b3d3ff;
+        border-color: $focus-color;
     }
 }
 
@@ -21,7 +23,7 @@
         padding: 0;
         border: 0;
         background: transparent;
-        min-width: 40px;
+        min-width: 40%;
         max-width: 100%;
     }
 
@@ -50,7 +52,7 @@
         border: 0;
         font-size: .8rem;
         font-weight: normal;
-        margin: 0px 2px 2px 0;
+        margin: 0 2px 2px 0;
     }
 
     &,

src/Squidex/app/framework/angular/forms/tag-editor.component.ts

@@ -101,7 +101,7 @@ export class TagEditorComponent implements ControlValueAccessor, OnDestroy, OnIn
     public class: string;
 
     @Input()
-    public placeholder = '+Tag';
+    public placeholder = 'Press comma (,) to add tag';
 
     @Input()
     public inputName = 'tag-editor';

src/Squidex/app/shared/components/asset.component.html

@@ -73,7 +73,7 @@
                     [acceptEnter]="true"
                     [allowDuplicates]="false"
                     [undefinedWhenEmpty]="false" 
-                    [formControl]="tagInput" class="blank">
+                    [formControl]="tagInput" class="blank" placeholder="+Tag">
                 </sqx-tag-editor>
             </div>
             <div class="file-info">

src/Squidex/app/shared/components/asset.component.scss

@@ -31,10 +31,6 @@
     color: $color-dark-foreground;
 }
 
-@mixin asset-link {
-    
-}
-
 .drop-overlay {
     & {
         @include overlay;
@@ -172,11 +168,11 @@
                 cursor: pointer;
                 color: darken($color-dark-foreground, 10%);
             }
-        
+
             &:hover {
                 color: $color-dark-foreground;
             }
-        
+
             &:focus,
             &:hover {
                 text-decoration: none;

src/Squidex/app/theme/_bootstrap.scss

@@ -537,8 +537,8 @@ a {
             }
         }
     }
-}
 
-.table tbody + tbody {
+    tbody + tbody {
-    border: 0;
+        border: 0;
+    }
 }

src/Squidex/app/theme/_forms.scss

@@ -197,20 +197,22 @@
         outline: none;
     }
 
-    &.ng-invalid.ng-dirty {
+    &.ng-invalid {
-        & {
+        &.ng-dirty {
-            @include box-shadow-none;
+            & {
-            background: transparent;
+                @include box-shadow-none;
-            border-color: transparent;
+                background: transparent;
-            border-bottom-color: $color-theme-error;
+                border-color: transparent;
-            outline: none;
+                border-bottom-color: $color-theme-error;
-        }
+                outline: none;
+            }
 
-        &:hover,
+            &:hover,
-        &:focus {
+            &:focus {
-            @include box-shadow-none;
+                @include box-shadow-none;
-            border-color: transparent;
+                border-color: transparent;
-            border-bottom-color: $color-theme-error-dark;
+                border-bottom-color: $color-theme-error-dark;
+            }
         }
     }
 }