Skip to content

Commit

Permalink
Added header to reading list panel
Browse files Browse the repository at this point in the history
fix brave/brave-browser#32953

Reading list header includes its icon & title.
  • Loading branch information
simonhong committed Sep 18, 2023
1 parent a8aeb07 commit 5e2fa93
Show file tree
Hide file tree
Showing 10 changed files with 149 additions and 1 deletion.
3 changes: 3 additions & 0 deletions app/brave_generated_resources.grd
Original file line number Diff line number Diff line change
Expand Up @@ -796,6 +796,9 @@ Or change later at <ph name="SETTINGS_EXTENIONS_LINK">$2<ex>brave://settings/ext
<message name="IDS_SIDEBAR_ADD_ITEM_BUTTON_TOOLTIP" desc="Text of sidebar add item button tooltip">
Add to Sidebar
</message>
<message name="IDS_SIDEBAR_READING_LIST_PANEL_HEADER_TITLE" desc="Text of readling list panel header">
Reading List
</message>
</if>

<!-- Stats -->
Expand Down
1 change: 1 addition & 0 deletions app/theme/brave_theme_resources.grd
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@
<if expr="toolkit_views">
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_ITEM_HIGHLIGHT" file="brave/sidebar_item_highlight.png" />
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_ITEM_HIGHLIGHT_RIGHT" file="brave/sidebar_item_highlight_right.png" />
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_READING_LIST_PANEL_HEADER" file="brave/sidebar_reading_list_panel_header.png" />
</if>
<if expr="enable_ipfs and not is_android">
<structure type="chrome_scaled_image" name="IDR_BRAVE_IPFS_LOGO" file="brave/ipfs_logo.png" />
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions browser/ui/BUILD.gn
Original file line number Diff line number Diff line change
Expand Up @@ -330,6 +330,8 @@ source_set("ui") {
"views/page_action/brave_page_action_icon_container_view.h",
"views/rounded_separator.cc",
"views/rounded_separator.h",
"views/side_panel/brave_read_later_side_panel_view.cc",
"views/side_panel/brave_read_later_side_panel_view.h",
"views/side_panel/brave_side_panel.cc",
"views/side_panel/brave_side_panel.h",
"views/side_panel/brave_side_panel_resize_widget.cc",
Expand Down
5 changes: 4 additions & 1 deletion browser/ui/color/brave_color_id.h
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,10 @@
E_CPONLY(kColorSidebarButtonPressed) \
E_CPONLY(kColorSidebarItemBackgroundHovered) \
E_CPONLY(kColorSidebarItemDragIndicator) \
E_CPONLY(kColorSidebarSeparator)
E_CPONLY(kColorSidebarSeparator) \
E_CPONLY(kColorSidebarPanelHeaderSeparator) \
E_CPONLY(kColorSidebarPanelHeaderBackground) \
E_CPONLY(kColorSidebarPanelHeaderTitle)

#if BUILDFLAG(ENABLE_SPEEDREADER)
#define BRAVE_SPEEDREADER_COLOR_IDS \
Expand Down
13 changes: 13 additions & 0 deletions browser/ui/color/brave_color_mixer.cc
Original file line number Diff line number Diff line change
Expand Up @@ -356,6 +356,12 @@ void AddBraveLightThemeColorMixer(ui::ColorProvider* provider,
mixer[kColorSidebarArrowBackgroundHovered] = {GetToolbarInkDropColor(mixer)};
mixer[kColorSidebarItemBackgroundHovered] = {GetToolbarInkDropColor(mixer)};
mixer[kColorSidebarSeparator] = {SkColorSetRGB(0xE6, 0xE8, 0xF5)};
mixer[kColorSidebarPanelHeaderSeparator] = {
leo::GetColor(leo::Color::kColorDividerSubtle, leo::Theme::kLight)};
mixer[kColorSidebarPanelHeaderBackground] = {
leo::GetColor(leo::Color::kColorContainerBackground, leo::Theme::kLight)};
mixer[kColorSidebarPanelHeaderTitle] = {
leo::GetColor(leo::Color::kColorTextSecondary, leo::Theme::kLight)};

if (HasCustomToolbarColor(key)) {
// When custom color for toolbar is set, we can't depend on the color mode.
Expand Down Expand Up @@ -462,6 +468,13 @@ void AddBraveDarkThemeColorMixer(ui::ColorProvider* provider,
mixer[kColorSidebarArrowBackgroundHovered] = {GetToolbarInkDropColor(mixer)};
mixer[kColorSidebarItemBackgroundHovered] = {GetToolbarInkDropColor(mixer)};
mixer[kColorSidebarSeparator] = {SkColorSetRGB(0x5E, 0x61, 0x75)};
mixer[kColorSidebarPanelHeaderSeparator] = {
leo::GetColor(leo::Color::kColorDividerSubtle, leo::Theme::kDark)};
mixer[kColorSidebarPanelHeaderBackground] = {
leo::GetColor(leo::Color::kColorContainerBackground, leo::Theme::kDark)};
mixer[kColorSidebarPanelHeaderTitle] = {
leo::GetColor(leo::Color::kColorTextSecondary, leo::Theme::kDark)};

if (HasCustomToolbarColor(key)) {
// When custom color for toolbar is set, we can't depend on the color mode.
mixer[kColorSidebarButtonBase] = {PickColorContrastingToToolbar(
Expand Down
88 changes: 88 additions & 0 deletions browser/ui/views/side_panel/brave_read_later_side_panel_view.cc
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
/* Copyright (c) 2023 The Brave Authors. All rights reserved.
* 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 https://mozilla.org/MPL/2.0/. */

#include "brave/browser/ui/views/side_panel/brave_read_later_side_panel_view.h"

#include <memory>

#include "brave/browser/ui/color/brave_color_id.h"
#include "brave/grit/brave_generated_resources.h"
#include "brave/grit/brave_theme_resources.h"
#include "chrome/browser/ui/views/side_panel/read_later_side_panel_web_view.h"
#include "ui/base/l10n/l10n_util.h"
#include "ui/base/resource/resource_bundle.h"
#include "ui/gfx/font_list.h"
#include "ui/gfx/geometry/insets.h"
#include "ui/views/background.h"
#include "ui/views/controls/image_view.h"
#include "ui/views/controls/label.h"
#include "ui/views/controls/separator.h"
#include "ui/views/layout/flex_layout.h"
#include "ui/views/layout/layout_types.h"

namespace {

// Renders icon and title.
class ReadLaterSidePanelHeaderView : public views::View {
public:
ReadLaterSidePanelHeaderView() {
constexpr int kHeaderInteriorMargin = 16;
SetLayoutManager(std::make_unique<views::FlexLayout>())
->SetOrientation(views::LayoutOrientation::kHorizontal)
.SetInteriorMargin(gfx::Insets(kHeaderInteriorMargin))
.SetMainAxisAlignment(views::LayoutAlignment::kStart)
.SetCrossAxisAlignment(views::LayoutAlignment::kCenter);

ui::ResourceBundle& rb = ui::ResourceBundle::GetSharedInstance();
auto* header_image = AddChildView(
std::make_unique<views::ImageView>(ui::ImageModel::FromImageSkia(
*rb.GetImageSkiaNamed(IDR_SIDEBAR_READING_LIST_PANEL_HEADER))));
constexpr int kSpacingBetweenHeaderImageAndLabel = 8;
header_image->SetProperty(
views::kMarginsKey,
gfx::Insets::TLBR(0, 0, 0, kSpacingBetweenHeaderImageAndLabel));
header_image->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kPreferred));

auto* header_label =
AddChildView(std::make_unique<views::Label>(l10n_util::GetStringUTF16(
IDS_SIDEBAR_READING_LIST_PANEL_HEADER_TITLE)));
header_label->SetFontList(gfx::FontList("Poppins, Semi-Bold 16px"));
header_label->SetEnabledColorId(kColorSidebarPanelHeaderTitle);
header_label->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kPreferred));

SetBackground(
views::CreateThemedSolidBackground(kColorSidebarPanelHeaderBackground));
}

~ReadLaterSidePanelHeaderView() override = default;
ReadLaterSidePanelHeaderView(const ReadLaterSidePanelHeaderView&) = delete;
ReadLaterSidePanelHeaderView& operator=(const ReadLaterSidePanelHeaderView&) =
delete;
};

} // namespace

BraveReadLaterSidePanelView::BraveReadLaterSidePanelView(
Browser* browser,
base::RepeatingClosure close_cb) {
SetLayoutManager(std::make_unique<views::FlexLayout>())
->SetOrientation(views::LayoutOrientation::kVertical);
AddChildView(std::make_unique<ReadLaterSidePanelHeaderView>());
AddChildView(std::make_unique<views::Separator>())
->SetColorId(kColorSidebarPanelHeaderSeparator);
AddChildView(std::make_unique<ReadLaterSidePanelWebView>(browser, close_cb))
->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kUnbounded));
}

BraveReadLaterSidePanelView::~BraveReadLaterSidePanelView() = default;
25 changes: 25 additions & 0 deletions browser/ui/views/side_panel/brave_read_later_side_panel_view.h
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
/* Copyright (c) 2023 The Brave Authors. All rights reserved.
* 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 https://mozilla.org/MPL/2.0/. */

#ifndef BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_READ_LATER_SIDE_PANEL_VIEW_H_
#define BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_READ_LATER_SIDE_PANEL_VIEW_H_

#include "base/functional/callback_forward.h"
#include "ui/views/view.h"

class Browser;

// Gives reading list specific header view with web view.
class BraveReadLaterSidePanelView : public views::View {
public:
BraveReadLaterSidePanelView(Browser* browser,
base::RepeatingClosure close_cb);
~BraveReadLaterSidePanelView() override;
BraveReadLaterSidePanelView(const BraveReadLaterSidePanelView&) = delete;
BraveReadLaterSidePanelView& operator=(const BraveReadLaterSidePanelView&) =
delete;
};

#endif // BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_READ_LATER_SIDE_PANEL_VIEW_H_
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
// Copyright (c) 2023 The Brave Authors. All rights reserved.
// 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 https://mozilla.org/MPL/2.0/.

#include "brave/browser/ui/views/side_panel/brave_read_later_side_panel_view.h"
#include "chrome/browser/ui/views/side_panel/read_later_side_panel_web_view.h"

#define ReadLaterSidePanelWebView BraveReadLaterSidePanelView

#include "src/chrome/browser/ui/views/side_panel/reading_list/reading_list_side_panel_coordinator.cc"

#undef ReadLaterSidePanelWebView

0 comments on commit 5e2fa93

Please sign in to comment.