ADS: DaxTextInput specs (#2622)

Task/Issue URL: https://app.asana.com/0/1202857801505092/1203501746286791 Description Update TextInput to latest specs
duckduckgo · Dec 19, 2022 · 8e2790f · 8e2790f
1 parent cbe0da9
commit 8e2790f
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 4 deletions.
diff --git a/common-ui/src/main/res/color/text_input_box_color_selector.xml b/common-ui/src/main/res/color/text_input_box_color_selector.xml
@@ -16,7 +16,7 @@
   -->
 
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="?attr/daxColorAccentBlue" android:state_hovered="true" />
-    <item android:color="?attr/daxColorAccentBlue" android:state_focused="true" />
-    <item android:color="?attr/daxColorPrimaryText" />
+    <item android:color="?attr/daxColorTextInputFocusedOutline" android:state_hovered="true" />
+    <item android:color="?attr/daxColorTextInputFocusedOutline" android:state_focused="true" />
+    <item android:color="?attr/daxColorTextInputEnabledOutline" />
 </selector>
diff --git a/common-ui/src/main/res/layout/view_dax_text_input.xml b/common-ui/src/main/res/layout/view_dax_text_input.xml
@@ -31,7 +31,7 @@
 
         <com.google.android.material.textfield.TextInputEditText
             android:id="@+id/internal_edit_text"
-            style="@style/Typography.DuckDuckGo.Body1"
+            style="@style/Widget.DuckDuckGo.TextInputText"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:textColor="?attr/daxColorPrimaryText" />

diff --git a/common-ui/src/main/res/values/design-system-colors.xml b/common-ui/src/main/res/values/design-system-colors.xml
@@ -84,6 +84,9 @@
     <attr name="daxColorSliderTrackInactive" format="color"/>
     <attr name="daxColorSliderActive" format="color"/>
 
+    <attr name="daxColorTextInputFocusedOutline" format="color"/>
+    <attr name="daxColorTextInputEnabledOutline" format="color"/>
+
     <!-- Design System Brand Colors -->
     <color name="disabledColor">#59000000</color>
 
@@ -133,6 +136,7 @@
     <color name="black84">#D6000000</color>
     <color name="black60">#99000000</color>
     <color name="black36">#5C000000</color>
+    <color name="black30">#4D000000</color>
     <color name="black35">#35000000</color>
     <color name="black18">#2E000000</color>
     <color name="black12">#1F000000</color>
@@ -142,6 +146,7 @@
     <color name="white84">#D6FFFFFF</color>
     <color name="white60">#99FFFFFF</color>
     <color name="white36">#5CFFFFFF</color>
+    <color name="white30">#4DFFFFFF</color>
     <color name="white18">#2EFFFFFF</color>
     <color name="white12">#1FFFFFFF</color>
     <color name="white9">#17FFFFFF</color>

diff --git a/common-ui/src/main/res/values/design-system-theming.xml b/common-ui/src/main/res/values/design-system-theming.xml
@@ -286,6 +286,10 @@
         <item name="daxColorSliderTrackInactive">@color/gray40_50</item>
         <item name="daxColorSliderActive">?attr/daxColorAccentBlue</item>
 
+        <!-- Text Input -->
+        <item name="daxColorTextInputFocusedOutline">?attr/daxColorAccentBlue</item>
+        <item name="daxColorTextInputEnabledOutline">@color/white30</item>
+
     </style>
 
     <style name="Theme.DuckDuckGo.Light" parent="Theme.DuckDuckGo">
@@ -427,6 +431,10 @@
         <item name="daxColorSliderTrackInactive">@color/gray60_50</item>
         <item name="daxColorSliderActive">?attr/daxColorAccentBlue</item>
 
+        <!-- Text Input -->
+        <item name="daxColorTextInputFocusedOutline">?attr/daxColorAccentBlue</item>
+        <item name="daxColorTextInputEnabledOutline">@color/black30</item>
+
     </style>
 
     <style name="Theme.DuckDuckGo.Survey" parent="Theme.DuckDuckGo.Light">

diff --git a/common-ui/src/main/res/values/widgets.xml b/common-ui/src/main/res/values/widgets.xml
@@ -345,6 +345,12 @@
         <item name="android:theme">@style/Widget.DuckDuckGo.TextInputCursor</item>
     </style>
 
+    <style name="Widget.DuckDuckGo.TextInputText">
+        <item name="android:textAppearance">@style/Typography.DuckDuckGo.Body1</item>
+        <item name="android:textColor">?attr/daxColorPrimaryText</item>
+    </style>
+
+
     <!-- The color of the cursor comes from the theme, not the widget itself -->
     <style name="Widget.DuckDuckGo.TextInputCursor">
         <item name="android:colorControlActivated">?attr/daxColorAccentBlue</item>