Merge branch 'section-theme-hooks' into 'master'

add theme hooks for section

See merge request !5

src/ui/Section.js

 import React from 'react'
 import PropTypes, { object } from 'prop-types'
-import { List } from '@pubsweet/ui'
 import styled from 'styled-components'
 
+import { List } from '@pubsweet/ui'
+import { override } from '@pubsweet/ui-toolkit'
+
 const Root = styled.div`
   display: flex;
   flex-direction: column;
+
+  ${override('ui.Section')};
 `
 
 const Header = styled.div`
   display: flex;
   margin-bottom: ${props => props.theme.gridUnit};
+
+  ${override('ui.Section.Header')};
 `
 
 const Title = styled.div`
@@ -18,10 +24,14 @@ const Title = styled.div`
   font-size: ${props => props.theme.fontSizeHeading1};
   line-height: ${props => props.theme.lineHeightHeading1};
   text-transform: uppercase;
+
+  /* stylelint-disable-next-line order/properties-alphabetical-order */
+  ${override('ui.Section.Title')};
 `
 
 const StyledRightComponet = styled.div`
   flex-grow: 1;
+  ${override('ui.Section.RightComponent')};
 `
 
 const StyledEmptyMessage = styled.div`
@@ -29,6 +39,9 @@ const StyledEmptyMessage = styled.div`
   font-style: italic;
   padding: ${props => `calc(2* ${props.theme.gridUnit})`};
   text-align: center;
+
+  /* stylelint-disable-next-line order/properties-alphabetical-order */
+  ${override('ui.Section.EmptyMessage')};
 `
 
 /**