OpenEcoLab-LasAlpujarras/qpa-client
5
0
Fork 0
mirror of https://github.com/quepasaevents/qpa-client.git synced 2023-12-14 05:33:02 +01:00
Code Issues Projects Releases Wiki Activity

Change edit icon to pencil

Browse source
This commit is contained in:
Amit Jakubowicz 2019-12-11 08:56:44 +01:00
parent 8466ad08de
commit 4c00c19bf8
4 changed files with 29 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/qpa-components/Icons.tsx
View file

@ -8,9 +8,6 @@ import ReplayIcon from '@material-ui/icons/Replay';
import LocationPinIcon from '@material-ui/icons/Room'; import LocationPinIcon from '@material-ui/icons/Room';
import HourIcon from '@material-ui/icons/AccessTime'; import HourIcon from '@material-ui/icons/AccessTime';
import AddPhotoIcon from '@material-ui/icons/AddPhotoAlternate'; import AddPhotoIcon from '@material-ui/icons/AddPhotoAlternate';
import EditIcon from '@material-ui/icons/Edit';
export { EditIcon, TagIcon, CheckIcon, CrossNoIcon, PlayIcon, StopIcon, DeleteForeverIcon, ReplayIcon, LocationPinIcon, HourIcon, AddPhotoIcon }
export { TagIcon, CheckIcon, CrossNoIcon, PlayIcon, StopIcon, DeleteForeverIcon, ReplayIcon, LocationPinIcon, HourIcon, AddPhotoIcon }

30
packages/qpa/App/Event/EventDetails.tsx
View file

@ -1,6 +1,8 @@
import { format } from "date-fns" import { format } from "date-fns"
import { Button, LocationPinIcon, HourIcon } from "qpa-components" import { LocationPinIcon, HourIcon, IconButton, EditIcon } from "qpa-components"
import styled, { css, useTheme } from "qpa-emotion" import styled from "@emotion/styled"
import css from "@emotion/css"
import { useTheme } from "qpa-emotion"
import * as React from "react" import * as React from "react"
import { hot } from "react-hot-loader" import { hot } from "react-hot-loader"
import intl from "react-intl-universal" import intl from "react-intl-universal"
@ -49,16 +51,18 @@ const EventDetails = (props: Props) => {
{intl.get("event-awaiting-mandatory-revision")} {intl.get("event-awaiting-mandatory-revision")}
</CommentToPublishedState> </CommentToPublishedState>
)} )}
<Title>
{info.title}
{canEdit ? ( {canEdit ? (
<EditButton <EditIconButton
onClick={() => props.history.push(`/event/${event.id}/edit`)} onClick={() => props.history.push(`/event/${event.id}/edit`)}
css={{}} css={{}}
> >
Edit <EditIcon />
</EditButton> </EditIconButton>
) : null} ) : null}
</Title>
<Title>{info.title}</Title>
{props.occurrence ? ( {props.occurrence ? (
<OccurrenceTime> <OccurrenceTime>
<HourIcon /> <HourIcon />
@ -113,13 +117,16 @@ const EventDetails = (props: Props) => {
) )
} }
const EditButton = styled(Button)` const EditIconButton = styled(IconButton)``
grid-column: right-margin;
width: 80px;
`
const Title = styled.div` const Title = styled.div`
grid-column: content; grid-column: content;
font-size: 32px; font-size: 32px;
display: flex;
flex-direction: row;
justify-content: space-between;
${EditIconButton} {
margin-right: 8px;
}
` `
const Info = styled.div` const Info = styled.div`
@ -127,6 +134,7 @@ const Info = styled.div`
` `
const Root = styled.div` const Root = styled.div`
position: relative;
margin-top: 24px; margin-top: 24px;
display: grid; display: grid;
grid-template-columns: grid-template-columns:

4
packages/qpa/Event/EventForm.msg.json
View file

@ -9,7 +9,7 @@
"LOCATION_PLACEHOLDER": "Location's name", "LOCATION_PLACEHOLDER": "Location's name",
"ADDRESS": "Address", "ADDRESS": "Address",
"ADDRESS_PLACEHOLDER": "Address of the location", "ADDRESS_PLACEHOLDER": "Address of the location",
"EDIT": "Edit Event", "save-changes": "Save changes",
"CREATE": "Create Event", "CREATE": "Create Event",
"EVENT_FORM_INFO_IN_LANGUAGE": "Event details in english", "EVENT_FORM_INFO_IN_LANGUAGE": "Event details in english",
"en-GB": "English", "en-GB": "English",
@ -44,7 +44,7 @@
"LOCATION_PLACEHOLDER": "Nombre del lugar", "LOCATION_PLACEHOLDER": "Nombre del lugar",
"ADDRESS": "Dirección", "ADDRESS": "Dirección",
"ADDRESS_PLACEHOLDER": "Dirección del lugar", "ADDRESS_PLACEHOLDER": "Dirección del lugar",
"EDIT": "Modificar evento", "save-changes": "Guardar cambios",
"CREATE": "Crear evento", "CREATE": "Crear evento",
"EVENT_FORM_INFO_IN_LANGUAGE": "Detalles del evento en español", "EVENT_FORM_INFO_IN_LANGUAGE": "Detalles del evento en español",
"en-GB": "Inglés", "en-GB": "Inglés",

4
packages/qpa/Event/EventForm.tsx
View file

@ -300,8 +300,8 @@ const EventForm = (props: Props) => {
)} )}
</Field> </Field>
<Footer> <Footer>
<Button type="submit" loading={props.loading} disabled={!isValid}> <Button type="submit" loading={props.loading} disabled={!isValid} color="green">
{isEdit ? intl.get("EDIT") : intl.get("CREATE")} {isEdit ? intl.get("save-changes") : intl.get("CREATE")}
</Button> </Button>
{props.onDeleteEvent ? ( {props.onDeleteEvent ? (
<DeleteButton <DeleteButton