mirror of
https://github.com/mfocko/blog.git
synced 2024-11-21 20:43:48 +01:00
feat: add contributions page
Signed-off-by: Matej Focko <mfocko@redhat.com>
This commit is contained in:
parent
f7a028db6f
commit
ab4ba212d1
6 changed files with 329 additions and 0 deletions
|
@ -134,6 +134,10 @@ const config = {
|
|||
title: "mf",
|
||||
items: [
|
||||
...subjects.map((s) => s.navbar()),
|
||||
{
|
||||
to: "contributions",
|
||||
label: "Contributions",
|
||||
},
|
||||
{
|
||||
to: "blog",
|
||||
position: "right",
|
||||
|
|
52
src/components/contributions/Contribution.module.scss
Normal file
52
src/components/contributions/Contribution.module.scss
Normal file
|
@ -0,0 +1,52 @@
|
|||
@import "../../css/mixins";
|
||||
|
||||
.card {
|
||||
margin-bottom: calc(var(--ifm-spacing-horizontal) * 2);
|
||||
border: 1px solid var(--ifm-color-emphasis-300);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.contributionsContainer {
|
||||
border-left: 1px solid var(--ifm-color-emphasis-300);
|
||||
|
||||
@include small-size {
|
||||
border-left: 0;
|
||||
border-top: 1px solid var(--ifm-color-emphasis-300);
|
||||
padding-top: var(--ifm-spacing-vertical);
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
> a {
|
||||
@include small-size {
|
||||
width: 100%;
|
||||
margin-top: calc(var(--ifm-spacing-vertical) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
a + a {
|
||||
margin-left: 0.5em;
|
||||
|
||||
@include small-size {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin-right: 0.3rem;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 4px;
|
||||
|
||||
[data-theme="dark"] & {
|
||||
fill: var(--ifm-font-color-base);
|
||||
}
|
||||
}
|
57
src/components/contributions/Contribution.tsx
Normal file
57
src/components/contributions/Contribution.tsx
Normal file
|
@ -0,0 +1,57 @@
|
|||
import clsx from "clsx";
|
||||
import React, { FunctionComponent } from "react";
|
||||
|
||||
import styles from "./Contribution.module.scss";
|
||||
import RepositoryIcon from "./assets/icon-repository.svg";
|
||||
|
||||
export interface ContributionMetadata {
|
||||
title: string;
|
||||
description: React.ReactNode;
|
||||
contribution: React.ReactNode;
|
||||
repoURL: string;
|
||||
}
|
||||
|
||||
const Contribution: FunctionComponent<ContributionMetadata> = ({
|
||||
title,
|
||||
description,
|
||||
contribution,
|
||||
repoURL,
|
||||
}) => {
|
||||
return (
|
||||
<div className="col col--12">
|
||||
<div className={clsx("card", styles.card)}>
|
||||
<div className="card__header">
|
||||
<h2>{title}</h2>
|
||||
</div>
|
||||
<div className="card__body">
|
||||
<div className="row">
|
||||
<div className="col col--6">
|
||||
<h6>Description</h6>
|
||||
{description}
|
||||
</div>
|
||||
<div className={clsx("col col--6", styles.contributionsContainer)}>
|
||||
<h6>Contribution</h6>
|
||||
{contribution}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="card__footer">
|
||||
<div className={styles.buttons}>
|
||||
<a
|
||||
href={repoURL}
|
||||
target="_blank"
|
||||
className="button button--secondary button--outline"
|
||||
>
|
||||
<span className="button__icon">
|
||||
<RepositoryIcon />
|
||||
</span>
|
||||
See repository
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Contribution;
|
2
src/components/contributions/assets/icon-repository.svg
Normal file
2
src/components/contributions/assets/icon-repository.svg
Normal file
|
@ -0,0 +1,2 @@
|
|||
<!-- Source: https://remixicon.com/ -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M13 21v2.5l-3-2-3 2V21h-.5A3.5 3.5 0 0 1 3 17.5V5a3 3 0 0 1 3-3h14a1 1 0 0 1 1 1v17a1 1 0 0 1-1 1h-7zm0-2h6v-3H6.5a1.5 1.5 0 0 0 0 3H7v-2h6v2zm6-5V4H6v10.035A3.53 3.53 0 0 1 6.5 14H19zM7 5h2v2H7V5zm0 3h2v2H7V8zm0 3h2v2H7v-2z"/></svg>
|
After Width: | Height: | Size: 379 B |
7
src/css/mixins.scss
Normal file
7
src/css/mixins.scss
Normal file
|
@ -0,0 +1,7 @@
|
|||
$breakpoint: 996px;
|
||||
|
||||
@mixin small-size {
|
||||
@media (max-width: $breakpoint) {
|
||||
@content;
|
||||
}
|
||||
}
|
207
src/pages/contributions.tsx
Normal file
207
src/pages/contributions.tsx
Normal file
|
@ -0,0 +1,207 @@
|
|||
import React from "react";
|
||||
import Layout from "@theme/Layout";
|
||||
|
||||
import Contribution, { ContributionMetadata } from "../components/contributions/Contribution";
|
||||
|
||||
const contributions: ContributionMetadata[] = [
|
||||
{
|
||||
title: "Fedora Infrastructure Ansible",
|
||||
description: (<p>
|
||||
Collection of Ansible playbooks that powers the Fedora Infrastructure.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
I have adjusted the groups in the Bodhi playbooks after Packit has
|
||||
been granted the privileges to propose updates without restrictions.
|
||||
</p>),
|
||||
repoURL: "https://pagure.io/fedora-infra/ansible",
|
||||
},
|
||||
{
|
||||
title: "Bodhi",
|
||||
description: (<p>
|
||||
Bodhi is a web-system that facilitates the process of publishing
|
||||
updates for a Fedora-based software distribution.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
I have adjusted the client, so that it doesn't show secrets in
|
||||
terminal when you log in to the Bodhi via browser.
|
||||
</p>),
|
||||
repoURL: "https://github.com/fedora-infra/bodhi",
|
||||
},
|
||||
{
|
||||
title: "Gluetool Modules Collection",
|
||||
description: (<p>
|
||||
Modules for <code>gluetool</code> — a command line centric framework
|
||||
usable for glueing modules into a pipeline.
|
||||
</p>),
|
||||
contribution: (<ul>
|
||||
<li>
|
||||
I have proposed a possible implementation of git merging that
|
||||
was later on extended.
|
||||
</li>
|
||||
<li>
|
||||
I have tried to help out with Copr module after they deprecated
|
||||
older version of their API.
|
||||
</li>
|
||||
</ul>),
|
||||
repoURL: "https://gitlab.com/testing-farm/gluetool-modules",
|
||||
},
|
||||
{
|
||||
title: "Pagure",
|
||||
description: (<p>
|
||||
Pagure is a git-centered forge, python based using pygit2.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
I have added an API endpoint for reopening pull requests.
|
||||
</p>),
|
||||
repoURL: "https://pagure.io/pagure",
|
||||
},
|
||||
{
|
||||
title: "Copr",
|
||||
description: (<p>
|
||||
RPM build system - upstream for{" "}
|
||||
<a target="_blank" href="https://copr.fedorainfracloud.org/">Copr</a>.
|
||||
</p>),
|
||||
contribution: (<ul>
|
||||
<li>
|
||||
Supporting external repositories for custom SRPM build method.
|
||||
</li>
|
||||
<li>
|
||||
Allowing admins of Copr repositories to build without the need
|
||||
to ask for explicit <code>builder</code> permissions.
|
||||
</li>
|
||||
</ul>),
|
||||
repoURL: "https://github.com/fedora-copr/copr",
|
||||
},
|
||||
{
|
||||
title: "python-gitlab",
|
||||
description: (<p>
|
||||
A python wrapper for the GitLab API.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
I have contributed support for the <code>merge_ref</code> on merge
|
||||
requests that hasn't been supported, yet it was present in the GitLab
|
||||
API.
|
||||
</p>),
|
||||
repoURL: "https://github.com/python-gitlab/python-gitlab",
|
||||
},
|
||||
{
|
||||
title: "PatternFly React",
|
||||
description: (<p>
|
||||
A set of React components for the PatternFly project.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
When working on Packit Dashboard, I have spotted smaller bugs that
|
||||
were present in this project and fixed them upstream to provide
|
||||
better experience for our users.
|
||||
</p>),
|
||||
repoURL: "https://github.com/patternfly/patternfly-react",
|
||||
},
|
||||
{
|
||||
title: "Fira Code",
|
||||
description: (<p>
|
||||
Free monospaced font with programming ligatures.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
I have set up a GitHub Action for building the font on each push to
|
||||
the default branch allowing users to install <i>bleeding edge</i>{" "}
|
||||
version of the font.
|
||||
</p>),
|
||||
repoURL: "https://github.com/tonsky/FiraCode",
|
||||
},
|
||||
{
|
||||
title: "nixpkgs",
|
||||
description: (<p>
|
||||
Nixpkgs is a collection of over 80,000 software packages that can be
|
||||
installed with the Nix package manager. It also implements NixOS,
|
||||
a purely-functional Linux distribution.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
When I was trying out the nixpkgs, I have tried to bump .NET Core to
|
||||
the latest version. My changes haven't been accepted as they required
|
||||
bumping of multiple more packages that depended upon the .NET Core.
|
||||
</p>),
|
||||
repoURL: "https://github.com/NixOS/nixpkgs",
|
||||
},
|
||||
{
|
||||
title: "Darcula",
|
||||
description: (<p>
|
||||
A theme for Visual Studio Code based on Darcula theme from Jetbrains
|
||||
IDEs.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
I have contributed support for diff files, though the project doesn't
|
||||
seem to be live anymore, so it hasn't been accepted as of now.
|
||||
</p>),
|
||||
repoURL: "https://github.com/rokoroku/vscode-theme-darcula",
|
||||
},
|
||||
{
|
||||
title: "Packit",
|
||||
description: (<p>
|
||||
An open source project aiming to ease the integration of your
|
||||
project with Fedora Linux, CentOS Stream and other distributions.
|
||||
</p>),
|
||||
contribution: (<p>
|
||||
Have a look at my{" "}
|
||||
<a
|
||||
href="https://github.com/search?q=is%3Apr%20author%3Amfocko%20org%3Apackit&type=pullrequests"
|
||||
target="_blank">
|
||||
pull requests
|
||||
</a>.
|
||||
</p>),
|
||||
repoURL: "https://github.com/packit",
|
||||
},
|
||||
{
|
||||
title: "Snitch",
|
||||
description: (<>
|
||||
<p>
|
||||
Language agnostic tool that collects TODOs in the source code
|
||||
and reports them as Issues.
|
||||
</p>
|
||||
</>),
|
||||
contribution: (<ul>
|
||||
<li>Environment variable support for self-hosted GitLab instances</li>
|
||||
<li>GitLab support</li>
|
||||
</ul>),
|
||||
repoURL: "https://github.com/tsoding/snitch",
|
||||
},
|
||||
{
|
||||
title: "Karel the Robot",
|
||||
description: (<>
|
||||
<p>
|
||||
Karel the robot is in general an educational programming
|
||||
language for beginners, created by <i>Richard E. Pattis</i>.
|
||||
This is implementation of <i>Karel the Robot</i> for{" "}
|
||||
<i>C programming language</i>.
|
||||
</p>
|
||||
<p>
|
||||
This project is used for educational purposes at{" "}
|
||||
<a target="_blank" href="https://fei.tuke.sk">TUKE</a>.
|
||||
</p>
|
||||
</>),
|
||||
contribution: (<p>
|
||||
I have contributed some refactoring tips to the author of the
|
||||
library.
|
||||
</p>),
|
||||
repoURL: "https://git.kpi.fei.tuke.sk/kpi/karel-the-robot",
|
||||
},
|
||||
];
|
||||
|
||||
const title = "Contributions";
|
||||
const description = "Many of my contributions to open-source projects.";
|
||||
|
||||
export default function Contributions(): JSX.Element {
|
||||
return (
|
||||
<Layout title={title} description={description}>
|
||||
<main className="container container--fluid margin-vert--lg">
|
||||
<h1>{title}</h1>
|
||||
<p>{description}</p>
|
||||
|
||||
<div className="row">
|
||||
{contributions.map((contributionData) => (
|
||||
<Contribution key={contributionData.project} {...contributionData} />
|
||||
))}
|
||||
</div>
|
||||
</main>
|
||||
</Layout>
|
||||
);
|
||||
}
|
Loading…
Reference in a new issue