mirror of
https://github.com/zhigang1992/probot.github.io.git
synced 2026-01-12 17:33:05 +08:00
tweaks
This commit is contained in:
Brandon Keepers
8
Gemfile
8
Gemfile
@@ -1,11 +1,11 @@
|
||||
source 'https://rubygems.org'
|
||||
|
||||
require 'json'
|
||||
require 'open-uri'
|
||||
versions = JSON.parse(open('https://pages.github.com/versions.json').read)
|
||||
# require 'json'
|
||||
# require 'open-uri'
|
||||
# versions = JSON.parse(open('https://pages.github.com/versions.json').read)
|
||||
|
||||
group :jekyll_plugins do
|
||||
gem 'github-pages', versions['github-pages']
|
||||
gem 'github-pages' #, versions['github-pages']
|
||||
gem 'jekyll-octicons'
|
||||
gem 'jekyll-livereload'
|
||||
end
|
||||
|
||||
@@ -163,7 +163,6 @@ GEM
|
||||
gemoji (~> 3.0)
|
||||
html-pipeline (~> 2.2)
|
||||
jekyll (>= 3.0)
|
||||
json (2.0.3)
|
||||
kramdown (1.13.2)
|
||||
liquid (3.0.6)
|
||||
listen (3.0.6)
|
||||
@@ -207,10 +206,9 @@ PLATFORMS
|
||||
ruby
|
||||
|
||||
DEPENDENCIES
|
||||
github-pages (= 140)
|
||||
github-pages
|
||||
jekyll-livereload
|
||||
jekyll-octicons
|
||||
json
|
||||
rb-fsevent (= 0.9.8)
|
||||
|
||||
BUNDLED WITH
|
||||
|
||||
@@ -4,58 +4,53 @@ layout: default
|
||||
|
||||
{% include nav.html %}
|
||||
|
||||
<div class="border-bottom">
|
||||
<div class="">
|
||||
<div class="container-lg px-3 jumbotron jumbotron-minitron">
|
||||
<div class="d-flex d-flex-row gutter-spacious flex-items-center">
|
||||
<div class="flex-column col-3 text-center">
|
||||
<div class="cover rounded-2"
|
||||
style="background-image: url({{ page.background }}); background-size: cover; background-position: center;"></div>
|
||||
</div>
|
||||
<div class="flex-column col-7">
|
||||
<div class="flex-column col-9">
|
||||
<h1 class="alt-h1 lh-condensed-ultra">{{ page.title }}</h1>
|
||||
<p class="text-gray">{{ page.description }}</p>
|
||||
<p class="text-gray-light">{{ page.description }}</p>
|
||||
<div class="text-gray-light">
|
||||
<div class="d-inline mr-3 tooltipped tooltipped-s" aria-label="{{ page.installs }} installations">{% octicon cloud-download width:14 class:"v-align-middle" %} <span class="">{{ page.installs }}</span></div>
|
||||
<div class="d-inline mr-3 tooltipped tooltipped-s" aria-label="{{ page.stars }} stars">{% octicon star heigh:16 class:"v-align-middle" %} <span class="">{{ page.stars }}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-column col-2 text-right">
|
||||
<a class="btn btn-primary btn-large" href="https://github.com/apps/{{ page.slug }}/installations/new">Install</a>
|
||||
<div class="flex-column col-3 text-center">
|
||||
<a class="d-block btn btn-primary btn-large" href="https://github.com/apps/{{ page.slug }}/installations/new">Install</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
<div class="bg-gray-dark text-white">
|
||||
<div class="container-lg px-3 py-6">
|
||||
<div class="d-flex flex-row-reverse d-flex-row gutter-spacious">
|
||||
<div class="d-flex flex-row d-flex-row gutter-spacious">
|
||||
<div class="flex-coumn col-9">
|
||||
<div class="mb-6 bg-white">
|
||||
<div class="d-flex flex-items-center flex-justify-center">
|
||||
<div class="">
|
||||
<div class="d-flex flex-items-center flex-justify-center rounded-1 bg-white overflow-hidden p-3">
|
||||
{% for screenshot in page.screenshots limit:1 %}
|
||||
<img src="{{ screenshot }}" style="max-width:100%; max-height:100%;">
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if page.screenshots.size > 1 %}
|
||||
<div class="d-flex flex-items-center flex-justify-center p-2">
|
||||
{% for screenshot in page.screenshots %}
|
||||
<div class="rounded border mx-1" style="width:125px; height: 70px; background-image: url({{ screenshot }}); background-size: cover; background-position: center;">
|
||||
<div class="rounded-1 border border-gray-light mx-1" style="width:125px; height: 70px; background-image: url({{ screenshot }}); background-size: cover; background-position: center;">
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-column col-3">
|
||||
<h4 class="alt-h4 text-gray">Topics</h4>
|
||||
{% for topic in page.topics %}
|
||||
<a class="bg-blue-light rounded-2 px-2 py-1" href="#">#{{ topic }}</a>
|
||||
<a class="text-inherit" href="#">#{{ topic }}</a>
|
||||
{% endfor %}
|
||||
|
||||
<h4 class="mt-4 alt-h4 text-gray">About</h4>
|
||||
|
||||
<p>
|
||||
<span class="text-gray-light">Author:</span>
|
||||
<img class="avatar" src="https://github.com/{{ page.author }}.png" height="26">
|
||||
<span class="text-bold text-inherit">@{{ page.author }}</span>
|
||||
</p>
|
||||
<p><span class="text-gray-light">Updated:</span> June 12, 2017</p>
|
||||
<p><strong>{{ page.installs | default: 0 }}</strong> <span class="text-gray-light">installs</span></p>
|
||||
<p><strong>{{ page.stars | default: 0 }}</strong> <span class="text-gray-light">stars</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -63,7 +58,7 @@ layout: default
|
||||
|
||||
<div class="py-6">
|
||||
<div class="container-lg px-3">
|
||||
<div class="d-flex flex-row-reverse d-flex-row gutter-spacious">
|
||||
<div class="d-flex flex-row gutter-spacious">
|
||||
<div class="flex-coumn col-9">
|
||||
<div class="markdown-body">
|
||||
{{ content }}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
title: Certificate of Origin
|
||||
title: Developer Certificate of Origin
|
||||
description: Enforce the DCO on Pull Requests
|
||||
slug: dco
|
||||
octicon: law
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
$brand: (red, #EF4136),
|
||||
(blue, #00B0D8),
|
||||
(blue-dark, darken(#00B0D8, 25%)),
|
||||
(blue-dark, darken(#00B0D8, 10%)),
|
||||
(blue-light, lighten(#AFDFE4, 15%)),
|
||||
(orange, #FCBA63);
|
||||
|
||||
|
||||
@@ -25,8 +25,9 @@ img {
|
||||
|
||||
.octicon {
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
vertical-align: middle;
|
||||
fill: currentColor;
|
||||
|
||||
}
|
||||
|
||||
.cover {
|
||||
@@ -78,3 +79,21 @@ code {
|
||||
border-color: transparent;
|
||||
border-style: solid solid outset;
|
||||
}
|
||||
|
||||
.markdown-body {
|
||||
h1 { @include alt-h1; }
|
||||
h2 { @include alt-h2; }
|
||||
h3 { @include alt-h3; }
|
||||
|
||||
h1, h2, h3 {
|
||||
margin-top: $spacer-6;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
color: $text-gray;
|
||||
}
|
||||
}
|
||||
|
||||
135
index.html
135
index.html
@@ -1,39 +1,45 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
<div class="bg-gray-dark text-white border-bottom">
|
||||
<div class="container-lg px-3">
|
||||
<div class="py-4 clearfix">
|
||||
<div class="">
|
||||
<div class="">
|
||||
<div class="container-lg py-4 clearfix">
|
||||
<nav class="text-bold d-block float-right">
|
||||
<a class="text-inherit px-2 d-inline-block" href="/#explore">Explore</a>
|
||||
<a class="text-inherit px-2 d-inline-block" href="/docs/">Build</a>
|
||||
<a class="text-inherit px-2 d-inline-block" href="https://github.com/probot/probot">Contribute</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-lg px-3">
|
||||
<header class="py-6">
|
||||
<div class="pb-0 pt-md-4 py-lg-6">
|
||||
<div class="d-flex flex-items-center flex-justify-center">
|
||||
<div class="col-3 text-right p-4">
|
||||
<div class="d-flex flex-items-center flex-justify-center gutter-spacious">
|
||||
<div class="col-3 offset-1 text-right">
|
||||
<img src="/assets/logo.png">
|
||||
</div>
|
||||
<div class="flex-column col-9">
|
||||
<h1 class="alt-h2 text-uppercase lh-condensed text-gray">Probot</h1>
|
||||
<h2 class="alt-h1 lh-condensed">
|
||||
Why should a human<br>
|
||||
do the work of a robot?
|
||||
<div class="flex-column col-8">
|
||||
<h1 class="alt-h2 text-uppercase lh-condensed text-brand-blue">Probot</h1>
|
||||
<h2 class="alt-h2 lh-condensed">
|
||||
GitHub Apps to automate <br>and improve your workflow
|
||||
</h2>
|
||||
<div class="alt-lead text-gray">GitHub Apps to automate and improve your workflow</div>
|
||||
<p class="alt-lead text-gray-light mt-4 lh-condensed" style="opacity: 0.6">
|
||||
Use one of the pre-built open source apps that extend GitHub, or easily build and share your own.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
</div>
|
||||
<div id="explore">
|
||||
<div class="container-lg px-3 featurette">
|
||||
<h2 class="alt-h2 text-center">Explore</h2>
|
||||
<p class="lead text-center col-md-8 col-sm-10 mx-auto">Replace this with a pitch about all the awesome apps built by the community that you can just use.</p>
|
||||
|
||||
<div id="explore" class="bg-gray-light border-top">
|
||||
<div class="container-lg px-3 page-section">
|
||||
<h2 class="alt-h1 text-center">Discover</h2>
|
||||
<p class="lead text-center col-md-8 col-sm-10 mx-auto">
|
||||
Check out these apps built by the community that extend your project on GitHub. They're all open source and free to use on any project.
|
||||
</p>
|
||||
|
||||
<div class="d-md-flex flex-wrap gutter flex-auto">
|
||||
{% for plugin in site.plugins limit:6 %}
|
||||
@@ -56,25 +62,41 @@ layout: default
|
||||
</div>
|
||||
|
||||
<div class="text-center my-6">
|
||||
<h3 class="alt-h2">By the community, for the community</h3>
|
||||
<p class="lead mx-auto col-md-8">Find a bunch of really cool plugins built by other people in the community, just for you.</p>
|
||||
<a class="btn btn-outline">Explore more plugins</a>
|
||||
<p class="lead mx-auto col-md-8">
|
||||
Discover dozens of apps that extend GitHub and improve your workflow.
|
||||
</p>
|
||||
<a class="btn btn-outline btn-large">
|
||||
{% octicon telescope class:"mr-2" %}
|
||||
Explore more apps
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="build" class="border-top bg-gray-light featurette">
|
||||
<div id="build" class="border-top page-section">
|
||||
<div class="container-lg px-3">
|
||||
<h2 class="alt-h1 text-center">Build your own bot</h2>
|
||||
<p class="alt-lead text-center mb-6">Something about how easy it is to get started.</p>
|
||||
<h2 class="alt-h1 text-center lh-condensed">Build your own app</h2>
|
||||
<p class="alt-lead text-center mb-6">Apps are easy to write and share.</p>
|
||||
|
||||
<div class="mt-6">
|
||||
<div class="d-flex flex-column flex-md-row flex-items-center flex-md-items-center my-4">
|
||||
<div class="col-6 d-flex flex-column pr-6">
|
||||
<h3 class="alt-h3 mb-2">Easily scriptable:</h3>
|
||||
<p class="">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
<div class="page-section d-flex flex-column flex-md-row gutter flex-items-center flex-md-items-center">
|
||||
<div class="col-6 d-flex flex-column">
|
||||
<img src="https://assets-cdn.github.com/images/modules/site/home-illo-business.svg" class="d-block width-fit mx-auto mb-4">
|
||||
</div>
|
||||
<div class="col-6 text-center">
|
||||
<h3 class="alt-h3 mb-2">Optimized for GitHub</h3>
|
||||
<p class="">
|
||||
Receive webhooks and use the authenticated client to access the GitHub API. Granular permissions give each app access to the data it needs and nothing more.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-section">
|
||||
<div class="d-flex flex-md-row gutter flex-items-center flex-md-items-center">
|
||||
<div class="col-6 text-center">
|
||||
<h3 class="alt-h3 mb-2">Easily scriptable</h3>
|
||||
<p class="">Focus on what you want to build. A simple API—built on the latest ES6 JavaScript features—hides the details you don't care about.</p>
|
||||
</div>
|
||||
<div class="col-6 d-flex flex-column">
|
||||
<div class="col-6">
|
||||
<div class="rounded-2 overflow-hidden border" style="margin-left: 60px;">
|
||||
{% highlight javascript %}
|
||||
module.exports = robot => {
|
||||
@@ -87,42 +109,41 @@ module.exports = robot => {
|
||||
};
|
||||
{% endhighlight %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-6">
|
||||
<img src="https://github.com/probot.png" height="44" class="avatar rounded-1 float-left">
|
||||
<div class="timeline-comment box rounded-2 border bg-white" style="margin-left: 60px;">
|
||||
<div class="bg-gray px-3 py-2 border-bottom">
|
||||
<strong>@probot</strong> commented
|
||||
</div>
|
||||
<p class="m-0 p-3">Hello World!</p>
|
||||
<div class="d-flex flex-md-row gutter mt-4">
|
||||
<div class="col-6 text-center">
|
||||
<h2 class="alt-h3 mb-2"></h2>
|
||||
<p>Apps are first class actors within GitHub.</p>
|
||||
</div>
|
||||
|
||||
<div class="col-6">
|
||||
<img src="https://github.com/probot.png" height="44" width="44" class="avatar rounded-1 float-left">
|
||||
<div class="timeline-comment box rounded-2 border bg-white" style="margin-left: 60px;">
|
||||
<div class="bg-gray px-3 py-2 border-bottom">
|
||||
<strong>@probot</strong> commented
|
||||
</div>
|
||||
<p class="m-0 p-3">Hello World!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-6">
|
||||
<div class="d-flex flex-column flex-md-row flex-items-center flex-md-items-center my-4">
|
||||
<div class="col-6 d-flex flex-column pr-6">
|
||||
<img src="https://assets-cdn.github.com/images/modules/site/home-illo-business.svg" class="d-block width-fit mx-auto mb-4">
|
||||
</div>
|
||||
<div class="col-6 d-flex flex-column pr-6">
|
||||
<h3 class="alt-h3 mb-2">Full access to the GitHub API</h3>
|
||||
<p class="">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<h3>Somethign cool about it</h3>
|
||||
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
|
||||
|
||||
<h3>Somethign cool about it</h3>
|
||||
<p> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
|
||||
|
||||
<h3>Somethign cool about it</h3>
|
||||
<p> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum..</p>
|
||||
<div class="page-section d-md-flex flex-md-row flex-items-center flex-md-items-center flex-md-row-reverse">
|
||||
<div class="col-6 d-flex flex-column pr-6 text-center">
|
||||
<h3 class="alt-h3 mb-2">Serverless deployment</h3>
|
||||
<p>Use one of the hosted apps on any of your GitHub accounts, and deploy your custom apps in minutes.</p>
|
||||
<p class="mt-3">
|
||||
<a class="btn btn-outline btn-large" href="">
|
||||
{% octicon cloud-upload class:"mr-1" %}
|
||||
Deploy Your App
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-6 d-flex flex-column pr-6">
|
||||
<img src="https://assets-cdn.github.com/images/modules/site/home-illo-business.svg" class="d-block width-fit mx-auto mb-4">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-dark mt-6 pt-6" style="height: 300px;">
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user