Chap04 -> Styling components with CSS modules

master
Jason Zhu 2022-03-26 17:56:51 +11:00
parent 58c82bb334
commit beedc2aef8
4 changed files with 4 additions and 4 deletions

View File

@ -1,11 +1,11 @@
import React from 'react'; import React from 'react';
import { Header } from './Header'; import { Header } from './Header';
import './App.css'; import style from './App.module.css';
import { HomePage } from './HomePage'; import { HomePage } from './HomePage';
function App() { function App() {
return ( return (
<div className="container"> <div className={style.container}>
<Header /> <Header />
<HomePage /> <HomePage />
</div> </div>

View File

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { UserIcon } from './Icons'; import { UserIcon } from './Icons';
import './Header.css'; import style from './Header.module.css';
export const Header = () => { export const Header = () => {
const handleSearchInputChange = (e: React.ChangeEvent<HTMLInputElement>) => { const handleSearchInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
@ -8,7 +8,7 @@ export const Header = () => {
}; };
return ( return (
<div className="container"> <div className={style.container}>
<a href="./">Q & A</a> <a href="./">Q & A</a>
<input <input
type="text" type="text"