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

Layout fixes

Browse Source
This commit is contained in:
Bill 2021-09-24 05:02:24 -04:00
parent c19efc7fed
commit 67afaccd21
12 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/layout/card/grid/NitroCardGridView.tsx
View File

@ -3,7 +3,7 @@ import { NitroCardGridViewProps } from './NitroCardGridView.types';
export const NitroCardGridView: FC<NitroCardGridViewProps> = props =>
{
const { columns = 5, gap = 2, className = '', style = null, children = null, ...rest } = props;
const { columns = 0, gap = 2, className = '', style = null, children = null, ...rest } = props;
const getClassName = useMemo(() =>
{
@ -18,7 +18,11 @@ export const NitroCardGridView: FC<NitroCardGridViewProps> = props =>
{
const newStyle = { ...style };
//newStyle['--bs-columns'] = columns.toString();
if(columns && (columns >= 1))
{
newStyle['grid-template-columns'] = 'unset';
newStyle['--bs-columns'] = columns.toString();
}
return newStyle;
}, [ style, columns ]);

2
src/views/avatar-editor/views/figure-set/AvatarEditorFigureSetView.tsx
View File

@ -22,7 +22,7 @@ export const AvatarEditorFigureSetView: FC<AvatarEditorFigureSetViewProps> = pro
}, [ model, category, setMaxPaletteCount ]);
return (
<NitroCardGridView columns={ 3 }>
<NitroCardGridView>
{ (category.parts.length > 0) && category.parts.map((item, index) =>
{
return <AvatarEditorFigureSetItemView key={ index } partItem={ item } onClick={ selectPart } />;

2
src/views/avatar-editor/views/palette-set/AvatarEditorPaletteSetView.tsx
View File

@ -18,7 +18,7 @@ export const AvatarEditorPaletteSetView: FC<AvatarEditorPaletteSetViewProps> = p
}, [ model, category, paletteSet, paletteIndex ]);
return (
<NitroCardGridView columns={ 4 } { ...rest }>
<NitroCardGridView { ...rest }>
{ (paletteSet.length > 0) && paletteSet.map((item, index) =>
{
return <AvatarEditorPaletteSetItem key={ index } colorItem={ item } onClick={ event => selectColor(item) } />;

2
src/views/avatar-editor/views/wardrobe/AvatarEditorWardrobeView.tsx
View File

@ -67,7 +67,7 @@ export const AvatarEditorWardrobeView: FC<AvatarEditorWardrobeViewProps> = props
return (
<div className="row h-100">
<div className="col-12 d-flex h-100">
<NitroCardGridView className="wardrobe-grid" columns={ 5 }>
<NitroCardGridView className="wardrobe-grid">
{ figures }
</NitroCardGridView>
</div>

2
src/views/catalog/views/page/layout/pets/CatalogLayoutPetView.tsx
View File

@ -143,7 +143,7 @@ export const CatalogLayoutPetView: FC<CatalogLayoutPetViewProps> = props =>
return (
<div className="row h-100">
<div className="d-flex flex-column col-7 h-100">
<NitroCardGridView columns={ 5 }>
<NitroCardGridView>
{ !colorsShowing && (sellablePalettes.length > 0) && sellablePalettes.map((palette, index) =>
{
return (

2
src/views/catalog/views/page/layout/single-bundle/CatalogLayoutSingleBundleView.tsx
View File

@ -15,7 +15,7 @@ export const CatalogLayoutSingleBundleView: FC<CatalogLayoutSingleBundleViewProp
return (
<div className="row h-100">
<div className="d-flex flex-column col-7 h-100">
<NitroCardGridView columns={ 5 }>
<NitroCardGridView>
{ activeOffer && activeOffer.products && (activeOffer.products.length > 0) && activeOffer.products.map((product, index) =>
{
return <CatalogProductView key={ index } isActive={ false } product={ product } />

2
src/views/catalog/views/page/offers/CatalogPageOffersView.tsx
View File

@ -11,7 +11,7 @@ export const CatalogPageOffersView: FC<CatalogPageOffersViewProps> = props =>
const { activeOffer = null } = catalogState;
return (
<NitroCardGridView columns={ 5 } { ...rest }>
<NitroCardGridView { ...rest }>
{ offers && (offers.length > 0) && offers.map((offer, index) =>
{
return <CatalogPageOfferView key={ index } isActive={ (activeOffer === offer) } offer={ offer } />

2
src/views/catalog/views/page/search-result/offers/CatalogSearchResultOffersView.tsx
View File

@ -20,7 +20,7 @@ export const CatalogSearchResultOffersView: FC<CatalogSearchResultOffersViewProp
}, [ offers ]);
return (
<NitroCardGridView columns={ 5 } { ...rest }>
<NitroCardGridView { ...rest }>
{ offers && (offers.length > 0) && offers.map((offer, index) =>
{
const isActive = (activeOffer && (activeOffer.products[0].furniClassId === offer.id));

2
src/views/inventory/views/badge/active-results/InventoryActiveBadgeResultsView.tsx
View File

@ -8,7 +8,7 @@ export const InventoryActiveBadgeResultsView: FC<InventoryActiveBadgeResultsView
const { badges = [] } = props;
return (
<NitroCardGridView columns={ 3 }>
<NitroCardGridView>
{ badges && (badges.length > 0) && badges.map(code =>
{
return <InventoryBadgeItemView key={ code } badge={ code } />

2
src/views/inventory/views/furniture/results/InventoryFurnitureResultsView.tsx
View File

@ -8,7 +8,7 @@ export const InventoryFurnitureResultsView: FC<InventoryFurnitureResultsViewProp
const { groupItems = [], columns = 5 } = props;
return (
<NitroCardGridView columns={ columns }>
<NitroCardGridView>
{ groupItems && (groupItems.length > 0) && groupItems.map((item, index) =>
{
return <InventoryFurnitureItemView key={ index } groupItem={ item } />

2
src/views/toolbar/ToolbarView.tsx
View File

@ -158,7 +158,7 @@ export const ToolbarView: FC<ToolbarViewProps> = props =>
}, []);
return (
<div className="nitro-toolbar-container overflow-hidden">
<div className="nitro-toolbar-container">
<TransitionAnimation type={ TransitionAnimationTypes.FADE_IN } inProp={ isMeExpanded } timeout={ 300 }>
<ToolbarMeView handleToolbarItemClick={ handleToolbarItemClick } />
</TransitionAnimation>

2
src/views/user-profile/views/badges-container/BadgesContainerView.tsx
View File

@ -9,7 +9,7 @@ export const BadgesContainerView: FC<BadgesContainerViewProps> = props =>
return (
<div className="row">
<NitroCardGridView columns={ 5 }>
<NitroCardGridView>
{ badges && (badges.length > 0) && badges.map((badge, index) =>
{
return (