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

Remove size="sm" from buttons

Browse Source
This commit is contained in:
Bill 2022-03-16 04:51:05 -04:00
parent 6b4a9e36e6
commit 10ae353c02
19 changed files with 52 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/avatar-editor/AvatarEditorView.tsx
View File

@ -310,17 +310,17 @@ export const AvatarEditorView: FC<{}> = props =>
<AvatarEditorFigurePreviewView figureData={ figureData } />
<Column grow gap={ 1 }>
<ButtonGroup>
<Button variant="secondary" size="sm" onClick={ event => processAction(AvatarEditorAction.ACTION_RESET) }>
<Button variant="secondary" onClick={ event => processAction(AvatarEditorAction.ACTION_RESET) }>
<FontAwesomeIcon icon="undo" />
</Button>
<Button variant="secondary" size="sm" onClick={ event => processAction(AvatarEditorAction.ACTION_CLEAR) }>
<Button variant="secondary" onClick={ event => processAction(AvatarEditorAction.ACTION_CLEAR) }>
<FontAwesomeIcon icon="trash" />
</Button>
<Button variant="secondary" size="sm" onClick={ event => processAction(AvatarEditorAction.ACTION_RANDOMIZE) }>
<Button variant="secondary" onClick={ event => processAction(AvatarEditorAction.ACTION_RANDOMIZE) }>
<FontAwesomeIcon icon="dice" />
</Button>
</ButtonGroup>
<Button className="w-100" variant="success" size="sm" onClick={ event => processAction(AvatarEditorAction.ACTION_SAVE) }>
<Button className="w-100" variant="success" onClick={ event => processAction(AvatarEditorAction.ACTION_SAVE) }>
{ LocalizeText('avatareditor.save') }
</Button>
</Column>

2
src/components/camera/views/checkout/CameraWidgetCheckoutView.tsx
View File

@ -154,7 +154,7 @@ export const CameraWidgetCheckoutView: FC<CameraWidgetCheckoutViewProps> = props
</Column>
{ !wasPicturePublished &&
<Flex className="d-flex align-items-end">
<Button variant="success" size="sm" disabled={ (isWaiting || (publishCooldown > 0)) } onClick={ event => processAction('publish') }>
<Button variant="success" disabled={ (isWaiting || (publishCooldown > 0)) } onClick={ event => processAction('publish') }>
{ LocalizeText('camera.publish.button.text') }
</Button>
</Flex> }

10
src/components/camera/views/editor/CameraWidgetEditorView.tsx
View File

@ -204,21 +204,21 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
</Column>
<Flex justifyContent="between">
<ButtonGroup>
<Button size="sm" onClick={ event => processAction('clear_effects') }>
<Button onClick={ event => processAction('clear_effects') }>
<FontAwesomeIcon icon="trash" />
</Button>
<Button size="sm" onClick={ event => processAction('download') }>
<Button onClick={ event => processAction('download') }>
<FontAwesomeIcon icon="save" />
</Button>
<Button size="sm" onClick={ event => processAction('zoom') }>
<Button onClick={ event => processAction('zoom') }>
<FontAwesomeIcon icon={ isZoomed ? 'search-minus' : 'search-plus' } />
</Button>
</ButtonGroup>
<Flex gap={ 1 }>
<Button size="sm" onClick={ event => processAction('cancel') }>
<Button onClick={ event => processAction('cancel') }>
{ LocalizeText('generic.cancel') }
</Button>
<Button size="sm" onClick={ event => processAction('checkout') }>
<Button onClick={ event => processAction('checkout') }>
{ LocalizeText('camera.preview.button.text') }
</Button>
</Flex>

2
src/components/camera/views/editor/effect-list/CameraWidgetEffectListItemView.tsx
View File

