diff --git a/app/mobile/src/session/profile/Profile.jsx b/app/mobile/src/session/profile/Profile.jsx index 4c7b67d1..9e711dbc 100644 --- a/app/mobile/src/session/profile/Profile.jsx +++ b/app/mobile/src/session/profile/Profile.jsx @@ -82,6 +82,40 @@ export function Profile({ drawer }) { + + + + { state.strings.edit } + + + + + { state.name && ( + { state.name } + )} + { !state.name && ( + { state.strings.name } + )} + + + + { state.location && ( + { state.location } + )} + { !state.location && ( + Location + )} + + + + { state.description && ( + { state.description } + )} + { !state.description && ( + Description + )} + + )} { !drawer && ( diff --git a/app/mobile/src/session/profile/Profile.styled.js b/app/mobile/src/session/profile/Profile.styled.js index 94cccb58..a80ececc 100644 --- a/app/mobile/src/session/profile/Profile.styled.js +++ b/app/mobile/src/session/profile/Profile.styled.js @@ -14,9 +14,9 @@ export const styles = StyleSheet.create({ padding: 16, }, drawerFrame: { - width: '50%', + width: '80%', maxWidth: 400, - paddingBottom: 16, + paddingBottom: 32, }, drawerLogo: { aspectRatio: 1, @@ -32,13 +32,62 @@ export const styles = StyleSheet.create({ flexDirection: 'row', alignItems: 'center', alignSelf: 'center', - backgroundColor: 'rgba(255,255,255,0.6)', + backgroundColor: Colors.drawerBase, paddingLeft: 8, paddingRight: 8, borderBottomLeftRadius: 6, borderBottomRightRadius: 6, }, - + drawerEditDivider: { + width: '80%', + display: 'flex', + flexDirection: 'row', + alignItems: 'center', + }, + drawerLine: { + borderWidth: 1, + borderColor: Colors.areaBase, + flexGrow: 1, + }, + drawerDivider: { + width: '80%', + borderWidth: 1, + borderColor: Colors.areaBase, + marginTop: 16, + }, + drawerName: { + width: '80%', + paddingLeft: 8, + paddingRight: 8, + }, + drawerNameSet: { + color: Colors.text, + fontFamily: 'roboto', + fontSize: 48, + flexGrow: 1, + flexShrink: 1, + }, + drawerNameUnset: { + color: Colors.inputPlaceholder, + fontFamily: 'roboto', + fontSize: 48, + fontStyle: 'italic', + flexGrow: 1, + }, + drawerNameEdit: { + display: 'flex', + flexDirection: 'row', + alignItems: 'center', + paddingLeft: 8, + paddingRight: 8, + }, + drawerEntry: { + width: '80%', + display: 'flex', + alignItems: 'center', + flexDirection: 'row', + padding: 8, + }, container: { width: '100%', height: '100%',