Move files into correct place in asset directory, and refactored Header

This commit is contained in:
Jason Zhu 2023-05-19 00:07:45 +10:00
parent 64a3bedde1
commit 81a2b7cb69
9 changed files with 36 additions and 19 deletions

View File

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import './App.css'; import './App.css';
import Header from 'components/Header'; import Header from 'components/Header/Header';
import Pokedex from 'features/Pokedex'; import Pokedex from 'features/Pokedex';
import Filters from 'features/Filters'; import Filters from 'features/Filters';
import InfoDialog from 'features/InfoDialog'; import InfoDialog from 'features/InfoDialog';

View File

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

View File

@ -1,14 +0,0 @@
import React from 'react';
import logo from 'assets/poke_logo.png';
const Header = () => {
return (
<div>
<div className="poke__logos">
<img src={logo} alt="Poke Logo" />
</div>
</div>
);
};
export default Header;

View File

@ -0,0 +1,12 @@
.poke__logos {
display: flex;
flex-direction: column;
margin-left: 10px;
}
.poke__logo {
margin-top: 10px;
width: 15vw;
-webkit-filter: drop-shadow(5px 0px 0px rgba(0,0,0,0.6));
filter: drop-shadow(5px 0px 0px rgba(0,0,0,0.6));
}

View File

@ -0,0 +1,18 @@
import React from 'react';
import logo from 'assets/images/pokedex.png';
import './Header.css';
const Header = () => {
return (
<div>
<div className="app__header">
<div className="poke__logo noselect">
<img src={logo} alt="Poke Logo" />
</div>
</div>
</div>
);
};
export default Header;

View File

@ -0,0 +1 @@
export { default } from './Header';

View File

@ -3,7 +3,7 @@ html {
--cardborder: #fff; --cardborder: #fff;
--pokenumber: hsl(228, 28%, 20%); --pokenumber: hsl(228, 28%, 20%);
--info: #fff; --info: #fff;
--bggradient: url('assets/bg.png'); --bggradient: url('assets/images/bg.png');
--bgcolor: none; --bgcolor: none;
} }
@ -147,7 +147,7 @@ html[data-theme='dark'] {
} }
.dialog__bg { .dialog__bg {
background-image: url('assets/bg.png'); background-image: url('assets/images/bg.png');
background-repeat: repeat; background-repeat: repeat;
} }

View File

@ -1,6 +1,6 @@
html { html {
--toggle: hsl(230deg 17% 85%); --toggle: hsl(230deg 17% 85%);
--bggradient: url('assets/bg.png'); --bggradient: url('assets/images/bg.png');
--bgcolor: none; --bgcolor: none;
--colorPrimary: #000; --colorPrimary: #000;
--filterHeading: #000; --filterHeading: #000;
@ -38,7 +38,7 @@ body {
sans-serif; sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
background-image: url('assets/bg.png'); background-image: url('assets/images/bg.png');
background-size: initial; background-size: initial;
background-repeat: repeat; background-repeat: repeat;
} }