mirror of https://github.com/mitchell/mjfs.us.git
Added svg badges to projects that have them
This commit is contained in:
parent
65c1f85277
commit
34dba26cb3
|
@ -16,6 +16,7 @@ class Experience extends React.PureComponent<Props> {
|
||||||
|
|
||||||
constructor(props: Props) {
|
constructor(props: Props) {
|
||||||
super(props)
|
super(props)
|
||||||
|
|
||||||
this.listedBullets = this.props.bullets.map((bullet, index) => (
|
this.listedBullets = this.props.bullets.map((bullet, index) => (
|
||||||
<li key={index}>{bullet}</li>
|
<li key={index}>{bullet}</li>
|
||||||
))
|
))
|
||||||
|
|
|
@ -1,3 +1,8 @@
|
||||||
|
.project-badge {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 3px 2px 0 2px;
|
||||||
|
}
|
||||||
|
|
||||||
.project-container {
|
.project-container {
|
||||||
border-bottom: 2px solid rgb(139, 191, 209);
|
border-bottom: 2px solid rgb(139, 191, 209);
|
||||||
flex: 1 0 45%;
|
flex: 1 0 45%;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
// @flow
|
// @flow
|
||||||
import React from "react"
|
import * as React from "react"
|
||||||
|
|
||||||
import ClearButton from "../../components/ClearButton"
|
import ClearButton from "../../components/ClearButton"
|
||||||
|
|
||||||
|
@ -8,14 +8,28 @@ import "./index.css"
|
||||||
type Props = {
|
type Props = {
|
||||||
title: string,
|
title: string,
|
||||||
children: string,
|
children: string,
|
||||||
repoUrl: string
|
repoUrl: string,
|
||||||
|
badges: Array<{ imgUrl: string, linkUrl: string, alt: string }>
|
||||||
}
|
}
|
||||||
|
|
||||||
class Project extends React.PureComponent<Props> {
|
class Project extends React.PureComponent<Props> {
|
||||||
|
badges: Array<React.Element<string>>
|
||||||
|
|
||||||
|
constructor(props: Props) {
|
||||||
|
super(props)
|
||||||
|
|
||||||
|
this.badges = this.props.badges.map((badge, index) => (
|
||||||
|
<a className="project-badge" href={badge.linkUrl} key={index}>
|
||||||
|
<img src={badge.imgUrl} alt={badge.alt} />
|
||||||
|
</a>
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div className="project-container">
|
<div className="project-container">
|
||||||
<h4>{this.props.title}</h4>
|
<h4>{this.props.title}</h4>
|
||||||
|
{this.badges}
|
||||||
<p>{this.props.children}</p>
|
<p>{this.props.children}</p>
|
||||||
<ClearButton href={this.props.repoUrl}>Repository</ClearButton>
|
<ClearButton href={this.props.repoUrl}>Repository</ClearButton>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -14,6 +14,20 @@ class Projects extends React.PureComponent<Props> {
|
||||||
<Project
|
<Project
|
||||||
title="mjfs.us"
|
title="mjfs.us"
|
||||||
repoUrl="https://github.com/mitchelljfs/react-website"
|
repoUrl="https://github.com/mitchelljfs/react-website"
|
||||||
|
badges={[
|
||||||
|
{
|
||||||
|
imgUrl:
|
||||||
|
"https://travis-ci.org/mitchelljfs/react-website.svg?branch=master",
|
||||||
|
linkUrl: "https://travis-ci.org/mitchelljfs/react-website",
|
||||||
|
alt: "Travis Build Status"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl:
|
||||||
|
"https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat",
|
||||||
|
linkUrl: "https://github.com/prettier/prettier",
|
||||||
|
alt: "Prettier Style"
|
||||||
|
}
|
||||||
|
]}
|
||||||
>
|
>
|
||||||
This website has taken many forms over the years, as my frontend and
|
This website has taken many forms over the years, as my frontend and
|
||||||
design skills increase. It has been simple HTML, CSS, and JS, and a
|
design skills increase. It has been simple HTML, CSS, and JS, and a
|
||||||
|
@ -25,6 +39,34 @@ class Projects extends React.PureComponent<Props> {
|
||||||
<Project
|
<Project
|
||||||
title="lambdarouter"
|
title="lambdarouter"
|
||||||
repoUrl="https://github.com/mitchelljfs/lambdarouter"
|
repoUrl="https://github.com/mitchelljfs/lambdarouter"
|
||||||
|
badges={[
|
||||||
|
{
|
||||||
|
imgUrl:
|
||||||
|
"https://godoc.org/github.com/mitchelljfs/lambdarouter?status.svg",
|
||||||
|
linkUrl: "https://godoc.org/github.com/mitchelljfs/lambdarouter",
|
||||||
|
alt: "Go Doc"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl:
|
||||||
|
"https://travis-ci.org/mitchelljfs/lambdarouter.svg?branch=master",
|
||||||
|
linkUrl: "https://travis-ci.org/mitchelljfs/lambdarouter",
|
||||||
|
alt: "Build Status"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl:
|
||||||
|
"https://coveralls.io/repos/github/mitchelljfs/lambdarouter/badge.svg?branch=master",
|
||||||
|
linkUrl:
|
||||||
|
"https://coveralls.io/github/mitchelljfs/lambdarouter?branch=master",
|
||||||
|
alt: "Code Coverage"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl:
|
||||||
|
"https://goreportcard.com/badge/github.com/mitchelljfs/lambdarouter",
|
||||||
|
linkUrl:
|
||||||
|
"https://goreportcard.com/report/github.com/mitchelljfs/lambdarouter",
|
||||||
|
alt: "Code Coverage"
|
||||||
|
}
|
||||||
|
]}
|
||||||
>
|
>
|
||||||
This package will become a fully featured AWS Lambda function router,
|
This package will become a fully featured AWS Lambda function router,
|
||||||
able to respond to HTTP, Schedule, Cognito, and SNS events. It will
|
able to respond to HTTP, Schedule, Cognito, and SNS events. It will
|
||||||
|
@ -36,6 +78,7 @@ class Projects extends React.PureComponent<Props> {
|
||||||
<Project
|
<Project
|
||||||
title="destinate"
|
title="destinate"
|
||||||
repoUrl="https://github.com/mitchelljfs/destinate"
|
repoUrl="https://github.com/mitchelljfs/destinate"
|
||||||
|
badges={[]}
|
||||||
>
|
>
|
||||||
destinate is a react-native, iOS (and Android) app. Its main objective
|
destinate is a react-native, iOS (and Android) app. Its main objective
|
||||||
is to suggest places or activities to the user based on their past
|
is to suggest places or activities to the user based on their past
|
||||||
|
@ -47,6 +90,7 @@ class Projects extends React.PureComponent<Props> {
|
||||||
<Project
|
<Project
|
||||||
title="sys-mgmt"
|
title="sys-mgmt"
|
||||||
repoUrl="https://github.com/mitchelljfs/sys-mgmt"
|
repoUrl="https://github.com/mitchelljfs/sys-mgmt"
|
||||||
|
badges={[]}
|
||||||
>
|
>
|
||||||
A minimal, cross-platform, unix-like-system management program. This
|
A minimal, cross-platform, unix-like-system management program. This
|
||||||
program is designed to detect which programs are affiliated with the
|
program is designed to detect which programs are affiliated with the
|
||||||
|
|
Loading…
Reference in New Issue