Skip to content

Commit c9b0238

Browse files
BrilatorBrilator
committed
extract metadata from slides.md yaml
1 parent 7eef6b8 commit c9b0238

7 files changed

Lines changed: 162 additions & 246 deletions

File tree

‎app/src/App.vue‎

Lines changed: 77 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,118 @@
11
<script setup>
22
import decks from './decks'
3-
import { ref } from 'vue'
4-
5-
const active = ref(null)
63
</script>
74

85
<template>
96
<main class="container">
10-
<h1>EduSlides Gallery</h1>
7+
<header class="header">
8+
<h1>Slides Gallery</h1>
9+
<p class="subtitle">Browse and open available slide decks</p>
10+
</header>
1111

1212
<div class="grid">
13-
<div
13+
<a
1414
v-for="deck in decks"
1515
:key="deck.id"
16+
:href="deck.url"
1617
class="card"
17-
@click="active = deck"
1818
>
19-
<img :src="deck.thumbnail" />
20-
<h2>{{ deck.title }}</h2>
21-
<p>{{ deck.description }}</p>
22-
</div>
23-
</div>
19+
<div class="card-body">
20+
<h2>{{ deck.title }}</h2>
21+
<p>{{ deck.description }}</p>
22+
</div>
2423

25-
<div v-if="active" class="modal" @click.self="active = null">
26-
<iframe
27-
:src="active.url"
28-
class="deck-frame"
29-
sandbox="allow-scripts allow-same-origin allow-forms allow-pointer-lock allow-popups"
30-
referrerpolicy="no-referrer"
31-
/>
24+
<div class="meta">
25+
<span class="author">{{ deck.author }}</span>
26+
<span class="date">{{ deck.date }}</span>
27+
</div>
28+
</a>
3229
</div>
3330
</main>
3431
</template>
3532

