mediacube-ui 0.1.244 → 0.1.246

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.246](https://github.com/MediaCubeCo/mcui/compare/v0.1.245...v0.1.246) (2024-04-01)
+
+### [0.1.245](https://github.com/MediaCubeCo/mcui/compare/v0.1.244...v0.1.245) (2024-03-28)
+
 ### [0.1.244](https://github.com/MediaCubeCo/mcui/compare/v0.1.243...v0.1.244) (2024-03-27)
 
 ### [0.1.243](https://github.com/MediaCubeCo/mcui/compare/v0.1.242...v0.1.243) (2024-03-27)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mediacube-ui",
-  "version": "0.1.244",
+  "version": "0.1.246",
   "description": "Design system for Mediacube services",
   "author": "Mediacube",
   "private": false,

package/src/elements/McField/McFieldSelect/McFieldSelect.vue

@@ -394,7 +394,7 @@ export default {
                 'mc-field-select--error': this.errorText,
                 'mc-field-select--disabled': this.disabled,
                 [`mc-field-select--bg-${this.backgroundColor}`]: this.backgroundColor,
-                'mc-field-select--is-empty-options-list': this.isEmptyOptionsList,
+                'mc-field-select--is-empty-options-list': this.isEmptyOptionsList || this.loading,
                 'mc-field-select--with-preview': this.optionWithPreview,
                 'mc-field-select--max-height': this.maxHeight,
                 'mc-field-select--rtl': this.rtl,

package/src/patterns/McModal/McModal.vue

@@ -434,7 +434,7 @@ export default {
     &__header {
         flex-shrink: 0;
         transition: $duration-s all;
-        padding: var(--mc-modal-padding) $space-200 $space-250;
+        padding: var(--mc-modal-padding) $space-200 $space-350;
         border-color: $border-color;
         @media #{$media-query-s} {
             padding: $space-350;
@@ -460,7 +460,7 @@ export default {
     }
 
     &__body {
-        padding: $space-50 $space-200;
+        padding: $space-50 $space-200 $space-200;
         flex-grow: 1;
         min-height: 0;
         overflow-x: hidden;
@@ -468,7 +468,7 @@ export default {
             min-height: 100%;
         }
         @media #{$media-query-s} {
-            padding: $space-50 $space-400;
+            padding: $space-50 $space-400 $space-200;
             overflow: visible;
         }
     }
@@ -535,7 +535,7 @@ export default {
         @media #{$media-query-s} {
             #{$block-name} {
                 &__control {
-                    padding-bottom: var(--mc-modal-padding-small) !important;
+                    padding-block: var(--mc-modal-padding-small) !important;
                     .mc-button {
                         height: var(--mc-modal-button-height-small);
                     }
@@ -549,6 +549,9 @@ export default {
                         align-items: center;
                     }
                 }
+                &__body {
+                    padding-bottom: $space-50;
+                }
                 &__btn {
                     &-back,
                     &-close {
@@ -587,10 +590,10 @@ export default {
         flex-shrink: 0;
         display: flex;
         justify-content: center;
-        padding: $space-250 $space-200 $space-400;
+        padding: $space-200 $space-200 $space-400;
         transition: $duration-s all;
         @media #{$media-query-s} {
-            padding: $space-150 $space-300 $space-300;
+            padding: $space-200 $space-300 $space-400;
         }
         .mc-button {
             width: 100%;
@@ -611,6 +614,13 @@ export default {
             border-color: $border-color;
         }
     }
+    &:has(&__control:empty) {
+        #{$block-name} {
+            &__body {
+                padding-bottom: $space-50;
+            }
+        }
+    }
     &--variation {
         &-info {
             #{$block-name} {
@@ -637,10 +647,17 @@ export default {
                     }
                 }
                 &__body {
+                    padding-bottom: $space-50;
                     @media #{$media-query-s} {
                         padding-inline: $space-300;
                     }
                 }
+                &__control {
+                    padding-top: $space-250;
+                    @media #{$media-query-s} {
+                        padding-top: $space-150;
+                    }
+                }
             }
         }
     }