@ -23,7 +23,7 @@ export const CameraWidgetEffectListItemView: FC<CameraWidgetEffectListItemViewPr
return (
<LayoutGridItem title={ LocalizeText(!isLocked ? (`camera.effect.name.${ effect.name }`) : `camera.effect.required.level ${ effect.minLevel }`) } itemActive={ isActive } onClick={ event => (!isActive && selectEffect()) }>
{ isActive &&
<Button variant="danger" size="sm" className="rounded-circle remove-effect" onClick={ removeEffect }>
<Button variant="danger" className="rounded-circle remove-effect" onClick={ removeEffect }>
<FontAwesomeIcon icon="times" />
</Button> }
{ !isLocked && (thumbnailUrl && thumbnailUrl.length > 0) &&

2
src/components/catalog/views/gift/CatalogGiftView.tsx
View File

@ -220,7 +220,7 @@ export const CatalogGiftView: FC<{}> = props =>
{ LocalizeText('catalog.gift_wrapping.pick_color') }
</Text>
<ButtonGroup fullWidth>
{ colors.map(color => <Button key={ color.id } variant="dark" size="sm" active={ (color.id === selectedColorId) } disabled={ !isColorable } style={{ backgroundColor: color.color }} onClick={ () => setSelectedColorId(color.id) } />) }
{ colors.map(color => <Button key={ color.id } variant="dark" active={ (color.id === selectedColorId) } disabled={ !isColorable } style={{ backgroundColor: color.color }} onClick={ () => setSelectedColorId(color.id) } />) }
</ButtonGroup>
</Column>
<Flex justifyContent="between" alignItems="center">

2
src/components/catalog/views/page/common/CatalogRedeemVoucherView.tsx
View File

@ -58,7 +58,7 @@ export const CatalogRedeemVoucherView: FC<CatalogRedeemVoucherViewProps> = props
return (
<Flex gap={ 1 }>
<input type="text" className="form-control form-control-sm" placeholder={ text } value={ voucher } onChange={ event => setVoucher(event.target.value) } />
<Button variant="primary" size="sm" onClick={ redeemVoucher } disabled={ isWaiting }>
<Button variant="primary" onClick={ redeemVoucher } disabled={ isWaiting }>
<FontAwesomeIcon icon="tag" />
</Button>
</Flex>

4
src/components/catalog/views/page/common/CatalogSearchView.tsx
View File

@ -118,11 +118,11 @@ export const CatalogSearchView: FC<{}> = props =>
<input type="text" className="form-control form-control-sm" placeholder={ LocalizeText('generic.search') } value={ searchValue } onChange={ event => updateSearchValue(event.target.value) } onKeyDown={ event => ((event.code === 'Enter') || (event.code === 'NumpadEnter')) && processSearch(searchValue) } />
</Flex>
{ (!searchValue || !searchValue.length) &&
<Button variant="primary" size="sm" className="catalog-search-button">
<Button variant="primary" className="catalog-search-button">
<FontAwesomeIcon icon="search" />
</Button> }
{ searchValue && !!searchValue.length &&
<Button variant="primary" size="sm" className="catalog-search-button" onClick={ event => updateSearchValue('') }>
<Button variant="primary" className="catalog-search-button" onClick={ event => updateSearchValue('') }>
<FontAwesomeIcon icon="times" />
</Button> }
</Flex>

12
src/components/catalog/views/page/layout/CatalogLayoutVipBuyView.tsx
View File

@ -108,25 +108,25 @@ export const CatalogLayoutVipBuyView: FC<CatalogLayoutProps> = props =>
if(pendingOffer.priceCredits > GetCurrencyAmount(-1))
{
return <Button fullWidth variant="danger" size="sm">{ LocalizeText('catalog.alert.notenough.title') }</Button>;
return <Button fullWidth variant="danger">{ LocalizeText('catalog.alert.notenough.title') }</Button>;
}
if(pendingOffer.priceActivityPoints > GetCurrencyAmount(pendingOffer.priceActivityPointsType))
{
return <Button fullWidth variant="danger" size="sm">{ LocalizeText('catalog.alert.notenough.activitypoints.title.' + pendingOffer.priceActivityPointsType) }</Button>;
return <Button fullWidth variant="danger">{ LocalizeText('catalog.alert.notenough.activitypoints.title.' + pendingOffer.priceActivityPointsType) }</Button>;
}
switch(purchaseState)
{
case CatalogPurchaseState.CONFIRM:
return <Button fullWidth variant="warning" size="sm" onClick={ purchaseSubscription }>{ LocalizeText('catalog.marketplace.confirm_title') }</Button>;
return <Button fullWidth variant="warning" onClick={ purchaseSubscription }>{ LocalizeText('catalog.marketplace.confirm_title') }</Button>;
case CatalogPurchaseState.PURCHASE:
return <Button fullWidth variant="primary" size="sm" disabled><LayoutLoadingSpinnerView /></Button>;
return <Button fullWidth variant="primary" disabled><LayoutLoadingSpinnerView /></Button>;
case CatalogPurchaseState.FAILED:
return <Button fullWidth variant="danger" size="sm" disabled>{ LocalizeText('generic.failed') }</Button>;
return <Button fullWidth variant="danger" disabled>{ LocalizeText('generic.failed') }</Button>;
case CatalogPurchaseState.NONE:
default:
return <Button fullWidth variant="success" size="sm" onClick={ () => setPurchaseState(CatalogPurchaseState.CONFIRM) }>{ LocalizeText('buy') }</Button>;
return <Button fullWidth variant="success" onClick={ () => setPurchaseState(CatalogPurchaseState.CONFIRM) }>{ LocalizeText('buy') }</Button>;
}
}, [ pendingOffer, purchaseState, purchaseSubscription ]);

6
src/components/catalog/views/page/layout/marketplace/CatalogLayoutMarketplaceItemView.tsx
View File

@ -84,15 +84,15 @@ export const CatalogLayoutMarketplaceItemView: FC<MarketplaceItemViewProps> = pr
</Column>
<Column gap={ 1 }>
{ ((type === OWN_OFFER) && (offerData.status !== MarketPlaceOfferState.SOLD)) &&
<Button variant="secondary" size="sm" onClick={ () => onClick(offerData) }>
<Button variant="secondary" onClick={ () => onClick(offerData) }>
{ LocalizeText('catalog.marketplace.offer.pick') }
</Button> }
{ type === PUBLIC_OFFER &&
<>
<Button variant="secondary" size="sm" onClick={ () => onClick(offerData) }>
<Button variant="secondary" onClick={ () => onClick(offerData) }>
{ LocalizeText('buy') }
</Button>
<Button variant="secondary" size="sm" disabled>
<Button variant="secondary" disabled>
{ LocalizeText('catalog.marketplace.view_more') }
</Button>
</> }

2
src/components/catalog/views/page/layout/marketplace/CatalogLayoutMarketplaceOwnItemsView.tsx
View File

@ -93,7 +93,7 @@ export const CatalogLayoutMarketplaceOwnItemsView: FC<CatalogLayoutProps> = prop
<Text>
{ LocalizeText('catalog.marketplace.redeem.get_credits', ['count', 'credits'], [ soldOffers.length.toString(), creditsWaiting.toString() ]) }
</Text>
<Button size="sm" className="mt-1" onClick={ redeemSoldOffers }>
<Button className="mt-1" onClick={ redeemSoldOffers }>
{ LocalizeText('catalog.marketplace.offer.redeem') }
</Button>
</Column> }

