UX Changes: Dialer actionbar, tabs and searchbox.

See CL 423036 for the searchbox text changes.

Bug: 13167901
Change-Id: I6806cb27c19f7f0ca55394d70134f0c30c93446b
(cherry picked from commit a8ff9750831fcc276354ed80fad3b54316489383)

36 files changed, 286 insertions, 95 deletions

diff --git a/res/drawable-hdpi/divider.9.png b/res/drawable-hdpi/divider.9.png
new file mode 100644
index 000000000..88e5d91af
--- /dev/null
+++ b/res/drawable-hdpi/divider.9.png
diff --git a/res/drawable-hdpi/ic_back_arrow.png b/res/drawable-hdpi/ic_back_arrow.png
new file mode 100644
index 000000000..aad4f3659
--- /dev/null
+++ b/res/drawable-hdpi/ic_back_arrow.png
diff --git a/res/drawable-hdpi/ic_menu_dialpad_lt.png b/res/drawable-hdpi/ic_menu_dialpad_lt.png
new file mode 100644
index 000000000..bd0fe5d1d
--- /dev/null
+++ b/res/drawable-hdpi/ic_menu_dialpad_lt.png
diff --git a/res/drawable-hdpi/ic_voice_search.png b/res/drawable-hdpi/ic_voice_search.png
index 6caf4a43d..9631d3e3d 100644
--- a/res/drawable-hdpi/ic_voice_search.png
+++ b/res/drawable-hdpi/ic_voice_search.png
diff --git a/res/drawable-hdpi/search_bg.9.png b/res/drawable-hdpi/search_bg.9.png
new file mode 100644
index 000000000..81c47be3b
--- /dev/null
+++ b/res/drawable-hdpi/search_bg.9.png
diff --git a/res/drawable-mdpi/divider.9.png b/res/drawable-mdpi/divider.9.png
new file mode 100644
index 000000000..88e5d91af
--- /dev/null
+++ b/res/drawable-mdpi/divider.9.png
diff --git a/res/drawable-mdpi/ic_back_arrow.png b/res/drawable-mdpi/ic_back_arrow.png
new file mode 100644
index 000000000..56eb887dd
--- /dev/null
+++ b/res/drawable-mdpi/ic_back_arrow.png
diff --git a/res/drawable-mdpi/ic_menu_dialpad_lt.png b/res/drawable-mdpi/ic_menu_dialpad_lt.png
new file mode 100644
index 000000000..14674ed05
--- /dev/null
+++ b/res/drawable-mdpi/ic_menu_dialpad_lt.png
diff --git a/res/drawable-mdpi/ic_voice_search.png b/res/drawable-mdpi/ic_voice_search.png
index e290f9277..af58538d9 100644
--- a/res/drawable-mdpi/ic_voice_search.png
+++ b/res/drawable-mdpi/ic_voice_search.png
diff --git a/res/drawable-mdpi/search_bg.9.png b/res/drawable-mdpi/search_bg.9.png
new file mode 100644
index 000000000..879aeaabd
--- /dev/null
+++ b/res/drawable-mdpi/search_bg.9.png
diff --git a/res/drawable-xhdpi/divider.9.png b/res/drawable-xhdpi/divider.9.png
new file mode 100644
index 000000000..88e5d91af
--- /dev/null
+++ b/res/drawable-xhdpi/divider.9.png
diff --git a/res/drawable-xhdpi/ic_back_arrow.png b/res/drawable-xhdpi/ic_back_arrow.png
new file mode 100644
index 000000000..9d46e3d2c
--- /dev/null
+++ b/res/drawable-xhdpi/ic_back_arrow.png
diff --git a/res/drawable-xhdpi/ic_menu_dialpad_lt.png b/res/drawable-xhdpi/ic_menu_dialpad_lt.png
new file mode 100644
index 000000000..345cf1a0b
--- /dev/null
+++ b/res/drawable-xhdpi/ic_menu_dialpad_lt.png
diff --git a/res/drawable-xhdpi/ic_voice_search.png b/res/drawable-xhdpi/ic_voice_search.png
index 614758188..6e5d8115b 100644
--- a/res/drawable-xhdpi/ic_voice_search.png
+++ b/res/drawable-xhdpi/ic_voice_search.png
diff --git a/res/drawable-xhdpi/search_bg.9.png b/res/drawable-xhdpi/search_bg.9.png
new file mode 100644
index 000000000..9d2d9ae5b
--- /dev/null
+++ b/res/drawable-xhdpi/search_bg.9.png
diff --git a/res/drawable-xxhdpi/divider.9.png b/res/drawable-xxhdpi/divider.9.png
new file mode 100644
index 000000000..88e5d91af
--- /dev/null
+++ b/res/drawable-xxhdpi/divider.9.png
diff --git a/res/drawable-xxhdpi/ic_back_arrow.png b/res/drawable-xxhdpi/ic_back_arrow.png
new file mode 100644
index 000000000..66b6e351d
--- /dev/null
+++ b/res/drawable-xxhdpi/ic_back_arrow.png
diff --git a/res/drawable-xxhdpi/ic_menu_dialpad_lt.png b/res/drawable-xxhdpi/ic_menu_dialpad_lt.png
new file mode 100644
index 000000000..45c1ab203
--- /dev/null
+++ b/res/drawable-xxhdpi/ic_menu_dialpad_lt.png
diff --git a/res/drawable-xxhdpi/ic_voice_search.png b/res/drawable-xxhdpi/ic_voice_search.png
index 4c17d2b7f..4e72f6947 100644
--- a/res/drawable-xxhdpi/ic_voice_search.png
+++ b/res/drawable-xxhdpi/ic_voice_search.png
diff --git a/res/drawable-xxhdpi/search_bg.9.png b/res/drawable-xxhdpi/search_bg.9.png
new file mode 100644
index 000000000..2f4f4b688
--- /dev/null
+++ b/res/drawable-xxhdpi/search_bg.9.png
diff --git a/res/drawable/action_bar_tab.xml b/res/drawable/action_bar_tab.xml
index 35df0538f..3f31dbae1 100644
--- a/res/drawable/action_bar_tab.xml
+++ b/res/drawable/action_bar_tab.xml
@@ -16,11 +16,10 @@
 -->
 
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
-
     <item android:drawable="@drawable/tab_selected_pressed" android:state_pressed="true" android:state_selected="true"/>
     <item android:drawable="@drawable/tab_selected_focused" android:state_focused="true" android:state_selected="true"/>
     <item android:drawable="@drawable/tab_selected" android:state_selected="true"/>
     <item android:drawable="@drawable/tab_unselected_pressed" android:state_pressed="true"/>
     <item android:drawable="@drawable/tab_unselected_focused" android:state_focused="true"/>
