This commit is contained in:
Brandon Rosage 2019-01-25 15:47:50 -06:00
commit 9d3b467220
9 changed files with 371 additions and 12 deletions

19
_includes/org-card.html Normal file
View file

@ -0,0 +1,19 @@
<div class="github-component">
<div class="topic-box position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/primer" class="no-underline d-flex flex-column flex-justify-center">
<img src="https://avatars1.githubusercontent.com/u/7143434?s=200&amp;v=4" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="primer logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">
Primer
</p>
<p class="f5 text-gray text-center mb-3 mt-1">Components and behaviors for building things on the Web, from GitHub.</p>
<div class="v-align-middle text-gray">
{% octicon location height:16 class:"mr-1 v-align-middle" aria-label:location %}
<span>Planet Earth</span>
</div>
<div class="v-align-middle">
{% octicon link height:16 class:"mr-1 v-align-middle" aria-label:link %}
<p><a href="http://primer.github.io/">primer.github.io</a></p>
</div>
</a>
</div>
</div>

24
_includes/repo-card.html Normal file
View file

@ -0,0 +1,24 @@
<div class="github-component">
<div class="height-full border border-gray-light bg-white rounded-1 p-3">
<div class="d-flex flex-justify-between flex-items-start mb-1">
<h1 class="f4 lh-condensed mb-1">
<a href="/twbs" class="d-inline-block v-align-top mr-1" data-ga-click="Repository, go to repository owner, location:topic row">
<img src="https://avatars2.githubusercontent.com/u/2918581?s=96&amp;v=4" class="avatar rounded-1" width="20" height="20" alt="@twbs">
</a>
<a href="/twbs/bootstrap" data-ga-click="Repository, go to repository, location:topic row">
<span class="text-normal">twbs /</span>
bootstrap
</a>
</h1>
</div>
<div class="text-gray mb-2 ws-normal">The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.</div>
<div class="d-flex f6">
<a href="/twbs/bootstrap/stargazers" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository stargazers, location:topic row">
<svg class="octicon octicon-star mr-1" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"></path></svg>130253
</a>
<a href="/twbs/bootstrap/network" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository forks, location:topic row">
<svg class="octicon octicon-git-branch mr-1" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 5c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v.3c-.02.52-.23.98-.63 1.38-.4.4-.86.61-1.38.63-.83.02-1.48.16-2 .45V4.72a1.993 1.993 0 0 0-1-3.72C.88 1 0 1.89 0 3a2 2 0 0 0 1 1.72v6.56c-.59.35-1 .99-1 1.72 0 1.11.89 2 2 2 1.11 0 2-.89 2-2 0-.53-.2-1-.53-1.36.09-.06.48-.41.59-.47.25-.11.56-.17.94-.17 1.05-.05 1.95-.45 2.75-1.25S8.95 7.77 9 6.73h-.02C9.59 6.37 10 5.73 10 5zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm0 12.41c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm6-8c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"></path></svg>63919
</a>
</div>
</div>
</div>

View file

@ -0,0 +1,9 @@
<div class="github-component">
<div class="position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/topics/sql" class="no-underline d-flex flex-column flex-justify-center" data-ga-click="Topics, go to sql, location:boxes">
<img src="https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/react/react.png" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="react logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">React</p>
<p class="f5 text-gray text-center mb-0 mt-1">React (also known as React.js or ReactJS) is a JavaScript library that makes developing interactive user interfaces simple.</p>
</a>
</div>
</div>

View file

