fix(component/result): grid-column on is-empty

nyancodeid · Aug 21, 2021 · 4665454 · 4665454
1 parent c25e41c
commit 4665454
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/src/components/ColorPicker/ColorResult.vue b/src/components/ColorPicker/ColorResult.vue
@@ -84,14 +84,16 @@ export default {
     column-gap: 16px;
     row-gap: 16px;
 
+    padding: 8px 0;
     justify-items: center;
 
     .video-color--result-empty {
+      grid-column: 2 / 5;
+
       text-align: center;
       width: 100%;
       border-radius: 0.5em;
       padding: 16px;
-      margin: 8px 8px 16px;
       color: var(--darker-color);
       font-size: 14px;
     }
@@ -125,6 +127,10 @@ export default {
     .video-color--result-wrapper {
       grid-template-columns: auto auto auto auto;
 
+      .video-color--result-empty {
+        grid-column: 2 / 4;
+      }
+
       .video-color--result-item {
         .result-item--text {
           font-size: 12px;