fix(textarea): change style to be like osds-input

ovh · Feb 15, 2024 · 8bdd3a6 · 8bdd3a6
1 parent cab347f
commit 8bdd3a6
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 5 deletions.
diff --git a/packages/common/theming/size/ods-theming-size.textarea.scss b/packages/common/theming/size/ods-theming-size.textarea.scss
@@ -4,13 +4,13 @@
     @return (
       padding: var(--ods-size-textarea-#{$size-name}-padding),
       border-radius: var(--ods-size-textarea-#{$size-name}-border-radius),
+      border-width: var(--ods-size-textarea-#{$size-name}-border-width),
     );
   }
-  
+
   /// @access private
   @function ods-get-textarea-component-size-definition() {
     @return (
       md: ods-get-textarea-size-properties(md),
     );
   }
-
diff --git a/...ages/components/src/textarea/src/components/osds-textarea/styles/osds-textarea.color.scss b/...ages/components/src/textarea/src/components/osds-textarea/styles/osds-textarea.color.scss
@@ -13,7 +13,8 @@
         color: map_get($colors, color);
 
         &::placeholder {
-          color: map_get($colors, color);
+          opacity: 1;
+          color: ods-get-color-variable($intent-name: text, $hue: '500');
         }
 
         &:active,

diff --git a/packages/components/src/textarea/src/components/osds-textarea/styles/osds-textarea.size.scss b/packages/components/src/textarea/src/components/osds-textarea/styles/osds-textarea.size.scss
@@ -9,6 +9,7 @@
 
   :host {
     @include osds-textarea-on-main-element {
+      border-width: ods-get-size-property($size-properties, border-width);
       border-radius: ods-get-size-property($size-properties, border-radius);
       padding: ods-get-size-property($size-properties, padding);
     }

diff --git a/...components/src/textarea/src/components/osds-textarea/styles/osds-textarea.typography.scss b/...components/src/textarea/src/components/osds-textarea/styles/osds-textarea.typography.scss
@@ -17,6 +17,13 @@
   }
 
   :host textarea::placeholder {
-    font-style: italic;
+    $typography-properties: ods-get-typography-properties(body, '300');
+
+    line-height: ods-get-typography-property($typography-properties, line-height);
+    letter-spacing: ods-get-typography-property($typography-properties, letter-spacing);
+    font-family: ods-get-typography-property($typography-properties, font-family);
+    font-size: ods-get-typography-property($typography-properties, font-size);
+    font-weight: ods-get-typography-property($typography-properties, font-weight);
+    font-style: ods-get-typography-property($typography-properties, font-style);
   }
 }
diff --git a/packages/themes/blue-jeans/src/index.scss b/packages/themes/blue-jeans/src/index.scss
@@ -442,8 +442,9 @@
         ),
         $textarea: (
           md: (
+            border-width: var(--ods-size-inset-01),
+            border-radius: var(--ods-size-border-radius-01),
             padding: var(--ods-size-inset-04),
-            border-radius: var(--ods-size-03),
           ),
         ),
         $tile: (