Browse Source

show more button

main
sina_sajjadi 2 months ago
parent
commit
d9363a054b
  1. 3
      src/app/(client-components)/(HeroSearchForm)/LocationInput.tsx
  2. 5
      src/app/globals.css
  3. 8
      src/app/signup/page.tsx
  4. 6
      src/components/SectionGridFeaturePlaces.tsx
  5. 19
      src/data/navigation.ts

3
src/app/(client-components)/(HeroSearchForm)/LocationInput.tsx

@ -79,9 +79,6 @@ const LocationInput: FC<LocationInputProps> = ({
key={item.id}
className="flex px-4 sm:px-8 items-center space-x-3 sm:space-x-4 py-4 hover:bg-neutral-100 dark:hover:bg-neutral-700 cursor-pointer"
>
<span className="block text-neutral-400">
<ClockIcon className="h-4 sm:h-6 w-4 sm:w-6" />
</span>
<span className=" block font-medium text-neutral-700 dark:text-neutral-200">
{item.title}
</span>

5
src/app/globals.css

@ -6,3 +6,8 @@
font-size: 16px;
-webkit-text-security: disc;
}
.no-border-on-focus:focus {
outline: none;
box-shadow: none;
border: none; /* Ensures no border shows on focus */
}

8
src/app/signup/page.tsx

@ -97,17 +97,17 @@ const PageSignUp: FC<PageSignUpProps> = () => {
value={countryCode}
onChange={countryCodeHandler}
type="text"
placeholder="98"
placeholder="000"
maxLength={3}
className="w-[50px] p-2 mr-[-10px] text-center border-none outline-none bg-transparent text-neutral-800 dark:text-neutral-200"
className="w-[50px] no-border-on-focus p-2 mr-[-10px] shadow-none text-center border-none outline-none bg-transparent text-neutral-800 dark:text-neutral-200"
/>
<span className="px-2 text-neutral-500">|</span>
<input
value={phoneNumber}
onChange={(e) => setPhoneNumber(e.target.value)}
type="text"
placeholder="26363687"
className="flex-1 p-2 border-none outline-none bg-transparent text-neutral-800 dark:text-neutral-200"
placeholder=""
className="flex-1 p-2 no-border-on-focus border-none outline-none bg-transparent text-neutral-800 dark:text-neutral-200"
/>
</div>
{errors.countryCode && <p className="text-xs text-red-600">{errors.countryCode}</p>}

6
src/components/SectionGridFeaturePlaces.tsx

@ -34,6 +34,8 @@ const SectionGridFeaturePlaces: FC<SectionGridFeaturePlacesProps> = ({
const { countries , tours } = useContext(Context);
const [countryTours, setCountryTours] = useState();
const [limit, setLimit] = useState(7);
@ -85,13 +87,13 @@ const SectionGridFeaturePlaces: FC<SectionGridFeaturePlacesProps> = ({
className={`grid gap-6 md:gap-8 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 ${gridClass}`}
>
{countryTours?.length ? (
countryTours?.map((stay) => <StayCard2 key={stay.id} data={stay} />)
countryTours?.map((stay , idx) => limit >= idx && <StayCard2 key={stay.id} data={stay} />)
) : (
<h2>No tours Available</h2>
)}
</div>
<div className="flex mt-16 justify-center items-center">
<ButtonPrimary>Show me more</ButtonPrimary>
<ButtonPrimary onClick={()=>{setLimit((prev)=> prev + 8)}}>Show me more</ButtonPrimary>
</div>
</div>
);

19
src/data/navigation.ts

@ -164,6 +164,13 @@ const templatesChildrenMenus: NavItemType[] = [
];
export const NAVIGATION_DEMO: NavItemType[] = [
{
id: ncNanoId(),
href: "/",
name: "Home",
type: "none",
isNew: true,
},
{
id: ncNanoId(),
href: "/",
@ -179,6 +186,18 @@ export const NAVIGATION_DEMO: NavItemType[] = [
type: "megaMenu",
megaMenu: megaMenuDemo,
},
{
id: ncNanoId(),
href: "/",
name: "FAQ",
type: "none",
},
{
id: ncNanoId(),
href: "/",
name: "AboutUs",
type: "none",
},
// {
// id: ncNanoId(),
// href: "/listing-stay",

Loading…
Cancel
Save