-
+    <item android:drawable="@drawable/tab_unselected" android:state_selected="false"/>
 </selector>
\ No newline at end of file
diff --git a/res/drawable/background_favorites_menu.xml b/res/drawable/background_favorites_menu.xml
index fc2669b10..60933fd5e 100644
--- a/res/drawable/background_favorites_menu.xml
+++ b/res/drawable/background_favorites_menu.xml
@@ -18,7 +18,7 @@
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_pressed="false">
         <shape android:shape="rectangle" >
-            <solid android:color="@color/background_dialer_list_items" />
+            <solid android:color="@color/favorites_menu_background_color" />
         </shape>
     </item>
     <item android:state_pressed="true">
diff --git a/res/drawable/call_history_actionbar_background.xml b/res/drawable/call_history_actionbar_background.xml
index f781f27b0..eabceac2b 100644
--- a/res/drawable/call_history_actionbar_background.xml
+++ b/res/drawable/call_history_actionbar_background.xml
@@ -16,10 +16,10 @@
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
     <item>
         <shape android:shape="rectangle">
-            <solid android:color="#c6c6c6" />
+            <solid android:color="@color/actionbar_underline" />
         </shape>
     </item>
-    <item android:bottom="1dip">
+    <item android:bottom="2dp">
         <shape android:shape="rectangle">
             <solid android:color="@color/actionbar_background_color" />
         </shape>
diff --git a/res/drawable/tab_selected.xml b/res/drawable/tab_selected.xml
index 25d76fc27..821f0473f 100644
--- a/res/drawable/tab_selected.xml
+++ b/res/drawable/tab_selected.xml
@@ -14,18 +14,26 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
-
+    <!-- Tab underline -->
     <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@color/tab_underline_selected_color"/>
