CV tablet redesign. b/16152766

Doesn't include the toggle changes (as that will
be a separate CL). Also just uses 32dp for message
content padding since we currently don't have support
for asymmetrical padding.

Change-Id: I012885f48cb626094d0b0029a346a613c33f4cac

16 files changed, 106 insertions, 66 deletions

diff --git a/res/layout/conversation_footer.xml b/res/layout/conversation_footer.xml
index 49b3e2bc0..c8eb691cc 100644
--- a/res/layout/conversation_footer.xml
+++ b/res/layout/conversation_footer.xml
@@ -21,16 +21,14 @@
     android:layout_width="match_parent"
     android:layout_height="wrap_content" >
 
-    <View
-        android:id="@+id/top_border"
-        android:layout_width="match_parent"
-        android:layout_height="1dp"
-        android:background="@color/conversation_view_border_color"/>
+    <include layout="@layout/conversation_view_border" />
 
     <LinearLayout
         android:id="@+id/footer_buttons"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content" >
+        android:layout_height="wrap_content"
+        android:layout_marginLeft="@dimen/conversation_border_margin_side"
+        android:layout_marginRight="@dimen/conversation_border_margin_side" >
 
         <TextView
             android:id="@+id/reply_button"
@@ -55,6 +53,6 @@
     <View
         android:layout_width="match_parent"
         android:layout_height="16dp"
-        android:background="@color/conversation_view_background_color" />
+        android:background="@color/conversation_view_item_background_color" />
 
 </com.android.mail.browse.ConversationFooterView>
\ No newline at end of file
diff --git a/res/layout/conversation_message_header.xml b/res/layout/conversation_message_header.xml
index a0a1db945..7a8489179 100644
--- a/res/layout/conversation_message_header.xml
+++ b/res/layout/conversation_message_header.xml
@@ -22,10 +22,7 @@
     android:visibility="visible"
     android:orientation="vertical">
 
-    <View android:id="@+id/message_header_border"
-          android:layout_width="match_parent"
-          android:layout_height="1dp"
-          android:background="@color/conversation_view_border_color"/>
+    <include android:id="@+id/message_header_border" layout="@layout/conversation_view_border" />
 
     <include layout="@layout/conversation_message_upper_header"
              android:id="@+id/upper_header" />
diff --git a/res/layout/conversation_message_upper_header.xml b/res/layout/conversation_message_upper_header.xml
index 5422851ee..b8552df93 100644
--- a/res/layout/conversation_message_upper_header.xml
+++ b/res/layout/conversation_message_upper_header.xml
@@ -25,33 +25,37 @@
         android:id="@+id/photo"
         android:layout_width="@dimen/contact_image_width"
         android:layout_height="@dimen/contact_image_height"
-        android:layout_marginTop="@dimen/message_header_contact_photo_margin"
-        android:layout_marginBottom="@dimen/message_header_contact_photo_margin"
+        android:layout_marginTop="@dimen/message_header_icon_margin"
+        android:layout_marginBottom="@dimen/message_header_icon_margin"
         android:background="?android:attr/selectableItemBackground"
         android:scaleType="centerCrop"
         android:contentDescription="@string/contact_info_string"
-        style="@style/ConversationViewMarginStyle" />
+        style="@style/MessageHeaderIconStyle" />
+
     <!-- invisible view so that the quick contact will expand from the image -->
     <QuickContactBadge
         android:id="@+id/invisible_quick_contact"
         android:layout_width="0dp"
         android:layout_height="0dp"
-        android:layout_marginTop="@dimen/message_header_contact_photo_margin"
-        android:layout_marginBottom="@dimen/message_header_contact_photo_margin"
+        android:layout_marginTop="@dimen/message_header_icon_margin"
+        android:layout_marginBottom="@dimen/message_header_icon_margin"
         android:visibility="invisible" />
+
     <!-- draft should match photo in dimensions -->
     <ImageView
         android:id="@+id/draft"
         android:layout_width="@dimen/contact_image_width"
         android:layout_height="@dimen/contact_image_height"
-        android:layout_marginTop="@dimen/message_header_contact_photo_margin"
-        android:layout_marginBottom="@dimen/message_header_contact_photo_margin"
+        android:layout_marginTop="@dimen/message_header_icon_margin"
+        android:layout_marginBottom="@dimen/message_header_icon_margin"
         android:background="@drawable/draft_background_circle"
         android:scaleType="center"
         android:src="@drawable/ic_drafts_wht_24dp"
         android:visibility="gone"
