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

Update trophy style

Browse Source
This commit is contained in:
Bill 2022-03-04 12:42:57 -05:00
parent b7be05f488
commit 63a77f9005
2 changed files with 19 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/common/index.scss
View File

@ -78,32 +78,24 @@
}
.trophy-header {
height: 22px;
.trophy-close {
position: absolute;
cursor: pointer;
width: 15px;
height: 15px;
right: 5.5px;
top: 5px;
right: 5px;
}
.trophy-title {
padding-top: 3px;
}
}
.trophy-content {
width: 297px;
height: 110px;
margin-top: 3px;
margin-left: 23px;
height: 116px;
white-space: pre-wrap;
}
.trophy-footer {
width: 297px;
margin-top: 5px;
margin-left: 23px;
}
}

30
src/common/layout/LayoutTrophyView.tsx
View File

@ -1,4 +1,5 @@
import { FC } from 'react';
import { Base, Column, Flex, Text } from '..';
import { LocalizeText } from '../../api';
import { DraggableWindow } from '../draggable-window';
@ -18,22 +19,21 @@ export const LayoutTrophyView: FC<LayoutTrophyViewProps> = props =>
return (
<DraggableWindow handleSelector=".drag-handler">
<div className={ `nitro-layout-trophy trophy-${ color }` }>
<div className="trophy-header drag-handler">
<div className="float-end trophy-close" onClick={ onCloseClick }></div>
<div className="trophy-title fw-bold text-center">
{ LocalizeText('widget.furni.trophy.title') }
</div>
</div>
<div className="trophy-content">
{ customTitle && <div className="mb-2 fw-bold">{ customTitle }</div> }
<Column gap={ 0 } alignItems="center" className={ `nitro-layout-trophy trophy-${ color }` }>
<Flex center fullWidth position="relative" className="trophy-header drag-handler">
<Base position="absolute" pointer className="trophy-close" onClick={ onCloseClick } />
<Text bold>{ LocalizeText('widget.furni.trophy.title') }</Text>
</Flex>
<Column className="trophy-content py-1" gap={ 1 }>
{ customTitle &&
<Text bold>{ customTitle }</Text> }
{ message }
</div>
<div className="trophy-footer d-flex justify-content-between fw-bold">
<div>{ date }</div>
<div>{ senderName }</div>
</div>
</div>
</Column>
<Flex alignItems="center" justifyContent="between" className="trophy-footer mt-1">
<Text bold>{ date }</Text>
<Text bold>{ senderName }</Text>
</Flex>
</Column>
</DraggableWindow>
);
}