+        </shape>
+    </item>
+    <!-- Tab selection indicator -->
+    <item android:bottom="@dimen/tab_underline_height">
         <shape android:shape="rectangle" >
-            <solid android:color="#7d7d7d" />
+            <solid android:color="@color/tab_selected_color" />
         </shape>
     </item>
-    <item android:bottom="6dp">
+    <!-- Tab background -->
+    <item android:bottom="@dimen/tab_selection_height">
         <shape android:shape="rectangle" >
-            <solid android:color="@color/actionbar_background_color" />
+            <gradient
+                android:startColor="@color/tab_background_gradient_start_color"
+                android:endColor="@color/tab_background_gradient_end_color"
+                android:angle="270" />
         </shape>
     </item>
-
 </layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_selected_focused.xml b/res/drawable/tab_selected_focused.xml
index 8efd7b30e..7c0d35f83 100644
--- a/res/drawable/tab_selected_focused.xml
+++ b/res/drawable/tab_selected_focused.xml
@@ -14,32 +14,33 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
-
+    <!-- Tab underline -->
     <item>
-        <shape android:shape="rectangle" >
-            <solid android:color="#7d7d7d" />
+        <shape android:shape="rectangle">
+            <solid android:color="@color/tab_underline_selected_color"/>
         </shape>
     </item>
-    <item android:bottom="6dp">
+    <!-- Tab selection indicator -->
+    <item android:bottom="@dimen/tab_underline_height">
         <shape android:shape="rectangle" >
-            <solid android:color="@color/actionbar_background_color" />
+            <solid android:color="@color/tab_selected_color" />
         </shape>
     </item>
-    <item>
+    <!-- Tab background -->
+    <item android:bottom="@dimen/tab_selection_height">
         <shape android:shape="rectangle" >
-            <solid android:color="#27ffffff" />
+            <gradient
+                android:startColor="@color/tab_background_gradient_start_color"
+                android:endColor="@color/tab_background_gradient_end_color"
+                android:angle="270" />
         </shape>
     </item>
     <item>
         <shape android:shape="rectangle" >
-            <solid android:color="#00000000" />
-
             <stroke
-                android:width="2dp"
-                android:color="#27ffffff" />
+                android:width="4dp"
+                android:color="#44ff0000" />
         </shape>
     </item>
-
 </layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_selected_pressed.xml b/res/drawable/tab_selected_pressed.xml
index a38344e04..32efb69c4 100644
--- a/res/drawable/tab_selected_pressed.xml
+++ b/res/drawable/tab_selected_pressed.xml
@@ -14,23 +14,26 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
-
+    <!-- Tab underline -->
     <item>
-        <shape android:shape="rectangle" >
-            <solid android:color="#7d7d7d" />
+        <shape android:shape="rectangle">
+            <solid android:color="@color/tab_underline_selected_color"/>
         </shape>
     </item>
-    <item android:bottom="6dp">
+    <!-- Tab selection indicator -->
+    <item android:bottom="@dimen/tab_underline_height">
         <shape android:shape="rectangle" >
-            <solid android:color="@color/actionbar_background_color" />
+            <solid android:color="@color/tab_selected_color" />
         </shape>
     </item>
-    <item>
+    <!-- Tab background (in pressed state) -->
+    <item android:bottom="@dimen/tab_selection_height">
         <shape android:shape="rectangle" >
-            <solid android:color="#4dffffff" />
+            <gradient
+                android:startColor="@color/tab_background_gradient_start_pressed_color"
+                android:endColor="@color/tab_background_gradient_end_pressed_color"
+                android:angle="270" />
         </shape>
     </item>
-
 </layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_unselected.xml b/res/drawable/tab_unselected.xml
new file mode 100644
index 000000000..3eee4876e
--- /dev/null
+++ b/res/drawable/tab_unselected.xml
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  ~ Copyright (C) 2014 The Android Open Source Project
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~      http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License
+  -->
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
+    <!-- Tab underline -->
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@color/tab_underline_color"/>
+        </shape>
+    </item>
+    <!-- Tab background -->
+    <item android:bottom="@dimen/tab_underline_height">
+        <shape android:shape="rectangle" >
+            <gradient
+                android:startColor="@color/tab_background_gradient_start_color"
+                android:endColor="@color/tab_background_gradient_end_color"
+                android:angle="270" />
+        </shape>
+    </item>
+</layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_unselected_focused.xml b/res/drawable/tab_unselected_focused.xml
index 2aceb63ef..c85473959 100644
--- a/res/drawable/tab_unselected_focused.xml
+++ b/res/drawable/tab_unselected_focused.xml
@@ -14,22 +14,27 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-
-<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
-
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <!-- Tab underline -->
     <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@color/tab_underline_color"/>