-        style="@style/ConversationViewMarginStyle" />
+        style="@style/MessageHeaderIconStyle" />
+
     <include layout="@layout/conversation_message_upper_header_text" />
+
     <include layout="@layout/conversation_message_upper_header_actions" />
 
 </LinearLayout>
diff --git a/res/layout/conversation_message_upper_header_text.xml b/res/layout/conversation_message_upper_header_text.xml
index dd06383fa..eedad010a 100644
--- a/res/layout/conversation_message_upper_header_text.xml
+++ b/res/layout/conversation_message_upper_header_text.xml
@@ -24,7 +24,7 @@
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:layout_weight="1"
-    android:layout_marginTop="14dp"
+    android:layout_marginTop="@dimen/message_header_text_margin_top"
     style="@style/MessageUpperHeaderTextStyle" >
 
     <TextView
diff --git a/res/layout/conversation_view_border.xml b/res/layout/conversation_view_border.xml
new file mode 100644
index 000000000..89ec42777
--- /dev/null
+++ b/res/layout/conversation_view_border.xml
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2014 Google Inc.
+     Licensed to 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.
+-->
+<View xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/border"
+    android:layout_width="match_parent"
+    android:layout_height="1dp"
+    android:layout_marginLeft="@dimen/conversation_border_margin_side"
+    android:layout_marginRight="@dimen/conversation_border_margin_side"
+    android:background="@color/conversation_view_border_color" />
\ No newline at end of file
diff --git a/res/layout/conversation_view_header.xml b/res/layout/conversation_view_header.xml
index c676ef7b1..cbb2ec4ed 100644
--- a/res/layout/conversation_view_header.xml
+++ b/res/layout/conversation_view_header.xml
@@ -20,12 +20,12 @@
     android:id="@+id/conversation_header"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:background="@color/conversation_view_background_color"
+    android:background="@color/conversation_view_item_background_color"
     android:orientation="horizontal"
     android:minHeight="88sp"
     android:paddingTop="16dp"
     android:paddingBottom="16dp"
-    style="@style/ConversationHeaderMarginStyle" >
+    style="@style/ConversationHeaderStyle" >
 
     <com.android.mail.browse.SubjectAndFolderView
         android:id="@+id/subject_and_folder_view"
@@ -38,8 +38,8 @@
 
     <com.android.mail.browse.StarView
         android:id="@+id/conversation_header_star"
-        android:layout_width="52dp"
-        android:layout_height="52dp"
+        android:layout_width="@dimen/conversation_header_star_size"
+        android:layout_height="@dimen/conversation_header_star_size"
         android:layout_gravity="center_vertical"
         android:background="?android:attr/selectableItemBackground"
         android:scaleType="center"
diff --git a/res/layout/drawer_footer_item.xml b/res/layout/drawer_footer_item.xml
index 808187e35..16b6ee07b 100644
--- a/res/layout/drawer_footer_item.xml
+++ b/res/layout/drawer_footer_item.xml
@@ -26,7 +26,7 @@
         android:id="@+id/top_border"
         android:layout_width="match_parent"
         android:layout_height="@dimen/drawer_item_divider_thickness"
-        android:background="@color/separator_color"
+        android:background="@color/divider_color"
         android:layout_marginTop="8dp"
         android:layout_marginBottom="8dp" />
 
diff --git a/res/layout/fake_bottom_border.xml b/res/layout/fake_bottom_border.xml
index 1d4c717eb..c80ff4ad3 100644
--- a/res/layout/fake_bottom_border.xml
+++ b/res/layout/fake_bottom_border.xml
@@ -18,4 +18,4 @@
 <View xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
-      android:background="@color/conversation_view_background_color" />
+      android:background="@color/conversation_view_item_background_color" />
diff --git a/res/layout/folder_list_header.xml b/res/layout/folder_list_header.xml
index 4ccb316b0..935e80cf6 100644
--- a/res/layout/folder_list_header.xml
+++ b/res/layout/folder_list_header.xml
@@ -27,7 +27,7 @@
         android:layout_width="match_parent"
         android:layout_height="1px"
         android:layout_marginTop="8dp"
-        android:background="@color/separator_color" />
+        android:background="@color/divider_color" />
 
     <TextView
         android:id="@+id/header_text"
