superdesk-ui-framework 3.0.1-beta.28 → 3.0.1-beta.30

package/app/styles/_big-icon-font.scss

@@ -40,7 +40,7 @@ $icon-color: $grayDark !default;
 [class^="big-icon--"],
 [class*=" big-icon--"] {
     @include big-icon-base;
-    color: $icon-color;
+    color: var(--color-icon-default);
     /* Better Font Rendering =========== */
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;

package/app/styles/_labels.scss

@@ -40,7 +40,6 @@ $font-size__label--large: 1.2rem;
     letter-spacing: 0.125em;
     font-size: $font-size__label--default;
     white-space: nowrap;
-    cursor: default;
     border: 1px solid transparent;
     font-weight: 500;
     &--large {

package/app/styles/_simple-list.scss

@@ -16,9 +16,6 @@ $simple-list-border-color: $neutral-border-color;
         [class^="icon-"], [class*=" icon-"] {
             flex-grow: 0;
             flex-shrink: 0;
-            //margin-inline-end: 1rem;
-            color: var(--color-icon-default) !important;
-            opacity: .75;
         }
         &--stacked {
             display: flex;

package/app/styles/components/_sd-media-carousel.scss

@@ -290,8 +290,10 @@ $background-active: scale-color($background, $alpha: 100%))
     font-weight: 300;
     line-height: 140%;
     border: 1px solid transparent;
-    transition: all ease-in-out 0.2s; 
-    &[contenteditable="true"] {
+    transition: all ease-in-out 0.2s;
+    background-color: transparent; 
+    &[contenteditable="true"],
+    &textarea:not(disabled) {
         &:hover {
             border-color: var(--sd-colour-interactive--alpha-60);
         }
@@ -312,6 +314,39 @@ $background-active: scale-color($background, $alpha: 100%))
     }
     
 }
+textarea.sd-media-carousel__media-caption, 
+textarea.sd-media-carousel__media-title {
+    color: inherit;
+    position: relative;
+    padding: 1.2rem;
+    width: 100%;
+    font-size: 1.4rem;
+    text-align: start;
+    font-weight: 300;
+    line-height: 140%;
+    border: 1px solid transparent;
+    transition: all ease-in-out 0.2s;
+    background-color: transparent; 
+    &:not(disabled) {
+        &:hover {
+            border-color: var(--sd-colour-interactive--alpha-60);
+        }
+        &:focus {
+            border-color: $sd-colour-interactive;
+            box-shadow: inset 0 0 0 4px var(--sd-colour-interactive--alpha-30);
+        }
+        &:empty {
+            &:before {
+                position: absolute;
+                content: attr(sd-placeholder) " ";
+                opacity: 0.55;
+                color: inherit;
+                font-weight: 300;
+                cursor: text;
+            }
+        }  
+    }
+}
 .sd-media-carousel__media-caption {
     min-height: 4rem;
 }