Chap04 -> Styling components with CSS modules
parent
58c82bb334
commit
beedc2aef8
|
@ -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>
|
||||||
|
|
|
@ -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"
|
||||||
|
|
Loading…
Reference in New Issue