diff --git a/res/layout/super_collapsed_block.xml b/res/layout/super_collapsed_block.xml
index f686ef9b3..ad0494b9b 100644
--- a/res/layout/super_collapsed_block.xml
+++ b/res/layout/super_collapsed_block.xml
@@ -26,8 +26,9 @@
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_gravity="center"
-        android:orientation="vertical" >
+        android:layout_gravity="center_vertical"
+        android:orientation="vertical"
+        style="@style/SuperCollapsedStrokeStyle" >
 
         <View
             android:layout_width="match_parent"
@@ -46,10 +47,10 @@
         android:id="@+id/super_collapsed_text"
         android:layout_width="40sp"
         android:layout_height="40sp"
-        android:layout_marginStart="16dp"
         android:background="@drawable/super_collapse_circle"
         android:contentDescription="@null"
         android:gravity="center"
-        android:textSize="@dimen/super_collapsed_text_size" />
+        android:textSize="@dimen/super_collapsed_text_size"
+        style="@style/MessageHeaderIconStyle" />
 
 </com.android.mail.browse.SuperCollapsedBlock>
diff --git a/res/values-ldrtl/styles-ldrtl.xml b/res/values-ldrtl/styles-ldrtl.xml
index 6b85e75c8..93c10ada3 100644
--- a/res/values-ldrtl/styles-ldrtl.xml
+++ b/res/values-ldrtl/styles-ldrtl.xml
@@ -41,9 +41,7 @@
         <item name="android:paddingStart">@dimen/message_header_inner_side_padding</item>
     </style>
 
-    <style name="ConversationHeaderMarginStyle">
-        <item name="android:layout_marginStart">@dimen/conversation_header_margin_side</item>
-        <item name="android:layout_marginEnd">@dimen/conversation_header_margin_side</item>
+    <style name="ConversationHeaderStyle">
         <item name="android:paddingStart">@dimen/conversation_header_padding_side</item>
     </style>
 
@@ -65,8 +63,13 @@
         <item name="android:paddingEnd">@dimen/conversation_view_margin_side</item>
     </style>
 
-    <style name="ConversationViewMarginStyle">
-        <item name="android:layout_marginStart">@dimen/conversation_view_margin_side</item>
+    <style name="MessageHeaderIconStyle">
+        <item name="android:layout_marginStart">@dimen/message_header_icon_additional_margin_start</item>
+    </style>
+
+    <style name="SuperCollapsedStrokeStyle">
+        <item name="android:layout_marginStart">@dimen/super_collapsed_stroke_margin_start</item>
+        <item name="android:layout_marginEnd">@dimen/conversation_border_margin_side</item>
     </style>
 
     <style name="NewMessageButtonStyle" parent="AbstractNewMessageButtonStyle">
diff --git a/res/values-sw600dp/colors.xml b/res/values-sw600dp/colors.xml
new file mode 100644
index 000000000..6ea7a37df
--- /dev/null
+++ b/res/values-sw600dp/colors.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="conversation_view_item_background_color">@android:color/white</color>
+</resources>
\ No newline at end of file
diff --git a/res/values-sw600dp/dimen.xml b/res/values-sw600dp/dimen.xml
index 19dc96877..720bce5db 100644
--- a/res/values-sw600dp/dimen.xml
+++ b/res/values-sw600dp/dimen.xml
@@ -16,19 +16,26 @@
      limitations under the License.
 -->
 <resources>
-    <dimen name="conversation_view_margin_side">16dp</dimen>
-    <dimen name="conversation_header_margin_side">15dp</dimen>
-    <dimen name="conversation_header_font_size">24sp</dimen>
+    <dimen name="conversation_message_content_margin_side">32dp</dimen>
+    <dimen name="conversation_view_margin_side">24dp</dimen>
     <dimen name="conversation_header_padding_side">24dp</dimen>
-    <dimen name="conversation_page_gutter">0dip</dimen>
-    <dimen name="message_header_inner_side_padding">16dp</dimen>
+    <dimen name="conversation_header_star_size">55dp</dimen>
+    <dimen name="conversation_border_margin_side">24dp</dimen>
+
+    <dimen name="message_header_icon_margin">24dp</dimen>
+    <dimen name="message_header_icon_additional_margin_start">32dp</dimen>
     <dimen name="message_header_action_button_width">56dp</dimen>
     <dimen name="message_header_action_button_height">56dp</dimen>
