Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2024-11-22 08:36:33 +03:00
Code Issues Packages Projects Releases Wiki Activity

chore: run prettier

Browse Source
This commit is contained in:
Roman Hotsiy 2018-03-22 18:23:32 +02:00
parent d92ed428f9
commit 4b15a1702d
No known key found for this signature in database
GPG Key ID: 5CB7B3ACABA57CB0
2 changed files with 22 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/SideMenu/MenuItem.tsx
View File

@ -40,19 +40,24 @@ export class MenuItem extends React.Component<MenuItemProps> {
render() { render() {
const { item, withoutChildren } = this.props; const { item, withoutChildren } = this.props;
return ( return (
<MenuItemLi onClick={this.activate} depth={item.depth} innerRef={this.saveRef} data-item-id={item.id}> <MenuItemLi
onClick={this.activate}
depth={item.depth}
innerRef={this.saveRef}
data-item-id={item.id}
>
{item.type === 'operation' ? ( {item.type === 'operation' ? (
<OperationMenuItemContent item={item as OperationModel} /> <OperationMenuItemContent item={item as OperationModel} />
) : ( ) : (
<MenuItemLabel depth={item.depth} active={item.active} type={item.type}> <MenuItemLabel depth={item.depth} active={item.active} type={item.type}>
<MenuItemTitle title={item.name}>{item.name}</MenuItemTitle> <MenuItemTitle title={item.name}>{item.name}</MenuItemTitle>
{(item.depth > 0 && {(item.depth > 0 &&
item.items.length > 0 && ( item.items.length > 0 && (
<ShelfIcon float={'right'} direction={item.active ? 'down' : 'right'} /> <ShelfIcon float={'right'} direction={item.active ? 'down' : 'right'} />
)) || )) ||
null} null}
</MenuItemLabel> </MenuItemLabel>
)} )}
{!withoutChildren && {!withoutChildren &&
item.items && item.items &&
item.items.length > 0 && ( item.items.length > 0 && (

13
src/components/SideMenu/styled.elements.ts
View File

@ -5,7 +5,7 @@ import styled, { css, withProps } from '../../styled-components';
export const OperationBadge = withProps<{ type: string }>(styled.span).attrs({ export const OperationBadge = withProps<{ type: string }>(styled.span).attrs({
className: props => `operation-type ${props.type}`, className: props => `operation-type ${props.type}`,
}) ` })`
width: 26px; width: 26px;
display: inline-block; display: inline-block;
height: ${props => props.theme.code.fontSize};; height: ${props => props.theme.code.fontSize};;
@ -70,7 +70,7 @@ function menuItemActiveBg(depth): string {
} }
} }
export const MenuItemUl = withProps<{ active: boolean }>(styled.ul) ` export const MenuItemUl = withProps<{ active: boolean }>(styled.ul)`
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -81,7 +81,7 @@ export const MenuItemUl = withProps<{ active: boolean }>(styled.ul) `
${props => (props.active ? '' : 'display: none;')}; ${props => (props.active ? '' : 'display: none;')};
`; `;
export const MenuItemLi = withProps<{ depth: number }>(styled.li) ` export const MenuItemLi = withProps<{ depth: number }>(styled.li)`
list-style: none inside none; list-style: none inside none;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -121,12 +121,13 @@ export const MenuItemLabel = withProps<{
classnames('-depth' + props.depth, { classnames('-depth' + props.depth, {
active: props.active, active: props.active,
}), }),
}) ` })`
cursor: pointer; cursor: pointer;
color: ${props => (props.active ? props.theme.colors.main : props.theme.colors.text)}; color: ${props => (props.active ? props.theme.colors.main : props.theme.colors.text)};
margin: 0; margin: 0;
padding: 12.5px ${props => props.theme.spacingUnit}px; padding: 12.5px ${props => props.theme.spacingUnit}px;
${({ depth, type, theme }) => type === 'section' && depth > 1 && 'padding-left: ' + theme.spacingUnit * 2 + 'px;' || ''} ${({ depth, type, theme }) =>
(type === 'section' && depth > 1 && 'padding-left: ' + theme.spacingUnit * 2 + 'px;') || ''}
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-family: ${props => props.theme.headingsFont.family}; font-family: ${props => props.theme.headingsFont.family};
@ -140,7 +141,7 @@ export const MenuItemLabel = withProps<{
} }
`; `;
export const MenuItemTitle = withProps<{ width?: string }>(styled.span) ` export const MenuItemTitle = withProps<{ width?: string }>(styled.span)`
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
width: ${props => (props.width ? props.width : 'auto')}; width: ${props => (props.width ? props.width : 'auto')};