|
|
|
import React from 'react';
|
|
|
|
import './Grid.css';
|
|
|
|
|
|
|
|
import logo from './logo.png';
|
|
|
|
import GridItem from './GridItem';
|
|
|
|
|
|
|
|
import tanner from './tanner.jpg';
|
|
|
|
import dress1 from './dress1.jpg';
|
|
|
|
import switch1 from './switch1.jpg';
|
|
|
|
import pump1 from './pump1.jpg';
|
|
|
|
import hand1 from './hand1.jpg';
|
|
|
|
|
|
|
|
import banff1 from './banff1.jpg';
|
|
|
|
import bee1 from './bee1.jpg';
|
|
|
|
import canmore1 from './canmore1.jpg';
|
|
|
|
import carshow1 from './carshow1.jpg';
|
|
|
|
|
|
|
|
//function importAll(r) {
|
|
|
|
// return r.keys().map(x => r(x));
|
|
|
|
//}
|
|
|
|
|
|
|
|
//const images = importAll(require.context('./images'));
|
|
|
|
|
|
|
|
|
|
|
|
class Grid extends React.Component {
|
|
|
|
render() {
|
|
|
|
return (
|
|
|
|
<div className='grid-container'>
|
|
|
|
<GridItem type='menu'>
|
|
|
|
<img src={logo} className='logo' alt='' />
|
|
|
|
<section>
|
|
|
|
<div className='fuckcss'>
|
|
|
|
<img src={tanner} alt='' />
|
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
<footer>More info or a .onion link.</footer>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='project left'>
|
|
|
|
<header>LED Dress</header>
|
|
|
|
<section>
|
|
|
|
<img src={dress1} alt='' />
|
|
|
|
<p>A dress lit up with LEDs that act as twinkling stars. Seven act as The Big Dipper, and the rest twinkle randomly.</p>
|
|
|
|
</section>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='photo'>
|
|
|
|
<a>
|
|
|
|
<header>Thorncliffe Car Show</header>
|
|
|
|
<img src={carshow1} alt='' />
|
|
|
|
</a>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='project bottom'>
|
|
|
|
<header>Remote Control Lightswitch</header>
|
|
|
|
<section>
|
|
|
|
<img src={switch1} alt='' />
|
|
|
|
<p>Custom circuit that lets me control a ceiling light over Wifi.</p>
|
|
|
|
</section>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='project bottom'>
|
|
|
|
<header>Plant Waterer</header>
|
|
|
|
<section>
|
|
|
|
<img src={pump1} alt='' />
|
|
|
|
<p>Controller that waters my plant automatically every day.</p>
|
|
|
|
</section>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='photo'>
|
|
|
|
<a>
|
|
|
|
<header>Prince's Island Park</header>
|
|
|
|
<img src={bee1} alt='' />
|
|
|
|
</a>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='photo'>
|
|
|
|
<a>
|
|
|
|
<header>Johnston Creek, Banff</header>
|
|
|
|
<img src={banff1} alt='' />
|
|
|
|
</a>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='project left'>
|
|
|
|
<header>Hand of Ozymandias</header>
|
|
|
|
<section>
|
|
|
|
<img src={hand1} alt='' />
|
|
|
|
<p>Sculpture welded together out of scrap metal for practice.</p>
|
|
|
|
</section>
|
|
|
|
</GridItem>
|
|
|
|
<GridItem type='photo'>
|
|
|
|
<a>
|
|
|
|
<header>VW Van in Canmore</header>
|
|
|
|
<img src={canmore1} alt='' />
|
|
|
|
</a>
|
|
|
|
</GridItem>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export default Grid;
|