-    <dimen name="message_details_header_padding_start_expanded">104dip</dimen>
-    <dimen name="message_sender_name_text_size">20sp</dimen>
-    <dimen name="message_header_subtitle_text_size">16sp</dimen>
-    <dimen name="super_collapsed_height">39sp</dimen>
-    <dimen name="super_collapsed_text_size">16sp</dimen>
+    <dimen name="message_header_action_button_margin_top">8dp</dimen>
+    <dimen name="message_header_text_margin_top">22dp</dimen>
+    <dimen name="message_header_margin_bottom">24dp</dimen>
+    <dimen name="message_details_header_padding_start_expanded">88dp</dimen>
+    <dimen name="message_details_header_padding_end">24dp</dimen>
+
+    <!-- This value needs to be greater than message_header_icon_margin_side.
+         Chose to make it larger by 20dp, half of the message_header_icon size. -->
+    <dimen name="super_collapsed_stroke_margin_start">52dp</dimen>
+
     <dimen name="attachment_tile_min_size">180dp</dimen>
     <dimen name="attachment_tile_max_size">254dp</dimen>
     <dimen name="wait_padding">32dp</dimen>
diff --git a/res/values/colors.xml b/res/values/colors.xml
index b6022094a..bcbd24e05 100644
--- a/res/values/colors.xml
+++ b/res/values/colors.xml
@@ -28,6 +28,8 @@
     <!-- if you want to make something blue, please try to use THIS blue -->
     <color name="mail_app_blue">@android:color/holo_blue_light</color>
     <color name="tablet_background_gray">#eeeeee</color>
+    <color name="divider_color">#b2b2b2</color>
+
     <!-- Conversation List Item Colors -->
     <color name="senders_text_color">@color/text_color_black</color>
     <color name="subject_text_color_unread">@color/text_color_black</color>
@@ -51,7 +53,6 @@
     <color name="account_item_selected_text_color">@color/mail_app_blue</color>
     <color name="folder_list_heading_text_color">@color/light_gray</color>
     <color name="list_background_color">@android:color/white</color>
-    <color name="separator_color">#b2b2b2</color>
 
     <!-- Compose colors -->
     <color name="compose_label_text">@color/text_color_grey</color>
@@ -69,8 +70,10 @@
     <color name="conv_header_add_label_background">#eeeeee</color>
 
     <!-- Conversation message header colors -->
-    <color name="conversation_view_border_color">#eeeeee</color>
+    <color name="conversation_view_border_color">@color/divider_color</color>
     <color name="conversation_view_background_color">#f5f5f5</color>
+    <!-- Overridden on tablet to give a white background -->
+    <color name="conversation_view_item_background_color">@color/conversation_view_background_color</color>
     <color name="conversation_view_text_color_light">@color/text_color_grey</color>
     <color name="conversation_view_text_color_dark">@color/text_color_black</color>
     <color name="conversation_view_text_color_link_blue">@color/text_color_blue</color>
diff --git a/res/values/dimen.xml b/res/values/dimen.xml
index 4fe2a880f..e0d3e6ece 100644
--- a/res/values/dimen.xml
+++ b/res/values/dimen.xml
@@ -41,9 +41,10 @@
     <dimen name="conversation_page_gutter">16dp</dimen>
     <dimen name="conversation_message_content_margin_side">16dp</dimen>
     <dimen name="conversation_view_margin_side">16dp</dimen>
-    <dimen name="conversation_header_margin_side">0dp</dimen>
     <dimen name="conversation_header_font_size">20sp</dimen>
     <dimen name="conversation_header_padding_side">16dp</dimen>
+    <dimen name="conversation_header_star_size">52dp</dimen>
+    <dimen name="conversation_border_margin_side">0dp</dimen>
     <dimen name="conversation_folder_font_size">12sp</dimen>
     <dimen name="conversation_folder_padding">1dp</dimen>
     <dimen name="conversation_folder_padding_extra_width">8dp</dimen>
@@ -54,21 +55,23 @@
     <dimen name="message_details_header_padding_start_expanded">72dip</dimen>
     <dimen name="message_details_header_padding_end">16dp</dimen>
     <dimen name="message_details_header_vertical_padding">7dp</dimen>
-    <dimen name="message_details_header_inner_side_padding">8dp</dimen>
     <dimen name="message_show_pics_header_padding_end">14dip</dimen>
