Initial changes for Material Design

res/drawable/card_bg_elevate.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
+
+    <item>
+        <shape
+            android:dither="true"
+            android:shape="rectangle" >
+            <corners android:radius="2dp" />
+
+            <solid android:color="@color/secondary_color" />
+        </shape>
+    </item>
+    <item android:bottom="1dp">
+        <shape
+            android:dither="true"
+            android:shape="rectangle" >
+            <corners android:radius="2dp" />
+
+            <solid android:color="@android:color/white" />
+        </shape>
+    </item>
+
+</layer-list>

res/layout/activity_main.xml

@@ -1,43 +1,30 @@
 <!-- Copyright 2014 ACR Development -->
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/main_layout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:background="?attr/colorPrimary"
     android:orientation="vertical" >
 
-    <LinearLayout
-        android:id="@+id/progressWrapper"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:background="?progressColor"
-        android:orientation="vertical" >
-
-        <ProgressBar
-            android:id="@+id/activity_bar"
-            android:layout_width="match_parent"
-            android:layout_height="2dp"
-            android:indeterminate="false"
-            android:indeterminateOnly="false"
-            android:maxHeight="2dp"
-            android:minHeight="2dp"
-            android:progressDrawable="@drawable/progress" />
-    </LinearLayout>
-
     <android.support.v4.widget.DrawerLayout
-        xmlns:android="http://schemas.android.com/apk/res/android"
         android:id="@+id/drawer_layout"
         android:layout_width="match_parent"
-        android:layout_height="match_parent" >
+        android:layout_height="match_parent"
+        android:fitsSystemWindows="true" >
 
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:orientation="vertical" >
 
+            <include layout="@layout/toolbar" />
+
             <FrameLayout
                 android:id="@+id/content_frame"
                 android:layout_width="match_parent"
-                android:layout_height="match_parent"
+                android:layout_height="0dp" 
+                android:background="@color/primary_color"
                 android:layout_weight="1"/>
 
             <include layout="@layout/search_interface" />
@@ -50,21 +37,22 @@
             android:layout_gravity="start"
             android:background="@color/drawer_background"
             android:clickable="true"
+            android:fitsSystemWindows="true"
             android:orientation="vertical" >
 
             <RelativeLayout
                 android:id="@+id/new_tab_button"
                 android:layout_width="match_parent"
-                android:layout_height="wrap_content"
+                android:layout_height="?attr/actionBarSize"
                 android:layout_alignParentTop="true"
-                android:background="@drawable/list_bg"
+                android:background="?attr/listBackground"
                 android:gravity="center_vertical"
                 android:orientation="horizontal" >
 
                 <ImageView
                     android:id="@+id/plusIcon"
-                    android:layout_width="20dp"
-                    android:layout_height="20dp"
+                    android:layout_width="24dp"
+                    android:layout_height="24dp"
                     android:layout_alignParentLeft="true"
                     android:layout_centerVertical="true"
                     android:layout_marginLeft="16dp"
@@ -103,7 +91,7 @@
                 android:layout_below="@+id/view"
                 android:choiceMode="singleChoice"
                 android:dividerHeight="1dp"
-                android:listSelector="@drawable/list_bg" />
+                android:listSelector="?attr/listBackground" />
 
             <View
                 android:id="@+id/lineView"
@@ -126,7 +114,7 @@
                     android:layout_width="match_parent"
                     android:layout_height="match_parent"
                     android:layout_weight="1"
-                    android:background="@drawable/list_bg"
+                    android:background="?attr/listBackground"
                     android:clickable="true" >
 
                     <ImageView
@@ -146,7 +134,7 @@
                     android:layout_width="match_parent"
                     android:layout_height="match_parent"
                     android:layout_weight="1"
-                    android:background="@drawable/list_bg"
+                    android:background="?attr/listBackground"
                     android:clickable="true" >
 
                     <ImageView
@@ -170,20 +158,22 @@
             android:layout_gravity="end"
             android:background="@color/drawer_background"
             android:clickable="true"
+            android:fitsSystemWindows="true"
             android:orientation="vertical" >
 
             <RelativeLayout
                 android:id="@+id/bookmark_title"
                 android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:background="@drawable/list_bg"
