Skip to content
Snippets Groups Projects
Commit 0def521e authored by fanconic's avatar fanconic
Browse files

imageurl for hot-card and frontpage-card was implemented

parent d81ae520
No related branches found
No related tags found
1 merge request!45Frontpage
......@@ -3,15 +3,33 @@ import * as events from '../models/events';
const date = `${new Date().toISOString().split('.')[0]}Z`;
// Render the frontpage cards, with href and imageurl
const renderCards = item => {
const { title, href } = item;
return m('div.frontpage-card', m('a', { href }, title));
const { title, href, imageurl } = item;
return m(
'div.frontpage-card',
{ style: `background-image: url(${imageurl})` },
m('a', { href }, title)
);
};
// Render the Hot Cards, with link and imageurl
const renderHotCards = (item, index) => {
const { title } = item;
if (index === 0) return m('div.hot-first-card', title);
return m('div.hot-card', title);
const { title, href, imageurl } = item;
if (index === 0) {
return m(
'div.hot-first-card',
{
style: `background-image: url(${imageurl})`,
},
m('a', { href }, title)
);
}
return m(
'div.hot-card',
{ style: `background-image: url(${imageurl})` },
m('a', { href }, title)
);
};
export default class Frontpage {
......@@ -28,12 +46,33 @@ export default class Frontpage {
this.events = events.getList().slice(0, 3);
// MOCKDATA
this.hot = [{ title: 'super hot' }, { title: 'also pretty hot' }, { title: 'kinda hot' }];
this.jobs = [{ title: 'google' }, { title: 'abb' }, { title: 'accenture' }];
this.hot = [
{
title: 'super hot',
imageurl: 'http://www.heilpraxisnet.de/wp-content/uploads/2016/04/bier-lagern-1024x724.jpg',
},
{ title: 'also pretty hot' },
{ title: 'kinda hot' },
];
this.jobs = [{ title: 'Google' }, { title: 'ABB' }, { title: 'Accenture' }];
this.socialmedia = [
{ title: 'Facebook', href: 'https://www.facebook.com/AMIV.ETHZ/' },
{ title: 'Instagram', href: 'https://www.instagram.com/amiv_eth/?hl=de' },
{ title: 'Twitter', href: 'https://twitter.com/amiv_ethz?lang=de' },
{
title: 'Facebook',
href: 'https://www.facebook.com/AMIV.ETHZ/',
imageurl: 'https://upload.wikimedia.org/wikipedia/commons/c/c2/F_icon.svg',
},
{
title: 'Instagram',
href: 'https://www.instagram.com/amiv_eth/?hl=de',
imageurl:
'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e7/Instagram_logo_2016.svg/2000px-Instagram_logo_2016.svg.png',
},
{
title: 'Twitter',
href: 'https://twitter.com/amiv_ethz?lang=de',
imageurl:
'https://upload.wikimedia.org/wikipedia/de/thumb/9/9f/Twitter_bird_logo_2012.svg/1200px-Twitter_bird_logo_2012.svg.png',
},
];
}
......
......@@ -25,12 +25,14 @@
background-color: red;
grid-row-start: 1;
grid-row-end: 3;
// TODO: Title, Picture and shit
background-size: cover;
background-position: centre-centre;
}
.hot-card {
background-color: aqua;
// TODO: Title, Picture and shit
background-color: yellow;
background-size: cover;
background-position: centre-centre;
}
}
......@@ -45,10 +47,11 @@
grid-gap: 30px;
.frontpage-card{
background-color: greenyellow;
background-color: yellowgreen;
grid-row-start: 1;
grid-row-end: 8;
// TODO: Title, Picture and shit
background-size: cover;
background-position: centre-centre;
}
}
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment