Improve the journal's look.

master
Tom Hacohen 7 years ago
parent 56947722d3
commit 63a1b0286b

@ -3,6 +3,8 @@ import { Tabs, Tab } from 'material-ui/Tabs';
import * as EteSync from './api/EteSync'; import * as EteSync from './api/EteSync';
import Container from './Container';
import JournalEntries from './JournalEntries'; import JournalEntries from './JournalEntries';
import JournalAddressBook from './JournalAddressBook'; import JournalAddressBook from './JournalAddressBook';
import JournalCalendar from './JournalCalendar'; import JournalCalendar from './JournalCalendar';
@ -10,6 +12,8 @@ import LoadingIndicator from './LoadingIndicator';
import { syncEntriesToItemMap, syncEntriesToCalendarItemMap } from './journal-processors'; import { syncEntriesToItemMap, syncEntriesToCalendarItemMap } from './journal-processors';
import { getPalette } from './App';
import { JournalsData, EntriesType, CredentialsData } from './store'; import { JournalsData, EntriesType, CredentialsData } from './store';
interface PropsType { interface PropsType {
@ -72,21 +76,42 @@ class Journal extends React.Component {
itemsTitle = 'Items'; itemsTitle = 'Items';
} }
const style = {
header: {
backgroundColor: getPalette('primary1Color'),
color: getPalette('alternateTextColor'),
padding: 15,
textAlign: 'center',
},
headerText: {
margin: 0,
},
};
return ( return (
<Tabs> <React.Fragment>
<Tab <div style={style.header}>
label={itemsTitle} <Container>
> <h2 style={style.headerText}>{collectionInfo.displayName}</h2>
<h2>{collectionInfo.displayName}</h2> </Container>
{itemsView} </div>
</Tab> <Tabs>
<Tab <Tab
label="Journal Entries" label={itemsTitle}
> >
<h2>{collectionInfo.displayName}</h2> <Container>
<JournalEntries journal={journal} entries={syncEntries} />; {itemsView}
</Tab> </Container>
</Tabs> </Tab>
<Tab
label="Journal Entries"
>
<Container>
<JournalEntries journal={journal} entries={syncEntries} />;
</Container>
</Tab>
</Tabs>
</React.Fragment>
); );
} }
} }

@ -48,12 +48,9 @@ class JournalCalendar extends React.Component {
<Route <Route
path={routeResolver.getRoute('journals._id.items._id')} path={routeResolver.getRoute('journals._id.items._id')}
exact={true} exact={true}
render={({match}) => { render={({match}) => (
<Event event={items.get(match.params.itemUid)} />
return ( )}
<Event event={items.get(match.params.itemUid)} />
);
}}
/> />
</Switch> </Switch>
); );

Loading…
Cancel
Save