+                android:layout_height="?attr/actionBarSize"
+                android:background="?attr/listBackground"
+                android:clickable="true"
                 android:gravity="center_vertical"
                 android:orientation="horizontal" >
 
                 <ImageView
                     android:id="@+id/starIcon"
-                    android:layout_width="20dp"
-                    android:layout_height="20dp"
+                    android:layout_width="24dp"
+                    android:layout_height="24dp"
                     android:layout_alignParentLeft="true"
                     android:layout_centerVertical="true"
                     android:layout_marginLeft="16dp"
@@ -218,7 +208,7 @@
                 android:layout_height="match_parent"
                 android:divider="#bababa"
                 android:dividerHeight="1dp"
-                android:listSelector="@drawable/list_bg" />
+                android:listSelector="?attr/listBackground" />
         </LinearLayout>
     </android.support.v4.widget.DrawerLayout>
 

res/layout/animated_progress_bar.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/progress_background"
+    android:layout_width="match_parent"
+    android:orientation="horizontal"
+    android:layout_height="5dp">
+
+    <View
+        android:id="@android:id/progress"
+        android:layout_width="0dp"
+        android:layout_height="match_parent"/>
+
+</LinearLayout>

res/layout/bookmark_list_item.xml

@@ -2,31 +2,31 @@
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="56dp"
-    android:gravity="center_vertical"
     android:background="@drawable/list_bg"
+    android:gravity="center_vertical"
     android:orientation="horizontal" >
 
     <ImageView
-        android:id="@+id/favicon1"
-        android:layout_width="20dp"
-        android:layout_height="20dp"
-        android:contentDescription="Favicon"
-        android:gravity="center_vertical"
+        android:id="@+id/faviconBookmark"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
         android:layout_marginLeft="16dp"
-        android:layout_marginRight="16dp" >
+        android:layout_marginRight="16dp"
+        android:contentDescription="Favicon"
+        android:gravity="center_vertical" >
     </ImageView>
 
     <TextView
-        android:id="@+id/text1"
+        android:id="@+id/textBookmark"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:gravity="center_vertical"
-        android:fontFamily="sans-serif-light"
-        android:maxLines="1"
-        android:singleLine="true"
         android:ellipsize="end"
+        android:fontFamily="sans-serif-light"
+        android:gravity="center_vertical"
+        android:maxLines="1"
         android:minHeight="?android:attr/listPreferredItemHeightSmall"
         android:paddingRight="16dp"
+        android:singleLine="true"
         android:textAppearance="?android:attr/textAppearanceListItemSmall"
         android:textColor="@color/dark_text" />
 

res/layout/search.xml

@@ -2,11 +2,13 @@
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:layout_marginBottom="7dp"
-    android:layout_marginLeft="5dp"
-    android:layout_marginRight="5dp"
+    android:layout_marginBottom="6dp"
+    android:layout_marginLeft="2dp"
+    android:layout_marginRight="2dp"
+    android:layout_weight="1"
     android:layout_marginTop="8dp"
-    android:background="@drawable/card_bg"
+    android:elevation="2dp"
+    android:background="?attr/searchBackground"
     android:clipChildren="false"
     android:clipToPadding="false"
     android:descendantFocusability="beforeDescendants"
@@ -29,6 +31,7 @@
         android:selectAllOnFocus="true"
         android:singleLine="true"
         android:textColor="@color/gray_dark"
+        android:textColorHint="@color/hint_text"
         android:textCursorDrawable="@null" >
     </AutoCompleteTextView>
 

res/layout/settings.xml

@@ -4,6 +4,8 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent" >
     
+   
+
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"

res/layout/tab_list_item.xml

@@ -7,9 +7,9 @@
     android:orientation="horizontal" >
 
     <ImageView
-        android:id="@+id/favicon1"
-        android:layout_width="20dp"
-        android:layout_height="20dp"
+        android:id="@+id/faviconTab"
+        android:layout_width="24dp"
+        android:layout_height="24dp"
         android:layout_alignParentLeft="true"
         android:layout_centerVertical="true"
         android:layout_marginLeft="16dp"
