parent
ed7fa5249c
commit
c915b7741f
|
@ -5,9 +5,14 @@ import Routes from './Routes'
|
|||
import Messages from './components/messages/Messages'
|
||||
|
||||
const GlobalStyle = createGlobalStyle`
|
||||
html {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
#root, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
/* Make dimmer lighter */
|
||||
|
|
|
@ -21,7 +21,7 @@ const SearchField = styled.input`
|
|||
border: 1px solid #eee;
|
||||
border-radius: 4px;
|
||||
padding: 0 8px;
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
||||
|
||||
&:focus {
|
||||
|
@ -120,8 +120,8 @@ const SearchBar = () => {
|
|||
}
|
||||
|
||||
const ResultTitle = styled.h1`
|
||||
font-size: 20px;
|
||||
margin: 12px 0 4px;
|
||||
font-size: 1.25rem;
|
||||
margin: 12px 0 0.25rem;
|
||||
`
|
||||
|
||||
const SearchResults = ({ result }) => {
|
||||
|
|
|
@ -36,18 +36,18 @@ const photoQuery = gql`
|
|||
|
||||
const PreviewImage = styled(ProtectedImage)`
|
||||
width: 100%;
|
||||
height: 333px;
|
||||
height: ${({ imageAspect }) => imageAspect * 100}%;
|
||||
object-fit: contain;
|
||||
`
|
||||
|
||||
const Name = styled.div`
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 1.2rem;
|
||||
margin: 0.75rem 0 1rem;
|
||||
`
|
||||
|
||||
const ExifInfo = styled.div`
|
||||
margin-bottom: 24px;
|
||||
margin-bottom: 1.5rem;
|
||||
`
|
||||
|
||||
const exifNameLookup = {
|
||||
|
@ -109,15 +109,20 @@ const SidebarContent = ({ photo, hidePreview }) => {
|
|||
))
|
||||
}
|
||||
|
||||
let previewUrl = null
|
||||
let previewImage = null
|
||||
if (photo) {
|
||||
if (photo.highRes) previewUrl = photo.highRes.url
|
||||
else if (photo.thumbnail) previewUrl = photo.thumbnail.url
|
||||
if (photo.highRes) previewImage = photo.highRes
|
||||
else if (photo.thumbnail) previewImage = photo.thumbnail
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
{!hidePreview && <PreviewImage src={previewUrl} />}
|
||||
{!hidePreview && (
|
||||
<PreviewImage
|
||||
src={previewImage.url}
|
||||
imageAspect={previewImage.width / previewImage.height}
|
||||
/>
|
||||
)}
|
||||
<Name>{photo && photo.title}</Name>
|
||||
<ExifInfo>{exifItems}</ExifInfo>
|
||||
<SidebarDownload photo={photo} />
|
||||
|
|
|
@ -181,7 +181,7 @@ const SidebarDownload = ({ photo }) => {
|
|||
<div style={{ marginBottom: 24 }}>
|
||||
<h2>Download</h2>
|
||||
|
||||
<Table selectable singleLine>
|
||||
<Table selectable singleLine compact>
|
||||
<Table.Header>
|
||||
<Table.Row>
|
||||
<Table.HeaderCell>Name</Table.HeaderCell>
|
||||
|
|
|
@ -6,14 +6,15 @@ const ItemName = styled.div`
|
|||
display: inline-block;
|
||||
width: 100px;
|
||||
font-weight: 600;
|
||||
font-size: 12px;
|
||||
font-size: 0.85rem;
|
||||
color: #888;
|
||||
text-align: right;
|
||||
margin-right: 8px;
|
||||
margin-right: 0.5rem;
|
||||
`
|
||||
|
||||
const ItemValue = styled.div`
|
||||
display: inline-block;
|
||||
font-size: 1rem;
|
||||
`
|
||||
|
||||
const SidebarItem = ({ name, value }) => (
|
||||
|
|
Loading…
Reference in New Issue