gwen.works
+177
src/layouts/SHS.astro
+177
src/layouts/SHS.astro
···
1
+
---
2
+
import YAML from "yaml";
3
+
import { getCollection } from "astro:content";
4
+
import Bare from "./Bare.astro";
5
+
import { setCssColors } from "../colors";
6
+
import SHSNavigation from "../components/SHSNavigation.astro";
7
+
8
+
interface Props {
9
+
/**
10
+
* Colors to use for the layout.
11
+
* Sets CSS variables --primary, --secondary, and ---tertiary.
12
+
*/
13
+
colors?: { primary: string; secondary: string; tertiary: string };
14
+
/**
15
+
* Client-side redirect URL.
16
+
*/
17
+
clientSideRedirect?: string;
18
+
}
19
+
---
20
+
21
+
<Bare
22
+
htmlAttributes={{
23
+
lang: Astro.locals.locale || Astro.locals.lang,
24
+
style: setCssColors(Astro.props.colors),
25
+
}}
26
+
>
27
+
{
28
+
Astro.props.clientSideRedirect ? (
29
+
<Fragment slot="head">
30
+
<title>Redirecting to {Astro.props.clientSideRedirect}</title>
31
+
<meta
32
+
http-equiv="refresh"
33
+
content={`0; url=${Astro.props.clientSideRedirect}`}
34
+
/>
35
+
<link rel="canonical" href={Astro.props.clientSideRedirect} />
36
+
</Fragment>
37
+
) : (
38
+
<title slot="head">gwen.works</title>
39
+
)
40
+
}
41
+
<SHSNavigation />
42
+
<div class="main-wrapper">
43
+
<slot />
44
+
</div>
45
+
<footer>
46
+
<p>
47
+
made with <a href="/ortfo">ortfo/db</a> & <a
48
+
href="https://astro.build">astro</a
49
+
>
50
+
</p>
51
+
52
+
<p><3 Gwenn {new Date().getFullYear()}</p>
53
+
54
+
<p>generative ai cannot make art</p>
55
+
56
+
<ul>
57
+
{
58
+
(await getCollection("sites")).map(
59
+
({ data: { name, url, purpose } }) => (
60
+
<>
61
+
<li>
62
+
<a href={url}>{`/to/${name}`.padEnd(15)}</a>
63
+
<span class="purpose">{purpose}</span>
64
+
</li>
65
+
</>
66
+
),
67
+
)
68
+
}
69
+
</ul>
70
+
71
+
<section class="technical">
72
+
<slot name="technical-pre" />
73
+
{
74
+
Astro.locals.buildCommit && (
75
+
<a
76
+
href={`https://github.com/gwennlbh/portfolio/commit/${Astro.locals.buildCommit}`}
77
+
>
78
+
<pre>{Astro.locals.buildCommit?.slice(0, 8)}</pre>
79
+
</a>
80
+
)
81
+
}
82
+
<pre>loc {Astro.locals.locale}</pre>
83
+
<pre>lng {Astro.locals.lang}</pre>
84
+
<slot name="technical-post" />
85
+
</section>
86
+
</footer>
87
+
</Bare>
88
+
89
+
<style>
90
+
footer {
91
+
margin-top: 5rem;
92
+
display: flex;
93
+
flex-direction: column;
94
+
/* XXX: same as work pages' main section max-width */
95
+
max-width: 80rem;
96
+
gap: 3rem;
97
+
padding: 2rem;
98
+
font-family:
99
+
Victor Mono,
100
+
monospace;
101
+
}
102
+
103
+
footer,
104
+
footer :global(a) {
105
+
color: var(--tertiary, white);
106
+
background-color: var(--primary, black);
107
+
}
108
+
109
+
footer ul {
110
+
display: flex;
111
+
flex-direction: column;
112
+
gap: 0.5em;
113
+
list-style: none;
114
+
padding: 0;
115
+
}
116
+
117
+
footer ul a {
118
+
white-space: pre;
119
+
}
120
+
121
+
footer ul .purpose {
122
+
font-style: italic;
123
+
opacity: 0.75;
124
+
}
125
+
126
+
footer .technical {
127
+
display: flex;
128
+
align-items: center;
129
+
flex-wrap: wrap;
130
+
gap: 1em;
131
+
}
132
+
133
+
:global(p, p > *) {
134
+
line-height: 1.2;
135
+
}
136
+
:global(ul, li, h1, h2, p) {
137
+
padding: 0;
138
+
margin: 0;
139
+
}
140
+
:global(pre) {
141
+
font-family: inherit;
142
+
font-size: 1em;
143
+
}
144
+
:global(a:not(.block-link)) {
145
+
color: var(--primary, black);
146
+
text-underline-offset: 5px;
147
+
text-decoration-thickness: 1.5px;
148
+
transition: all 0.125s;
149
+
}
150
+
:global(a:not(.block-link):hover, a:not(.block-link):focus-visible) {
151
+
font-weight: bold;
152
+
text-underline-offset: calc(5px - 1px);
153
+
text-decoration-thickness: 3px;
154
+
}
155
+
:global(ul) {
156
+
list-style: none;
157
+
}
158
+
:global(ul li::before) {
159
+
content: "— ";
160
+
opacity: 0.5;
161
+
font-weight: bold;
162
+
}
163
+
body {
164
+
--pad: 2rem;
165
+
padding: var(--pad);
166
+
width: calc(100% - 2 * var(--pad));
167
+
height: calc(100% - 2 * var(--pad));
168
+
display: flex;
169
+
flex-direction: column;
170
+
gap: 2rem;
171
+
}
172
+
.main-wrapper {
173
+
font-size: 1.5rem;
174
+
line-height: 1.5;
175
+
max-width: min(80ch, 100%);
176
+
}
177
+
</style>
+12
src/pages/shs/career.astro
+12
src/pages/shs/career.astro
+42
src/pages/shs/course.astro
+42
src/pages/shs/course.astro
···
1
+
---
2
+
import SHS from "../../layouts/SHS.astro";
3
+
---
4
+
5
+
<SHS>
6
+
<main>
7
+
<h1>Education</h1>
8
+
<section>
9
+
<p>2019 to 2022</p>
10
+
<h2>Preparatory classes</h2>
11
+
<p>
12
+
Intensive 2-year program in mathematics and physics, preparing for the
13
+
entrance exams to top-ranking French engineering schools.
14
+
<a
15
+
href="https://fr.wikipedia.org/wiki/Classes_pr%C3%A9paratoires_aux_grandes_%C3%A9coles"
16
+
>
17
+
Learn more
18
+
</a>
19
+
</p>
20
+
</section>
21
+
<section>
22
+
<p>2022 to 2023</p>
23
+
<h2>ENSEEIHT, first year</h2>
24
+
<p>
25
+
Computer science major
26
+
<a
27
+
href="https://www.enseeiht.fr/en/training/full-time-engineering-program/sn.html"
28
+
>
29
+
Learn more
30
+
</a>
31
+
</p>
32
+
</section>
33
+
<section>
34
+
<p>2023 to 2024</p>
35
+
<h2>ENSEEIHT, second year</h2>
36
+
<p>
37
+
Networks and architecture minor (first semester), then multimedia and
38
+
image minor (second semester)
39
+
</p>
40
+
</section>
41
+
</main>
42
+
</SHS>
+38
src/pages/shs/engagement.astro
+38
src/pages/shs/engagement.astro
···
1
+
---
2
+
import SHS from "../../layouts/SHS.astro";
3
+
---
4
+
5
+
<SHS>
6
+
<main>
7
+
<h2>Involvement in student life</h2>
8
+
<section>
9
+
<img src="https://churros.inpt.fr/storage/groups/n7beats-n7.png" />
10
+
<h3>n7beats</h3>
11
+
<p>
12
+
Last year, I picked up a club that was dead since a few years, <em
13
+
>n7beats</em
14
+
>. It's a club that helps students that want to learn or improve their
15
+
music-making skills. I really like creating music, and I wanted to share
16
+
that with other students.
17
+
</p>
18
+
<a href="https://n7beats.org"> Visit n7beats </a>
19
+
</section>
20
+
<section>
21
+
<h3>Loca7</h3>
22
+
<p>
23
+
Last year, I re-built
24
+
<em> Loca7 </em> from the ground up, the website that connects landlords
25
+
in the area with students of the school.
26
+
</p>
27
+
<a href="https://loca7.fr"> Visit Loca7 </a>
28
+
<a href="https://en.gwen.works/loca7"> Learn more </a>
29
+
</section>
30
+
<h3>Churros</h3>
31
+
<p>
32
+
I continue to work on the app that we, at net7, released at the start of
33
+
this school year, <em>Churros</em>. It's a web application that powers the
34
+
entire student life of the school.
35
+
</p>
36
+
<a href="https://en.gwen.works/churros"> Learn more </a>
37
+
</main>
38
+
</SHS>
+51
src/pages/shs/international.astro
+51
src/pages/shs/international.astro
···
1
+
---
2
+
import SHS from "../../layouts/SHS.astro";
3
+
---
4
+
5
+
<SHS>
6
+
<main>
7
+
<h1>International mobility</h1>
8
+
<h2>
9
+
Seven weeks in
10
+
<abbr title="Japan">日本</abbr>
11
+
<sup> Japan </sup>
12
+
</h2>
13
+
<p>
14
+
I took Japanese as a second language course. I learned to read characters
15
+
of both Japanese syllabaries, ひらがな (hiragana) & カタカナ (katakana). I
16
+
then actually went there for almost two months! It was a great experience
17
+
to discover the culture and daily life in another continent.
18
+
</p>
19
+
<ul>
20
+
<li>Japanese language courses @ 横浜</li>
21
+
<li>Internship @ 山中湖</li>
22
+
</ul>
23
+
<h2>
24
+
Two weeks in
25
+
<abbr title="Morocco"> المملكة المغربية </abbr><sup>Morocco</sup>
26
+
</h2>
27
+
<h2>POMI Module</h2>
28
+
<dl>
29
+
<dt>Interculturality video</dt>
30
+
<dd>
31
+
<iframe
32
+
width="560"
33
+
height="315"
34
+
src="https://www.youtube.com/embed/6rKUK1bhlOQ?si=KursnTE_a2igbRm8"
35
+
title="YouTube video player"
36
+
frameborder="0"
37
+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
38
+
referrerpolicy="strict-origin-when-cross-origin"
39
+
allowfullscreen></iframe>
40
+
<br />
41
+
<a href="https://youtu.be/6rKUK1bhlOQ"> on YouTube </a>
42
+
</dd>
43
+
<dt>Documents</dt>
44
+
<dd>
45
+
<a href="https://media.gwen.works/pomi-documents.zip"
46
+
>download (.zip archive)</a
47
+
>
48
+
</dd>
49
+
</dl>
50
+
</main>
51
+
</SHS>