fix #3 add fonts to be used for the header and the rest of the website.

This commit is contained in:
Ahmed-Ayman 2018-12-05 23:51:53 +02:00
parent c17e153fd3
commit ba0f08036e
8 changed files with 57 additions and 5 deletions

View File

Binary file not shown.

View File

View File

View File

View File

View File

@ -6,11 +6,13 @@ class Header extends React.Component {
render() {
const Logo = () => {
return (
<nav>
<header>
<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 "/>
</nav>
<h1 >An archive of resistance</h1>
<h2 className="counter">٩٦٧ ساعة وبيزيدوا</h2>
</header>
);
}
return (

View File

@ -1,4 +1,54 @@
* {
box-sizing: border-box;
margin: 0px;
border: 0px;
}
:root {
--858-light-gray-color: #ebebeb;
}
/* fonts */
@font-face {
font-family: 'Fedra Arabic';
src: url('../assets/fonts/Fedra Arabic Reg_beta.ttf') format('truetype');
}
@font-face {
font-family: 'bebas';
src: url('../assets/fonts/BEBAS___.ttf') format('truetype');
}
@font-face {
font-family: 'majalla';
src: url('../assets/fonts/majalla 2.ttf') format('truetype');
}
@font-face {
font-family: 'MyriadPro Regular';
src: url('../assets/fonts/MyriadPro-Regular.otf') format('otf');
}
@font-face {
font-family: 'interstate';
src: url('../assets/fonts/Interstate-Regular.bmap') format('bmap'),
url('../assets/fonts/Interstate-Bold.bmap') format('bmap');
}
/* header */
header {
padding-top: 1em;
}
.site-logo {
max-width: 300px;
padding-top: 2em;
text-align: center;
}
.counter {
position: absolute;
right: 0;
top: 0;
padding: 2em;
font-family: majalla, serif;
}