demo
NB 3 years ago
parent 715290696c
commit 802d8d8c08
  1. BIN
      public/images/reactEpubIcon.png
  2. 35
      src/components/header/Logo.tsx
  3. 2
      src/containers/Header.tsx
  4. 2
      src/index.tsx

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

@ -0,0 +1,35 @@
import styled from 'styled-components'
// lib
import * as styles from 'lib/styles/styles'
import palette from 'lib/styles/palette'
const Logo = () => {
return (
<Wrapper href="https://github.com/altmshfkgudtjr/react-epub-viewer" target="__blank__">
<Img src="react-epub-viewer/images/reactEpubIcon.png" alt="Logo" />
</Wrapper>
);
}
const Wrapper = styled.a`
display: flex;
align-items: center;
justify-content: center;
outline: none;
margin-left: 16px;
background-color: rgba(0,0,0,0);
transition: .3s ${styles.transition};
border-radius: 8px;
padding: 4px 8px;
cursor: pointer;
&:focus, &:hover {
background-color: ${palette.blue1};
}
`;
const Img = styled.img`
height: 32px;
`;
export default Logo

@ -2,6 +2,7 @@ import { useState } from 'react'
// components // components
import Wrapper from 'components/header/Wrapper' import Wrapper from 'components/header/Wrapper'
import Layout, { AutoLayout } from 'components/header/Layout' import Layout, { AutoLayout } from 'components/header/Layout'
import Logo from 'components/header/Logo'
import ControlBtn from 'components/header/ControlBtn' import ControlBtn from 'components/header/ControlBtn'
import ControlIconBtn from 'components/header/ControlIconBtn' import ControlIconBtn from 'components/header/ControlIconBtn'
import VerticalLine from 'components/header/VerticalLine' import VerticalLine from 'components/header/VerticalLine'
@ -72,6 +73,7 @@ const Header = ({
<Layout> <Layout>
<AutoLayout> <AutoLayout>
<div> <div>
<Logo />
<ControlBtn message="Contents" onClick={onNavToggle} /> <ControlBtn message="Contents" onClick={onNavToggle} />
<ControlBtn message="Setting" onClick={onOptionToggle} /> <ControlBtn message="Setting" onClick={onOptionToggle} />
<ControlBtn message="Highlights" onClick={onLearningToggle} /> <ControlBtn message="Highlights" onClick={onLearningToggle} />

@ -1,6 +1,6 @@
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import Reader from 'containers/Reader' import Reader from 'containers/Reader'
const EPUB_URL = "files/Alices Adventures in Wonderland.epub"; const EPUB_URL = "react-epub-viewer/files/Alices Adventures in Wonderland.epub";
ReactDOM.render(<Reader url={EPUB_URL} />, document.getElementById('root')); ReactDOM.render(<Reader url={EPUB_URL} />, document.getElementById('root'));
Loading…
Cancel
Save