3633
<style>
34+
/* Layout */
3735
.container {
38-
max-width: 1200px;
36+
max-width: 1400px;
3937
margin: auto;
40-
padding: 2rem;
41-
font-family: system-ui;
38+
padding: 3rem 2rem;
39+
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
40+
Roboto, "Helvetica Neue", Arial, sans-serif;
41+
}
42+
43+
/* Header */
44+
.header {
45+
margin-bottom: 2.5rem;
46+
}
47+
48+
.header h1 {
49+
font-size: 2.4rem;
50+
margin: 0;
4251
}
4352
53+
.subtitle {
54+
opacity: 0.6;
55+
margin-top: 0.4rem;
56+
}
57+
58+
/* Responsive grid */
4459
.grid {
4560
display: grid;
46-
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
47-
gap: 1.5rem;
61+
gap: 1.8rem;
62+
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
4863
}
4964
65+
/* Card */
5066
.card {
51-
cursor: pointer;
52-
border-radius: 12px;
53-
overflow: hidden;
54-
box-shadow: 0 10px 30px rgba(0,0,0,.1);
55-
transition: transform .2s;
56-
background: white;
67+
display: flex;
68+
flex-direction: column;
69+
justify-content: space-between;
70+
text-decoration: none;
71+
color: inherit;
72+
background: linear-gradient(180deg, #ffffff, #fafafa);
73+
border-radius: 16px;
74+
padding: 1.6rem 1.6rem 1.2rem;
75+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
76+
transition: transform 0.2s ease, box-shadow 0.2s ease;
77+
min-height: 180px;
5778
}
5879
5980
.card:hover {
60-
transform: scale(1.03);
81+
transform: translateY(-6px);
82+
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
6183
}
6284
63-
.card img {
64-
width: 100%;
65-
height: 160px;
66-
object-fit: cover;
85+
/* Content */
86+
.card h2 {
87+
font-size: 1.2rem;
88+
margin: 0 0 0.4rem;
89+
line-height: 1.3;
6790
}
6891
69-
.modal {
70-
position: fixed;
71-
inset: 0;
72-
background: rgba(0,0,0,.8);
73-
display: flex;
74-
padding: 2rem;
92+
.card p {
93+
font-size: 0.95rem;
94+
opacity: 0.75;
95+
line-height: 1.4;
7596
}
7697
77-
.modal iframe {
78-
flex: 1;
79-
border-radius: 12px;
80-
background: white;
98+
/* Metadata */
99+
.meta {
100+
display: flex;
101+
justify-content: space-between;
102+
align-items: center;
103+
margin-top: 1.2rem;
104+
font-size: 0.8rem;
105+
opacity: 0.65;
106+
border-top: 1px solid rgba(0, 0, 0, 0.05);
107+
padding-top: 0.8rem;
81108
}
82109
83-
.deck-frame {
84-
width: 100%;
85-
height: 100%;
86-
border: none;
87-
background: white;
110+
.author {
111+
font-weight: 500;
88112
}
89113
114+
.date {
115+
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
116+
"Liberation Mono", monospace;
117+
}
90118
</style>

‎app/src/decks.js‎

Lines changed: 28 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -5,47 +5,43 @@ const dev = import.meta.env.DEV
55

66
export default [
77
{
8-
id: "2025-11-19_intro-rdm",
9-
title: "2025-11-19_intro-rdm",
10-
description: "Slidev presentation",
11-
thumbnail: dev
12-
? "http://localhost:3030/__slidev__/preview.png"
13-
: "/2025-11-19_intro-rdm/preview.png",
14-
url: dev
15-
? "http://localhost:3030"
16-
: "/2025-11-19_intro-rdm/"
17-
},
18-
{
19-
id: "2025-12-04_arc",
20-
title: "2025-12-04_arc",
21-
description: "Slidev presentation",
22-
thumbnail: dev
23-
? "http://localhost:3031/__slidev__/preview.png"
24-
: "/2025-12-04_arc/preview.png",
8+
id: "2026-01-14_cwl-handsOn",
9+
title: "CWL Demo",
10+
description: "CWL Demo",
11+
author: "Dominik Brilhaus",
12+
date: "2026-01-14",
2513
url: dev
26-
? "http://localhost:3031"
27-
: "/2025-12-04_arc/"
14+
? "http://localhost:3033"
15+
: "/2026-01-14_cwl-handsOn/"
2816
},
2917
{
3018
id: "2025-12-12_wfls",
31-
title: "2025-12-12_wfls",
32-
description: "Slidev presentation",
33-
thumbnail: dev
34-
? "http://localhost:3032/__slidev__/preview.png"
35-
: "/2025-12-12_wfls/preview.png",
19+
title: "Computational Workflows",
20+
description: "",
21+
author: "Dominik Brilhaus",
22+
date: "2025-12-12",
3623
url: dev
3724
? "http://localhost:3032"
3825
: "/2025-12-12_wfls/"
3926
},
4027
{
41-
id: "2026-01-14_cwl-handsOn",
42-
title: "2026-01-14_cwl-handsOn",
43-
description: "Slidev presentation",
44-
thumbnail: dev
45-
? "http://localhost:3033/__slidev__/preview.png"
46-
: "/2026-01-14_cwl-handsOn/preview.png",
28+
id: "2025-12-04_arc",
29+
title: "Intro to ARC",
30+
description: "",
31+
author: "Dominik Brilhaus",
32+
date: "2025-12-04",
4733
url: dev
48-
? "http://localhost:3033"
49-
: "/2026-01-14_cwl-handsOn/"
34+
? "http://localhost:3031"
35+
: "/2025-12-04_arc/"
36+
},
37+
{
38+
id: "2025-11-19_intro-rdm",
39+
title: "Intro to RDM",
40+
description: "",
41+
author: "Dominik Brilhaus",
42+
date: "2025-11-19",
43+
url: dev
44+
? "http://localhost:3030"
45+
: "/2025-11-19_intro-rdm/"
5046
}
5147
]

‎dist/index.html‎

Lines changed: 0 additions & 141 deletions
This file was deleted.

0 commit comments

Comments
 (0)