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

mod tools icons

Browse Source
This commit is contained in:
Layne 2022-03-17 16:02:43 -04:00
parent 7486e9c7d2
commit 3f69ea167d
4 changed files with 20 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/icons/tickets.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 143 B

BIN
src/assets/images/icons/user.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 881 B

11
src/assets/styles/icons.scss
View File

@ -580,6 +580,17 @@
height: 45px; height: 45px;
} }
&.icon-tickets {
background-image: url('../images/icons/tickets.png');
width: 17px;
height: 17px;
}
&.icon-user {
background-image: url('../images/icons/user.png');
width: 18px;
height: 19px;
}
&.spin { &.spin {
animation: rotating 1s linear infinite; animation: rotating 1s linear infinite;
} }

19
src/components/mod-tools/ModToolsView.tsx
View File

@ -1,8 +1,7 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { RoomEngineObjectEvent, RoomObjectCategory } from '@nitrots/nitro-renderer'; import { RoomEngineObjectEvent, RoomObjectCategory } from '@nitrots/nitro-renderer';
import { FC, useCallback, useReducer, useState } from 'react'; import { FC, useCallback, useReducer, useState } from 'react';
import { GetRoomSession } from '../../api'; import { GetRoomSession } from '../../api';
import { Button, DraggableWindowPosition, NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../common'; import { Base, Button, DraggableWindowPosition, NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../common';
import { ModToolsEvent, ModToolsOpenRoomChatlogEvent, ModToolsOpenRoomInfoEvent, ModToolsOpenUserInfoEvent } from '../../events'; import { ModToolsEvent, ModToolsOpenRoomChatlogEvent, ModToolsOpenRoomInfoEvent, ModToolsOpenUserInfoEvent } from '../../events';
import { DispatchUiEvent, UseRoomEngineEvent, UseUiEvent } from '../../hooks'; import { DispatchUiEvent, UseRoomEngineEvent, UseUiEvent } from '../../hooks';
import { ISelectedUser } from './common/ISelectedUser'; import { ISelectedUser } from './common/ISelectedUser';
@ -188,17 +187,17 @@ export const ModToolsView: FC<{}> = props =>
<NitroCardView uniqueKey="mod-tools" className="nitro-mod-tools" windowPosition={ DraggableWindowPosition.TOP_LEFT } theme="primary-slim" > <NitroCardView uniqueKey="mod-tools" className="nitro-mod-tools" windowPosition={ DraggableWindowPosition.TOP_LEFT } theme="primary-slim" >
<NitroCardHeaderView headerText={ 'Mod Tools' } onCloseClick={ event => setIsVisible(false) } /> <NitroCardHeaderView headerText={ 'Mod Tools' } onCloseClick={ event => setIsVisible(false) } />
<NitroCardContentView className="text-black" gap={ 1 }> <NitroCardContentView className="text-black" gap={ 1 }>
<Button gap={ 1 } onClick={ event => handleClick('toggle_room') } disabled={ !currentRoomId }> <Button gap={ 1 } onClick={ event => handleClick('toggle_room') } disabled={ !currentRoomId } className="position-relative">
<FontAwesomeIcon icon="home" /> Room Tool <Base className="icon icon-small-room position-absolute start-1"/> Room Tool
</Button> </Button>
<Button gap={ 1 } onClick={ event => handleClick('toggle_room_chatlog') } disabled={ !currentRoomId }> <Button gap={ 1 } onClick={ event => handleClick('toggle_room_chatlog') } disabled={ !currentRoomId } className="position-relative">
<FontAwesomeIcon icon="comments" /> Chatlog Tool <Base className="icon icon-chat-history position-absolute start-1"/> Chatlog Tool
</Button> </Button>
<Button gap={ 1 } onClick={ () => handleClick('toggle_user_info') } disabled={ !selectedUser }> <Button gap={ 1 } onClick={ () => handleClick('toggle_user_info') } disabled={ !selectedUser } className="position-relative">
<FontAwesomeIcon icon="user" /> User: { selectedUser ? selectedUser.username : '' } <Base className="icon icon-user position-absolute start-1"/> User: { selectedUser ? selectedUser.username : '' }
</Button> </Button>
<Button gap={ 1 } onClick={ () => setIsTicketsVisible(value => !value) }> <Button gap={ 1 } onClick={ () => setIsTicketsVisible(value => !value) } className="position-relative">
<FontAwesomeIcon icon="exclamation-circle" /> Report Tool <Base className="icon icon-tickets position-absolute start-1"/> Report Tool
</Button> </Button>
</NitroCardContentView> </NitroCardContentView>
</NitroCardView> } </NitroCardView> }