diff --git a/src/components/search/index.tsx b/src/components/search/index.tsx index ea644724c..0e48fdd89 100644 --- a/src/components/search/index.tsx +++ b/src/components/search/index.tsx @@ -20,6 +20,7 @@ export interface SearchProps { const StyledContainer = styled.div` position: relative; + padding: 0 ${getSpace(SpaceSize.M)}px; `; const StyledSearch = styled.input` @@ -61,8 +62,8 @@ const StyledSearch = styled.input` const StyledIcon = styled(Icon.Search)` position: absolute; - left: 0; - top: ${getSpace(SpaceSize.M) - 1}px; // fix to propertly align icon + left: ${getSpace(SpaceSize.M)}px; + top: ${getSpace(SpaceSize.M) - 1}px; /* fix to propertly align icon */ pointer-events: none; `; diff --git a/src/container/pattern-list/pattern-list-container.tsx b/src/container/pattern-list/pattern-list-container.tsx index 851c50cfc..68b4bd326 100644 --- a/src/container/pattern-list/pattern-list-container.tsx +++ b/src/container/pattern-list/pattern-list-container.tsx @@ -4,6 +4,7 @@ import * as MobxReact from 'mobx-react'; import * as Model from '../../model'; import { PatternItemContainer } from './pattern-item-container'; import * as React from 'react'; +import styled from 'styled-components'; import * as Types from '../../types'; import { ViewStore } from '../../store'; @@ -31,27 +32,39 @@ export class PatternListContainer extends React.Component { const searchResult = project.getPatternSearch().query(store.getPatternSearchTerm()); return ( -