6
src/components/catalog/views/page/layout/marketplace/CatalogLayoutMarketplacePublicItemsView.tsx
View File

@ -142,13 +142,13 @@ export const CatalogLayoutMarketplacePublicItemsView: FC<CatalogLayoutMarketplac
return (
<>
<ButtonGroup>
<Button size="sm" active={ (searchType === MarketplaceSearchType.BY_ACTIVITY) } onClick={ () => setSearchType(MarketplaceSearchType.BY_ACTIVITY) }>
<Button active={ (searchType === MarketplaceSearchType.BY_ACTIVITY) } onClick={ () => setSearchType(MarketplaceSearchType.BY_ACTIVITY) }>
{ LocalizeText('catalog.marketplace.search_by_activity') }
</Button>
<Button size="sm" active={ (searchType === MarketplaceSearchType.BY_VALUE) } onClick={ () => setSearchType(MarketplaceSearchType.BY_VALUE) }>
<Button active={ (searchType === MarketplaceSearchType.BY_VALUE) } onClick={ () => setSearchType(MarketplaceSearchType.BY_VALUE) }>
{ LocalizeText('catalog.marketplace.search_by_value') }
</Button>
<Button size="sm" active={ (searchType === MarketplaceSearchType.ADVANCED) } onClick={ () => setSearchType(MarketplaceSearchType.ADVANCED) }>
<Button active={ (searchType === MarketplaceSearchType.ADVANCED) } onClick={ () => setSearchType(MarketplaceSearchType.ADVANCED) }>
{ LocalizeText('catalog.marketplace.search_advanced') }
</Button>
</ButtonGroup>

2
src/components/catalog/views/page/layout/marketplace/CatalogLayoutMarketplaceSearchFormView.tsx
View File

@ -69,7 +69,7 @@ export const SearchFormView: FC<SearchFormViewProps> = props =>
<input className="form-control form-control-sm" type="number" min={ 0 } value={ max } onChange={ event => setMax(event.target.valueAsNumber) } />
</Flex>
</Flex>
<Button variant="secondary" size="sm" className="mx-auto" onClick={ onClickSearch }>{ LocalizeText('generic.search') }</Button>
<Button variant="secondary" className="mx-auto" onClick={ onClickSearch }>{ LocalizeText('generic.search') }</Button>
</> }
</Column>
);

2
src/components/catalog/views/page/layout/marketplace/MarketplacePostOfferView.tsx
View File

