coop-cloud-chaos-patchs/outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: Show mobile-style (slide from bottom) menus on mobile (#2025)

Browse Source 
* feat: Show mobile-style (slide from bottom) menus at responsive viewport sizes

* More mobile improvements

* fix: Safari compatability
This commit is contained in:
Tom Moor
2021-04-13 21:43:24 -07:00
committed by GitHub
parent f37371c16e
commit 1dd97c1ddd
8 changed files with 76 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
app/components/ContextMenu/MenuItem.js
View File

@ -3,6 +3,7 @@ import { CheckmarkIcon } from "outline-icons";
import * as React from "react";
import { MenuItem as BaseMenuItem } from "reakit/Menu";
import styled from "styled-components";
import breakpoint from "styled-components-breakpoint";
type Props = {|
onClick?: (SyntheticEvent<>) => void | Promise<void>,
@ -72,7 +73,7 @@ export const MenuAnchor = styled.a`
display: flex;
margin: 0;
border: 0;
padding: 6px 12px;
padding: 12px;
width: 100%;
min-height: 32px;
background: none;
@ -80,7 +81,7 @@ export const MenuAnchor = styled.a`
props.disabled ? props.theme.textTertiary : props.theme.textSecondary};
justify-content: left;
align-items: center;
font-size: 15px;
font-size: 16px;
cursor: default;
user-select: none;
@ -115,6 +116,11 @@ export const MenuAnchor = styled.a`
background: ${props.theme.primary};
}
`};
${breakpoint("tablet")`
padding: 6px 12px;
font-size: 15px;
`};
`;
export default MenuItem;