aboutsummaryrefslogtreecommitdiffstats
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/Landing.tsx2
-rw-r--r--src/components/icons.tsx6
-rw-r--r--src/components/landing/Elsewhere.module.css48
-rw-r--r--src/components/landing/Elsewhere.tsx35
-rw-r--r--src/components/landing/sections/Blog.module.css1
-rw-r--r--src/components/landing/sections/Blog.tsx9
-rw-r--r--src/components/landing/sections/Contact.module.css7
-rw-r--r--src/components/landing/sections/Contact.tsx4
-rw-r--r--src/components/landing/sections/Hero.tsx3
-rw-r--r--src/components/landing/sections/Publications.module.css43
-rw-r--r--src/components/landing/sections/Publications.tsx247
-rw-r--r--src/components/landing/sections/Resume.tsx7
-rw-r--r--src/components/landing/sections/Software.module.css359
-rw-r--r--src/components/landing/sections/Software.tsx230
-rw-r--r--src/components/landing/sections/ferdium.svg45
-rw-r--r--src/components/landing/sections/ferdium.svg.license7
-rw-r--r--src/components/landing/sections/refinery-background.pngbin0 -> 1914438 bytes
-rw-r--r--src/components/landing/sections/refinery-background.png.license9
-rw-r--r--src/components/landing/sections/refinery-logo.svg1
-rw-r--r--src/components/landing/sections/refinery-logo.svg.license7
-rw-r--r--src/components/landing/sections/refinery-screenshot-dark.pngbin0 -> 293303 bytes
-rw-r--r--src/components/landing/sections/refinery-screenshot-dark.png.license5
-rw-r--r--src/components/landing/sections/refinery-screenshot-light.pngbin0 -> 292925 bytes
-rw-r--r--src/components/landing/sections/refinery-screenshot-light.png.license5
24 files changed, 888 insertions, 192 deletions
diff --git a/src/components/Landing.tsx b/src/components/Landing.tsx
index 5eac99b..5d3a4cd 100644
--- a/src/components/Landing.tsx
+++ b/src/components/Landing.tsx
@@ -13,6 +13,7 @@ import Hero from './landing/sections/Hero';
13import Publications from './landing/sections/Publications'; 13import Publications from './landing/sections/Publications';
14import Research from './landing/sections/Research'; 14import Research from './landing/sections/Research';
15import Resume from './landing/sections/Resume'; 15import Resume from './landing/sections/Resume';
16import Software from './landing/sections/Software';
16import TrackActiveSection from './TrackActiveSection'; 17import TrackActiveSection from './TrackActiveSection';
17 18
18export default function Home(props: Props) { 19export default function Home(props: Props) {
@@ -22,6 +23,7 @@ export default function Home(props: Props) {
22 <Hero /> 23 <Hero />
23 <Research /> 24 <Research />
24 <Blog {...props} /> 25 <Blog {...props} />
26 <Software />
25 <Publications /> 27 <Publications />
26 <Resume /> 28 <Resume />
27 <Contact /> 29 <Contact />
diff --git a/src/components/icons.tsx b/src/components/icons.tsx
index 9b48a17..dc0f9f9 100644
--- a/src/components/icons.tsx
+++ b/src/components/icons.tsx
@@ -6,9 +6,11 @@
6 6
7import { useId } from 'react'; 7import { useId } from 'react';
8import { 8import {
9 siCodeberg,
9 siCreativecommons, 10 siCreativecommons,
10 siDblp, 11 siDblp,
11 siGithub, 12 siGithub,
13 siGitlab,
12 siGnuprivacyguard, 14 siGnuprivacyguard,
13 siGooglescholar, 15 siGooglescholar,
14 siLinkedin, 16 siLinkedin,
@@ -76,6 +78,8 @@ function makeSimpleIcon(icon: SimpleIcon): (props: IconProps) => JSX.Element {
76 return (props) => <SimpleIcon icon={icon} {...props} />; 78 return (props) => <SimpleIcon icon={icon} {...props} />;
77} 79}
78 80
81export const CodebergIcon = makeSimpleIcon(siCodeberg);
82
79export const CreativeCommonsIcon = makeSimpleIcon(siCreativecommons); 83export const CreativeCommonsIcon = makeSimpleIcon(siCreativecommons);
80 84
81export const DBLPIcon = makeSimpleIcon(siDblp); 85export const DBLPIcon = makeSimpleIcon(siDblp);
@@ -84,6 +88,8 @@ export const FediverseIcon = makeSimpleIcon(fediverse);
84 88
85export const GithubIcon = makeSimpleIcon(siGithub); 89export const GithubIcon = makeSimpleIcon(siGithub);
86 90
91export const GitlabIcon = makeSimpleIcon(siGitlab);
92
87export const GPGIcon = makeSimpleIcon(siGnuprivacyguard); 93export const GPGIcon = makeSimpleIcon(siGnuprivacyguard);
88 94
89export const GoogleScholarIcon = makeSimpleIcon(siGooglescholar); 95export const GoogleScholarIcon = makeSimpleIcon(siGooglescholar);
diff --git a/src/components/landing/Elsewhere.module.css b/src/components/landing/Elsewhere.module.css
new file mode 100644
index 0000000..0697b12
--- /dev/null
+++ b/src/components/landing/Elsewhere.module.css
@@ -0,0 +1,48 @@
1/*
2 * SPDX-FileCopyrightText: 2023-2024 Kristóf Marussy
3 *
4 * SPDX-License-Identifier: MIT
5 */
6
7.elsewhere {
8 display: flex;
9 flex-direction: row;
10 align-items: center;
11 flex-wrap: wrap;
12 column-gap: 0.25rem;
13}
14
15.elsewhere__text {
16 margin: 0;
17}
18
19.elsewhere__list {
20 display: flex;
21 margin: 0;
22 padding: 0;
23}
24
25.elsewhere__item {
26 display: flex;
27 align-items: center;
28 margin: 0;
29 list-style-type: none;
30}
31
32.elsewhere__icon {
33 display: flex;
34 padding: 0.375rem;
35 --ifm-link-color: var(--ifm-color-secondary-contrast-foreground);
36 --ifm-link-hover-color: var(--ifm-color-emphasis-700);
37 --ifm-link-text-decoration: none;
38}
39
40[data-theme='dark'] .elsewhere__icon {
41 --ifm-link-color: var(--ifm-color-secondary);
42 --ifm-link-hover-color: var(--ifm-color-secondary-dark);
43}
44
45.elsewhere__icon svg {
46 width: 1.75rem;
47 height: 1.75rem;
48}
diff --git a/src/components/landing/Elsewhere.tsx b/src/components/landing/Elsewhere.tsx
new file mode 100644
index 0000000..dc0d7ac
--- /dev/null
+++ b/src/components/landing/Elsewhere.tsx
@@ -0,0 +1,35 @@
1/*
2 * SPDX-FileCopyrightText: 2024 Kristóf Marussy
3 *
4 * SPDX-License-Identifier: MIT
5 */
6
7import Link from '@docusaurus/Link';
8
9import styles from './Elsewhere.module.css';
10
11export default function Elsewhere({
12 label,
13 links,
14}: {
15 label: React.ReactNode;
16 links: {
17 href: string;
18 icon: React.ReactNode;
19 }[];
20}) {
21 return (
22 <div className={styles.elsewhere}>
23 <p className={styles.elsewhere__text}>{label}</p>
24 <ul className={styles.elsewhere__list}>
25 {links.map(({ href, icon }) => (
26 <li className={styles.elsewhere__item} key={href}>
27 <Link href={href} className={styles.elsewhere__icon}>
28 {icon}
29 </Link>
30 </li>
31 ))}
32 </ul>
33 </div>
34 );
35}
diff --git a/src/components/landing/sections/Blog.module.css b/src/components/landing/sections/Blog.module.css
index 57682f6..b8b953d 100644
--- a/src/components/landing/sections/Blog.module.css
+++ b/src/components/landing/sections/Blog.module.css
@@ -21,6 +21,7 @@
21 font-weight: var(--ifm-font-weight-normal); 21 font-weight: var(--ifm-font-weight-normal);
22 --casl: 0; 22 --casl: 0;
23 letter-spacing: 0; 23 letter-spacing: 0;
24 white-space: nowrap;
24} 25}
25 26
26.prev::after { 27.prev::after {
diff --git a/src/components/landing/sections/Blog.tsx b/src/components/landing/sections/Blog.tsx
index 3ac87db..deb6d2f 100644
--- a/src/components/landing/sections/Blog.tsx
+++ b/src/components/landing/sections/Blog.tsx
@@ -16,9 +16,6 @@ import Section from '@site/src/components/landing/Section';
16import Subtitle from '@site/src/components/landing/Subtitle'; 16import Subtitle from '@site/src/components/landing/Subtitle';
17 17
18import styles from './Blog.module.css'; 18import styles from './Blog.module.css';
19import React from 'react';
20
21const columnLength = 5;
22 19
23function Column({ 20function Column({
24 items, 21 items,
@@ -52,7 +49,7 @@ function Column({
52 {content.metadata.title} 49 {content.metadata.title}
53 </Link>{' '} 50 </Link>{' '}
54 <span className={styles.date}> 51 <span className={styles.date}>
55 on&nbsp;{dateTimeFormat.format(new Date(content.metadata.date))} 52 on {dateTimeFormat.format(new Date(content.metadata.date))}
56 </span> 53 </span>
57 </li> 54 </li>
58 ))} 55 ))}
@@ -70,9 +67,7 @@ export default function Blog(props: Props) {
70 return ( 67 return (
71 <Section id="blog" title="Blog"> 68 <Section id="blog" title="Blog">
72 <div className="container"> 69 <div className="container">
73 <section> 70 <Subtitle icon="🗓️">Recent posts</Subtitle>
74 <Subtitle icon="🗓️">Recent posts</Subtitle>
75 </section>
76 <div className={clsx('row', styles.row)}> 71 <div className={clsx('row', styles.row)}>
77 <Column items={items.slice(0, columnLength)} /> 72 <Column items={items.slice(0, columnLength)} />
78 <Column items={items.slice(columnLength)} /> 73 <Column items={items.slice(columnLength)} />
diff --git a/src/components/landing/sections/Contact.module.css b/src/components/landing/sections/Contact.module.css
index 4ff19df..2eb9f06 100644
--- a/src/components/landing/sections/Contact.module.css
+++ b/src/components/landing/sections/Contact.module.css
@@ -165,4 +165,11 @@
165 height: 100%; 165 height: 100%;
166 object-fit: cover; 166 object-fit: cover;
167 object-position: 25% center; 167 object-position: 25% center;
168 transform-origin: 25% center;
169 transition: transform var(--ifm-transition-fast) ease;
170}
171
172.contacts:has(.contact--address:hover) .photo,
173.contacts:has(.contact--address:focus-within) .photo {
174 transform: scale(140%);
168} 175}
diff --git a/src/components/landing/sections/Contact.tsx b/src/components/landing/sections/Contact.tsx
index f95e458..94da73a 100644
--- a/src/components/landing/sections/Contact.tsx
+++ b/src/components/landing/sections/Contact.tsx
@@ -103,7 +103,7 @@ export default function Contact() {
103 </div> 103 </div>
104 </div> 104 </div>
105 <div className={clsx('col', 'col--4', styles.col)}> 105 <div className={clsx('col', 'col--4', styles.col)}>
106 <div className={styles.contact}> 106 <div className={clsx(styles.contact, styles['contact--address'])}>
107 <div className={styles['contact__icon-holder']}> 107 <div className={styles['contact__icon-holder']}>
108 <MapPin aria-hidden="true" className={styles.contact__icon} /> 108 <MapPin aria-hidden="true" className={styles.contact__icon} />
109 </div> 109 </div>
@@ -133,7 +133,7 @@ export default function Contact() {
133 srcSet={photo.srcSet} 133 srcSet={photo.srcSet}
134 width={photo.width} 134 width={photo.width}
135 height={photo.height} 135 height={photo.height}
136 sizes="(min-width: 1384px) 1288px, (min-width: 996px) calc(100vw - 96px), (min-width: 676px) calc(100vw - 32px), 644px" 136 sizes="(min-width: 1384px) 1288px, (min-width: 1384px) 1108px, (min-width: 997px) calc(100vw - 96px), (min-width: 676px) calc(100vw - 32px), 644px"
137 loading="lazy" 137 loading="lazy"
138 alt="" 138 alt=""
139 className={styles.photo} 139 className={styles.photo}
diff --git a/src/components/landing/sections/Hero.tsx b/src/components/landing/sections/Hero.tsx
index 45ecd50..3087dd3 100644
--- a/src/components/landing/sections/Hero.tsx
+++ b/src/components/landing/sections/Hero.tsx
@@ -60,7 +60,8 @@ export default function Hero() {
60 </Link>{' '} 60 </Link>{' '}
61 at the{' '} 61 at the{' '}
62 <Link to="https://www.mit.bme.hu"> 62 <Link to="https://www.mit.bme.hu">
63 🏫&nbsp;Department of Artificial Intelligence and Systems Engineering&nbsp;(MIT) 63 🏫&nbsp;Department of Artificial Intelligence and Systems
64 Engineering&nbsp;(MIT)
64 </Link>{' '} 65 </Link>{' '}
65 at{' '} 66 at{' '}
66 <Link to="https://bme.hu"> 67 <Link to="https://bme.hu">
diff --git a/src/components/landing/sections/Publications.module.css b/src/components/landing/sections/Publications.module.css
index 9ef368b..fd324cf 100644
--- a/src/components/landing/sections/Publications.module.css
+++ b/src/components/landing/sections/Publications.module.css
@@ -22,46 +22,3 @@
22 height: 1em; 22 height: 1em;
23 margin-right: 0.125rem; 23 margin-right: 0.125rem;
24} 24}
25
26.elsewhere {
27 display: flex;
28 flex-direction: row;
29 align-items: center;
30 flex-wrap: wrap;
31 column-gap: 0.25rem;
32}
33
34.elsewhere__text {
35 margin: 0;
36}
37
38.elsewhere__list {
39 display: flex;
40 margin: 0;
41 padding: 0;
42}
43
44.elsewhere__item {
45 display: flex;
46 align-items: center;
47 margin: 0;
48 list-style-type: none;
49}
50
51.elsewhere__icon {
52 display: flex;
53 padding: 0.375rem;
54 --ifm-link-color: var(--ifm-color-secondary-contrast-foreground);
55 --ifm-link-hover-color: var(--ifm-color-emphasis-700);
56 --ifm-link-text-decoration: none;
57}
58
59[data-theme='dark'] .elsewhere__icon {
60 --ifm-link-color: var(--ifm-color-secondary);
61 --ifm-link-hover-color: var(--ifm-color-secondary-dark);
62}
63
64.elsewhere__icon svg {
65 width: 1.75rem;
66 height: 1.75rem;
67}
diff --git a/src/components/landing/sections/Publications.tsx b/src/components/landing/sections/Publications.tsx
index 33f989f..ceb5c02 100644
--- a/src/components/landing/sections/Publications.tsx
+++ b/src/components/landing/sections/Publications.tsx
@@ -17,6 +17,7 @@ import {
17 OrcidIcon, 17 OrcidIcon,
18 ScopusIcon, 18 ScopusIcon,
19} from '@site/src/components/icons'; 19} from '@site/src/components/icons';
20import Elsewhere from '@site/src/components/landing/Elsewhere';
20import Section from '@site/src/components/landing/Section'; 21import Section from '@site/src/components/landing/Section';
21import Subtitle from '@site/src/components/landing/Subtitle'; 22import Subtitle from '@site/src/components/landing/Subtitle';
22import authorizedLinks from '@site/src/components/landing/sections/authorizedLinks'; 23import authorizedLinks from '@site/src/components/landing/sections/authorizedLinks';
@@ -129,142 +130,116 @@ export default function Publications() {
129 return ( 130 return (
130 <Section id="publications" title="Publications"> 131 <Section id="publications" title="Publications">
131 <div className="container"> 132 <div className="container">
132 <section> 133 <Subtitle icon="📌">Selected publications</Subtitle>
133 <Subtitle icon="📌">Selected publications</Subtitle> 134 <ul>
134 <ul> 135 <li className={styles.publications__item}>
135 <li className={styles.publications__item}> 136 <b>Kristóf Marussy</b>, Attila Ficsor, Oszkár Semeráth, Dániel Varró
136 <b>Kristóf Marussy</b>, Attila Ficsor, Oszkár Semeráth, Dániel 137 (2024). Refinery: Graph Solver as a Service. In&nbsp;
137 Varró (2024). Refinery: Graph Solver as a Service. In&nbsp; 138 <i>International Conference on Software Engineering (ICSE) 2024</i>
138 <i> 139 . <PDFLink filename="icse24" />{' '}
139 International Conference on Software Engineering (ICSE) 2024 140 <VideoLink url="https://www.youtube.com/watch?v=Qy_3udNsWsM" />{' '}
140 </i> 141 <OpenAccess license="by" />
141 . <PDFLink filename="icse24" />{' '} 142 </li>
142 <VideoLink url="https://www.youtube.com/watch?v=Qy_3udNsWsM" />{' '} 143 <li className={styles.publications__item}>
143 <OpenAccess license="by" /> 144 Máté Földiák, <b>Kristóf Marussy</b>, Dániel Varró, István Majzik
144 </li> 145 (2022). System architecture synthesis for performability by logic
145 <li className={styles.publications__item}> 146 solvers. In&nbsp;
146 Máté Földiák, <b>Kristóf Marussy</b>, Dániel Varró, István Majzik 147 <i>
147 (2022). System architecture synthesis for performability by logic 148 International Conference on Model Driven Engineering Languages and
148 solvers. In&nbsp; 149 Systems (MODELS) 2022,
149 <i> 150 </i>{' '}
150 International Conference on Model Driven Engineering Languages 151 pp.&nbsp;433&ndash;45. <DOILink doi="10.1145/3550355.3552448" />{' '}
151 and Systems (MODELS) 2022, 152 <PDFLink filename="models22" />{' '}
152 </i>{' '} 153 <ArtifactLink doi="10.5281/zenodo.6974248" />{' '}
153 pp.&nbsp;433&ndash;45. <DOILink doi="10.1145/3550355.3552448" />{' '} 154 <ClosedAccess
154 <PDFLink filename="models22" />{' '} 155 publisher="ACM"
155 <ArtifactLink doi="10.5281/zenodo.6974248" />{' '} 156 url="https://authors.acm.org/journals/rights-permissions"
156 <ClosedAccess 157 authorizedURL={authorizedLinks.models22}
157 publisher="ACM" 158 />
158 url="https://authors.acm.org/journals/rights-permissions" 159 </li>
159 authorizedURL={authorizedLinks.models22} 160 <li className={styles.publications__item}>
160 /> 161 Boqi Chen, <b>Kristóf Marussy</b>, Sebastian Pilarski, Oszkár
161 </li> 162 Semeráth, Dániel Varró (2022). Consistent Scene Graph Generation by
162 <li className={styles.publications__item}> 163 Constraint Optimization. In&nbsp;
163 Boqi Chen, <b>Kristóf Marussy</b>, Sebastian Pilarski, Oszkár 164 <i>
164 Semeráth, Dániel Varró (2022). Consistent Scene Graph Generation 165 International Conference on Automated Software Engineering (ASE)
165 by Constraint Optimization. In&nbsp; 166 2022
166 <i> 167 </i>
167 International Conference on Automated Software Engineering (ASE) 168 . <DOILink doi="10.1145/3551349.3560433" />{' '}
168 2022 169 <PDFLink filename="ase22" /> <OpenAccess license="by" />
169 </i> 170 </li>
170 . <DOILink doi="10.1145/3551349.3560433" />{' '} 171 <li className={styles.publications__item}>
171 <PDFLink filename="ase22" /> <OpenAccess license="by" /> 172 <b>Kristóf Marussy</b>, Oszkár Semeráth, Dániel Varró (2022).{' '}
172 </li> 173 Automated Generation of Consistent Graph Models With Multiplicity
173 <li className={styles.publications__item}> 174 Reasoning. <i>IEEE Transactions on Software Engineering,</i> volume
174 <b>Kristóf Marussy</b>, Oszkár Semeráth, Dániel Varró (2022).{' '} 175 48, issue 5. <DOILink doi="10.1109/TSE.2020.3025732 " />{' '}
175 Automated Generation of Consistent Graph Models With Multiplicity 176 <PDFLink filename="tse22" /> <OpenAccess license="by" />
176 Reasoning. <i>IEEE Transactions on Software Engineering,</i>{' '} 177 </li>
177 volume 48, issue 5. <DOILink doi="10.1109/TSE.2020.3025732 " />{' '} 178 <li className={styles.publications__item}>
178 <PDFLink filename="tse22" /> <OpenAccess license="by" /> 179 Márton Búr, <b>Kristóf Marussy</b>, Brett H.&nbsp;Meyer, Dániel
179 </li> 180 Varró (2021). Worst-case Execution Time Calculation for Query-based
180 <li className={styles.publications__item}> 181 Monitors by Witness Generation.{' '}
181 Márton Búr, <b>Kristóf Marussy</b>, Brett H.&nbsp;Meyer, Dániel 182 <i>ACM Transactions on Embedded Computing Systems,</i> volume 20,
182 Varró (2021). Worst-case Execution Time Calculation for 183 issue 6. <DOILink doi="10.1145/3471904" />{' '}
183 Query-based Monitors by Witness Generation.{' '} 184 <ArxivLink arxivID="2102.03116" /> <PDFLink filename="tecs21" />{' '}
184 <i>ACM Transactions on Embedded Computing Systems,</i> volume 20, 185 <ClosedAccess
185 issue 6. <DOILink doi="10.1145/3471904" />{' '} 186 publisher="ACM"
186 <ArxivLink arxivID="2102.03116" /> <PDFLink filename="tecs21" />{' '} 187 url="https://authors.acm.org/journals/rights-permissions"
187 <ClosedAccess 188 authorizedURL={authorizedLinks.tecs21}
188 publisher="ACM" 189 />
189 url="https://authors.acm.org/journals/rights-permissions" 190 </li>
190 authorizedURL={authorizedLinks.tecs21} 191 <li className={styles.publications__item}>
191 /> 192 <b>Kristóf Marussy</b>, Oszkár Semeráth, Aren A.&nbsp;Babikian,
192 </li> 193 Dániel Varró (2020). A Specification Language for Consistent Model
193 <li className={styles.publications__item}> 194 Generation based on Partial Models.{' '}
194 <b>Kristóf Marussy</b>, Oszkár Semeráth, Aren A.&nbsp;Babikian, 195 <i>Journal of Object Technology,</i> volume 19,
195 Dániel Varró (2020). A Specification Language for Consistent Model 196 pp.&nbsp;3:1&ndash;22. <DOILink doi="10.5381/jot.2020.19.3.a12" />{' '}
196 Generation based on Partial Models.{' '} 197 <PDFLink filename="jot20" />{' '}
197 <i>Journal of Object Technology,</i> volume 19, 198 <VideoLink url="https://www.youtube.com/watch?v=ggTbv_s5t2A" />{' '}
198 pp.&nbsp;3:1&ndash;22. <DOILink doi="10.5381/jot.2020.19.3.a12" />{' '} 199 <OpenAccess license="by-nd" />
199 <PDFLink filename="jot20" />{' '} 200 </li>
200 <VideoLink url="https://www.youtube.com/watch?v=ggTbv_s5t2A" />{' '} 201 <li className={styles.publications__item}>
201 <OpenAccess license="by-nd" /> 202 <b>Kristóf Marussy</b> and Oszkár Semeráth (2018). Incremental View
202 </li> 203 Model Synchronization Using Partial Models. In&nbsp;
203 <li className={styles.publications__item}> 204 <i>
204 <b>Kristóf Marussy</b> and Oszkár Semeráth (2018). Incremental 205 International Conference on Model Driven Engineering Languages and
205 View Model Synchronization Using Partial Models. In&nbsp; 206 Systems (MODELS) 2018,
206 <i> 207 </i>{' '}
207 International Conference on Model Driven Engineering Languages 208 pp.&nbsp;323&ndash;333. <DOILink doi="10.1145/3239372.3239412" />{' '}
208 and Systems (MODELS) 2018, 209 <PDFLink filename="models18" />{' '}
209 </i>{' '} 210 <ArtifactLink doi="10.5281/zenodo.1318156" />{' '}
210 pp.&nbsp;323&ndash;333. <DOILink doi="10.1145/3239372.3239412" />{' '} 211 <ClosedAccess
211 <PDFLink filename="models18" />{' '} 212 publisher="ACM"
212 <ArtifactLink doi="10.5281/zenodo.1318156" />{' '} 213 url="https://authors.acm.org/journals/rights-permissions"
213 <ClosedAccess 214 authorizedURL={authorizedLinks.models18}
214 publisher="ACM" 215 />
215 url="https://authors.acm.org/journals/rights-permissions" 216 </li>
216 authorizedURL={authorizedLinks.models18} 217 </ul>
217 /> 218 <Elsewhere
218 </li> 219 label="See the full list of my pulications at"
219 </ul> 220 links={[
220 </section> 221 {
221 <div className={styles.elsewhere}> 222 href: 'https://orcid.org/0000-0002-9135-8256',
222 <p className={styles.elsewhere__text}> 223 icon: <OrcidIcon />,
223 See the full list of my publications at 224 },
224 </p> 225 {
225 <ul className={styles.elsewhere__list}> 226 href: 'https://dblp.org/pid/130/6479.html',
226 <li className={styles.elsewhere__item}> 227 icon: <DBLPIcon />,
227 <Link 228 },
228 to="https://orcid.org/0000-0002-9135-8256" 229 {
229 className={styles.elsewhere__icon} 230 href: 'https://scholar.google.com/citations?user=E9CKNYoAAAAJ',
230 > 231 icon: <GoogleScholarIcon />,
231 <OrcidIcon /> 232 },
232 </Link> 233 {
233 </li> 234 href: 'https://www.scopus.com/authid/detail.uri?authorId=55860043200',
234 <li className={styles.elsewhere__item}> 235 icon: <ScopusIcon />,
235 <Link 236 },
236 to="https://dblp.org/pid/130/6479.html" 237 {
237 className={styles.elsewhere__icon} 238 href: 'https://m2.mtmt.hu/gui2/?type=authors&mode=browse&sel=authors10062709',
238 > 239 icon: <MTMTIcon />,
239 <DBLPIcon /> 240 },
240 </Link> 241 ]}
241 </li> 242 />
242 <li className={styles.elsewhere__item}>
243 <Link
244 to="https://scholar.google.com/citations?user=E9CKNYoAAAAJ"
245 className={styles.elsewhere__icon}
246 >
247 <GoogleScholarIcon />
248 </Link>
249 </li>
250 <li className={styles.elsewhere__item}>
251 <Link
252 to="https://www.scopus.com/authid/detail.uri?authorId=55860043200"
253 className={styles.elsewhere__icon}
254 >
255 <ScopusIcon />
256 </Link>
257 </li>
258 <li className={styles.elsewhere__item}>
259 <Link
260 to="https://m2.mtmt.hu/gui2/?type=authors&mode=browse&sel=authors10062709"
261 className={styles.elsewhere__icon}
262 >
263 <MTMTIcon />
264 </Link>
265 </li>
266 </ul>
267 </div>
268 </div> 243 </div>
269 </Section> 244 </Section>
270 ); 245 );
diff --git a/src/components/landing/sections/Resume.tsx b/src/components/landing/sections/Resume.tsx
index 1666f19..4e31c1a 100644
--- a/src/components/landing/sections/Resume.tsx
+++ b/src/components/landing/sections/Resume.tsx
@@ -122,7 +122,8 @@ function Experience() {
122 </p> 122 </p>
123 <p> 123 <p>
124 <i> 124 <i>
125 Department of Artificial Intelligence and Systems Engineering, Budapest University of Technology and Economics, Hungary 125 Department of Artificial Intelligence and Systems Engineering,
126 Budapest University of Technology and Economics, Hungary
126 </i> 127 </i>
127 </p> 128 </p>
128 <ul className={styles.cv__activities}> 129 <ul className={styles.cv__activities}>
@@ -230,8 +231,8 @@ function Awards() {
230 László Schell Foundation 231 László Schell Foundation
231 </Link>{' '} 232 </Link>{' '}
232 to 1&nbsp;member of the{' '} 233 to 1&nbsp;member of the{' '}
233 <i>Department of Artificial Intelligence and Systems Engineering</i> per year 234 <i>Department of Artificial Intelligence and Systems Engineering</i>{' '}
234 for exceptional work in innovation 235 per year for exceptional work in innovation
235 </p> 236 </p>
236 </li> 237 </li>
237 <li className={styles.cv__item}> 238 <li className={styles.cv__item}>
diff --git a/src/components/landing/sections/Software.module.css b/src/components/landing/sections/Software.module.css
new file mode 100644
index 0000000..a68b5a6
--- /dev/null
+++ b/src/components/landing/sections/Software.module.css
@@ -0,0 +1,359 @@
1/*
2 * Copyright (c) 2024 Kristóf Marussy <kristof@marussy.com>
3 *
4 * SPDX-License-Identifier: MIT
5 */
6
7.wrapper {
8 overflow-x: hidden;
9 /* Leave space for the shadow, see https://stackoverflow.com/a/33949075 */
10 padding-bottom: 8rem;
11 margin-bottom: -8rem;
12}
13
14.software-grid {
15 display: grid;
16 grid-template-rows: min-content minmax(4rem, 1fr) min-content;
17 grid-template-columns: 0.4fr 0.2fr 0.4fr;
18 gap: 2rem;
19 margin: 1.5rem 0;
20}
21
22.software {
23 border-radius: var(--ifm-card-border-radius);
24}
25
26.software--refinery {
27 position: relative;
28 grid-column: 1 / span 2;
29 grid-row: 1 / span 2;
30 min-height: 200px;
31 overflow: hidden;
32 background-size: cover;
33 background-position: center center;
34 --ifm-color-primary: #038a99;
35 --ifm-color-primary-dark: #037c8a;
36 --ifm-color-primary-darker: #037582;
37 --ifm-color-primary-darkest: #02616b;
38 --ifm-color-primary-light: #0398a8;
39 --ifm-color-primary-lighter: #039fb0;
40 --ifm-color-primary-lightest: #04b3c7;
41 z-index: 10;
42 box-shadow: var(--ifm-global-shadow-md);
43}
44
45.software--interactive {
46 transition: box-shadow var(--ifm-transition-fast) ease;
47}
48
49.software--interactive:hover,
50.software--interactive:focus-within {
51 box-shadow: var(--ifm-global-shadow-tl);
52 z-index: 20;
53}
54
55.software-grid:has(.software--screenshot:hover) .software--refinery,
56.software-grid:has(.software--screenshot:focus-within) .software--refinery {
57 box-shadow: none;
58}
59
60[data-theme='dark'] .software--refinery {
61 --ifm-color-primary: #56b6c2;
62 --ifm-color-primary-dark: #43acb9;
63 --ifm-color-primary-darker: #3fa2af;
64 --ifm-color-primary-darkest: #348690;
65 --ifm-color-primary-light: #6bbfc9;
66 --ifm-color-primary-lighter: #75c3cd;
67 --ifm-color-primary-lightest: #94d1d8;
68}
69
70.refinery__background {
71 position: absolute;
72 top: 0;
73 left: 0;
74 width: 100%;
75 height: 100%;
76 z-index: 1;
77 object-fit: cover;
78 transition: transform var(--ifm-transition-fast) ease;
79}
80
81.software--refinery:hover .refinery__background,
82.software--refinery:focus-within .refinery__background {
83 transform: scale(140%);
84}
85
86.content {
87 position: relative;
88 height: 100%;
89 z-index: 99;
90 display: flex;
91 flex-direction: column;
92}
93
94.content--refinery {
95 justify-content: space-between;
96}
97
98.refinery__heading {
99 padding: 1.25rem 1rem;
100 margin: 0;
101 display: flex;
102 flex-direction: row;
103 align-items: center;
104 color: var(--ifm-link-color);
105 --ifm-link-color: #21252b;
106 --ifm-link-hover-color: var(--ifm-link-color);
107 --ifm-h3-font-size: 2rem;
108 --casl: 1;
109}
110
111[data-theme='dark'] .refinery__heading {
112 --ifm-link-color: #282c34;
113}
114
115.refinery__logo {
116 width: 4rem;
117 height: 4rem;
118 margin-right: 0.25rem;
119}
120
121.refinery__logo :global(.refinery-a) {
122 fill: currentcolor;
123}
124
125.refinery__logo :global(.refinery-b) {
126 fill: var(--ifm-color-primary);
127}
128
129[data-theme='dark'] .refinery__logo :global(.refinery-b) {
130 fill: var(--ifm-color-primary-darkest);
131}
132
133.cover-link::after {
134 content: ' ';
135 position: absolute;
136 top: 0;
137 left: 0;
138 width: 100%;
139 height: 100%;
140 z-index: 998;
141}
142
143.overlay {
144 padding: 1rem;
145 background: #ebedf0cd;
146 display: flex;
147 flex-direction: column;
148 gap: 1rem;
149}
150
151[data-theme='dark'] .overlay {
152 color: #fff;
153 background: #21252bcd;
154}
155
156.description p {
157 margin-bottom: 1rem;
158}
159
160.description p:last-of-type {
161 margin-bottom: 0;
162}
163
164.refinery__buttons {
165 display: flex;
166 flex-direction: row;
167 gap: 1rem;
168}
169
170.button {
171 z-index: 999;
172}
173
174:root:not([data-theme='dark']) .refinery__buttons :global(.button--secondary) {
175 --ifm-button-background-color: var(--ifm-background-surface-color);
176 --ifm-button-border-color: var(--ifm-button-background-color);
177}
178
179:root:not([data-theme='dark'])
180 .refinery__buttons
181 :global(.button--secondary):hover,
182:root:not([data-theme='dark'])
183 .refinery__buttons
184 :global(.button--secondary):active {
185 --ifm-button-background-color: var(--ifm-color-emphasis-200);
186}
187
188.software--screenshot {
189 grid-column: 2 / span 2;
190 grid-row: 2 / span 2;
191 position: relative;
192 overflow: hidden;
193 transition-property: box-shadow, transform;
194 z-index: 0;
195 background-size: cover;
196 background-position: center center;
197}
198
199.software--screenshot:hover,
200.software--screenshot:focus-within {
201 transform: scale(120%);
202}
203
204.screenshot {
205 position: absolute;
206 top: 0;
207 left: 0;
208 width: 100%;
209 height: 100%;
210 z-index: 1;
211}
212
213.content--screenshot {
214 justify-content: flex-end;
215}
216
217.overlay--screenshot {
218 /* Fix rounding error in Chromium by oversizing the overlay. */
219 padding: 0.83333rem 1.83333rem 1.83333rem 1.83333rem;
220 margin: 0 -1rem -1rem -1rem;
221 font-size: 0.83333rem;
222 transform: translatey(100%);
223 transition: transform var(--ifm-transition-fast) ease;
224}
225
226.software--screenshot:hover .overlay--screenshot,
227.software--screenshot:focus-within .overlay--screenshot {
228 transform: translatey(0%);
229}
230
231.software--screenshot:focus-within,
232.software--screenshot:focus-within .overlay--screenshot {
233 /* Avoid the overlay jumping around on focus. */
234 transition: none;
235}
236
237.screenshot__link {
238 --ifm-link-color: var(--ifm-text-color-base);
239 --ifm-link-hover-color: var(--ifm-link-color);
240}
241
242.screenshot__link::after {
243 content: ' ';
244 position: absolute;
245 top: -1000%;
246 left: 0;
247 width: 100%;
248 height: 1100%;
249}
250
251.software--ferdium {
252 grid-column: 3;
253 grid-row: 1;
254 background: linear-gradient(45deg, #ce9ffc, #7367f0);
255 padding: 1rem;
256 display: flex;
257 position: relative;
258 flex-direction: row;
259 align-items: center;
260 gap: 1rem;
261}
262
263.ferdium__icon {
264 position: relative;
265 overflow: hidden;
266 width: 4rem;
267 height: 4rem;
268 border-radius: 50rem;
269 display: flex;
270 align-items: center;
271 justify-content: center;
272 background: rgba(255 255 255 / 0.2);
273 flex-shrink: 0;
274}
275
276.ferdium__icon::after {
277 position: absolute;
278 content: ' ';
279 top: 0;
280 left: 0;
281 width: 100%;
282 height: 100%;
283 z-index: 1;
284 background-image: linear-gradient(45deg, #7266f0, #734ed3);
285 opacity: 0;
286 transition: opacity var(--ifm-transition-fast) ease;
287}
288
289.software--ferdium:hover .ferdium__icon::after,
290.software--ferdium:focus-within .ferdium__icon::after {
291 opacity: 1;
292}
293
294.ferdium__logo {
295 position: relative;
296 width: 78%;
297 height: auto;
298 z-index: 2;
299}
300
301.ferdium__content {
302 flex-shrink: 1;
303 color: var(--ifm-link-color);
304 --ifm-link-color: #fff;
305 --ifm-link-hover-color: var(--ifm-link-color);
306}
307
308.software--hosted {
309 grid-column: 1;
310 gird-row: 3;
311 background: var(--ifm-color-emphasis-200);
312 padding: 1rem;
313}
314
315[data-theme='dark'] .software--hosted {
316 background: var(--ifm-pre-background);
317 --ifm-link-color: var(--ifm-color-primary-light);
318 --ifm-link-hover-color: var(--ifm-color-primary-light);
319}
320
321@media (max-width: 996px) {
322 .wrapper {
323 overflow: visible;
324 padding: 0;
325 margin: 0;
326 }
327
328 .software-grid {
329 grid-template: min-content / 1fr;
330 }
331
332 .software {
333 grid-column: 1;
334 grid-row: auto / span 1;
335 }
336
337 .software {
338 box-shadow: none !important;
339 transform: none !important;
340 }
341
342 .overlay--screenshot {
343 padding: 1rem 2rem 2rem 2rem;
344 font-size: 1rem;
345 }
346}
347
348@media (max-width: 576px) {
349 .refinery__heading {
350 --ifm-h3-font-size: 1.5rem;
351 --casl: var(--marussy-slightly-casl);
352 }
353
354 .refinery__logo,
355 .ferdium__icon {
356 width: 3rem;
357 height: 3rem;
358 }
359}
diff --git a/src/components/landing/sections/Software.tsx b/src/components/landing/sections/Software.tsx
new file mode 100644
index 0000000..af25523
--- /dev/null
+++ b/src/components/landing/sections/Software.tsx
@@ -0,0 +1,230 @@
1/*
2 * Copyright (c) 2024 Kristóf Marussy <kristof@marussy.com>
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
9import Link from '@docusaurus/Link';
10import { useColorMode } from '@docusaurus/theme-common';
11import useIsBrowser from '@docusaurus/useIsBrowser';
12import clsx from 'clsx';
13
14import {
15 CodebergIcon,
16 GithubIcon,
17 GitlabIcon,
18} from '@site/src/components/icons';
19import Elsewhere from '@site/src/components/landing/Elsewhere';
20import Section from '@site/src/components/landing/Section';
21
22import styles from './Software.module.css';
23import FerdiumLogo from './ferdium.svg';
24import refineryBackground from './refinery-background.png?placeholder=true&sizes[]=767&sizes[]=997&sizes[]=1534&sizes[]=1920&rl';
25import RefineryLogo from './refinery-logo.svg';
26import refineryScreenshotDark from './refinery-screenshot-dark.png?placeholder=true&sizes[]=767&sizes[]=997&sizes[]=1534&sizes[]=1920&rl';
27import refineryScreenshotLight from './refinery-screenshot-light.png?placeholder=true&sizes[]=767&sizes[]=997&sizes[]=1534&sizes[]=1920&rl';
28
29function Screenshot() {
30 // Force re-render in browser.
31 // https://github.com/facebook/docusaurus/blob/e012e0315862b2ca02cad40c58d11d31c319ff75/packages/docusaurus-theme-classic/src/theme/CodeBlock/index.tsx#L32-L36
32 const isBrowser = useIsBrowser();
33 const { isDarkTheme } = useColorMode();
34 const refineryScreenshot = isDarkTheme
35 ? refineryScreenshotLight
36 : refineryScreenshotDark;
37
38 const screenshot = (
39 <img
40 src={refineryScreenshot.src}
41 srcSet={refineryScreenshot.srcSet}
42 width={refineryScreenshot.width}
43 height={refineryScreenshot.height}
44 sizes="(min-width: 1440px) 767px, (min-width: 1384px) 659px, (min-width: 997px) calc(60vw - 64px), calc(100vw - 32px)"
45 loading="lazy"
46 alt=""
47 className={styles.screenshot}
48 />
49 );
50
51 return (
52 <div
53 key={String(isBrowser)}
54 className={clsx(
55 styles.software,
56 styles['software--interactive'],
57 styles['software--screenshot'],
58 )}
59 style={{
60 aspectRatio: refineryScreenshot.width / refineryScreenshot.height,
61 backgroundImage: `url(${refineryScreenshot.placeholder})`,
62 }}
63 >
64 {isBrowser ? screenshot : <noscript>{screenshot}</noscript>}
65 <div className={clsx(styles.content, styles['content--screenshot'])}>
66 <div
67 className={clsx(
68 styles.overlay,
69 styles['overlay--screenshot'],
70 styles.description,
71 )}
72 >
73 <p>
74 <Link
75 href="https://refinery.services"
76 className={styles.screenshot__link}
77 >
78 Try Refinery in your browser!
79 </Link>
80 </p>
81 </div>
82 </div>
83 </div>
84 );
85}
86
87export default function Software() {
88 return (
89 <div className={styles.wrapper}>
90 <Section id="software" title="Software">
91 <div className="container">
92 <div className={styles['software-grid']}>
93 <div
94 className={clsx(
95 styles.software,
96 styles['software--interactive'],
97 styles['software--refinery'],
98 )}
99 style={{
100 backgroundImage: `url(${refineryBackground.placeholder})`,
101 }}
102 >
103 <img
104 src={refineryBackground.src}
105 srcSet={refineryBackground.srcSet}
106 width={refineryBackground.width}
107 height={refineryBackground.height}
108 sizes="(min-width: 1440px) 767px, (min-width: 1384px) 659px, (min-width: 997px) calc(60vw - 64px), calc(100vw - 32px)"
109 loading="lazy"
110 alt=""
111 className={styles.refinery__background}
112 />
113 <div
114 className={clsx(styles.content, styles['content--refinery'])}
115 >
116 <h3 className={styles.refinery__heading}>
117 <RefineryLogo className={styles.refinery__logo} />
118 <Link
119 href="https://refinery.tools"
120 className={styles['cover-link']}
121 >
122 Refinery
123 </Link>
124 </h3>
125 <div className={styles.overlay}>
126 <div className={styles.description}>
127 <p>
128 I am a developer and maintainer of Refinery, an efficient{' '}
129 <b>graph solver</b> for generating{' '}
130 <b>well-formed models</b> and reasoning about{' '}
131 <b>interconnected systems.</b>
132 </p>
133 </div>
134 <div className={styles.refinery__buttons}>
135 <Link
136 href="https://refinery.services"
137 className={clsx(
138 'button',
139 'button--primary',
140 styles.button,
141 )}
142 >
143 Try now
144 </Link>
145 <Link
146 href="https://refinery.tools"
147 className={clsx(
148 'button',
149 'button--secondary',
150 styles.button,
151 )}
152 >
153 More info
154 </Link>
155 </div>
156 </div>
157 </div>
158 </div>
159 <Screenshot />
160 <div
161 className={clsx(
162 styles.software,
163 styles['software--interactive'],
164 styles['software--ferdium'],
165 )}
166 >
167 <div className={styles.ferdium__icon}>
168 <FerdiumLogo className={styles.ferdium__logo} />
169 </div>
170 <div
171 className={clsx(styles.ferdium__content, styles.description)}
172 >
173 <p>
174 I also contributed to <b>Ferdium,</b> a desktop app that
175 combines and organizes <b>messaging apps</b> to take back{' '}
176 <b>user freedom.</b>{' '}
177 <Link
178 href="https://ferdium.org/"
179 className={styles['cover-link']}
180 >
181 Give it a spin!
182 </Link>
183 </p>
184 </div>
185 </div>
186 <div
187 className={clsx(
188 styles.software,
189 styles['software--hosted'],
190 styles.description,
191 )}
192 >
193 <p>
194 I host some{' '}
195 <Link href="https://git.marussy.com">Git repositories</Link> and{' '}
196 <Link href="https://jenkins.marussy.com">Jenkins CI</Link> to
197 publish my own code and mirror software I contribute to or use.
198 </p>
199 <p>
200 Take a look at the mirrors of{' '}
201 <Link href="https://git.marussy.com/firejail/">Firejail</Link>{' '}
202 and <Link href="https://git.marussy.com/sway/">sway</Link>. Here
203 are my{' '}
204 <Link href="https://git.marussy.com/gitmirror/">scripts</Link>{' '}
205 for mirroring.
206 </p>
207 </div>
208 </div>
209 <Elsewhere
210 label="See my other repositories at"
211 links={[
212 {
213 href: 'https://github.com/kris7t/',
214 icon: <GithubIcon />,
215 },
216 {
217 href: 'https://gitlab.com/kris7t',
218 icon: <GitlabIcon />,
219 },
220 {
221 href: 'https://codeberg.org/marussy',
222 icon: <CodebergIcon />,
223 },
224 ]}
225 />
226 </div>
227 </Section>
228 </div>
229 );
230}
diff --git a/src/components/landing/sections/ferdium.svg b/src/components/landing/sections/ferdium.svg
new file mode 100644
index 0000000..0b63966
--- /dev/null
+++ b/src/components/landing/sections/ferdium.svg
@@ -0,0 +1,45 @@
1<?xml version="1.0" encoding="UTF-8" standalone="no"?>
2<svg
3 width="806.57886"
4 height="260.71109"
5 viewBox="0 0 806.57886 260.71109"
6 version="1.1"
7 xml:space="preserve"
8 style="clip-rule:evenodd;fill-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"
9 id="svg5552"
10 sodipodi:docname="Ferdium.svg"
11 inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
12 xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
13 xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
14 xmlns="http://www.w3.org/2000/svg"
15 xmlns:svg="http://www.w3.org/2000/svg"><defs
16 id="defs5556" /><sodipodi:namedview
17 id="namedview5554"
18 pagecolor="#ffffff"
19 bordercolor="#666666"
20 borderopacity="1.0"
21 inkscape:pageshadow="2"
22 inkscape:pageopacity="0"
23 inkscape:pagecheckerboard="0"
24 showgrid="false"
25 inkscape:current-layer="svg5552"
26 inkscape:showpageshadow="2"
27 inkscape:deskcolor="#d1d1d1"
28 inkscape:zoom="1.883"
29 inkscape:cx="404.93893"
30 inkscape:cy="177.64206"
31 inkscape:window-width="3840"
32 inkscape:window-height="2135"
33 inkscape:window-x="0"
34 inkscape:window-y="0"
35 inkscape:window-maximized="0" />
36 <path
37 id="path1020"
38 sodipodi:nodetypes="zscszscsz"
39 class="st4"
40 d="M 403.28942,0 C 373.79442,0 232.71341,109.93592 208.58114,109.93592 182.59253,109.93592 19.235589,46.82075 0.46603569,59.40252 -10.053166,82.09099 160.52284,260.71109 206.93107,260.71109 c 45.58318,0 180.68268,-95.0853 196.35835,-95.0853 15.67566,0 150.77516,95.0853 196.35835,95.0853 46.40823,0 216.98422,-178.6201 206.46503,-201.30857 -18.76955,-12.78804 -182.12649,50.5334 -208.1151,50.5334 C 573.86542,109.93592 432.78443,0 403.28942,0 Z"
41 inkscape:export-filename="/Users/fernando/Downloads/logo.png"
42 inkscape:export-xdpi="195.03999"
43 inkscape:export-ydpi="195.03999"
44 style="clip-rule:evenodd;display:inline;fill:#ffffff;fill-rule:evenodd;stroke-width:2.06259" />
45</svg>
diff --git a/src/components/landing/sections/ferdium.svg.license b/src/components/landing/sections/ferdium.svg.license
new file mode 100644
index 0000000..7782463
--- /dev/null
+++ b/src/components/landing/sections/ferdium.svg.license
@@ -0,0 +1,7 @@
1SPDX-FileCopyrightText: Ferdium Contributors <hello@ferdium.org> (https://ferdium.org/)
2
3SPDX-License-Identifier: Apache-2.0
4
5This file was obtained by cropping the viewbox of
6https://github.com/ferdium/ferdium-app/blob/a877c6a83e40f09c5ba6f537a672e40a61a82415/branding/Ferdium.svg
7to only enclose the logo itself.
diff --git a/src/components/landing/sections/refinery-background.png b/src/components/landing/sections/refinery-background.png
new file mode 100644
index 0000000..67f00cd
--- /dev/null
+++ b/src/components/landing/sections/refinery-background.png
Binary files differ
diff --git a/src/components/landing/sections/refinery-background.png.license b/src/components/landing/sections/refinery-background.png.license
new file mode 100644
index 0000000..50ad65f
--- /dev/null
+++ b/src/components/landing/sections/refinery-background.png.license
@@ -0,0 +1,9 @@
1SPDX-FileCopyrightText: 2024 The Refinery Authors <https://refinery.tools/>
2
3SPDX-License-Identifier: EPL-2.0
4
5Modified image based on "Low Angle Shot of Manufacturing Plant under Blue Sky"
6available under the CC-1.0 license at
7https://www.pexels.com/photo/low-angle-shot-of-manufacturing-plant-under-blue-sky-257700/
8Original image "Bulgaria, Vratsa, Abandoned image. Free for use." by "2427999" also available at
9https://pixabay.com/photos/bulgaria-vratsa-abandoned-industry-1351947/
diff --git a/src/components/landing/sections/refinery-logo.svg b/src/components/landing/sections/refinery-logo.svg
new file mode 100644
index 0000000..2d2ac6a
--- /dev/null
+++ b/src/components/landing/sections/refinery-logo.svg
@@ -0,0 +1 @@
<svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M447.98 179.335c-139.95-9.583-301.272-50.91-384-147.336v46.117C98.45 129.623 209.442 178.137 294.243 199.1c-84.796 20.963-195.791 69.476-230.265 120.985v46.117c82.73-96.422 244.053-137.752 384.002-147.334z" class="refinery-a"/><path d="M447.98 296.729c-113.755 4.192-287.485 40.727-384 136.557v46.716c95.14-103.612 279.898-137.754 384-143.745z" class="refinery-b"/></svg>
diff --git a/src/components/landing/sections/refinery-logo.svg.license b/src/components/landing/sections/refinery-logo.svg.license
new file mode 100644
index 0000000..dd2431a
--- /dev/null
+++ b/src/components/landing/sections/refinery-logo.svg.license
@@ -0,0 +1,7 @@
1SPDX-FileCopyrightText: 2021-2024 The Refinery Authors <https://refinery.tools/>
2
3SPDX-License-Identifier: EPL-2.0
4
5This image is a version of
6https://github.com/graphs4value/refinery/blob/5af12117129b266ed356d9609f6476544a30b67a/subprojects/docs/static/logo.svg
7modified by adding CSS classes for on-the-fly recoloring.
diff --git a/src/components/landing/sections/refinery-screenshot-dark.png b/src/components/landing/sections/refinery-screenshot-dark.png
new file mode 100644
index 0000000..60a11d6
--- /dev/null
+++ b/src/components/landing/sections/refinery-screenshot-dark.png
Binary files differ
diff --git a/src/components/landing/sections/refinery-screenshot-dark.png.license b/src/components/landing/sections/refinery-screenshot-dark.png.license
new file mode 100644
index 0000000..777b42e
--- /dev/null
+++ b/src/components/landing/sections/refinery-screenshot-dark.png.license
@@ -0,0 +1,5 @@
1SPDX-FileCopyrightText: 2024 Kristóf Marussy
2
3SPDX-License-Identifier: CC0-1.0
4
5Screenshot taken from https://refinery.services with 200% zoom in Firefox 129.0.
diff --git a/src/components/landing/sections/refinery-screenshot-light.png b/src/components/landing/sections/refinery-screenshot-light.png
new file mode 100644
index 0000000..8ba7564
--- /dev/null
+++ b/src/components/landing/sections/refinery-screenshot-light.png
Binary files differ
diff --git a/src/components/landing/sections/refinery-screenshot-light.png.license b/src/components/landing/sections/refinery-screenshot-light.png.license
new file mode 100644
index 0000000..777b42e
--- /dev/null
+++ b/src/components/landing/sections/refinery-screenshot-light.png.license
@@ -0,0 +1,5 @@
1SPDX-FileCopyrightText: 2024 Kristóf Marussy
2
3SPDX-License-Identifier: CC0-1.0
4
5Screenshot taken from https://refinery.services with 200% zoom in Firefox 129.0.
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2024-09-28 12:09:52 +0000