+        </shape>
+    </item>
+    <!-- Tab background -->
+    <item android:bottom="@dimen/tab_underline_height">
         <shape android:shape="rectangle" >
-            <solid android:color="#27ffffff" />
+            <gradient
+                android:startColor="@color/tab_background_gradient_start_color"
+                android:endColor="@color/tab_background_gradient_end_color"
+                android:angle="270" />
         </shape>
     </item>
     <item>
         <shape android:shape="rectangle" >
-            <solid android:color="#00000000" />
-
             <stroke
-                android:width="2dp"
-                android:color="#27ffffff" />
+                android:width="4dp"
+                android:color="#44ff0000" />
         </shape>
     </item>
-
 </layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_unselected_pressed.xml b/res/drawable/tab_unselected_pressed.xml
index 2362b6581..5d2af321a 100644
--- a/res/drawable/tab_unselected_pressed.xml
+++ b/res/drawable/tab_unselected_pressed.xml
@@ -14,13 +14,20 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
-
+    <!-- Tab underline -->
     <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@color/tab_underline_color"/>
+        </shape>
+    </item>
+    <!-- Tab background (in pressed state) -->
+    <item android:bottom="@dimen/tab_underline_height">
         <shape android:shape="rectangle" >
-            <solid android:color="#4dffffff" />
+            <gradient
+                android:startColor="@color/tab_background_gradient_start_pressed_color"
+                android:endColor="@color/tab_background_gradient_end_pressed_color"
+                android:angle="270" />
         </shape>
     </item>
-
 </layer-list>
\ No newline at end of file
diff --git a/res/layout/dialtacts_activity.xml b/res/layout/dialtacts_activity.xml
index 5a886e226..1a1a0b099 100644
--- a/res/layout/dialtacts_activity.xml
+++ b/res/layout/dialtacts_activity.xml
@@ -34,25 +34,32 @@
             >
             <LinearLayout
                 android:layout_width="match_parent"
-                android:layout_height="wrap_content"
+                android:layout_height="@dimen/search_box_height"
                 android:id="@+id/search_view_container"
                 android:orientation="horizontal"
-                android:paddingLeft="16dp"
-                android:paddingRight="23dp"
-                android:background="@color/searchbox_background_color"
+                android:layout_marginTop="@dimen/search_top_margin"
+                android:layout_marginBottom="@dimen/search_bottom_margin"
+                android:layout_marginLeft="@dimen/search_margin_horizontal"
+                android:layout_marginRight="@dimen/search_margin_horizontal"
+                android:paddingLeft="@dimen/search_box_left_padding"
+                android:paddingRight="@dimen/search_box_right_padding"
+                android:background="@drawable/search_bg"
                 android:gravity="center_vertical"
                 >
                 <EditText
                     android:id="@+id/search_view"
-                    android:layout_width="0dp"
-                    android:layout_height="56dp"
+                    android:layout_width="match_parent"
+                    android:layout_height="@dimen/search_box_icon_size"
                     android:layout_weight="1"
+                    android:layout_marginLeft="@dimen/search_box_text_left_margin"
                     android:textSize="@dimen/search_text_size"
+                    android:fontFamily="@string/search_font_family"
+                    android:textColor="@color/searchbox_text_color"
                     android:inputType="textFilter"/>
                 <ImageView
                     android:id="@+id/search_close_button"
-                    android:layout_height="40dp"
-                    android:layout_width="40dp"
+                    android:layout_height="@dimen/search_box_icon_size"
+                    android:layout_width="@dimen/search_box_icon_size"
                     android:padding="6dp"
                     android:src="@drawable/ic_close_dk"
                     android:clickable="true"
@@ -61,9 +68,9 @@
                     android:visibility="gone" />
                 <ImageView
                     android:id="@+id/voice_search_button"