@ -116,7 +116,7 @@ export const MarketplacePostOfferView : FC<{}> = props =>
{ LocalizeText('inventory.marketplace.make_offer.final_price', [ 'commission', 'finalprice' ], [ marketplaceConfiguration.commission.toString(), (askingPrice + marketplaceConfiguration.commission).toString() ]) }
</Base> }
</div>
<Button size="sm" disabled={ ((askingPrice < marketplaceConfiguration.minimumPrice) || (askingPrice > marketplaceConfiguration.maximumPrice) || isNaN(askingPrice)) } onClick={ postItem }>
<Button disabled={ ((askingPrice < marketplaceConfiguration.minimumPrice) || (askingPrice > marketplaceConfiguration.maximumPrice) || isNaN(askingPrice)) } onClick={ postItem }>
{ LocalizeText('inventory.marketplace.make_offer.post') }
</Button>
</Column>

2
src/components/catalog/views/page/layout/vip-gifts/VipGiftItemView.tsx
View File

@ -49,7 +49,7 @@ export const VipGiftItem : FC<VipGiftItemViewProps> = props =>
<LayoutGridItem center={ false } column={ false } alignItems="center" className="p-1">
<LayoutImage imageUrl={ getImageUrlForOffer() } fit={ false } style={ { width: 50, height: 50 } } />
<Text grow fontWeight="bold">{ getItemTitle() }</Text>
<Button variant="secondary" size="sm" onClick={ () => onSelect(offer.localizationId) }>
<Button variant="secondary" onClick={ () => onSelect(offer.localizationId) }>
{ LocalizeText('catalog.club_gift.select') }
</Button>
</LayoutGridItem>

2
src/components/inventory/views/furniture/InventoryFurnitureSearchView.tsx
View File