@ -3,9 +3,9 @@
{% assign user = site.github.organization_members[0] %}
<div class="d-md-flex">
<div class="flex-self-stretch border-bottom border-md-bottom-0 border-md-right col-md-5 col-lg-4 col-xl-3 px-4 py-6 px-lg-6">
<div class="flex-self-stretch border-bottom border-md-none border-md-right border-gray-light col-md-5 col-lg-4 col-xl-3 px-4 px-md-6 px-lg-7 py-6">
<img src="{{ user.avatar_url }}" class="circle mb-3" style="max-width: 150px;">
<h1 class="mb-2">{{ site.title }}</h1>
<h1 class="mb-2 lh-condensed">{{ site.title }}</h1>
<p class="mb-3 f4 text-gray">
Hi! I'm Ben. I love two things: bridges and smiling. I'm an aspiring developer who is learning how to use GitHub to build the stuff I wish existed. I'm looking to meet other developers who can help to contribute to the projects I have started.
</p>
@ -28,8 +28,58 @@
</div>
</div>
</div>
<div class="px-4 py-6 px-lg-6">
{{ content }}
<div class="bg-gray-light col-md-7 col-lg-8 col-xl-9 px-4 py-6 px-lg-7">
<div class="mx-auto" style="max-width: 900px;">
<h2>My Projects</h2>
<p class="f4 mb-4 text-gray">GitHub repositories that I've contributed to</p>
<div class="d-flex flex-wrap gutter-condensed mb-4">
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include repo-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include repo-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include repo-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include repo-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include repo-card.html %}
</div>
</div>
<h2>My Interests</h2>
<p class="f4 mb-4 text-gray">Topics that I want to learn more about</p>
<div class="d-flex flex-wrap gutter-condensed mb-4">
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include topic-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include topic-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include topic-card.html %}
</div>
</div>
<h2>My Organizations</h2>
<p class="f4 mb-4 text-gray">Teams I belong to</p>
<div class="d-flex flex-wrap gutter-condensed mb-4">
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include org-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include org-card.html %}
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
{% include org-card.html %}
</div>
</div>
</div>
</div>
</div>

View file

@ -4,7 +4,7 @@
<div class="container-lg py-6 p-responsive text-center">
<img src="{{ user.avatar_url }}" class="circle mb-3" style="max-width: 150px;">
<h1 class="mb-2">{{ site.title }}</h1>
<h1 class="mb-2 lh-condensed">{{ site.title }}</h1>
<p class="col-lg-8 mx-auto mb-3 f3 text-gray">
Hi! I'm Ben. I love two things: bridges and smiling. I'm an aspiring developer who is learning how to use GitHub to build the stuff I wish existed. I'm looking to meet other developers who can help to contribute to the projects I have started.
</p>

View file

@ -3769,4 +3769,4 @@ a.tabnav-extra:hover { color: #0366d6; text-decoration: none; }
.pb-xl-12 { padding-bottom: 128px !important; }
/* Set a 128px padding to the top & bottom at the xl breakpoint */
.py-xl-12 { padding-top: 128px !important; padding-bottom: 128px !important; } }
body { font-family: 'Rubik', sans-serif; }
.github-component { font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; }

View file