@@ -19,12 +19,12 @@
     </ImageView>
 
     <TextView
-        android:id="@+id/text1"
+        android:id="@+id/textTab"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_centerVertical="true"
-        android:layout_toLeftOf="@+id/delete1"
-        android:layout_toRightOf="@+id/favicon1"
+        android:layout_toLeftOf="@+id/deleteButton"
+        android:layout_toRightOf="@+id/faviconTab"
         android:ellipsize="end"
         android:fontFamily="sans-serif-light"
         android:gravity="center_vertical"
@@ -35,12 +35,13 @@
         android:textColor="@color/dark_text" />
 
     <ImageView
-        android:id="@+id/delete1"
+        android:id="@+id/deleteButton"
         android:layout_width="30dp"
         android:layout_height="30dp"
         android:layout_alignParentRight="true"
         android:layout_centerVertical="true"
         android:layout_marginRight="13dp"
+        android:background="?attr/actionBarItemBackground"
         android:alpha="0.5"
         android:contentDescription="Delete Tab"
         android:gravity="center_vertical"

res/layout/toolbar.xml

@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:custom="http://schemas.android.com/apk/res-auto"
+    android:id="@+id/toolbar_layout"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:background="?attr/colorPrimary"
+    android:elevation="2dp"
+    android:orientation="vertical" >
+
+    <android.support.v7.widget.Toolbar
+        android:id="@+id/toolbar"
+        android:layout_width="match_parent"
+        android:layout_height="?attr/actionBarSize"
+        custom:contentInsetEnd="0dp"
+        custom:contentInsetStart="0dp" />
+
+    <acr.browser.lightning.AnimatedProgressBar
+        android:id="@+id/progress_view"
+        android:layout_width="match_parent"
+        android:layout_height="2dp"
+        custom:bidirectionalAnimate="false"
+        custom:backgroundColor="?attr/progressBackgroundColor"
+        custom:progressColor="?attr/colorAccent" />
+
+</LinearLayout>

res/layout/toolbar_content.xml

@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:custom="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:orientation="horizontal" >
+
+    <LinearLayout
+        android:id="@+id/arrow_button"
+        android:layout_width="?attr/actionBarSize"
+        android:layout_height="?attr/actionBarSize"
+        android:layout_marginLeft="2dp"
+        android:layout_marginTop="2dp"
+        android:background="?attr/actionBarItemBackground"
+        android:clickable="true"
+        android:gravity="center" >
+
+        <ImageView
+            android:id="@+id/arrow"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content" />
+    </LinearLayout>
+
+    <include layout="@layout/search" />
+
+</LinearLayout>

res/values-v21/styles.xml