@ -41,7 +41,7 @@ export const InventoryFurnitureSearchView: FC<InventoryFurnitureSearchViewProps>
return (
<Flex gap={ 1 }>
<input type="text" className="form-control form-control-sm" placeholder={ LocalizeText('generic.search') } value={ searchValue } onChange={ event => setSearchValue(event.target.value) } />
<Button variant="primary" size="sm">
<Button variant="primary">
<FontAwesomeIcon icon="search" />
</Button>
</Flex>

4
src/components/navigator/views/room-doorbell/NavigatorRoomDoorbellView.tsx
View File

@ -50,10 +50,10 @@ export const NavigatorRoomDoorbellView: FC<NavigatorRoomDoorbellViewProps> = pro
</Column>
<Column gap={ 1 }>
{ (state === UpdateDoorStateEvent.START_DOORBELL) &&
<Button variant="success" size="sm" onClick={ ring }>
<Button variant="success" onClick={ ring }>
{ LocalizeText('navigator.doorbell.button.ring') }
</Button> }
<Button variant="danger" size="sm" onClick={ close }>
<Button variant="danger" onClick={ close }>
{ LocalizeText('generic.cancel') }
</Button>
</Column>

37
src/components/navigator/views/room-info/NavigatorRoomInfoView.tsx
View File

@ -1,8 +1,8 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { RoomMuteComposer, RoomSettingsComposer, RoomStaffPickComposer, SecurityLevel, UserHomeRoomComposer } from '@nitrots/nitro-renderer';
import classNames from 'classnames';
import { FC, useCallback, useEffect, useState } from 'react';
import { GetConfiguration, GetGroupInformation, GetSessionDataManager, LocalizeText, SendMessageComposer } from '../../../../api';
import { FC, useEffect, useState } from 'react';
import { GetGroupInformation, GetSessionDataManager, LocalizeText, SendMessageComposer } from '../../../../api';
import { Button, Column, Flex, LayoutBadgeImageView, LayoutRoomThumbnailView, NitroCardContentView, NitroCardHeaderView, NitroCardView, Text, UserProfileIconView } from '../../../../common';
import { FloorplanEditorEvent, NavigatorEvent, RoomWidgetThumbnailEvent } from '../../../../events';
import { BatchUpdates, DispatchUiEvent } from '../../../../hooks';
@ -35,7 +35,7 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
}
}
const processAction = useCallback((action: string, value?: string) =>
const processAction = (action: string, value?: string) =>
{
if(!roomInfoData || !roomInfoData.enteredGuestRoom) return;
@ -88,26 +88,14 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
return;
}
}, [ onCloseClick, dispatchNavigatorState, roomInfoData, homeRoomId ]);
}
useEffect(() =>
{
if(!roomInfoData || !roomInfoData.enteredGuestRoom) return;
let thumbnailUrl: string = null;
if(roomInfoData.enteredGuestRoom.officialRoomPicRef)
{
thumbnailUrl = (GetConfiguration<string>('image.library.url') + roomInfoData.enteredGuestRoom.officialRoomPicRef);
}
else
{
thumbnailUrl = (GetConfiguration<string>('thumbnails.url').replace('%thumbnail%', roomInfoData.enteredGuestRoom.roomId.toString()));
}
BatchUpdates(() =>
{
setRoomThumbnail(thumbnailUrl);
setIsRoomPicked(roomInfoData.enteredGuestRoom.roomPicker);
setIsRoomMuted(roomInfoData.enteredGuestRoom.allInRoomMuted);
});
@ -141,9 +129,10 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
<Text variant="muted">{ LocalizeText('navigator.roomrating') }</Text>
<Text>{ roomInfoData.enteredGuestRoom.score }</Text>
</Flex>
{ (roomInfoData.enteredGuestRoom.tags.length > 0) &&
{
<Flex alignItems="center" gap={ 1 }>
{ roomInfoData.enteredGuestRoom.tags.map(tag =>
<Text pointer className="bg-muted rounded p-1" onClick={ event => processAction('navigator_search_tag', 'test') }>#test</Text>
{ (roomInfoData.enteredGuestRoom.tags.length > 0) && roomInfoData.enteredGuestRoom.tags.map(tag =>
{
return <Text key={ tag } pointer className="bg-muted rounded p-1" onClick={ event => processAction('navigator_search_tag', tag) }>#{ tag }</Text>
}) }
@ -161,7 +150,7 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
</Flex> }
</Column>
</Flex>
<Text overflow="auto">{ roomInfoData.enteredGuestRoom.description }</Text>
<Text overflow="auto" style={ { maxHeight: 50 } }>{ roomInfoData.enteredGuestRoom.description }</Text>
{ (roomInfoData.enteredGuestRoom.habboGroupId > 0) &&
<Flex pointer alignItems="center" gap={ 1 } onClick={ () => processAction('open_group_info') }>
<LayoutBadgeImageView className="flex-none" badgeCode={ roomInfoData.enteredGuestRoom.groupBadgeCode } isGroup={ true } />
@ -173,16 +162,18 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
</Flex>
<Column gap={ 1 }>
{ hasPermission('staff_pick') &&
<Button size="sm" onClick={ () => processAction('toggle_pick') }>
<Button onClick={ () => processAction('toggle_pick') }>
{ LocalizeText(isRoomPicked ? 'navigator.staffpicks.unpick' : 'navigator.staffpicks.pick') }
</Button> }
<Button size="sm" variant="danger" disabled>
<Button variant="danger" disabled>
{ LocalizeText('help.emergency.main.report.room') }
</Button>
{ hasPermission('settings') &&
<Button size="sm" onClick={ () => processAction('toggle_mute') }>
<>
<Button onClick={ () => processAction('toggle_mute') }>
{ LocalizeText(isRoomMuted ? 'navigator.muteall_on' : 'navigator.muteall_off') }
</Button> }
</Button>
</> }
</Column>
</> }

4
src/components/navigator/views/room-password/NavigatorRoomPasswordView.tsx
View File

@ -49,9 +49,9 @@ export const NavigatorRoomPasswordView: FC<NavigatorRoomPasswordViewProps> = pro
<Text>{ LocalizeText('navigator.password.enter') }</Text>
<input type="password" className="form-control form-control-sm" onChange={ event => setPassword(event.target.value) } />
</Column>
<Button variant="success" size="sm" onClick={ tryEntering }>
<Button variant="success" onClick={ tryEntering }>
{ LocalizeText('navigator.password.button.try') }</Button>
<Button variant="danger" size="sm" onClick={ close }>
<Button variant="danger" onClick={ close }>
{ LocalizeText('generic.cancel') }
</Button>
</NitroCardContentView>

2
src/components/navigator/views/search/NavigatorSearchView.tsx
View File

@ -55,7 +55,7 @@ export const NavigatorSearchView: FC<NavigatorSearchViewProps> = props =>
</Flex>
<Flex fullWidth gap={ 1 }>
<input type="text" className="form-control form-control-sm" placeholder={ LocalizeText('navigator.filter.input.placeholder') } value={ searchValue } onChange={ event => setSearchValue(event.target.value) } onKeyDown={ event => handleKeyDown(event) } />
<Button variant="primary" size="sm" onClick={ processSearch }>
<Button variant="primary" onClick={ processSearch }>
<FontAwesomeIcon icon="search" />
</Button>
</Flex>