-                    android:layout_height="40dp"
-                    android:layout_width="40dp"
-                    android:padding="3dp"
+                    android:layout_height="@dimen/search_box_icon_size"
+                    android:layout_width="@dimen/search_box_icon_size"
+                    android:padding="@dimen/search_box_icon_padding"
                     android:src="@drawable/ic_voice_search"
                     android:clickable="true"
                     android:contentDescription="@string/description_start_voice_search"
@@ -93,23 +100,38 @@
                 />
             </com.android.dialer.list.RemoveView>
         </FrameLayout>
-        <View
-            android:id="@+id/searchbox_divider"
-            android:layout_height="1dp"
-            android:layout_width="match_parent"
-            android:background="@color/background_dialer_light" />
-        <FrameLayout
-            android:layout_height="0dp"
-            android:layout_weight="1"
-            android:layout_width="match_parent"
-            android:id="@+id/dialtacts_frame"
-            android:clipChildren="false">
-        </FrameLayout>
-        <View
-            android:layout_height="2dp"
-            android:layout_width="match_parent"
-            android:background="#33999999"
-        />
+
+        <!-- Relative Layout is used to contain the main contacts grid and the thin translucent
+             horizontal divider line at the bottom of the contacts grid above the menu bar. -->
+        <RelativeLayout android:layout_width="match_parent"
+                        android:layout_height="0dp"
+                        android:layout_weight="1"
+                        android:clipChildren="false"
+            >
+            <!-- The main contacts grid -->
+            <FrameLayout
+                android:layout_height="match_parent"
+                android:layout_width="match_parent"
+                android:id="@+id/dialtacts_frame"
+                android:clipChildren="false"
+                android:layout_alignParentBottom="true"
+                android:layout_alignParentTop="true"
+                android:layout_alignParentLeft="true"
+                android:layout_alignParentRight="true"
+                >
+            </FrameLayout>
+            <!-- Thin translucent horizontal line at the bottom of the contacts grid. Floats above
+                 the contacts grid and has a translucent color. -->
+            <View
+                android:layout_height="2dp"
+                android:layout_width="match_parent"
+                android:background="@color/contacts_grid_bottom_border_color"
+                android:layout_alignParentBottom="true"
+                android:layout_alignParentLeft="true"
+                android:layout_alignParentRight="true"
+                />
+        </RelativeLayout>
+
         <FrameLayout
             android:layout_height="@dimen/fake_action_bar_height"
             android:layout_width="match_parent"
@@ -122,7 +144,7 @@
                 android:layout_gravity="bottom|start"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/action_menu_call_history_description"
-                android:src="@drawable/ic_menu_history_dk"/>
+                android:src="@drawable/ic_menu_history_lt"/>
             <ImageButton
                 android:id="@+id/dialpad_button"
                 android:layout_width="@dimen/fake_menu_button_min_width"
@@ -130,13 +152,13 @@
                 android:layout_gravity="bottom|center"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/action_menu_dialpad_button"
-                android:src="@drawable/ic_menu_dialpad_dk"/>
+                android:src="@drawable/ic_menu_dialpad_lt"/>
             <ImageButton
                  android:id="@+id/overflow_menu"
                  android:layout_width="@dimen/fake_menu_button_min_width"
                  android:layout_height="match_parent"
                  android:layout_gravity="bottom|end"
-                 android:src="@drawable/ic_menu_overflow_dk"
+                 android:src="@drawable/ic_menu_overflow_lt"
                  android:contentDescription="@string/action_menu_overflow_description"
                  android:background="?android:attr/selectableItemBackground"/>
         </FrameLayout>
diff --git a/res/layout/phone_favorites_fragment.xml b/res/layout/phone_favorites_fragment.xml
index 363565a5d..23987a813 100644
--- a/res/layout/phone_favorites_fragment.xml
+++ b/res/layout/phone_favorites_fragment.xml
@@ -22,7 +22,7 @@
     android:divider="?android:attr/dividerHorizontal"
     android:showDividers="end"
     android:clipChildren="false"
-    android:background="@color/background_dialer_light">
+    android:background="@color/background_dialer_list_items">
 
     <FrameLayout
         android:id="@+id/contact_tile_frame"
