nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-23 14:40:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix infostand motto style

Browse Source
This commit is contained in:
Bill 2022-03-16 13:34:51 -04:00
parent 60fe9fe265
commit ca21e833c8
1 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/room/widgets/infostand/InfoStandWidgetUserView.tsx
View File

@ -138,14 +138,18 @@ export const InfoStandWidgetUserView: FC<InfoStandWidgetUserViewProps> = props =
<Column gap={ 1 }> <Column gap={ 1 }>
<Flex alignItems="center" className="bg-light-dark rounded py-1 px-2"> <Flex alignItems="center" className="bg-light-dark rounded py-1 px-2">
{ (userData.type !== RoomWidgetUpdateInfostandUserEvent.OWN_USER) && { (userData.type !== RoomWidgetUpdateInfostandUserEvent.OWN_USER) &&
<Text fullWidth wrap textBreak variant="white" small className="motto-content">{ motto }</Text> } <Flex grow alignItems="center" className="motto-content">
<Text fullWidth pointer wrap textBreak small variant="white">{ motto }</Text>
</Flex> }
{ userData.type === RoomWidgetUpdateInfostandUserEvent.OWN_USER && { userData.type === RoomWidgetUpdateInfostandUserEvent.OWN_USER &&
<Flex grow alignItems="center" gap={ 2 }> <Flex grow alignItems="center" gap={ 2 }>
<FontAwesomeIcon icon="pencil-alt" className="small" /> <FontAwesomeIcon icon="pencil-alt" className="small" />
<Flex grow alignItems="center" className="motto-content">
{ !isEditingMotto && { !isEditingMotto &&
<Text fullWidth pointer wrap textBreak small variant="white" className="motto-content" onClick={ event => setIsEditingMotto(true) }>{ motto }</Text> } <Text fullWidth pointer wrap textBreak small variant="white" onClick={ event => setIsEditingMotto(true) }>{ motto }</Text> }
{ isEditingMotto && { isEditingMotto &&
<input type="text" className="motto-input" maxLength={ 38 } value={ motto } onChange={ event => setMotto(event.target.value) } onBlur={ onMottoBlur } onKeyDown={ onMottoKeyDown } autoFocus={ true } /> } <input type="text" className="motto-input" maxLength={ 38 } value={ motto } onChange={ event => setMotto(event.target.value) } onBlur={ onMottoBlur } onKeyDown={ onMottoKeyDown } autoFocus={ true } /> }
</Flex>
</Flex> } </Flex> }
</Flex> </Flex>
<hr className="m-0" /> <hr className="m-0" />