import React from 'react';
import '../stylesheets/style.scss'
import {Link} from 'react-router-dom';

class Header extends React.Component {
  render() {
    const Logo = () => {
      return (
        <section className="logo-container">
          <Link to="/">
            <img className="site-logo" src={require('../assets/images/logo.png')} alt="logo 858 "/>
            <br/>
            <img className="site-logo" src={require('../assets/images/byline.ar.png')} alt="logo 858 "/>
            <h1>An archive of resistance</h1>
          </Link>
        </section>
      );
    }
    const Counter = () => {
      return (
        <div className="counter-container">
          <span>967</span>
          <br/>
          <span> ساعة وبيزيدوا</span>
        </div>
      );
    }
    return (
      <header>
        <Logo/>
        <Counter/>
      </header>
    )
  }
}

export default (Header);