@@ -30,7 +30,7 @@
         android:layout_height="match_parent"
         android:layout_alignParentTop="true"
         android:layout_alignParentLeft="true"
-        android:layout_alignParentStart="true">
+        >
 
         <com.android.dialer.list.PhoneFavoriteListView
             android:id="@+id/contact_tile_list"
diff --git a/res/layout/phone_favorites_menu.xml b/res/layout/phone_favorites_menu.xml
index d8f2f32c7..5f7a5a630 100644
--- a/res/layout/phone_favorites_menu.xml
+++ b/res/layout/phone_favorites_menu.xml
@@ -21,10 +21,10 @@
                 android:id="@+id/phone_favorites_menu"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:paddingLeft="@dimen/favorites_menu_margin"
-                android:paddingRight="@dimen/favorites_menu_margin"
-                android:paddingTop="@dimen/favorites_menu_margin"
-                android:paddingBottom="@dimen/favorites_menu_margin"
+                android:paddingLeft="@dimen/favorites_menu_padding_horizontal"
+                android:paddingRight="@dimen/favorites_menu_padding_horizontal"
+                android:paddingTop="@dimen/favorites_menu_padding_top"
+                android:paddingBottom="@dimen/favorites_menu_padding_bottom"
                 android:background="@drawable/background_favorites_menu"
                 android:addStatesFromChildren="true"
         >
@@ -44,8 +44,8 @@
             android:fontFamily="@string/favorites_menu_all_contacts_font_family"
             android:layout_width="wrap_content"
             android:layout_height="@dimen/favorites_menu_all_contacts_height"
-            android:paddingLeft="@dimen/favorites_menu_padding"
-            android:paddingRight="@dimen/favorites_menu_padding"
+            android:paddingLeft="@dimen/favorites_menu_padding_horizontal"
+            android:paddingRight="@dimen/favorites_menu_padding_horizontal"
             android:text="@string/favorites_menu_all_contacts"
             android:textSize="@dimen/favorites_menu_all_contacts_text_size"
             android:background="@color/all_contacts_button_color"
diff --git a/res/values/colors.xml b/res/values/colors.xml
index fc8e8473f..431f1bdec 100644
--- a/res/values/colors.xml
+++ b/res/values/colors.xml
@@ -54,7 +54,10 @@
     <color name="dialpad_secondary_text_color">#aaaaaa</color>
 
     <!-- Background color of action bars -->
-    <color name="actionbar_background_color">#ffffff</color>
+    <color name="actionbar_background_color">#3B77E7</color>
+
+    <!-- Underline color of action bars -->
+    <color name="actionbar_underline">#3265C1</color>
 
     <!-- Color of the 1dp divider that separates favorites -->
     <color name="favorite_contacts_separator_color">#d0d0d0</color>
@@ -88,7 +91,39 @@
     <!-- Background color for the favorites menu when pressed. -->
     <color name="favorites_menu_pressed_color">#d6d6d6</color>
 
+    <!-- Background color for the favorites menu. -->
+    <color name="favorites_menu_background_color">#ebebeb</color>
+
     <!-- Text color for the "All Contacts" button above the favorite callers -->
     <color name="all_contacts_button_text_color">#ffffff</color>
 
+    <!-- Background gradient start color for tabs in an unpressed state. -->
+    <color name="tab_background_gradient_start_color">#d3d3d3</color>
+
+    <!-- Background gradient end color for tabs in an unpressed state. -->
+    <color name="tab_background_gradient_end_color">#ebebeb</color>
+
+    <!-- Background gradient start color for tabs in a pressed state. -->
+    <color name="tab_background_gradient_start_pressed_color">#c4c4c4</color>
+
+    <!-- Background gradient end color for tabs in a pressed state. -->
+    <color name="tab_background_gradient_end_pressed_color">#dedede</color>
+
+    <!-- Color of the underline for a tab which is selected. -->
+    <color name="tab_underline_selected_color">#3265c1</color>
+
+    <!-- Color of the underline for a tab which is not selected. -->
+    <color name="tab_underline_color">#c8c8c8</color>
+
+    <!-- Color of the selection indicator for a tab which is selected. -->
+    <color name="tab_selected_color">#3b77e7</color>
+
+    <!-- Color of tab text. -->
+    <color name="tab_text_color">#505050</color>
+
+    <!-- Color of the bottom border below the contacts grid on the main dialer screen. -->
+    <color name="contacts_grid_bottom_border_color">#16000000</color>
+
+    <!-- Color of action bar text. -->
+    <color name="actionbar_text_color">#FFFFFF</color>
 </resources>
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index fb74e9748..24ee2e037 100644
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -29,9 +29,6 @@
     <!-- Match call_button_height to Phone's dimens/in_call_end_button_height -->
     <dimen name="call_button_height">74dp</dimen>
 
