diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/components/icons.tsx | 6 | ||||
-rw-r--r-- | src/components/landing/sections/Contact.module.css | 175 | ||||
-rw-r--r-- | src/components/landing/sections/Contact.tsx | 218 | ||||
-rw-r--r-- | src/components/landing/sections/Hero.module.css | 2 | ||||
-rw-r--r-- | src/components/landing/sections/Hero.tsx | 13 | ||||
-rw-r--r-- | src/components/landing/sections/Research.tsx | 2 | ||||
-rw-r--r-- | src/components/landing/sections/Software.module.css | 5 | ||||
-rw-r--r-- | src/components/landing/sections/Software.tsx | 15 | ||||
-rw-r--r-- | src/css/custom.css | 6 | ||||
-rw-r--r-- | src/pages/bme-building-i-cropped.jpg | bin | 0 -> 30231 bytes | |||
-rw-r--r-- | src/pages/bme-building-i-cropped.jpg.license | 6 | ||||
-rw-r--r-- | src/pages/index.tsx | 10 | ||||
-rw-r--r-- | src/pages/license.mdx | 3 | ||||
-rw-r--r-- | src/plugins/responsiveLoaderPlugin.ts | 39 | ||||
-rw-r--r-- | src/types.d.ts | 25 |
15 files changed, 486 insertions, 39 deletions
diff --git a/src/components/icons.tsx b/src/components/icons.tsx index 1411218..57fc10c 100644 --- a/src/components/icons.tsx +++ b/src/components/icons.tsx | |||
@@ -9,8 +9,10 @@ import { | |||
9 | siCreativecommons, | 9 | siCreativecommons, |
10 | siDblp, | 10 | siDblp, |
11 | siGithub, | 11 | siGithub, |
12 | siGnuprivacyguard, | ||
12 | siGooglescholar, | 13 | siGooglescholar, |
13 | siLinkedin, | 14 | siLinkedin, |
15 | siMicrosoftteams, | ||
14 | siOrcid, | 16 | siOrcid, |
15 | siScopus, | 17 | siScopus, |
16 | } from 'simple-icons'; | 18 | } from 'simple-icons'; |
@@ -83,6 +85,8 @@ export const FediverseIcon = makeSimpleIcon(fediverse); | |||
83 | 85 | ||
84 | export const GithubIcon = makeSimpleIcon(siGithub); | 86 | export const GithubIcon = makeSimpleIcon(siGithub); |
85 | 87 | ||
88 | export const GPGIcon = makeSimpleIcon(siGnuprivacyguard); | ||
89 | |||
86 | export const GoogleScholarIcon = makeSimpleIcon(siGooglescholar); | 90 | export const GoogleScholarIcon = makeSimpleIcon(siGooglescholar); |
87 | 91 | ||
88 | export const LinkedInIcon = makeSimpleIcon(siLinkedin); | 92 | export const LinkedInIcon = makeSimpleIcon(siLinkedin); |
@@ -92,3 +96,5 @@ export const MTMTIcon = makeSimpleIcon(mtmt); | |||
92 | export const OrcidIcon = makeSimpleIcon(siOrcid); | 96 | export const OrcidIcon = makeSimpleIcon(siOrcid); |
93 | 97 | ||
94 | export const ScopusIcon = makeSimpleIcon(siScopus); | 98 | export const ScopusIcon = makeSimpleIcon(siScopus); |
99 | |||
100 | export const TeamsIcon = makeSimpleIcon(siMicrosoftteams); | ||
diff --git a/src/components/landing/sections/Contact.module.css b/src/components/landing/sections/Contact.module.css new file mode 100644 index 0000000..15ed2a6 --- /dev/null +++ b/src/components/landing/sections/Contact.module.css | |||
@@ -0,0 +1,175 @@ | |||
1 | /* | ||
2 | * SPDX-FileCopyrightText: 2024 Kristóf Marussy | ||
3 | * | ||
4 | * SPDX-License-Identifier: MIT | ||
5 | */ | ||
6 | |||
7 | .contacts { | ||
8 | margin-top: 1.5rem; | ||
9 | margin-bottom: 2rem; | ||
10 | } | ||
11 | |||
12 | .col { | ||
13 | margin-bottom: 1.5rem; | ||
14 | } | ||
15 | |||
16 | .contact { | ||
17 | position: relative; | ||
18 | display: flex; | ||
19 | height: 100%; | ||
20 | flex-direction: row; | ||
21 | align-items: center; | ||
22 | --marussy-contact-color: var(--ifm-font-color-base); | ||
23 | --marussy-contact-icon-color: var(--marussy-contact-color); | ||
24 | --marussy-contact-icon-hover-color: var(--ifm-link-hover-color); | ||
25 | --marussy-contact-muted-color: var(--ifm-color-secondary-contrast-foreground); | ||
26 | --marussy-contact-muted-color-or-hover: var(--marussy-contact-muted-color); | ||
27 | --marussy-alternate-icon: 0; | ||
28 | color: var(--marussy-contact-color); | ||
29 | transition: color var(--ifm-transition-fast) | ||
30 | var(--ifm-transition-timing-default); | ||
31 | } | ||
32 | |||
33 | [data-theme='dark'] .contact { | ||
34 | --marussy-contact-muted-color: var(--ifm-color-emphasis-500); | ||
35 | --marussy-contact-icon-hover-color: var(--ifm-color-primary-light); | ||
36 | } | ||
37 | |||
38 | .contact:not(:has(.contact__action:hover)):hover, | ||
39 | .contact:focus-within:not(:has(.contact__action:focus)) { | ||
40 | --marussy-contact-color: var(--ifm-link-hover-color); | ||
41 | --marussy-contact-icon-color: var(--marussy-contact-icon-hover-color); | ||
42 | --marussy-contact-muted-color-or-hover: var(--ifm-link-hover-color); | ||
43 | } | ||
44 | |||
45 | .contact:has(.contact__action--alternate:hover), | ||
46 | .contact:has(.contact__action--alternate:focus) { | ||
47 | --marussy-alternate-icon: 1; | ||
48 | } | ||
49 | |||
50 | .contact__icon-holder { | ||
51 | position: relative; | ||
52 | display: flex; | ||
53 | padding: 1rem; | ||
54 | margin-right: 1rem; | ||
55 | background: var(--ifm-color-emphasis-200); | ||
56 | border-radius: 50em; | ||
57 | align-items: center; | ||
58 | justify-content: center; | ||
59 | color: var(--marussy-contact-icon-color); | ||
60 | } | ||
61 | |||
62 | .contact__icon-holder--fediverse { | ||
63 | padding: 0.75rem; | ||
64 | } | ||
65 | |||
66 | .contact__icon { | ||
67 | width: 2.5rem; | ||
68 | height: 2.5rem; | ||
69 | opacity: calc(1 - var(--marussy-alternate-icon)); | ||
70 | transition: | ||
71 | color var(--ifm-transition-fast) var(--ifm-transition-timing-default), | ||
72 | opacity var(--ifm-transition-fast) var(--ifm-transition-timing-default); | ||
73 | } | ||
74 | |||
75 | .contact__icon--fediverse { | ||
76 | width: 3rem; | ||
77 | height: 3rem; | ||
78 | margin: -0.0625rem -0.0625rem 0.0625rem 0.0625rem; | ||
79 | } | ||
80 | |||
81 | .contact__icon--alternate { | ||
82 | position: absolute; | ||
83 | top: 1rem; | ||
84 | left: 1rem; | ||
85 | color: var(--marussy-contact-icon-hover-color); | ||
86 | opacity: var(--marussy-alternate-icon); | ||
87 | } | ||
88 | |||
89 | .contact__content { | ||
90 | dispaly: flex; | ||
91 | flex-direction: row; | ||
92 | } | ||
93 | |||
94 | .contact__title { | ||
95 | margin: 0; | ||
96 | --casl: 0; | ||
97 | } | ||
98 | |||
99 | .contact__value { | ||
100 | margin: 0; | ||
101 | } | ||
102 | |||
103 | .contact__description { | ||
104 | margin: 0; | ||
105 | --slnt: -15; | ||
106 | --crsv: 1; | ||
107 | font-size: 0.875rem; | ||
108 | --marussy-contact-color: var(--marussy-contact-muted-color-or-hover); | ||
109 | color: var(--marussy-contact-muted-color-or-hover); | ||
110 | transition: color var(--ifm-transition-fast) | ||
111 | var(--ifm-transition-timing-default); | ||
112 | } | ||
113 | |||
114 | .contact__link { | ||
115 | --ifm-link-color: var(--marussy-contact-color); | ||
116 | } | ||
117 | |||
118 | .contact__link::after { | ||
119 | content: ' '; | ||
120 | position: absolute; | ||
121 | top: 0; | ||
122 | right: 0; | ||
123 | bottom: 0; | ||
124 | left: 0; | ||
125 | } | ||
126 | |||
127 | .contact__action { | ||
128 | position: relative; | ||
129 | --ifm-link-color: var(--marussy-contact-muted-color); | ||
130 | } | ||
131 | |||
132 | .contact__action:focus { | ||
133 | --ifm-link-color: var(--ifm-link-hover-color); | ||
134 | } | ||
135 | |||
136 | .small { | ||
137 | display: inline-block; | ||
138 | position: relative; | ||
139 | max-height: 0; | ||
140 | width: 1.5rem; | ||
141 | overflow: visible; | ||
142 | vertical-align: text-bottom; | ||
143 | } | ||
144 | |||
145 | .small__link { | ||
146 | display: flex; | ||
147 | position: absolute; | ||
148 | bottom: 0; | ||
149 | } | ||
150 | |||
151 | .small__icon { | ||
152 | height: 1.5rem; | ||
153 | width: 1.5rem; | ||
154 | } | ||
155 | |||
156 | .photo__container { | ||
157 | position: relative; | ||
158 | border-radius: var(--ifm-card-border-radius); | ||
159 | overflow: hidden; | ||
160 | aspect-ratio: 1288/480; | ||
161 | min-height: 15rem; | ||
162 | max-width: 100%; | ||
163 | background-size: cover; | ||
164 | background-position: 25% center; | ||
165 | } | ||
166 | |||
167 | .photo { | ||
168 | position: absolute; | ||
169 | top: 0; | ||
170 | left: 0; | ||
171 | width: 100%; | ||
172 | height: 100%; | ||
173 | object-fit: cover; | ||
174 | object-position: 25% center; | ||
175 | } | ||
diff --git a/src/components/landing/sections/Contact.tsx b/src/components/landing/sections/Contact.tsx new file mode 100644 index 0000000..01279a9 --- /dev/null +++ b/src/components/landing/sections/Contact.tsx | |||
@@ -0,0 +1,218 @@ | |||
1 | /* | ||
2 | * SPDX-FileCopyrightText: 2024 Kristóf Marussy | ||
3 | * | ||
4 | * SPDX-License-Identifier: MIT AND CC-BY-4.0 | ||
5 | * | ||
6 | * Code in this file is MIT licensed, while content is CC-BY-4.0 licensed. | ||
7 | */ | ||
8 | |||
9 | import Link from '@docusaurus/Link'; | ||
10 | import { | ||
11 | EnvelopeSimple, | ||
12 | HandWaving, | ||
13 | MapPin, | ||
14 | Phone, | ||
15 | } from '@phosphor-icons/react'; | ||
16 | import clsx from 'clsx'; | ||
17 | |||
18 | import Section from '@site/src/components/landing/Section'; | ||
19 | import { FediverseIcon, GPGIcon, TeamsIcon } from '@site/src/components/icons'; | ||
20 | import photo from '@site/src/pages/bme-building-i-cropped.jpg?placeholder=true&sizes[]=644&sizes[]=1288&sizes[]=2576&rl'; | ||
21 | |||
22 | import styles from './Contact.module.css'; | ||
23 | |||
24 | export default function Contact() { | ||
25 | return ( | ||
26 | <Section id="contact" title="Contact"> | ||
27 | <div className={clsx('container', styles.contacts)}> | ||
28 | <div className="row"> | ||
29 | <div className={clsx('col', 'col--4', styles.col)}> | ||
30 | <div className={styles.contact}> | ||
31 | <div className={styles['contact__icon-holder']}> | ||
32 | <EnvelopeSimple | ||
33 | aria-hidden="true" | ||
34 | className={styles.contact__icon} | ||
35 | /> | ||
36 | </div> | ||
37 | <div className={styles.contact__content}> | ||
38 | <h3 className={styles.contact__title}>Work e-mail</h3> | ||
39 | <p className={styles.contact__value}> | ||
40 | <Link | ||
41 | to="mailto:marussy@mit.bme.hu" | ||
42 | className={styles.contact__link} | ||
43 | > | ||
44 | marussy@mit.bme.hu | ||
45 | </Link>{' '} | ||
46 | <span className={styles.small}> | ||
47 | <Link | ||
48 | to="https://keyoxide.org/96C12D444D19ED5C41BA8B14C30B3B1A31ACCD46" | ||
49 | className={clsx( | ||
50 | styles.contact__action, | ||
51 | styles.small__link, | ||
52 | )} | ||
53 | > | ||
54 | <GPGIcon alt="GPG key" className={styles.small__icon} /> | ||
55 | </Link> | ||
56 | </span> | ||
57 | </p> | ||
58 | <p className={styles.contact__description}> | ||
59 | For research and professional inquiries | ||
60 | </p> | ||
61 | </div> | ||
62 | </div> | ||
63 | </div> | ||
64 | <div className={clsx('col', 'col--4', styles.col)}> | ||
65 | <div className={styles.contact}> | ||
66 | <div className={styles['contact__icon-holder']}> | ||
67 | <TeamsIcon hidden className={styles.contact__icon} /> | ||
68 | <Phone | ||
69 | aria-hidden="true" | ||
70 | className={clsx( | ||
71 | styles.contact__icon, | ||
72 | styles['contact__icon--alternate'], | ||
73 | )} | ||
74 | /> | ||
75 | </div> | ||
76 | <div className={styles.contact__content}> | ||
77 | <h3 className={styles.contact__title}>Call or chat with me</h3> | ||
78 | <p className={styles.contact__value}> | ||
79 | <Link | ||
80 | to="https://teams.microsoft.com/l/chat/0/0?users=marussy.kristof@bme.hu" | ||
81 | className={styles.contact__link} | ||
82 | > | ||
83 | <span className="sr-only">Microsoft Teams: </span> | ||
84 | marussy.kristof@bme.hu | ||
85 | </Link> | ||
86 | </p> | ||
87 | <p className={styles.contact__description}> | ||
88 | <Link | ||
89 | to="tel:+3614633586" | ||
90 | className={clsx( | ||
91 | styles.contact__action, | ||
92 | styles['contact__action--alternate'], | ||
93 | )} | ||
94 | > | ||
95 | Or use landline: +36 1 463-3586 | ||
96 | </Link> | ||
97 | </p> | ||
98 | </div> | ||
99 | </div> | ||
100 | </div> | ||
101 | <div className={clsx('col', 'col--4', styles.col)}> | ||
102 | <div className={styles.contact}> | ||
103 | <div className={styles['contact__icon-holder']}> | ||
104 | <MapPin aria-hidden="true" className={styles.contact__icon} /> | ||
105 | </div> | ||
106 | <div className={styles.contact__content}> | ||
107 | <h3 className={styles.contact__title}>Office</h3> | ||
108 | <p className={styles.contact__value}> | ||
109 | <Link | ||
110 | to="https://www.openstreetmap.org/way/24726476#map=19/47.47263/19.06006" | ||
111 | className={styles.contact__link} | ||
112 | > | ||
113 | H-1117 Budapest, Magyar tudósok körútja 2., Building I, Room | ||
114 | B.417 | ||
115 | </Link> | ||
116 | </p> | ||
117 | </div> | ||
118 | </div> | ||
119 | </div> | ||
120 | </div> | ||
121 | <div className="row"> | ||
122 | <div className={clsx('col', 'col--12', styles.col)}> | ||
123 | <div | ||
124 | className={styles.photo__container} | ||
125 | style={{ backgroundImage: `url("${photo.placeholder}")` }} | ||
126 | > | ||
127 | <img | ||
128 | src={photo.src} | ||
129 | srcSet={photo.srcSet} | ||
130 | width={photo.width} | ||
131 | height={photo.height} | ||
132 | sizes="(min-width: 1384px) 1288px, (min-width: 996px) calc(100vw - 96px), (min-width: 676px) calc(100vw - 32px), 644px" | ||
133 | loading="lazy" | ||
134 | alt="" | ||
135 | className={styles.photo} | ||
136 | /> | ||
137 | </div> | ||
138 | </div> | ||
139 | </div> | ||
140 | <div className="row"> | ||
141 | <div className={clsx('col', 'col--6', styles.col)}> | ||
142 | <div className={styles.contact}> | ||
143 | <div className={styles['contact__icon-holder']}> | ||
144 | <HandWaving | ||
145 | aria-hidden="true" | ||
146 | className={styles.contact__icon} | ||
147 | /> | ||
148 | </div> | ||
149 | <div className={styles.contact__content}> | ||
150 | <h3 className={styles.contact__title}>Personal e-mail</h3> | ||
151 | <p className={styles.contact__value}> | ||
152 | <Link | ||
153 | to="mailto:kristof@marussy.com" | ||
154 | className={styles.contact__link} | ||
155 | > | ||
156 | kristof@marussy.com | ||
157 | </Link>{' '} | ||
158 | <span className={styles.small}> | ||
159 | <Link | ||
160 | to="https://keyoxide.org/7AADE6E800F1979D2A13EEBBB00C29F3D5A628AF" | ||
161 | className={clsx( | ||
162 | styles.contact__action, | ||
163 | styles.small__link, | ||
164 | )} | ||
165 | > | ||
166 | <GPGIcon alt="GPG key" className={styles.small__icon} /> | ||
167 | </Link> | ||
168 | </span> | ||
169 | </p> | ||
170 | <p className={styles.contact__description}> | ||
171 | For messages about my projects, this website, or anything else | ||
172 | </p> | ||
173 | </div> | ||
174 | </div> | ||
175 | </div> | ||
176 | <div className={clsx('col', 'col--6', styles.col)}> | ||
177 | <div className={styles.contact}> | ||
178 | <div | ||
179 | className={clsx( | ||
180 | styles['contact__icon-holder'], | ||
181 | styles['contact__icon-holder--fediverse'], | ||
182 | )} | ||
183 | > | ||
184 | <FediverseIcon | ||
185 | className={clsx( | ||
186 | styles.contact__icon, | ||
187 | styles['contact__icon--fediverse'], | ||
188 | )} | ||
189 | /> | ||
190 | </div> | ||
191 | <div className={styles.contact__content}> | ||
192 | <h3 className={styles.contact__title}>Follow me</h3> | ||
193 | <p className={styles.contact__value}> | ||
194 | <Link | ||
195 | to="https://pleroma.marussy.com/users/kristof" | ||
196 | className={styles.contact__link} | ||
197 | > | ||
198 | @kristof@marussy.com | ||
199 | </Link> | ||
200 | </p> | ||
201 | <p className={styles.contact__description}> | ||
202 | On the{' '} | ||
203 | <Link | ||
204 | to="https://fediverse.info" | ||
205 | className={styles.contact__action} | ||
206 | > | ||
207 | Fediverse | ||
208 | </Link> | ||
209 | , a diverse community of interconnected platforms | ||
210 | </p> | ||
211 | </div> | ||
212 | </div> | ||
213 | </div> | ||
214 | </div> | ||
215 | </div> | ||
216 | </Section> | ||
217 | ); | ||
218 | } | ||
diff --git a/src/components/landing/sections/Hero.module.css b/src/components/landing/sections/Hero.module.css index ce0444f..0909c3f 100644 --- a/src/components/landing/sections/Hero.module.css +++ b/src/components/landing/sections/Hero.module.css | |||
@@ -37,6 +37,7 @@ | |||
37 | 37 | ||
38 | .avatar__image { | 38 | .avatar__image { |
39 | width: 100%; | 39 | width: 100%; |
40 | height: auto; | ||
40 | max-width: 298px; | 41 | max-width: 298px; |
41 | border-radius: 100em; | 42 | border-radius: 100em; |
42 | } | 43 | } |
@@ -48,7 +49,6 @@ | |||
48 | font-size: 1.5rem; | 49 | font-size: 1.5rem; |
49 | } | 50 | } |
50 | 51 | ||
51 | |||
52 | .introduction__name { | 52 | .introduction__name { |
53 | font-family: var(--ifm-heading-font-family); | 53 | font-family: var(--ifm-heading-font-family); |
54 | font-weight: var(--ifm-heading-font-weight); | 54 | font-weight: var(--ifm-heading-font-weight); |
diff --git a/src/components/landing/sections/Hero.tsx b/src/components/landing/sections/Hero.tsx index 2773b9b..ee11048 100644 --- a/src/components/landing/sections/Hero.tsx +++ b/src/components/landing/sections/Hero.tsx | |||
@@ -16,10 +16,11 @@ import { | |||
16 | LinkedInIcon, | 16 | LinkedInIcon, |
17 | OrcidIcon, | 17 | OrcidIcon, |
18 | } from '@site/src/components/icons'; | 18 | } from '@site/src/components/icons'; |
19 | import avatar from '@site/src/pages/avatar.jpg?sizes[]=149&sizes[]=298&sizes[]=596&rl'; | ||
19 | 20 | ||
20 | import styles from './Hero.module.css'; | 21 | import styles from './Hero.module.css'; |
21 | 22 | ||
22 | export default function Hero({ avatar }: { avatar: string }) { | 23 | export default function Hero() { |
23 | return ( | 24 | return ( |
24 | <header className={clsx('hero', 'hero--dark', styles.hero)}> | 25 | <header className={clsx('hero', 'hero--dark', styles.hero)}> |
25 | <div className="container"> | 26 | <div className="container"> |
@@ -27,7 +28,15 @@ export default function Hero({ avatar }: { avatar: string }) { | |||
27 | <div | 28 | <div |
28 | className={clsx('col', 'col--3', styles.hero__col, styles.avatar)} | 29 | className={clsx('col', 'col--3', styles.hero__col, styles.avatar)} |
29 | > | 30 | > |
30 | <img src={avatar} alt="My photo" className={styles.avatar__image} /> | 31 | <img |
32 | src={avatar.src} | ||
33 | srcSet={avatar.srcSet} | ||
34 | width={avatar.width} | ||
35 | height={avatar.height} | ||
36 | sizes="(min-width: 1384px) 298px, (min-width: 996px) calc(25vw - 48px), (min-width: 300px) 298px, calc(100vw - 32px)" | ||
37 | alt="My photo" | ||
38 | className={styles.avatar__image} | ||
39 | /> | ||
31 | </div> | 40 | </div> |
32 | <div className={clsx('col', 'col--9', styles.hero__col)}> | 41 | <div className={clsx('col', 'col--9', styles.hero__col)}> |
33 | <h1 className={clsx('hero__title', styles.introduction)}> | 42 | <h1 className={clsx('hero__title', styles.introduction)}> |
diff --git a/src/components/landing/sections/Research.tsx b/src/components/landing/sections/Research.tsx index a295419..5f69d5e 100644 --- a/src/components/landing/sections/Research.tsx +++ b/src/components/landing/sections/Research.tsx | |||
@@ -33,7 +33,7 @@ function Topic({ | |||
33 | children: ReactNode; | 33 | children: ReactNode; |
34 | }) { | 34 | }) { |
35 | return ( | 35 | return ( |
36 | <div className={clsx('col', 'col-3', styles.topic)}> | 36 | <div className={clsx('col', 'col--3', styles.topic)}> |
37 | <div className={styles.topic__contents}> | 37 | <div className={styles.topic__contents}> |
38 | <div className={clsx(styles.topic__icon, style)}> | 38 | <div className={clsx(styles.topic__icon, style)}> |
39 | <Icon aria-hidden="true" size={128} weight="light" /> | 39 | <Icon aria-hidden="true" size={128} weight="light" /> |
diff --git a/src/components/landing/sections/Software.module.css b/src/components/landing/sections/Software.module.css deleted file mode 100644 index 1d0db4d..0000000 --- a/src/components/landing/sections/Software.module.css +++ /dev/null | |||
@@ -1,5 +0,0 @@ | |||
1 | /* | ||
2 | * SPDX-FileCopyrightText: 2023 Kristóf Marussy | ||
3 | * | ||
4 | * SPDX-License-Identifier: MIT | ||
5 | */ | ||
diff --git a/src/components/landing/sections/Software.tsx b/src/components/landing/sections/Software.tsx deleted file mode 100644 index 8a421b5..0000000 --- a/src/components/landing/sections/Software.tsx +++ /dev/null | |||
@@ -1,15 +0,0 @@ | |||
1 | /* | ||
2 | * SPDX-FileCopyrightText: 2023 Kristóf Marussy | ||
3 | * | ||
4 | * SPDX-License-Identifier: MIT | ||
5 | */ | ||
6 | |||
7 | import clsx from 'clsx'; | ||
8 | |||
9 | import Section from '@site/src/components/landing/Section'; | ||
10 | |||
11 | import styles from './Software.module.css'; | ||
12 | |||
13 | export default function Software() { | ||
14 | return <Section id="software" title="Software"></Section>; | ||
15 | } | ||
diff --git a/src/css/custom.css b/src/css/custom.css index 2141aa3..6261ca7 100644 --- a/src/css/custom.css +++ b/src/css/custom.css | |||
@@ -68,3 +68,9 @@ h6, | |||
68 | .button { | 68 | .button { |
69 | --casl: 1; | 69 | --casl: 1; |
70 | } | 70 | } |
71 | |||
72 | .hash-link { | ||
73 | font-weight: 500; | ||
74 | --casl: 0; | ||
75 | --mono: 1; | ||
76 | } | ||
diff --git a/src/pages/bme-building-i-cropped.jpg b/src/pages/bme-building-i-cropped.jpg new file mode 100644 index 0000000..b5cad67 --- /dev/null +++ b/src/pages/bme-building-i-cropped.jpg | |||
Binary files differ | |||
diff --git a/src/pages/bme-building-i-cropped.jpg.license b/src/pages/bme-building-i-cropped.jpg.license new file mode 100644 index 0000000..fea5d17 --- /dev/null +++ b/src/pages/bme-building-i-cropped.jpg.license | |||
@@ -0,0 +1,6 @@ | |||
1 | SPDX-FileCopyrightText: 2024 Kristóf Marussy <kristof@marussy.com> | ||
2 | |||
3 | SPDX-License-Identifier: CC0-1.0 | ||
4 | |||
5 | Placeholder image to replace the following third-party content: | ||
6 | drone shot of BME building I. | ||
diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 125c5d3..60f86ca 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx | |||
@@ -6,26 +6,22 @@ | |||
6 | 6 | ||
7 | import Layout from '@theme/Layout'; | 7 | import Layout from '@theme/Layout'; |
8 | 8 | ||
9 | import Contact from '@site/src/components/landing/sections/Contact'; | ||
9 | import Hero from '@site/src/components/landing/sections/Hero'; | 10 | import Hero from '@site/src/components/landing/sections/Hero'; |
10 | import Publications from '@site/src/components/landing/sections/Publications'; | 11 | import Publications from '@site/src/components/landing/sections/Publications'; |
11 | import Research from '@site/src/components/landing/sections/Research'; | 12 | import Research from '@site/src/components/landing/sections/Research'; |
12 | import Resume from '@site/src/components/landing/sections/Resume'; | 13 | import Resume from '@site/src/components/landing/sections/Resume'; |
13 | import Software from '@site/src/components/landing/sections/Software'; | ||
14 | import Section from '@site/src/components/landing/Section'; | ||
15 | import TrackActiveSection from '@site/src/components/TrackActiveSection'; | 14 | import TrackActiveSection from '@site/src/components/TrackActiveSection'; |
16 | 15 | ||
17 | import avatar from '@site/src/pages/avatar.jpg'; | ||
18 | |||
19 | export default function Home() { | 16 | export default function Home() { |
20 | return ( | 17 | return ( |
21 | <Layout> | 18 | <Layout> |
22 | <TrackActiveSection> | 19 | <TrackActiveSection> |
23 | <Hero avatar={avatar} /> | 20 | <Hero /> |
24 | <Research /> | 21 | <Research /> |
25 | <Publications /> | 22 | <Publications /> |
26 | <Software /> | ||
27 | <Resume /> | 23 | <Resume /> |
28 | <Section id="contact" title="Contact" /> | 24 | <Contact /> |
29 | </TrackActiveSection> | 25 | </TrackActiveSection> |
30 | </Layout> | 26 | </Layout> |
31 | ); | 27 | ); |
diff --git a/src/pages/license.mdx b/src/pages/license.mdx index 1e55acd..eee4cf8 100644 --- a/src/pages/license.mdx +++ b/src/pages/license.mdx | |||
@@ -41,6 +41,8 @@ Restricted content on this site marked with the <ClosedAccessLink to="#content"> | |||
41 | 41 | ||
42 | - The photo of me apparing on the [home page](/) was taken by [SPOT Fotókör](https://spot.sch.bme.hu/) in 2019 for the [Critical Systems Research Group](https://ftsrg.mit.bme.hu/). | 42 | - The photo of me apparing on the [home page](/) was taken by [SPOT Fotókör](https://spot.sch.bme.hu/) in 2019 for the [Critical Systems Research Group](https://ftsrg.mit.bme.hu/). |
43 | 43 | ||
44 | - The drone shot of BME building I appearing in the [Contact](/#contact) section was taken by [Ákos Hajdu](https://hajduakos.github.io/) in 2020 for the [Critical Systems Research Group](https://ftsrg.mit.bme.hu/). | ||
45 | |||
44 | - Unfortunately, some of my [publications](/#publications) appeared in closed access journal and proceedings. Even though neither me nor by colleagues received any compensation, the copyright of this content was assigned to the publisher, such as ACM or IEEE. | 46 | - Unfortunately, some of my [publications](/#publications) appeared in closed access journal and proceedings. Even though neither me nor by colleagues received any compensation, the copyright of this content was assigned to the publisher, such as ACM or IEEE. |
45 | 47 | ||
46 | Whenever allowed by the current copyright holder, I posted the _final draft_ of the paper to this site. | 48 | Whenever allowed by the current copyright holder, I posted the _final draft_ of the paper to this site. |
@@ -62,6 +64,7 @@ If you use only code or only content from such files, you only need to abide by | |||
62 | The site also uses the following third-party code available under libre licenses: | 64 | The site also uses the following third-party code available under libre licenses: |
63 | 65 | ||
64 | - [Docusaurus](https://docusaurus.io/) static site generator, <MITLicenseLink /> | 66 | - [Docusaurus](https://docusaurus.io/) static site generator, <MITLicenseLink /> |
67 | - [Fediverse logo proposal](<https://commons.wikimedia.org/w/index.php?title=File:Fediverse_logo_proposal_(mono_version).svg&oldid=794518552>) by [Eukombos](https://commons.wikimedia.org/wiki/User:Eukombos), <CCLicenseLink to="https://creativecommons.org/publicdomain/zero/1.0/">CC0-1.0</CCLicenseLink> | ||
65 | - [Phosphor Icons](https://phosphoricons.com/), <MITLicenseLink /> | 68 | - [Phosphor Icons](https://phosphoricons.com/), <MITLicenseLink /> |
66 | - [Recursive Sans and Mono](https://www.recursive.design/) fonts, <LicenseLink to="https://openfontlicense.org/open-font-license-official-text/">OFL-1.1</LicenseLink> | 69 | - [Recursive Sans and Mono](https://www.recursive.design/) fonts, <LicenseLink to="https://openfontlicense.org/open-font-license-official-text/">OFL-1.1</LicenseLink> |
67 | - [Simple Icons](https://simpleicons.org/), <CCLicenseLink to="https://creativecommons.org/publicdomain/zero/1.0/">CC0-1.0</CCLicenseLink> | 70 | - [Simple Icons](https://simpleicons.org/), <CCLicenseLink to="https://creativecommons.org/publicdomain/zero/1.0/">CC0-1.0</CCLicenseLink> |
diff --git a/src/plugins/responsiveLoaderPlugin.ts b/src/plugins/responsiveLoaderPlugin.ts new file mode 100644 index 0000000..3dc198e --- /dev/null +++ b/src/plugins/responsiveLoaderPlugin.ts | |||
@@ -0,0 +1,39 @@ | |||
1 | /* | ||
2 | * Copyright (c) 2016, Jeremy Stucki | ||
3 | * Copyright (c) 2024 Kristóf Marussy <kristof@marussy.com> | ||
4 | * | ||
5 | * SPDX-License-Identifier: MIT AND BSD-3-Clause | ||
6 | */ | ||
7 | |||
8 | import type { Plugin } from '@docusaurus/types'; | ||
9 | import sharp from 'responsive-loader/sharp'; | ||
10 | |||
11 | export default function responsiveLoaderPlugin(): Plugin { | ||
12 | return { | ||
13 | name: 'marussy-responsive-loader-plugin', | ||
14 | configureWebpack: () => ({ | ||
15 | mergeStrategy: { | ||
16 | 'module.rules': 'prepend', | ||
17 | }, | ||
18 | // Configuration based on | ||
19 | // https://github.com/dazuaz/responsive-loader/blob/ef2c806fcd36f06f6be8a0b97e09f40c3d86d3ac/README.md | ||
20 | module: { | ||
21 | rules: [ | ||
22 | { | ||
23 | test: /\.(png|jpe?g)$/, | ||
24 | use: [ | ||
25 | { | ||
26 | loader: 'responsive-loader', | ||
27 | options: { | ||
28 | adapter: sharp, | ||
29 | format: 'webp', | ||
30 | }, | ||
31 | }, | ||
32 | ], | ||
33 | type: 'javascript/auto', | ||
34 | }, | ||
35 | ], | ||
36 | }, | ||
37 | }), | ||
38 | }; | ||
39 | } | ||
diff --git a/src/types.d.ts b/src/types.d.ts index e3ab6b7..a2ff976 100644 --- a/src/types.d.ts +++ b/src/types.d.ts | |||
@@ -1,14 +1,23 @@ | |||
1 | /* | 1 | /* |
2 | * SPDX-FileCopyrightText: 2023 Kristóf Marussy | 2 | * Copyright (c) 2016, Jeremy Stucki |
3 | * | 3 | * |
4 | * SPDX-License-Identifier: MIT | 4 | * SPDX-License-Identifier: BSD-3-Clause |
5 | * | ||
6 | * Typings copied from | ||
7 | * https://github.com/dazuaz/responsive-loader/blob/ef2c806fcd36f06f6be8a0b97e09f40c3d86d3ac/README.md | ||
5 | */ | 8 | */ |
6 | 9 | ||
7 | // Docusaurus doesn't contain module declarations for images, | 10 | interface ResponsiveImageOutput { |
8 | // so we add them ourselves. | 11 | src: string; |
9 | // See https://github.com/facebook/docusaurus/issues/8683 | 12 | srcSet: string; |
13 | placeholder: string | undefined; | ||
14 | images: { path: string; width: number; height: number }[]; | ||
15 | width: number; | ||
16 | height: number; | ||
17 | toString: () => string; | ||
18 | } | ||
10 | 19 | ||
11 | declare module '*.jpg' { | 20 | declare module '*&rl' { |
12 | const path: string; | 21 | const src: ResponsiveImageOutput; |
13 | export default path; | 22 | export default src; |
14 | } | 23 | } |