98 lines
2.2 KiB
Markdown
98 lines
2.2 KiB
Markdown
---
|
|
# Feel free to add content and custom Front Matter to this file.
|
|
# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults
|
|
|
|
layout: home
|
|
hide_posts: true
|
|
image: /assets/images/banner.webp
|
|
introduction: |
|
|
Otaniemen datojen oma sivu. Täältä löydät [tietoa datoista](/about), datojen [telegram-ryhmän](/telegram) sekä tietenkin [dataleffat](/leffat).
|
|
actions:
|
|
- label: "Telegram-ryhmä"
|
|
url: "/telegram"
|
|
- label: "Liity jäseneksi"
|
|
url: "https://rekisteri.datat.fi/apply"
|
|
---
|
|
|
|
{% assign sorted_movies = site.leffat | sort: 'path' | reverse %}
|
|
|
|
<div class="featured-movies">
|
|
<h3>Viimeisimmät dataleffat · <a href="/leffat" class="see-all-link">Kaikki</a></h3>
|
|
{% assign latest = sorted_movies | first %}
|
|
<a href="{{ latest.external_url }}" class="featured-movie-link featured-movie-main">
|
|
<img src="{{ latest.image.thumbnail }}" alt="{{ latest.title }}">
|
|
<span class="featured-movie-title">{{ latest.title }}</span>
|
|
</a>
|
|
|
|
<div class="older-movies">
|
|
{% for movie in sorted_movies offset:1 limit:2 %}
|
|
<a href="{{ movie.external_url }}" class="featured-movie-link featured-movie-small">
|
|
<img src="{{ movie.image.thumbnail }}" alt="{{ movie.title }}">
|
|
<span class="featured-movie-title">{{ movie.title }}</span>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.featured-movies {
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.featured-movies h3 {
|
|
margin-bottom: 0.75rem;
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
.see-all-link {
|
|
font-weight: 400;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.featured-movie-link {
|
|
display: inline-block;
|
|
text-decoration: none;
|
|
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
|
}
|
|
|
|
.featured-movie-main {
|
|
max-width: 320px;
|
|
}
|
|
|
|
.featured-movie-link:hover {
|
|
transform: translateY(-4px);
|
|
}
|
|
|
|
.featured-movie-link img {
|
|
width: 100%;
|
|
border-radius: 0.25em;
|
|
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
|
|
}
|
|
|
|
.featured-movie-link:hover img {
|
|
box-shadow: 0 8px 24px rgba(0,0,0,0.25);
|
|
}
|
|
|
|
.featured-movie-title {
|
|
display: block;
|
|
margin-top: 0.5rem;
|
|
font-weight: 600;
|
|
color: inherit;
|
|
}
|
|
|
|
.older-movies {
|
|
display: flex;
|
|
gap: 1rem;
|
|
flex-wrap: wrap;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.featured-movie-small {
|
|
max-width: 180px;
|
|
}
|
|
|
|
.featured-movie-small .featured-movie-title {
|
|
font-size: 0.9rem;
|
|
}
|
|
</style>
|