-    <!-- Search View -->
-    <dimen name="search_text_size">14sp</dimen>
-
     <!--
           Drag to remove view (in dp because it is used in conjunction with a statically
           sized icon
@@ -92,10 +89,12 @@
     <dimen name="dismiss_button_padding_start">20dip</dimen>
     <dimen name="dismiss_button_padding_end">28dip</dimen>
 
-    <!-- Margin around the favorites menu. -->
-    <dimen name="favorites_menu_margin">6dp</dimen>
-    <!-- Padding within the favorites menu. -->
-    <dimen name="favorites_menu_padding">4dp</dimen>
+    <!-- Padding above the favorites menu. -->
+    <dimen name="favorites_menu_padding_top">6dp</dimen>
+    <!-- Padding below the favorites menu.. -->
+    <dimen name="favorites_menu_padding_bottom">3dp</dimen>
+    <!-- Horizontal padding in the favorites menu. -->
+    <dimen name="favorites_menu_padding_horizontal">8dp</dimen>
     <!-- Text size for the "speed dial" text in the favorites menu. -->
     <dimen name="favorites_menu_speed_dial_text_size">18sp</dimen>
     <!-- Height of the speed dial TextView in the favorites menu. -->
@@ -104,4 +103,34 @@
     <dimen name="favorites_menu_all_contacts_text_size">12sp</dimen>
     <!-- Height of the all contacts Button in the favorites menu. -->
     <dimen name="favorites_menu_all_contacts_height">24dp</dimen>
+
+    <!-- Margin to the left and right of the search box. -->
+    <dimen name="search_margin_horizontal">7dp</dimen>
+    <!-- Margin above the search box. -->
+    <dimen name="search_top_margin">10dp</dimen>
+    <!-- Margin below the search box. -->
+    <dimen name="search_bottom_margin">4dp</dimen>
+    <!-- Height of the search box. -->
+    <dimen name="search_box_height">41dp</dimen>
+    <!-- Search box text size -->
+    <dimen name="search_text_size">13.24sp</dimen>
+    <!-- Search box interior padding - left -->
+    <dimen name="search_box_left_padding">16dp</dimen>
+    <!-- Search box interior padding - right -->
+    <dimen name="search_box_right_padding">8dp</dimen>
+    <!-- Padding around the icon in the search box. -->
+    <dimen name="search_box_icon_padding">3dp</dimen>
+    <!-- Left margin of the text field in the search box. -->
+    <dimen name="search_box_text_left_margin">8dp</dimen>
+    <!-- Size of the icon (voice search, close search) in the search box. -->
+    <dimen name="search_box_icon_size">37dp</dimen>
+
+    <!-- Height of the underline of a tab. -->
+    <dimen name="tab_underline_height">2dp</dimen>
+    <!-- Height of the selection indicator of a tab. -->
+    <dimen name="tab_selection_height">7.7dp</dimen>
+    <!-- Padding above and below the divider line of a tab. -->
+    <dimen name="tab_divider_padding">12dp</dimen>
+    <!-- Size of text in tabs. -->
+    <dimen name="tab_text_size">12sp</dimen>
 </resources>
diff --git a/res/values/strings.xml b/res/values/strings.xml
index 20a73c15b..91ceaef37 100644
--- a/res/values/strings.xml
+++ b/res/values/strings.xml
@@ -742,4 +742,12 @@
     <!-- The font-family to use for the "all contacts" label on the favorites menu.
          Do not translate. -->
     <string name="favorites_menu_all_contacts_font_family">sans-serif</string>
+
+    <!-- The font-family to use for the text inside the searchbox.
+         Do not translate. -->
+    <string name="search_font_family">sans-serif</string>
+
+    <!-- The font-family to use for tab text.
+         Do not translate. -->
+    <string name="tab_font_family">sans-serif</string>
 </resources>
diff --git a/res/values/styles.xml b/res/values/styles.xml
index 89678fc48..6ecad8c3b 100644
--- a/res/values/styles.xml
+++ b/res/values/styles.xml
@@ -21,7 +21,16 @@
         <item name="android:textColorSecondary">@color/dialtacts_secondary_text_color</item>
         <item name="android:windowActionBarOverlay">false</item>
         <item name="android:actionBarStyle">@style/DialtactsActionBarStyle</item>
+        <!-- Style for the tabs (for the tabs) -->
         <item name="android:actionBarTabStyle">@style/DialtactsActionBarTabStyle</item>
+        <!-- Style for the tab bar (for the divider between tabs) -->
+        <item name="android:actionBarTabBarStyle">@style/DialtactsActionBarTabBarStyle</item>
+        <!-- Style for the tab bar text (for text on tabs) -->
+        <item name="android:actionBarTabTextStyle">@style/DialtactsActionBarTabTextStyle</item>
+        <!-- Style for the overflow button in the actionbar. -->
+        <item name="android:actionOverflowButtonStyle">@style/DialtactsActionBarOverflow</item>
+        <!-- The "Up" icon in the action bar. -->
+        <item name="android:homeAsUpIndicator">@drawable/ic_back_arrow</item>
         <item name="android:windowContentOverlay">@null</item>
         <!--  Searchbox Style -->
         <item name="android:editTextStyle">@style/DialtactsSearchboxStyle</item>
@@ -68,6 +77,12 @@
         <item name="favorites_padding_bottom">?android:attr/actionBarSize</item>
     </style>
 
+    <!-- Action bar overflow menu icon. -->
+    <style name="DialtactsActionBarOverflow"
+           parent="@android:style/Widget.Holo.ActionButton.Overflow">
+        <item name="android:src">@drawable/ic_menu_overflow_lt</item>
+    </style>
+
     <style name="DialpadTheme" parent="DialtactsTheme">
         <item name="android:textColorPrimary">#FFFFFF</item>
     </style>
@@ -123,14 +138,40 @@
 
     <style name="DialtactsActionBarStyle" parent="android:Widget.Holo.ActionBar">
         <item name="android:background">@drawable/call_history_actionbar_background</item>
-        <item name="android:backgroundStacked">@color/actionbar_background_color</item>
+        <item name="android:backgroundStacked">#ffffff</item>
+        <item name="android:titleTextStyle">@style/DialtactsActionBarTitleText</item>
         <!-- Empty icon -->
         <item name="android:icon">@android:color/transparent</item>
-        <item name="android:displayOptions"></item>
     </style>
 
+    <!-- Text in the action bar at the top of the screen -->
+    <style name="DialtactsActionBarTitleText"
+           parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">
+        <item name="android:textColor">@color/actionbar_text_color</item>
+    </style>
+
+    <!-- Styling for the tab bar; handles styling of the divider line. -->
+    <style name="DialtactsActionBarTabBarStyle"
+           parent="@android:style/Widget.Holo.ActionBar.TabBar">
+        <item name="android:divider">@drawable/divider</item>
+        <item name="android:showDividers">middle</item>
+        <item name="android:dividerPadding">@dimen/tab_divider_padding</item>
+        <item name="android:background">@drawable/action_bar_tab</item>
+    </style>
+
+    <!-- Styling for tabs. -->
     <style name="DialtactsActionBarTabStyle" parent="@android:style/Widget.Holo.ActionBar.TabView">
         <item name="android:background">@drawable/action_bar_tab</item>
+        <item name="android:showDividers">none</item>
+    </style>
+
+    <!-- Text style for tabs. -->
+    <style name="DialtactsActionBarTabTextStyle"
+           parent="android:style/Widget.Holo.Light.ActionBar.TabText">
+        <item name="android:textColor">@color/tab_text_color</item>
+        <item name="android:textSize">@dimen/tab_text_size</item>
+        <item name="android:fontFamily">@string/tab_font_family</item>
+        <item name="android:textStyle">bold</item>
     </style>
 
     <style name="ListViewStyle" parent="@android:style/Widget.Holo.Light.ListView">