For #208 - Dark Mode UX edits

nightly-build-test
Emily Kager 5 years ago committed by Jeff Boek
parent f00e388dd4
commit 5d1738e011

@ -4,7 +4,8 @@
package org.mozilla.fenix.home.sessions
import android.graphics.PorterDuff
import android.graphics.Color
import android.graphics.LightingColorFilter
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
@ -112,10 +113,8 @@ class SessionsAdapter(
fun bind(session: ArchivedSession) {
this.session = session
val color = availableColors[(session.id % availableColors.size).toInt()]
session_card_thumbnail.setColorFilter(
ContextCompat.getColor(itemView.context, color),
PorterDuff.Mode.MULTIPLY)
session_card_thumbnail.colorFilter =
LightingColorFilter(ContextCompat.getColor(itemView.context, color), Color.BLACK)
session_card_timestamp.text = session.formattedSavedAt
session_card_titles.text = session.titles
session_card_extras.text = if (session.extrasLabel > 0) {
@ -124,9 +123,14 @@ class SessionsAdapter(
}
companion object {
private val availableColors = listOf(
R.color.photonBlue40, R.color.photonGreen50, R.color.photonYellow50, R.color.photonOrange50,
R.color.photonPurple50, R.color.photonInk70)
private val availableColors =
listOf(
R.color.session_placeholder_blue,
R.color.session_placeholder_green,
R.color.session_placeholder_orange,
R.color.session_placeholder_purple,
R.color.session_placeholder_pink
)
const val LAYOUT_ID = R.layout.session_item
}
}

@ -89,10 +89,17 @@ class AwesomeBarUIView(
init {
with(container.context) {
val draw = getDrawable(R.drawable.ic_link)
draw?.setColorFilter(
ContextCompat.getColor(
this,
DefaultThemeManager.resolveAttribute(R.attr.searchShortcutsTextColor, this)
), PorterDuff.Mode.SRC_IN
)
clipboardSuggestionProvider = ClipboardSuggestionProvider(
this,
loadUrlUseCase,
getDrawable(R.drawable.ic_link)!!.toBitmap(),
draw!!.toBitmap(),
getString(R.string.awesomebar_clipboard_title)
)

@ -66,8 +66,6 @@ class ShortcutEngineManager(
private fun showShortcutEnginePicker() {
with(context) {
awesomeBarUIView.search_shortcuts_button.background = getDrawable(R.drawable.search_pill_background)
awesomeBarUIView.search_shortcuts_button.compoundDrawables[0].setTint(ContextCompat.getColor(this,
DefaultThemeManager.resolveAttribute(R.attr.pillWrapperBackground, this)))
@ -81,9 +79,6 @@ class ShortcutEngineManager(
private fun hideShortcutEnginePicker() {
with(context) {
awesomeBarUIView.search_shortcuts_button.setBackgroundColor(ContextCompat.getColor(this,
DefaultThemeManager.resolveAttribute(R.attr.pillWrapperBackground, this)))
awesomeBarUIView.search_shortcuts_button.compoundDrawables[0].setTint(ContextCompat.getColor(this,
DefaultThemeManager.resolveAttribute(R.attr.searchShortcutsTextColor, this)))

@ -6,22 +6,31 @@ package org.mozilla.fenix.utils
import android.content.Context
import android.view.View
import androidx.core.content.ContextCompat
import com.google.android.material.snackbar.Snackbar
import org.mozilla.fenix.R
import org.mozilla.fenix.ext.asActivity
import org.mozilla.fenix.ext.components
class ItsNotBrokenSnack(val context: Context) {
fun showSnackbar(issueNumber: String) {
val rootView = context.asActivity()?.window?.decorView?.findViewById<View>(android.R.id.content)
val rootView =
context.asActivity()?.window?.decorView?.findViewById<View>(android.R.id.content)
rootView?.let {
Snackbar.make(rootView, message.replace("%", issueNumber), Snackbar.LENGTH_SHORT).apply {
setAction("Add Tab to Issue") {
context.components.useCases.tabsUseCases.addTab
.invoke(issues + issueNumber)
Snackbar.make(rootView, message.replace("%", issueNumber), Snackbar.LENGTH_SHORT)
.apply {
setAction("Add Tab to Issue") {
context.components.useCases.tabsUseCases.addTab
.invoke(issues + issueNumber)
}.setActionTextColor(
ContextCompat.getColor(
context,
R.color.accent_bright_dark_theme
)
)
show()
}
show()
}
}
}

@ -10,7 +10,7 @@
<path
android:pathData="M2.47,5.53L5.515,2.485C5.7829,2.2172 6.2171,2.2172 6.485,2.485L10.685,6.685C11.4609,5.7001 11.3815,4.2915 10.5,3.4L7.837,0.734C6.863,-0.2399 5.284,-0.2399 4.31,0.734L0.766,4.279C0.2984,4.7465 0.0356,5.3807 0.0356,6.042C0.0356,6.7033 0.2984,7.3375 0.766,7.805L3.426,10.466C4.3,11.3366 5.68,11.4354 6.669,10.698L2.47,6.5C2.3409,6.3716 2.2683,6.1971 2.2683,6.015C2.2683,5.8329 2.3409,5.6584 2.47,5.53ZM19.27,12.163L19.266,12.163C20.2383,13.137 20.2379,14.7145 19.265,15.688L15.72,19.232C15.2525,19.6996 14.6183,19.9624 13.957,19.9624C13.2957,19.9624 12.6615,19.6996 12.194,19.232L9.533,16.572C8.6621,15.6985 8.5633,14.3186 9.301,13.33L13.501,17.53C13.6293,17.6588 13.8037,17.7312 13.9855,17.7312C14.1673,17.7312 14.3417,17.6588 14.47,17.53L17.512,14.479C17.7798,14.2111 17.7798,13.7769 17.512,13.509L13.312,9.309C14.2998,8.53 15.7139,8.612 16.605,9.5L19.27,12.163ZM14.163,12.718C14.542,13.1104 14.5366,13.7341 14.1508,14.1198C13.7651,14.5056 13.1414,14.511 12.749,14.132L5.829,7.212C5.559,6.9632 5.4471,6.5864 5.5375,6.2306C5.6279,5.8747 5.906,5.597 6.262,5.5071C6.6179,5.4172 6.9946,5.5297 7.243,5.8L14.163,12.718Z"
android:strokeWidth="1"
android:fillColor="#2B20C1"
android:fillColor="?pillWrapperSelectedBackground"
android:fillType="evenOdd"
android:strokeColor="#00000000"/>
</vector>

@ -1,20 +0,0 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="64dp"
android:height="64dp"
android:viewportWidth="64"
android:viewportHeight="64">
<path
android:pathData="M12,8L60,8A4,4 0,0 1,64 12L64,60A4,4 0,0 1,60 64L12,64A4,4 0,0 1,8 60L8,12A4,4 0,0 1,12 8z"
android:fillColor="#024690"/>
<path
android:pathData="M8,4L56,4A4,4 0,0 1,60 8L60,56A4,4 0,0 1,56 60L8,60A4,4 0,0 1,4 56L4,8A4,4 0,0 1,8 4z"
android:fillColor="#0B68CD"/>
<path
android:pathData="M4,0L52,0A4,4 0,0 1,56 4L56,52A4,4 0,0 1,52 56L4,56A4,4 0,0 1,0 52L0,4A4,4 0,0 1,4 0z"
android:fillColor="#0390ED"/>
<path
android:pathData="M28.37,22.793L33.5,14 44,32L32.988,32c-0.26,5.567 -4.857,10 -10.488,10C16.701,42 12,37.299 12,31.5S16.701,21 22.5,21c2.175,0 4.195,0.661 5.87,1.793zM28.37,22.793L23,32h9.988c0.008,-0.166 0.012,-0.332 0.012,-0.5 0,-3.624 -1.836,-6.82 -4.63,-8.707z"
android:strokeAlpha="0.5"
android:fillColor="#024690"
android:fillAlpha="0.5"/>
</vector>

@ -0,0 +1,21 @@
<!-- 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="64dp"
android:height="64dp"
android:viewportWidth="64"
android:viewportHeight="64">
<path
android:fillColor="@color/photonGrey60"
android:pathData="M12,8L60,8A4,4 0,0 1,64 12L64,60A4,4 0,0 1,60 64L12,64A4,4 0,0 1,8 60L8,12A4,4 0,0 1,12 8z" />
<path
android:fillColor="@color/photonGrey40"
android:pathData="M8,4L56,4A4,4 0,0 1,60 8L60,56A4,4 0,0 1,56 60L8,60A4,4 0,0 1,4 56L4,8A4,4 0,0 1,8 4z" />
<path
android:fillColor="@color/photonWhite"
android:pathData="M4,0L52,0A4,4 0,0 1,56 4L56,52A4,4 0,0 1,52 56L4,56A4,4 0,0 1,0 52L0,4A4,4 0,0 1,4 0z" />
<path
android:fillColor="@color/photonGrey30"
android:pathData="M28.37,22.793L33.5,14 44,32L32.988,32c-0.26,5.567 -4.857,10 -10.488,10C16.701,42 12,37.299 12,31.5S16.701,21 22.5,21c2.175,0 4.195,0.661 5.87,1.793zM28.37,22.793L23,32h9.988c0.008,-0.166 0.012,-0.332 0.012,-0.5 0,-3.624 -1.836,-6.82 -4.63,-8.707z" />
</vector>

@ -0,0 +1,12 @@
<?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/. -->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="?attr/pillWrapperBackground"/>
<stroke android:width="1dp"
android:color="?attr/disabledIconColor"/>
<corners android:radius="16dp"/>
</shape>

@ -0,0 +1,8 @@
<?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/. -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/search_pill_background" android:state_checked="true" />
<item android:drawable="@drawable/search_pill_background_unselected" />
</selector>

@ -74,21 +74,21 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<Button
style="@style/search_pill"
<ToggleButton
android:id="@+id/search_scan_button"
android:text="@string/search_scan_button"
android:drawableStart="@drawable/ic_qr"
style="@style/search_pill"
android:layout_marginEnd="8dp"
android:drawableStart="@drawable/ic_qr"
android:textColor="?attr/searchShortcutsTextColor"
android:background="?attr/pillWrapperBackground"/>
android:textOff="@string/search_scan_button"
android:textOn="@string/search_scan_button" />
<Button
style="@style/search_pill"
<ToggleButton
android:id="@+id/search_shortcuts_button"
android:text="@string/search_shortcuts_button"
style="@style/search_pill"
android:drawableStart="@drawable/ic_search"
android:textColor="?attr/searchShortcutsTextColor"
android:background="?attr/pillWrapperBackground"/>
android:textOff="@string/search_shortcuts_button"
android:textOn="@string/search_shortcuts_button" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

@ -32,7 +32,9 @@
android:layout_margin="12dp"
android:contentDescription="@string/current_session_image"
android:paddingBottom="20dp"
android:src="@drawable/ic_session_thumbnail_placeholder_blue"
android:src="@drawable/ic_session_thumbnail_placeholder_greyscale"
android:tint="@color/session_placeholder_blue"
android:tintMode="multiply"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
@ -91,7 +93,7 @@
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/photonGrey30" />
android:background="?attr/listDividerColor" />
<TextView
android:id="@+id/archive_session_button"

@ -23,7 +23,7 @@
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/session_card_padding"
android:src="@drawable/ic_session_thumbnail_placeholder_blue"
android:src="@drawable/ic_session_thumbnail_placeholder_greyscale"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

@ -11,8 +11,9 @@
<color name="windowBackground_normal_theme">@color/background_dark_theme</color>
<color name="text_color_normal_theme">@color/off_white</color>
<color name="toolbar_normal_theme">@color/foreground_dark_theme</color>
<color name="toggle_activated_normal_theme">#A374F7</color>
<color name="toggle_activated_normal_theme">@color/accent_bright_dark_theme</color>
<color name="colorSwitchThumbNormal_normal_theme">@color/off_white</color>
<color name="color_accent_normal_theme">@color/off_white</color>
<color name="navigationBarColorHome_normal_theme">@android:color/transparent</color>
<color name="navigationBarColorBrowser_normal_theme">@android:color/transparent</color>
@ -29,6 +30,7 @@
<color name="homeBackgroundBottomGradient_normal_theme">@color/background_dark_theme</color>
<color name="menu_button_tint_normal_theme">@color/home_buttons_dark_theme</color>
<color name="privateBrowsingButtonTint_normal_theme">@color/home_buttons_dark_theme</color>
<color name="list_divider_color_normal_theme">#494951</color>
<!-- Colors for SearchView on homescreen -->
<color name="searchBackground_normal_theme">@color/foreground_dark_theme</color>
@ -41,7 +43,7 @@
<!-- Session Colors -->
<color name="sessionBackgroundColor_normal_theme">@color/foreground_dark_theme</color>
<color name="session_border_color">#592ACB</color>
<color name="session_border_color">@color/accent_bright_dark_theme</color>
<color name="save_session_button_color">#EFEFF2</color>
<color name="save_session_button_text_color">#1E1338</color>
<color name="delete_session_button_background">#e5e5ea</color>
@ -58,7 +60,7 @@
<color name="library_list_item_text_color_light_mode">@color/off_white</color>
<!-- Search Fragment -->
<color name="suggestionBackground_normal_theme">#A374F7</color>
<color name="suggestionBackground_normal_theme">@color/accent_bright_dark_theme</color>
<color name="search_text">@color/off_white</color>
<color name="url_box_view">@color/foreground_dark_theme</color>

@ -31,6 +31,7 @@
<attr name="sessionBackgroundColor" format="reference" />
<attr name="sessionBorderColor" format="reference" />
<attr name="deleteColor" format="reference" />
<attr name="listDividerColor" format="reference" />
<!-- Search fragment -->
<attr name="searchBackground" format="reference"/>

@ -7,6 +7,7 @@
<color name="color_primary">#544CD9</color>
<color name="color_primary_dark">#202340</color>
<color name="color_accent">#D81B60</color>
<color name="color_accent_normal_theme">#312a65</color>
<color name="off_white">#f9f9fa</color>
<color name="secondary_text_color_normal_theme">#6b6b6b</color>
@ -20,7 +21,14 @@
<color name="foreground_dark_theme">#32313C</color>
<color name="home_buttons_dark_theme">#A2A1A5</color>
<color name="secondaryTextColor_dark_theme">#A4A3AA</color>
<color name="accent_bright_dark_theme">#AB71FF</color>
<!-- Session Placeholder Available Colors -->
<color name="session_placeholder_blue">#00B3F4</color>
<color name="session_placeholder_orange">#FF8A50</color>
<color name="session_placeholder_green">#54FFBD</color>
<color name="session_placeholder_purple">@color/accent_bright_dark_theme</color>
<color name="session_placeholder_pink">#FF4AA2</color>
<!-- Normal Theme -->
<color name="history_header_normal_theme">#696A6A</color>
<color name="history_title_normal_theme">@color/text_color_normal_theme</color>
@ -40,6 +48,7 @@
<color name="privateBrowsingButtonTint_normal_theme">@color/menu_button_tint_normal_theme</color>
<color name="browserToolbarBackground_normal_theme">@color/off_white</color>
<color name="unloaded_progress_normal_theme">#E0E0E6</color>
<color name="list_divider_color_normal_theme">@color/photonGrey30</color>
<color name="searchBackground_normal_theme">@color/off_white</color>
<color name="search_stroke_normal">#c5c8d7</color>

@ -13,7 +13,8 @@
<item name="disabledIconColor">@color/disabled_icons_normal_theme</item>
<item name="toolbarColor">@color/toolbar_normal_theme</item>
<item name="colorPrimary">@color/color_primary</item>
<item name="colorAccent">@color/session_border_color</item>
<!-- Color Accent is used for Settings Category Text Color -->
<item name="colorAccent">@color/color_accent_normal_theme</item>
<item name="android:progressBarStyleHorizontal">@style/progressBarStyleHorizontal</item>
<item name="primaryTextColor">@color/text_color_normal_theme</item>
<item name="secondaryTextColor">@color/secondary_text_color_normal_theme</item>
@ -47,6 +48,7 @@
<item name="sessionBackgroundColor">@color/sessionBackgroundColor_normal_theme</item>
<item name="sessionBorderColor">@color/session_border_color</item>
<item name="deleteColor">@color/delete_color</item>
<item name="listDividerColor">@color/list_divider_color_normal_theme</item>
<!-- Search fragment colors -->
<item name="searchBackground">@color/searchBackground_normal_theme</item>
@ -111,6 +113,7 @@
<item name="sessionBackgroundColor">@color/session_list_private_header</item>
<item name="sessionBorderColor">@color/private_browsing_primary</item>
<item name="deleteColor">@color/photonRed60</item>
<item name="listDividerColor">@color/search_private_background</item>
<!-- Search fragment colors -->
<item name="searchBackground">@color/private_browsing_bottom_gradient</item>
@ -151,19 +154,19 @@
<style name="search_pill" parent="Widget.AppCompat.Button.Borderless">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_height">32dp</item>
<item name="android:textAllCaps">false</item>
<item name="android:textSize">14sp</item>
<item name="android:textColor">@color/search_pill_primary</item>
<item name="android:layout_gravity">center_vertical</item>
<item name="android:gravity">center_vertical</item>
<item name="android:singleLine">true</item>
<item name="android:padding">8dp</item>
<item name="android:paddingStart">8dp</item>
<item name="android:paddingEnd">16dp</item>
<item name="android:drawablePadding">8dp</item>
<item name="android:minWidth">0dp</item>
<item name="android:minHeight">0dp</item>
<item name="android:background">@drawable/search_pill_background</item>
<item name="android:background">@drawable/search_pill_drawable_button_background</item>
</style>
<style name="SitePermissionButton" parent="Widget.AppCompat.Button.Borderless">

Loading…
Cancel
Save