ishan/fenix
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

No issue: Tune Home and Library UI from Updated Mocks

Browse Source
This commit is contained in:
Emily Kager 2019-03-21 16:51:01 -07:00 committed by Colin Lee
parent f52d9537c9
commit 5a839167fc
16 changed files with 133 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/main/java/org/mozilla/fenix/library/LibraryListItem.kt
View File

@ -28,7 +28,7 @@ class LibraryListItem @JvmOverloads constructor(
try {
val id = getResourceId(
R.styleable.LibraryListItem_listItemIcon,
R.drawable.library_icon_logins_circle_background
R.drawable.library_icon_reading_list_circle_background
)
libraryIcon?.background = resources.getDrawable(id, context.theme)
libraryItemTitle?.text = resources.getString(

16
app/src/main/res/drawable/ic_readermode.xml Normal file
View File

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="#202340"
android:fillType="nonZero"
android:pathData="M16.69,21L7.31,21C5.4826,20.9983 4.0017,19.5174 4,17.69L4,6.31C4.0017,4.4826 5.4826,3.0017 7.31,3L16.69,3C18.5174,3.0017 19.9983,4.4826 20,6.31L20,17.69C19.9983,19.5174 18.5174,20.9983 16.69,21ZM7.31,5C6.5867,5.0006 6.0006,5.5867 6,6.31L6,17.69C6.0006,18.4133 6.5867,18.9994 7.31,19L16.69,19C17.4133,18.9994 17.9994,18.4133 18,17.69L18,6.31C17.9994,5.5867 17.4133,5.0006 16.69,5L7.31,5ZM15,8L9,8C8.7239,8 8.5,7.7761 8.5,7.5C8.5,7.2239 8.7239,7 9,7L15,7C15.2761,7 15.5,7.2239 15.5,7.5C15.5,7.7761 15.2761,8 15,8ZM15,11L9,11C8.7239,11 8.5,10.7761 8.5,10.5C8.5,10.2239 8.7239,10 9,10L15,10C15.2761,10 15.5,10.2239 15.5,10.5C15.5,10.7761 15.2761,11 15,11ZM15,14L9,14C8.7239,14 8.5,13.7761 8.5,13.5C8.5,13.2239 8.7239,13 9,13L15,13C15.2761,13 15.5,13.2239 15.5,13.5C15.5,13.7761 15.2761,14 15,14ZM11.571,17L9,17C8.7239,17 8.5,16.7761 8.5,16.5C8.5,16.2239 8.7239,16 9,16L11.571,16C11.8471,16 12.071,16.2239 12.071,16.5C12.071,16.7761 11.8471,17 11.571,17Z"
android:strokeWidth="1"
android:strokeColor="#00000000" />
</vector>

30
app/src/main/res/drawable/library_icon_logins_circle_background.xml
View File

@ -1,30 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<size
android:width="40dp"
android:height="40dp" />
<solid android:color="@color/library_key_icon_background" />
</shape>
</item>
<item
android:bottom="8dp"
android:left="8dp"
android:right="8dp"
android:top="8dp">
<vector
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@color/library_key_icon"
android:fillType="evenOdd"
android:pathData="M11.377,4.842c-1.045,1.18 -1.531,2.752 -1.334,4.315L9,10.2c-0.144,0.174 -0.144,0.426 0,0.6 0.115,0.206 0.26,0.393 0.429,0.557 0.216,0.19 0.408,0.406 0.571,0.643l-7,7v1.7c-0.002,0.08 0.03,0.157 0.086,0.214 0.057,0.057 0.134,0.088 0.214,0.086H7v-1h1v-1.5h1V18h1v-2h1l1.6,-1.6h0.3l0.6,0.6c0.3,0.3 0.3,0.3 0.469,0.3 0.134,-0.01 0.26,-0.068 0.354,-0.163l0.9,-1.151c0.093,0 0.185,0.014 0.279,0.014 3.038,0 5.5,-2.462 5.5,-5.5S18.54,3 15.502,3c-1.578,-0.008 -3.08,0.663 -4.125,1.842zM17.5,8c-0.828,0 -1.5,-0.672 -1.5,-1.5S16.672,5 17.5,5s1.5,0.672 1.5,1.5S18.328,8 17.5,8z" />
</vector>
</item>
</layer-list>

30
app/src/main/res/drawable/library_icon_reading_list_circle_background.xml Normal file
View File

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<size
android:width="40dp"
android:height="40dp" />
<solid android:color="@color/library_reading_list_icon_background" />
</shape>
</item>
<item
android:bottom="8dp"
android:left="8dp"
android:right="8dp"
android:top="8dp">
<vector
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@color/library_reading_list_icon"
android:fillType="nonZero"
android:pathData="M16.69,21L7.31,21C5.4826,20.9983 4.0017,19.5174 4,17.69L4,6.31C4.0017,4.4826 5.4826,3.0017 7.31,3L16.69,3C18.5174,3.0017 19.9983,4.4826 20,6.31L20,17.69C19.9983,19.5174 18.5174,20.9983 16.69,21ZM7.31,5C6.5867,5.0006 6.0006,5.5867 6,6.31L6,17.69C6.0006,18.4133 6.5867,18.9994 7.31,19L16.69,19C17.4133,18.9994 17.9994,18.4133 18,17.69L18,6.31C17.9994,5.5867 17.4133,5.0006 16.69,5L7.31,5ZM15,8L9,8C8.7239,8 8.5,7.7761 8.5,7.5C8.5,7.2239 8.7239,7 9,7L15,7C15.2761,7 15.5,7.2239 15.5,7.5C15.5,7.7761 15.2761,8 15,8ZM15,11L9,11C8.7239,11 8.5,10.7761 8.5,10.5C8.5,10.2239 8.7239,10 9,10L15,10C15.2761,10 15.5,10.2239 15.5,10.5C15.5,10.7761 15.2761,11 15,11ZM15,14L9,14C8.7239,14 8.5,13.7761 8.5,13.5C8.5,13.2239 8.7239,13 9,13L15,13C15.2761,13 15.5,13.2239 15.5,13.5C15.5,13.7761 15.2761,14 15,14ZM11.571,17L9,17C8.7239,17 8.5,16.7761 8.5,16.5C8.5,16.2239 8.7239,16 9,16L11.571,16C11.8471,16 12.071,16.2239 12.071,16.5C12.071,16.7761 11.8471,17 11.571,17Z" />
</vector>
</item>
</layer-list>

3
app/src/main/res/layout/activity_home.xml
View File

@ -13,6 +13,9 @@
android:id="@+id/navigationToolbar"
android:layout_width="match_parent"
android:layout_height="56dp"
app:titleMarginStart="16dp"
app:titleMarginEnd="16dp"
app:titleTextAppearance="@style/ToolbarTitleTextStyle"
android:background="?attr/toolbarColor"
android:elevation="8dp"/>

2
app/src/main/res/layout/component_tabs.xml
View File

@ -19,7 +19,7 @@
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/tabs_header_title"
android:textAppearance="@style/headerText"
android:textAppearance="@style/HeaderTextStyle"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

27
app/src/main/res/layout/fragment_library.xml
View File

@ -49,10 +49,21 @@
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"
android:contentDescription="@string/library_favorites"
android:contentDescription="@string/library_bookmarks"
android:focusable="true"
app:listItemIcon="@drawable/library_icon_favorites_circle_background"
app:listItemTitle="@string/library_favorites" />
app:listItemTitle="@string/library_bookmarks" />
<org.mozilla.fenix.library.LibraryListItem
android:id="@+id/libraryReadingList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"
android:contentDescription="@string/library_reading_list"
android:focusable="true"
app:listItemIcon="@drawable/library_icon_reading_list_circle_background"
app:listItemTitle="@string/library_reading_list" />
<org.mozilla.fenix.library.LibraryListItem
android:id="@+id/libraryHistory"
@ -63,16 +74,4 @@
android:focusable="true"
app:listItemIcon="@drawable/library_icon_history_circle_background"
app:listItemTitle="@string/library_history" />
<org.mozilla.fenix.library.LibraryListItem
android:id="@+id/libraryLogins"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"
android:contentDescription="@string/library_logins"
android:focusable="true"
app:listItemIcon="@drawable/library_icon_logins_circle_background"
app:listItemTitle="@string/library_logins" />
</LinearLayout>

4
app/src/main/res/layout/library_list_item.xml
View File

@ -17,7 +17,7 @@
android:layout_marginTop="@dimen/library_item_icon_margin_vertical"
android:layout_marginEnd="@dimen/library_item_icon_margin_horizontal"
android:layout_marginBottom="@dimen/library_item_icon_margin_vertical"
android:background="@drawable/library_icon_logins_circle_background"
android:background="@drawable/library_icon_reading_list_circle_background"
android:clickable="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
@ -30,7 +30,7 @@
android:layout_marginStart="@dimen/library_item_icon_margin_horizontal"
android:clickable="false"
android:gravity="center_vertical"
android:textAppearance="@style/TextAppearance.MaterialComponents.Subtitle1"
android:textAppearance="@style/ListItemTextStyle"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@id/libraryIcon"
app:layout_constraintTop_toTopOf="parent" />

2
app/src/main/res/layout/session_bottom_sheet.xml
View File

@ -44,7 +44,7 @@
android:layout_marginEnd="12dp"
android:layout_marginBottom="8dp"
android:text="@string/tabs_header_title"
android:textAppearance="@style/headerText"
android:textAppearance="@style/HeaderTextStyle"
app:layout_constraintStart_toEndOf="@id/current_session_image"
app:layout_constraintTop_toTopOf="parent" />

24
app/src/main/res/layout/session_item.xml
View File

@ -5,7 +5,7 @@
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_height="96dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="@android:color/white"
@ -31,9 +31,10 @@
android:id="@+id/session_card_timestamp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="12dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="12dp"
android:layout_marginBottom="2dp"
android:layout_marginBottom="5dp"
android:textAppearance="@style/Header14TextStyle"
android:textColor="@color/photonInk80"
android:textSize="16sp"
app:layout_constraintEnd_toStartOf="@id/session_card_overflow_button"
@ -44,8 +45,7 @@
android:id="@+id/session_card_titles"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textColor="@color/photonGrey50"
android:textSize="12sp"
android:textAppearance="@style/TextAppearance.MaterialComponents.Caption"
app:layout_constraintEnd_toEndOf="@id/session_card_timestamp"
app:layout_constraintStart_toStartOf="@id/session_card_timestamp"
app:layout_constraintTop_toBottomOf="@+id/session_card_timestamp" />
@ -54,8 +54,7 @@
android:id="@+id/session_card_extras"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/photonGrey50"
android:textSize="12sp"
android:textAppearance="@style/TextAppearance.MaterialComponents.Caption"
app:layout_constraintStart_toStartOf="@id/session_card_titles"
app:layout_constraintTop_toBottomOf="@+id/session_card_titles" />
@ -71,10 +70,21 @@
android:layout_width="@dimen/glyph_button_width"
android:layout_height="@dimen/glyph_button_height"
android:background="?android:attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/content_description_session_menu"
android:src="@drawable/ic_menu"
android:tint="?attr/toolbarTextColor"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ImageButton
android:id="@+id/session_card_share_button"
android:layout_width="@dimen/glyph_button_width"
android:layout_height="@dimen/glyph_button_height"
android:layout_gravity="bottom|end"
android:background="?android:attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/content_description_session_share"
android:src="@drawable/ic_send"
android:tint="?attr/toolbarTextColor" />
</androidx.cardview.widget.CardView>

2
app/src/main/res/layout/session_list_header.xml
View File

@ -5,7 +5,7 @@
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/header_text"
android:layout_marginBottom="8dp"
android:textAppearance="@style/headerText"
android:textAppearance="@style/HeaderTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</TextView>

3
app/src/main/res/values/attrs.xml
View File

@ -47,4 +47,7 @@
<attr name="historyURLColor" format="reference" />
<attr name="historyTitleColor" format="reference" />
<attr name="historyHeader" format="reference" />
<!-- Library Fragment -->
<attr name="libraryListItemTextColor" format="reference" />
</resources>

26
app/src/main/res/values/colors.xml
View File

@ -51,23 +51,23 @@
<color name="searchPillBackground">#FAFAFC</color>
<color name="searchPillPrimary">#202340</color>
<color name="library_sessions_icon_background">#C0EBFF</color>
<color name="library_sessions_icon">#094490</color>
<color name="library_sessions_icon_background">#B9F0FD</color>
<color name="library_sessions_icon">#0E214A</color>
<color name="library_screenshots_icon_background">#A3FFFF</color>
<color name="library_screenshots_icon">#09616A</color>
<color name="library_screenshots_icon_background">#A5FCD4</color>
<color name="library_screenshots_icon">#1B3F36</color>
<color name="library_downloads_icon_background">#D6CEFF</color>
<color name="library_downloads_icon">#1E1562</color>
<color name="library_downloads_icon_background">#D4C1FA</color>
<color name="library_downloads_icon">#2E2060</color>
<color name="library_favorites_icon_background">#FDD4FF</color>
<color name="library_favorites_icon">#6E006E</color>
<color name="library_favorites_icon_background">#F4B8D9</color>
<color name="library_favorites_icon">#491949</color>
<color name="library_history_icon_background">#FFDAEC</color>
<color name="library_history_icon">#720028</color>
<color name="library_history_icon_background">#F5C0C6</color>
<color name="library_history_icon">#3E0909</color>
<color name="library_key_icon_background">#FFF4C3</color>
<color name="library_key_icon">#C13905</color>
<color name="library_reading_list_icon_background">#FCE98F</color>
<color name="library_reading_list_icon">#8A201F</color>
<color name="history_header_light_theme">#696A6A</color>
<color name="history_title_light_theme">@color/light_mode_text_color</color>
@ -87,4 +87,6 @@
<color name="quick_action_read_icon_background">#fce98f</color>
<color name="quick_action_pull_tab">#2915141A</color>
<color name="library_list_item_text_color_light_mode">#202340</color>
</resources>

2
app/src/main/res/values/dimens.xml
View File

@ -14,7 +14,7 @@
<dimen name="library_item_icon_margin_horizontal">16dp</dimen>
<dimen name="library_item_icon_margin_vertical">8dp</dimen>
<dimen name="history_favicon_width_height">40dp</dimen>
<dimen name="session_card_padding">16dp</dimen>
<dimen name="session_card_padding">14dp</dimen>
<dimen name="tab_border_width">2dp</dimen>
<dimen name="tab_corner_radius">8dp</dimen>
<dimen name="preference_icon_drawable_size">24dp</dimen>

12
app/src/main/res/values/strings.xml
View File

@ -186,11 +186,11 @@
<!-- Option in Library to open Downloads page -->
<string name="library_downloads">Downloads</string>
<!-- Option in Library to open Favorites page -->
<string name="library_favorites">Favorites</string>
<string name="library_bookmarks">Bookmarks</string>
<!-- Option in Library to open History page -->
<string name="library_history">History</string>
<!-- Option in Library to open Logins page -->
<string name="library_logins">Logins</string>
<!-- Option in Library to open Reading List -->
<string name="library_reading_list">Reading List</string>
<!-- Menu Item Label for Search in Library -->
<string name="library_search">Search</string>
<!-- Library Page Title -->
@ -259,4 +259,10 @@
<string name="tab_crash_close">Close tab</string>
<!-- Restore tab button text on the tab crash page -->
<string name="tab_crash_restore">Restore tab</string>
<!-- Content Description for session item menu button -->
<string name="content_description_session_menu">Session Options</string>
<!-- Content Description for session item share button -->
<string name="content_description_session_share">Share Session</string>
</resources>

22
app/src/main/res/values/styles.xml
View File

@ -59,6 +59,9 @@
<item name="historyTitleColor">@color/history_title_light_theme</item>
<item name="historyURLColor">@color/history_url_light_theme</item>
<item name="historyHeader">@color/history_header_light_theme</item>
<!-- Library Fragment -->
<item name="libraryListItemTextColor">@color/library_list_item_text_color_light_mode</item>
</style>
<style name="LightTheme" parent="LightThemeBase">
@ -114,6 +117,9 @@
<item name="historyTitleColor">@color/history_title_private_theme</item>
<item name="historyURLColor">@color/history_url_private_theme</item>
<item name="historyHeader">@color/history_header_private_theme</item>
<!-- Library Fragment -->
<item name="libraryListItemTextColor">@color/off_white</item>
</style>
<style name="PrivateTheme" parent="PrivateThemeBase">
@ -159,10 +165,24 @@
<item name="scrimBackground">@drawable/session_sheet_background</item>
</style>
<style name="headerText" parent="TextAppearance.MaterialComponents.Subtitle1">
<style name="HeaderTextStyle" parent="TextAppearance.MaterialComponents.Subtitle1">
<item name="android:textSize">18sp</item>
<item name="android:textColor">?attr/toolbarTextColor</item>
<item name="android:textStyle">bold</item>
<item name="android:letterSpacing">0.03</item>
</style>
<style name="Header14TextStyle" parent="TextAppearance.MaterialComponents.Body2">
<item name="android:textColor">?attr/toolbarTextColor</item>
<item name="android:textSize">14sp</item>
<item name="android:textStyle">bold</item>
</style>
<style name="ToolbarTitleTextStyle" parent="HeaderTextStyle">
<item name="android:textSize">20sp</item>
</style>
<style name="ListItemTextStyle" parent="TextAppearance.MaterialComponents.Subtitle1">
<item name="android:textColor">?attr/libraryListItemTextColor</item>
</style>
</resources>