mirror of
https://github.com/duckietm/Nitro-V3.git
synced 2026-06-20 15:36:18 +00:00
🆕 Added New catalogue page
This commit is contained in:
@@ -1,11 +1,10 @@
|
||||
import { FC } from 'react';
|
||||
import { FaCaretLeft, FaCaretRight } from 'react-icons/fa';
|
||||
import { FaMinus, FaPlus } from 'react-icons/fa';
|
||||
import { LocalizeText } from '../../../../../api';
|
||||
import { Text } from '../../../../../common';
|
||||
import { useCatalog } from '../../../../../hooks';
|
||||
|
||||
const MIN_VALUE: number = 1;
|
||||
const MAX_VALUE: number = 100;
|
||||
const MAX_VALUE: number = 99;
|
||||
|
||||
export const CatalogSpinnerWidgetView: FC<{}> = props =>
|
||||
{
|
||||
@@ -34,13 +33,28 @@ export const CatalogSpinnerWidgetView: FC<{}> = props =>
|
||||
if(!currentOffer || !currentOffer.bundlePurchaseAllowed) return null;
|
||||
|
||||
return (
|
||||
<>
|
||||
<Text>{ LocalizeText('catalog.bundlewidget.spinner.select.amount') }</Text>
|
||||
<div className="flex items-center gap-1">
|
||||
<FaCaretLeft className="text-black cursor-pointer fa-icon" onClick={ event => updateQuantity(quantity - 1) } />
|
||||
<input className="[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none min-h-[17px] h-[17px] w-[28px] px-[4px] py-0 text-right rounded-[.2rem]" type="number" value={ quantity } onChange={ event => updateQuantity(event.target.valueAsNumber) } />
|
||||
<FaCaretRight className="text-black cursor-pointer fa-icon" onClick={ event => updateQuantity(quantity + 1) } />
|
||||
<div className="flex items-center gap-1.5">
|
||||
<span className="text-[10px] text-muted whitespace-nowrap">{ LocalizeText('catalog.bundlewidget.spinner.select.amount') }</span>
|
||||
<div className="flex items-center rounded overflow-hidden border-2 border-card-grid-item-border">
|
||||
<button
|
||||
className="w-[24px] h-[24px] flex items-center justify-center bg-card-grid-item hover:bg-card-grid-item-active transition-colors cursor-pointer border-r border-card-grid-item-border"
|
||||
onClick={ event => updateQuantity(quantity - 1) }
|
||||
>
|
||||
<FaMinus className="text-[7px] text-dark" />
|
||||
</button>
|
||||
<input
|
||||
className="w-[40px] h-[24px] text-center text-[11px] font-bold bg-white border-x border-card-grid-item-border [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none focus:outline-none"
|
||||
type="number"
|
||||
value={ quantity }
|
||||
onChange={ event => updateQuantity(event.target.valueAsNumber) }
|
||||
/>
|
||||
<button
|
||||
className="w-[24px] h-[24px] flex items-center justify-center bg-card-grid-item hover:bg-card-grid-item-active transition-colors cursor-pointer border-l border-card-grid-item-border"
|
||||
onClick={ event => updateQuantity(quantity + 1) }
|
||||
>
|
||||
<FaPlus className="text-[7px] text-dark" />
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user