@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <style name="Theme.SettingsTheme" parent="android:Theme.Material.Light">
+
+        <!-- customize the color palette -->
+        <item name="listBackground">?attr/listChoiceBackgroundIndicator</item>
+        <item name="android:colorPrimary">@color/primary_color</item>
+        <item name="android:colorPrimaryDark">@color/secondary_color_settings</item>
+        <item name="android:colorAccent">@color/accent_color</item>
+        <item name="android:windowContentOverlay">@null</item>
+        <item name="progressColor">@color/gray_medium</item>
+        <item name="arrowBackDrawable">@drawable/ic_action_back</item>
+        <item name="numberColor">@color/gray_dark</item>
+        <item name="autoCompleteTitleColor">@color/black</item>
+        <item name="autoCompleteUrlColor">@color/gray_medium</item>
+        <item name="arrowForwardDrawable">@drawable/ic_action_forward</item>
+        <item name="actionOverflowButtonStyle">@style/overFlowButtonStyle</item>
+    </style>
+
+    <style name="Theme.LightTheme" parent="Theme.AppCompat.Light">
+
+        <!-- customize the color palette -->
+        <item name="searchBackground">@drawable/card_bg</item>
+        <item name="listBackground">?attr/listChoiceBackgroundIndicator</item>
+        <item name="colorPrimary">@color/primary_color</item>
+        <item name="colorPrimaryDark">@color/secondary_color</item>
+        <item name="colorAccent">@color/accent_color</item>
+        <item name="android:windowNoTitle">true</item>
+        <item name="windowActionBar">false</item>
+        <item name="progressBackgroundColor">#00000000</item>
+        <item name="android:windowContentOverlay">@null</item>
+        <item name="progressColor">@color/gray_medium</item>
+        <item name="arrowBackDrawable">@drawable/ic_action_back</item>
+        <item name="numberColor">@color/gray_dark</item>
+        <item name="autoCompleteTitleColor">@color/black</item>
+        <item name="autoCompleteUrlColor">@color/gray_medium</item>
+        <item name="arrowForwardDrawable">@drawable/ic_action_forward</item>
+        <item name="android:actionBarStyle">@style/LightActionBar</item>
+        <item name="actionOverflowButtonStyle">@style/overFlowButtonStyle</item>
+    </style>
+
+    <style name="Theme.DarkTheme" parent="Theme.AppCompat">
+
+        <!-- customize the color palette -->
+        <item name="searchBackground">@drawable/card_bg</item>
+        <item name="listBackground">?attr/listChoiceBackgroundIndicator</item>
+        <item name="colorPrimary">@color/primary_color_dark</item>
+        <item name="colorPrimaryDark">@color/secondary_color</item>
+        <item name="colorAccent">@color/accent_color</item>
+        <item name="android:windowNoTitle">true</item>
+        <item name="progressBackgroundColor">#00000000</item>
+        <item name="windowActionBar">false</item>
+        <item name="android:windowContentOverlay">@null</item>
+        <item name="progressColor">@color/gray_medium</item>
+        <item name="arrowBackDrawable">@drawable/ic_action_back</item>
+        <item name="numberColor">@color/gray_dark</item>
+        <item name="autoCompleteTitleColor">@color/black</item>
+        <item name="autoCompleteUrlColor">@color/gray_medium</item>
+        <item name="arrowForwardDrawable">@drawable/ic_action_forward</item>
+        <item name="android:actionBarStyle">@style/LightActionBar</item>
+        <item name="actionOverflowButtonStyle">@style/overFlowButtonStyle</item>
+    </style>
+
+    <style name="overFlowButtonStyle" parent="@style/Widget.AppCompat.ActionButton.Overflow">
+        <item name="android:minWidth">48dp</item>
+        <item name="android:padding">0dp</item>
+    </style>
+
+</resources>

res/values/attr.xml

@@ -1,11 +1,19 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
 
-    <attr name="progressColor" format="reference|color" />
     <attr name="arrowBackDrawable" format="integer" />
     <attr name="arrowForwardDrawable" format="integer" />
     <attr name="numberColor" format="reference|color" />
     <attr name="autoCompleteTitleColor" format="reference|color" />
     <attr name="autoCompleteUrlColor" format="reference|color" />
+    <attr name="listBackground" format="reference|color" />
+    <attr name="progressBackgroundColor" format="color" />
+    <attr name="searchBackground" format="reference|color" />
+
+    <declare-styleable name="AnimatedProgressBar">
+        <attr name="progressColor" format="color" />
+        <attr name="backgroundColor" format="color" />
+        <attr name="bidirectionalAnimate" format="boolean" />
+    </declare-styleable>
 
 </resources>

res/values/colors.xml

@@ -10,6 +10,15 @@
     <color name="white">#ffffff</color>
     <color name="gray_extra_dark">#1b1b1b</color>
     <color name="gray_list_bg">#0d000000</color>
-    <color name="dark_text">#3f3f3f</color>
+    <color name="dark_text">#212121</color>
 
+    <color name="primary_color">#E0E0E0</color>
+    <color name="secondary_color">#4D000000</color>
+    <color name="accent_color">#0073EF</color>
+    
+    <color name="secondary_color_settings">#9C9C9C</color>
+    
+    <color name="hint_text">#BDBDBD</color>
+    
+    <color name="primary_color_dark">#424242</color>
 </resources>

res/values/dimens.xml

@@ -6,4 +6,6 @@
     <dimen name="navigation_width">260dp</dimen>
 	<dimen name="search_bar_height">48dp</dimen>
 	
+        <dimen name="abc_action_button_min_width_overflow_material">48dp</dimen>
+
 </resources>