-    <dimen name="message_header_presence_top_margin">-4dp</dimen>
+    <dimen name="message_header_icon_additional_margin_start">16dp</dimen>
     <dimen name="message_header_action_button_width">48dp</dimen>
     <dimen name="message_header_action_button_height">48dp</dimen>
+    <dimen name="message_header_action_button_margin_top">0dp</dimen>
     <dimen name="message_sender_name_text_size">16sp</dimen>
     <dimen name="message_header_subtitle_text_size">14sp</dimen>
     <dimen name="message_header_small_text_size">12sp</dimen>
+    <dimen name="message_header_text_margin_top">14dp</dimen>
     <dimen name="message_header_margin_bottom">12dp</dimen>
     <dimen name="super_collapsed_height">30sp</dimen>
     <dimen name="super_collapsed_text_size">16sp</dimen>
+    <dimen name="super_collapsed_stroke_margin_start">0dp</dimen>
     <dimen name="notification_view_height">36dp</dimen>
     <dimen name="contact_image_width">40dp</dimen>
     <dimen name="contact_image_height">40dp</dimen>
-    <dimen name="message_header_contact_photo_margin">16dp</dimen>
+    <dimen name="message_header_icon_margin">16dp</dimen>
     <dimen name="message_header_inner_side_padding">16dp</dimen>
     <dimen name="attachment_toast_yoffset">-100dip</dimen>
     <dimen name="spinner_frame_width">196dip</dimen>
diff --git a/res/values/styles.xml b/res/values/styles.xml
index ef9e0b6aa..82ae5d50d 100644
--- a/res/values/styles.xml
+++ b/res/values/styles.xml
@@ -259,9 +259,7 @@
         <item name="android:textSize">@dimen/conversation_header_font_size</item>
     </style>
 
-    <style name="ConversationHeaderMarginStyle">
-        <item name="android:layout_marginLeft">@dimen/conversation_header_margin_side</item>
-        <item name="android:layout_marginRight">@dimen/conversation_header_margin_side</item>
+    <style name="ConversationHeaderStyle">
         <item name="android:paddingLeft">@dimen/conversation_header_padding_side</item>
     </style>
 
@@ -277,14 +275,6 @@
     </style>
 
     <!-- Conversation view message header styles -->
-    <style name="MessageHeaderPresenceStyle">
-        <item name="android:layout_width">wrap_content</item>
-        <item name="android:layout_height">wrap_content</item>
-        <item name="android:paddingRight">4dip</item>
-        <!-- note: presence asset dimensions differ betwen HC and ICS -->
-        <item name="android:layout_marginTop">@dimen/message_header_presence_top_margin</item>
-    </style>
-
     <style name="AbstractMessageSenderNameStyle">
         <item name="android:singleLine">true</item>
         <item name="android:textSize">@dimen/message_sender_name_text_size</item>
@@ -318,7 +308,7 @@
     </style>
 
     <style name="MessageHeaderDetailsHeadingStyle" parent="MessageHeaderSmallStyle">
-        <item name="android:layout_marginRight">@dimen/message_details_header_inner_side_padding</item>
+        <item name="android:layout_marginRight">@dimen/message_header_inner_side_padding</item>
     </style>
 
     <style name="AbstractMessageHeaderShowPicsStyle" parent="MessageHeaderSmallStyle">
@@ -358,6 +348,7 @@
     <style name="MessageHeaderActionButtonStyle" parent="@style/MessageButtonStyleBase">
         <item name="android:layout_width">@dimen/message_header_action_button_width</item>
         <item name="android:layout_height">@dimen/message_header_action_button_height</item>
+        <item name="android:layout_marginTop">@dimen/message_header_action_button_margin_top</item>
         <item name="android:scaleType">center</item>
     </style>
 
@@ -629,8 +620,13 @@
         <item name="android:paddingRight">@dimen/conversation_view_margin_side</item>
     </style>
 
-    <style name="ConversationViewMarginStyle">
-        <item name="android:layout_marginLeft">@dimen/conversation_view_margin_side</item>
+    <style name="MessageHeaderIconStyle">
+        <item name="android:layout_marginLeft">@dimen/message_header_icon_additional_margin_start</item>
+    </style>
+
+    <style name="SuperCollapsedStrokeStyle">
+        <item name="android:layout_marginLeft">@dimen/super_collapsed_stroke_margin_start</item>
+        <item name="android:layout_marginRight">@dimen/conversation_border_margin_side</item>
     </style>
 
     <style name="MiniDrawerFolderStyle">