FreshRSS/FluentReader
1
0
Fork 0
mirror of https://github.com/yang991178/fluent-reader.git synced 2025-03-02 18:37:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix backdrop filter on mac

Browse Source
This commit is contained in:
Bruce Liu 2020-06-21 15:25:13 +08:00
parent 06abd8bc21
commit b7e97f3db1
3 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
dist/styles.css vendored
View File

@ -404,6 +404,9 @@ img.favicon {
body.darwin .menu-container .menu { body.darwin .menu-container .menu {
background: none; background: none;
} }
body.darwin .menu-container .menu.item-on {
background-color: var(--neutralLight);
}
.menu-container .menu::after { .menu-container .menu::after {
content: ""; content: "";
display: block; display: block;

3
src/components/menu.tsx
View File

@ -14,6 +14,7 @@ export type MenuProps = {
sources: SourceState, sources: SourceState,
groups: SourceGroup[], groups: SourceGroup[],
searchOn: boolean, searchOn: boolean,
itemOn: boolean,
toggleMenu: () => void, toggleMenu: () => void,
allArticles: () => void, allArticles: () => void,
selectSourceGroup: (group: SourceGroup, menuKey: string) => void, selectSourceGroup: (group: SourceGroup, menuKey: string) => void,
@ -115,7 +116,7 @@ export class Menu extends React.Component<MenuProps> {
render() { render() {
return this.props.status && ( return this.props.status && (
<div className="menu-container" onClick={this.props.toggleMenu} style={{display: this.props.display ? "block" : "none"}}> <div className="menu-container" onClick={this.props.toggleMenu} style={{display: this.props.display ? "block" : "none"}}>
<div className="menu" onClick={(e) => e.stopPropagation()}> <div className={"menu" + (this.props.itemOn ? " item-on" : "")} onClick={(e) => e.stopPropagation()}>
<div className="btn-group"> <div className="btn-group">
<a className="btn hide-wide" title={intl.get("menu.close")} onClick={this.props.toggleMenu}><Icon iconName="Back" /></a> <a className="btn hide-wide" title={intl.get("menu.close")} onClick={this.props.toggleMenu}><Icon iconName="Back" /></a>
<a className="btn inline-block-wide" title={intl.get("menu.close")} onClick={this.props.toggleMenu}><Icon iconName="GlobalNavButton" /></a> <a className="btn inline-block-wide" title={intl.get("menu.close")} onClick={this.props.toggleMenu}><Icon iconName="GlobalNavButton" /></a>

8
src/containers/menu-container.tsx
View File

@ -4,7 +4,7 @@ import { RootState } from "../scripts/reducer"
import { Menu } from "../components/menu" import { Menu } from "../components/menu"
import { toggleMenu, openGroupMenu } from "../scripts/models/app" import { toggleMenu, openGroupMenu } from "../scripts/models/app"
import { SourceGroup, toggleGroupExpansion } from "../scripts/models/group" import { SourceGroup, toggleGroupExpansion } from "../scripts/models/group"
import { selectAllArticles, selectSources, toggleSearch } from "../scripts/models/page" import { selectAllArticles, selectSources, toggleSearch, ViewType } from "../scripts/models/page"
import { initFeeds } from "../scripts/models/feed" import { initFeeds } from "../scripts/models/feed"
import { RSSSource } from "../scripts/models/source" import { RSSSource } from "../scripts/models/source"
@ -12,16 +12,18 @@ const getApp = (state: RootState) => state.app
const getSources = (state: RootState) => state.sources const getSources = (state: RootState) => state.sources
const getGroups = (state: RootState) => state.groups const getGroups = (state: RootState) => state.groups
const getSearchOn = (state: RootState) => state.page.searchOn const getSearchOn = (state: RootState) => state.page.searchOn
const getItemOn = (state: RootState) => state.page.itemId !== null && state.page.viewType !== ViewType.List
const mapStateToProps = createSelector( const mapStateToProps = createSelector(
[getApp, getSources, getGroups, getSearchOn], [getApp, getSources, getGroups, getSearchOn, getItemOn],
(app, sources, groups, searchOn) => ({ (app, sources, groups, searchOn, itemOn) => ({
status: app.sourceInit, status: app.sourceInit,
display: app.menu, display: app.menu,
selected: app.menuKey, selected: app.menuKey,
sources: sources, sources: sources,
groups: groups, groups: groups,
searchOn: searchOn, searchOn: searchOn,
itemOn: itemOn,
}) })
) )