@ -11,9 +11,9 @@
<div class="d-md-flex">
<div class="flex-self-stretch border-bottom border-md-bottom-0 border-md-right col-md-5 col-lg-4 col-xl-3 px-4 py-6 px-lg-6">
<div class="flex-self-stretch border-bottom border-md-none border-md-right border-gray-light col-md-5 col-lg-4 col-xl-3 px-4 px-md-6 px-lg-7 py-6">
<img src="https://avatars0.githubusercontent.com/u/334891?v=4" class="circle mb-3" style="max-width: 150px;">
<h1 class="mb-2">primer</h1>
<h1 class="mb-2 lh-condensed">primer</h1>
<p class="mb-3 f4 text-gray">
Hi! I'm Ben. I love two things: bridges and smiling. I'm an aspiring developer who is learning how to use GitHub to build the stuff I wish existed. I'm looking to meet other developers who can help to contribute to the projects I have started.
</p>
@ -36,9 +36,262 @@
</div>
</div>
</div>
<div class="px-4 py-6 px-lg-6">
Hello! This is where the content for the sidebar layout will be.
<div class="bg-gray-light col-md-7 col-lg-8 col-xl-9 px-4 py-6 px-lg-7">
<div class="mx-auto" style="max-width: 900px;">
<h2>My Projects</h2>
<p class="f4 mb-4 text-gray">GitHub repositories that I've contributed to</p>
<div class="d-flex flex-wrap gutter-condensed mb-4">
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="height-full border border-gray-light bg-white rounded-1 p-3">
<div class="d-flex flex-justify-between flex-items-start mb-1">
<h1 class="f4 lh-condensed mb-1">
<a href="/twbs" class="d-inline-block v-align-top mr-1" data-ga-click="Repository, go to repository owner, location:topic row">
<img src="https://avatars2.githubusercontent.com/u/2918581?s=96&amp;v=4" class="avatar rounded-1" width="20" height="20" alt="@twbs">
</a>
<a href="/twbs/bootstrap" data-ga-click="Repository, go to repository, location:topic row">
<span class="text-normal">twbs /</span>
bootstrap
</a>
</h1>
</div>
<div class="text-gray mb-2 ws-normal">The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.</div>
<div class="d-flex f6">
<a href="/twbs/bootstrap/stargazers" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository stargazers, location:topic row">
<svg class="octicon octicon-star mr-1" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"></path></svg>130253
</a>
<a href="/twbs/bootstrap/network" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository forks, location:topic row">
<svg class="octicon octicon-git-branch mr-1" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 5c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v.3c-.02.52-.23.98-.63 1.38-.4.4-.86.61-1.38.63-.83.02-1.48.16-2 .45V4.72a1.993 1.993 0 0 0-1-3.72C.88 1 0 1.89 0 3a2 2 0 0 0 1 1.72v6.56c-.59.35-1 .99-1 1.72 0 1.11.89 2 2 2 1.11 0 2-.89 2-2 0-.53-.2-1-.53-1.36.09-.06.48-.41.59-.47.25-.11.56-.17.94-.17 1.05-.05 1.95-.45 2.75-1.25S8.95 7.77 9 6.73h-.02C9.59 6.37 10 5.73 10 5zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm0 12.41c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm6-8c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"></path></svg>63919
</a>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="height-full border border-gray-light bg-white rounded-1 p-3">
<div class="d-flex flex-justify-between flex-items-start mb-1">
<h1 class="f4 lh-condensed mb-1">
<a href="/twbs" class="d-inline-block v-align-top mr-1" data-ga-click="Repository, go to repository owner, location:topic row">
<img src="https://avatars2.githubusercontent.com/u/2918581?s=96&amp;v=4" class="avatar rounded-1" width="20" height="20" alt="@twbs">
</a>
<a href="/twbs/bootstrap" data-ga-click="Repository, go to repository, location:topic row">
<span class="text-normal">twbs /</span>
bootstrap
</a>
</h1>
</div>
<div class="text-gray mb-2 ws-normal">The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.</div>
<div class="d-flex f6">
<a href="/twbs/bootstrap/stargazers" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository stargazers, location:topic row">
<svg class="octicon octicon-star mr-1" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"></path></svg>130253
</a>
<a href="/twbs/bootstrap/network" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository forks, location:topic row">
<svg class="octicon octicon-git-branch mr-1" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 5c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v.3c-.02.52-.23.98-.63 1.38-.4.4-.86.61-1.38.63-.83.02-1.48.16-2 .45V4.72a1.993 1.993 0 0 0-1-3.72C.88 1 0 1.89 0 3a2 2 0 0 0 1 1.72v6.56c-.59.35-1 .99-1 1.72 0 1.11.89 2 2 2 1.11 0 2-.89 2-2 0-.53-.2-1-.53-1.36.09-.06.48-.41.59-.47.25-.11.56-.17.94-.17 1.05-.05 1.95-.45 2.75-1.25S8.95 7.77 9 6.73h-.02C9.59 6.37 10 5.73 10 5zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm0 12.41c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm6-8c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"></path></svg>63919
</a>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="height-full border border-gray-light bg-white rounded-1 p-3">
<div class="d-flex flex-justify-between flex-items-start mb-1">
<h1 class="f4 lh-condensed mb-1">
<a href="/twbs" class="d-inline-block v-align-top mr-1" data-ga-click="Repository, go to repository owner, location:topic row">
<img src="https://avatars2.githubusercontent.com/u/2918581?s=96&amp;v=4" class="avatar rounded-1" width="20" height="20" alt="@twbs">
</a>
<a href="/twbs/bootstrap" data-ga-click="Repository, go to repository, location:topic row">
<span class="text-normal">twbs /</span>
bootstrap
</a>
</h1>
</div>
<div class="text-gray mb-2 ws-normal">The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.</div>
<div class="d-flex f6">
<a href="/twbs/bootstrap/stargazers" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository stargazers, location:topic row">
<svg class="octicon octicon-star mr-1" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"></path></svg>130253
</a>
<a href="/twbs/bootstrap/network" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository forks, location:topic row">
<svg class="octicon octicon-git-branch mr-1" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 5c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v.3c-.02.52-.23.98-.63 1.38-.4.4-.86.61-1.38.63-.83.02-1.48.16-2 .45V4.72a1.993 1.993 0 0 0-1-3.72C.88 1 0 1.89 0 3a2 2 0 0 0 1 1.72v6.56c-.59.35-1 .99-1 1.72 0 1.11.89 2 2 2 1.11 0 2-.89 2-2 0-.53-.2-1-.53-1.36.09-.06.48-.41.59-.47.25-.11.56-.17.94-.17 1.05-.05 1.95-.45 2.75-1.25S8.95 7.77 9 6.73h-.02C9.59 6.37 10 5.73 10 5zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm0 12.41c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm6-8c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"></path></svg>63919
</a>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="height-full border border-gray-light bg-white rounded-1 p-3">
<div class="d-flex flex-justify-between flex-items-start mb-1">
<h1 class="f4 lh-condensed mb-1">
<a href="/twbs" class="d-inline-block v-align-top mr-1" data-ga-click="Repository, go to repository owner, location:topic row">
<img src="https://avatars2.githubusercontent.com/u/2918581?s=96&amp;v=4" class="avatar rounded-1" width="20" height="20" alt="@twbs">
</a>
<a href="/twbs/bootstrap" data-ga-click="Repository, go to repository, location:topic row">
<span class="text-normal">twbs /</span>
bootstrap
</a>
</h1>
</div>
<div class="text-gray mb-2 ws-normal">The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.</div>
<div class="d-flex f6">
<a href="/twbs/bootstrap/stargazers" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository stargazers, location:topic row">
<svg class="octicon octicon-star mr-1" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"></path></svg>130253
</a>
<a href="/twbs/bootstrap/network" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository forks, location:topic row">
<svg class="octicon octicon-git-branch mr-1" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 5c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v.3c-.02.52-.23.98-.63 1.38-.4.4-.86.61-1.38.63-.83.02-1.48.16-2 .45V4.72a1.993 1.993 0 0 0-1-3.72C.88 1 0 1.89 0 3a2 2 0 0 0 1 1.72v6.56c-.59.35-1 .99-1 1.72 0 1.11.89 2 2 2 1.11 0 2-.89 2-2 0-.53-.2-1-.53-1.36.09-.06.48-.41.59-.47.25-.11.56-.17.94-.17 1.05-.05 1.95-.45 2.75-1.25S8.95 7.77 9 6.73h-.02C9.59 6.37 10 5.73 10 5zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm0 12.41c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm6-8c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"></path></svg>63919
</a>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="height-full border border-gray-light bg-white rounded-1 p-3">
<div class="d-flex flex-justify-between flex-items-start mb-1">
<h1 class="f4 lh-condensed mb-1">
<a href="/twbs" class="d-inline-block v-align-top mr-1" data-ga-click="Repository, go to repository owner, location:topic row">
<img src="https://avatars2.githubusercontent.com/u/2918581?s=96&amp;v=4" class="avatar rounded-1" width="20" height="20" alt="@twbs">
</a>
<a href="/twbs/bootstrap" data-ga-click="Repository, go to repository, location:topic row">
<span class="text-normal">twbs /</span>
bootstrap
</a>
</h1>
</div>
<div class="text-gray mb-2 ws-normal">The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.</div>
<div class="d-flex f6">
<a href="/twbs/bootstrap/stargazers" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository stargazers, location:topic row">
<svg class="octicon octicon-star mr-1" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"></path></svg>130253
</a>
<a href="/twbs/bootstrap/network" class="d-inline-block link-gray mr-4" data-ga-click="Repository, go to repository forks, location:topic row">
<svg class="octicon octicon-git-branch mr-1" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 5c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v.3c-.02.52-.23.98-.63 1.38-.4.4-.86.61-1.38.63-.83.02-1.48.16-2 .45V4.72a1.993 1.993 0 0 0-1-3.72C.88 1 0 1.89 0 3a2 2 0 0 0 1 1.72v6.56c-.59.35-1 .99-1 1.72 0 1.11.89 2 2 2 1.11 0 2-.89 2-2 0-.53-.2-1-.53-1.36.09-.06.48-.41.59-.47.25-.11.56-.17.94-.17 1.05-.05 1.95-.45 2.75-1.25S8.95 7.77 9 6.73h-.02C9.59 6.37 10 5.73 10 5zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm0 12.41c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm6-8c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"></path></svg>63919
</a>
</div>
</div>
</div>
</div>
</div>
<h2>My Interests</h2>
<p class="f4 mb-4 text-gray">Topics that I want to learn more about</p>
<div class="d-flex flex-wrap gutter-condensed mb-4">
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/topics/sql" class="no-underline d-flex flex-column flex-justify-center" data-ga-click="Topics, go to sql, location:boxes">
<img src="https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/react/react.png" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="react logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">React</p>
<p class="f5 text-gray text-center mb-0 mt-1">React (also known as React.js or ReactJS) is a JavaScript library that makes developing interactive user interfaces simple.</p>
</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/topics/sql" class="no-underline d-flex flex-column flex-justify-center" data-ga-click="Topics, go to sql, location:boxes">
<img src="https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/react/react.png" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="react logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">React</p>
<p class="f5 text-gray text-center mb-0 mt-1">React (also known as React.js or ReactJS) is a JavaScript library that makes developing interactive user interfaces simple.</p>
</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/topics/sql" class="no-underline d-flex flex-column flex-justify-center" data-ga-click="Topics, go to sql, location:boxes">
<img src="https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/react/react.png" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="react logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">React</p>
<p class="f5 text-gray text-center mb-0 mt-1">React (also known as React.js or ReactJS) is a JavaScript library that makes developing interactive user interfaces simple.</p>
</a>
</div>
</div>
</div>
</div>
<h2>My Organizations</h2>
<p class="f4 mb-4 text-gray">Teams I belong to</p>
<div class="d-flex flex-wrap gutter-condensed mb-4">
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="topic-box position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/primer" class="no-underline d-flex flex-column flex-justify-center">
<img src="https://avatars1.githubusercontent.com/u/7143434?s=200&amp;v=4" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="primer logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">
Primer
</p>
<p class="f5 text-gray text-center mb-3 mt-1">Components and behaviors for building things on the Web, from GitHub.</p>
<div class="v-align-middle text-gray">
<svg height="16" class="octicon octicon-location mr-1 v-align-middle" aria-label="location" viewBox="0 0 12 16" version="1.1" width="12" role="img"><path fill-rule="evenodd" d="M6 0C2.69 0 0 2.5 0 5.5 0 10.02 6 16 6 16s6-5.98 6-10.5C12 2.5 9.31 0 6 0zm0 14.55C4.14 12.52 1 8.44 1 5.5 1 3.02 3.25 1 6 1c1.34 0 2.61.48 3.56 1.36.92.86 1.44 1.97 1.44 3.14 0 2.94-3.14 7.02-5 9.05zM8 5.5c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg>
<span>Planet Earth</span>
</div>
<div class="v-align-middle">
<svg height="16" class="octicon octicon-link mr-1 v-align-middle" aria-label="link" viewBox="0 0 16 16" version="1.1" width="16" role="img"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"/></svg>
<p><a href="http://primer.github.io/">primer.github.io</a></p>
</div>
</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="topic-box position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/primer" class="no-underline d-flex flex-column flex-justify-center">
<img src="https://avatars1.githubusercontent.com/u/7143434?s=200&amp;v=4" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="primer logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">
Primer
</p>
<p class="f5 text-gray text-center mb-3 mt-1">Components and behaviors for building things on the Web, from GitHub.</p>
<div class="v-align-middle text-gray">
<svg height="16" class="octicon octicon-location octicon octicon-location mr-1 v-align-middle" aria-label="location" viewBox="0 0 12 16" version="1.1" width="12" role="img"><path fill-rule="evenodd" d="M6 0C2.69 0 0 2.5 0 5.5 0 10.02 6 16 6 16s6-5.98 6-10.5C12 2.5 9.31 0 6 0zm0 14.55C4.14 12.52 1 8.44 1 5.5 1 3.02 3.25 1 6 1c1.34 0 2.61.48 3.56 1.36.92.86 1.44 1.97 1.44 3.14 0 2.94-3.14 7.02-5 9.05zM8 5.5c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg>
<span>Planet Earth</span>
</div>
<div class="v-align-middle">
<svg height="16" class="octicon octicon-link octicon octicon-link mr-1 v-align-middle" aria-label="link" viewBox="0 0 16 16" version="1.1" width="16" role="img"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"/></svg>
<p><a href="http://primer.github.io/">primer.github.io</a></p>
</div>
</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-12 col-lg-6 col-xl-4 mb-3">
<div class="github-component">
<div class="topic-box position-relative hover-grow height-full text-center border border-gray-light rounded-1 bg-white p-5">
<a href="/primer" class="no-underline d-flex flex-column flex-justify-center">
<img src="https://avatars1.githubusercontent.com/u/7143434?s=200&amp;v=4" width="64" height="64" class="mx-auto rounded-1 mb-3" alt="primer logo">
<p class="f3 lh-condensed text-center link-gray-dark mb-0 mt-1">
Primer
</p>
<p class="f5 text-gray text-center mb-3 mt-1">Components and behaviors for building things on the Web, from GitHub.</p>
<div class="v-align-middle text-gray">
<svg height="16" class="octicon octicon-location octicon octicon-location octicon octicon-location mr-1 v-align-middle" aria-label="location" viewBox="0 0 12 16" version="1.1" width="12" role="img"><path fill-rule="evenodd" d="M6 0C2.69 0 0 2.5 0 5.5 0 10.02 6 16 6 16s6-5.98 6-10.5C12 2.5 9.31 0 6 0zm0 14.55C4.14 12.52 1 8.44 1 5.5 1 3.02 3.25 1 6 1c1.34 0 2.61.48 3.56 1.36.92.86 1.44 1.97 1.44 3.14 0 2.94-3.14 7.02-5 9.05zM8 5.5c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg>
<span>Planet Earth</span>
</div>
<div class="v-align-middle">
<svg height="16" class="octicon octicon-link octicon octicon-link octicon octicon-link mr-1 v-align-middle" aria-label="link" viewBox="0 0 16 16" version="1.1" width="16" role="img"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"/></svg>
<p><a href="http://primer.github.io/">primer.github.io</a></p>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View file

@ -12,7 +12,7 @@
<div class="container-lg py-6 p-responsive text-center">
<img src="https://avatars0.githubusercontent.com/u/334891?v=4" class="circle mb-3" style="max-width: 150px;">
<h1 class="mb-2">primer</h1>
<h1 class="mb-2 lh-condensed">primer</h1>
<p class="col-lg-8 mx-auto mb-3 f3 text-gray">
Hi! I'm Ben. I love two things: bridges and smiling. I'm an aspiring developer who is learning how to use GitHub to build the stuff I wish existed. I'm looking to meet other developers who can help to contribute to the projects I have started.
</p>

View file

@ -5,5 +5,9 @@
@import url('https://fonts.googleapis.com/css?family=Rubik:400,500,700,900');
body {
font-family: 'Rubik', sans-serif;
//font-family: 'Rubik', sans-serif;
}
.github-component {
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
}