From 753b33aec5a12a30f08701aa04b6ec67e7f590de Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 11 Nov 2018 15:31:52 +0100 Subject: Remove "Home" menu item, instead make different parts of logo link to different sections of the website --- packages/website/ts/components/nested_sidebar_menu.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages/website/ts/components/nested_sidebar_menu.tsx') diff --git a/packages/website/ts/components/nested_sidebar_menu.tsx b/packages/website/ts/components/nested_sidebar_menu.tsx index db7d55261..552839fb7 100644 --- a/packages/website/ts/components/nested_sidebar_menu.tsx +++ b/packages/website/ts/components/nested_sidebar_menu.tsx @@ -70,7 +70,7 @@ export class MenuItem extends React.Component { borderRadius="4px" padding="0.4em 0.375em" width="100%" - backgroundColor={isActive ? colors.lightLinkBlue : colors.grey100} + backgroundColor={isActive ? colors.lightLinkBlue : 'transparent'} fontSize="14px" textAlign="left" > -- cgit v1.2.3 From 1ec8a4115f386c45b12bdf0b6ebdcabb1a1c5bb7 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 11 Nov 2018 16:48:31 +0100 Subject: Fix menuItem background colors depending on the context --- packages/website/ts/components/nested_sidebar_menu.tsx | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) (limited to 'packages/website/ts/components/nested_sidebar_menu.tsx') diff --git a/packages/website/ts/components/nested_sidebar_menu.tsx b/packages/website/ts/components/nested_sidebar_menu.tsx index 552839fb7..4d4bc4617 100644 --- a/packages/website/ts/components/nested_sidebar_menu.tsx +++ b/packages/website/ts/components/nested_sidebar_menu.tsx @@ -4,11 +4,13 @@ import * as _ from 'lodash'; import * as React from 'react'; import { Button } from 'ts/components/ui/button'; import { Text } from 'ts/components/ui/text'; +import { ScreenWidths } from 'ts/types'; export interface NestedSidebarMenuProps { sectionNameToLinks: ObjectMap; sidebarHeader?: React.ReactNode; shouldReformatMenuItemNames?: boolean; + screenWidth: ScreenWidths; } export const NestedSidebarMenu = (props: NestedSidebarMenuProps) => { @@ -22,7 +24,7 @@ export const NestedSidebarMenu = (props: NestedSidebarMenuProps) => { ...link, title: menuItemTitle, }; - return ; + return ; }); // tslint:disable-next-line:no-unused-variable return ( @@ -44,6 +46,7 @@ export const NestedSidebarMenu = (props: NestedSidebarMenuProps) => { export interface MenuItemProps { link: ALink; + screenWidth: ScreenWidths; } export interface MenuItemState { @@ -70,7 +73,13 @@ export class MenuItem extends React.Component { borderRadius="4px" padding="0.4em 0.375em" width="100%" - backgroundColor={isActive ? colors.lightLinkBlue : 'transparent'} + backgroundColor={ + isActive + ? colors.lightLinkBlue + : this.props.screenWidth === ScreenWidths.Sm + ? 'white' + : colors.grey100 + } fontSize="14px" textAlign="left" > -- cgit v1.2.3