aljaz/landscape-template
1
0
Fork 0
mirror of https://github.com/aljazceru/landscape-template.git synced 2026-01-18 05:44:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

data: update category images

Browse Source
This commit is contained in:
MTG2000
2022-06-15 15:35:44 +03:00
parent 86a3f95c9c
commit 576cab576a
3 changed files with 8 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/category-bg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

3
src/assets/index.ts
View File

@@ -1,8 +1,9 @@
import Images_ExploreHeader1 from './images/explore_page_header_1.jpg'
import Images_ExploreHeader2 from './images/shock-the-web.jpg'
import Category_BG from './images/category-bg.jpg'
import Image_Hottest_Header from './images/hottest.jfif'
import Logo from './images/logo.png'
const ASSETS = { Images_ExploreHeader1, Images_ExploreHeader2, Image_Hottest_Header, Logo }
const ASSETS = { Images_ExploreHeader1, Images_ExploreHeader2, Image_Hottest_Header, Logo, Category_BG }
export default ASSETS;

7
src/features/Projects/pages/CategoryPage/HeaderImage/HeaderImage.tsx
View File

@@ -2,6 +2,7 @@ import React from 'react'
import { FiArrowLeft } from 'react-icons/fi'
import Skeleton from 'react-loading-skeleton'
import { Link } from 'react-router-dom'
import ASSETS from 'src/assets'
type Props = {
isLoading: boolean
@@ -23,9 +24,13 @@ export default function HeaderImage(props: Props) {
const { title, img, apps_count } = props;
const DEFAULT_IMG = ASSETS.Category_BG;
return (
<div className='h-[280px] rounded-20 overflow-hidden relative flex flex-col justify-center items-center gap-8'>
<img src={img} alt={`${title} cover`} className='absolute inset-0 w-full h-full object-cover z-[-1]' />
<img src={img.startsWith('https://via.placeholder.com/') ? DEFAULT_IMG : img} alt={`${title} cover`} className='absolute inset-0 w-full h-full object-cover z-[-1]' />
<div className='absolute inset-0 w-full h-full bg-black bg-opacity-50 z-[-1]' />
<Link
to='/'