Skip to content

Improve table, pre, and code in Outlines and Cheat Sheets#17

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jordanmccullough merged 10 commits into from
Jan 12, 2014
Merged

Improve table, pre, and code in Outlines and Cheat Sheets #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
901fe04
Add table and code block styling
Jan 11, 2014
731fcb0
Correct nav link and `li` styling
Jan 12, 2014
21dd297
Rearrange sub-page nav style for Outline page
Jan 12, 2014
b814bdc
Add update Home style tweaks artifact
Jan 12, 2014
49fc4bf
Add update default style tweaks artifact
Jan 12, 2014
3a44b86
Remove custom sizing to `pre` and `blockquote` for improved responsiv…
Jan 12, 2014
76bea2b
Add css artifacts from updated SCSS
Jan 12, 2014
2a26157
Update Cheatsheet layout with first draft
Jan 12, 2014
c93a052
Switch Octicon representation for Outlines vs. Cheatsheets
Jan 12, 2014
3705b95
Cleanup selectors, Simplify repeat attributes, Revise previously unst…
Jan 12, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion _layouts/bare.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -31,7 +31,11 @@
{% if page.path != "index.html" %}
<header>
<div class="container">
<nav><a href="https://training.github.com">Join an Event</nav>
<nav>
<ul>
<li><a class="button" href="https://training.github.com">Join an Event</a></li>
</ul>
</nav>
<a href="../">
<div class="logo-group">
<div class="logo">
Expand Down
40 changes: 15 additions & 25 deletions _layouts/cheatsheet.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<title>{% if page.title %}{{page.title }} •{% endif %}{{site.title }}</title>
{% if page.description %}
<meta name="description" content="{{page.description }}" />
{% endif %}
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
---
layout: bare
theme: outline
---

<link rel="stylesheet" media="screen" href="/_stylesheets/cheatsheet.css" type="text/css" />
<section class="hero">
<div class="container">
<span class="octicon octicon-file-text"></span><h1>{{page.title }}</h1>
</div>
</section>
<section>
<div class="container">
{{content }}
</div>
</section>

{% include analytics.html %}
</head>
<body>
<div class="top">
<header>
<div class="logo"><a href ="/">GitHub Training</a></div>
<a href="https://github.com/github/training-materials" class="mini-button"><span>R</span>Source on GitHub</a>
</header>
</div>

<div id="content-wrapper">
<h1>{{page.title }}</h1>
{{content }}
</div>
</body>
</html>
{% include footer.html %}
2 changes: 1 addition & 1 deletion _layouts/outline.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -5,7 +5,7 @@

<section class="hero">
<div class="container">
<span class="octicon octicon-file-text"></span><h1>{{page.title }}</h1>
<span class="octicon octicon-book"></span><h1>{{page.title }}</h1>
</div>
</section>
<section>
Expand Down
70 changes: 58 additions & 12 deletions _stylesheets/core.css
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -5,32 +5,51 @@ h1{

h2{
font-size: 200%;
line-height: 150%}
line-height: 150%;
border-top: solid 1px #e5e5e5;
padding: 10px 0;
margin: 20px 0 0 0;
color: #222}

h2 + p{
font-size: 125%;
font-weight: 200;
text-rendering: optimizeLegibility;
line-height: 150%;
opacity: .65;
margin: auto auto}
margin: auto auto 20px auto}

h3{
margin-top: 24px}
font-size: 125%;
margin: 20px 0 0 0;
color: #222}

p{
text-rendering: optimizeLegibility;
line-height: 150%;
opacity: .7}
line-height: 150%}

header{
background: #fff;
color: #ddd;
padding: 15px}
header a{
color: #d9d9d9}
header a:hover{
color: #d9d9d9}
header a:hover .logo{
margin-top: -32px;
opacity: 0}
header nav{
float: right;
font-size: 14px;
line-height: 26px}
header nav ul li{
display: inline-block;
margin-left: 10px}
header nav .button{
padding: 8px;
border: solid 1px #eee;
border-radius: 5px}
header .octicon{
font-size: 26px}
header .logo-training-materials{
Expand All@@ -45,18 +64,45 @@ header{
width: 178px;
display: block;
opacity: .15}
header a{
color: #d9d9d9}
header a:hover{
color: #d9d9d9}
header a:hover .logo{
margin-top: -32px;
opacity: 0}

section{
width: 100%;
float: left}

code{
font-family: "Courier New", Courier, monospace;
color: #63b83e;
border-radius: 3px}

pre{
width: 100%;
background: #222;
line-height: 140%;
margin: 30px 0;
border-radius: 3px}
pre code{
display: block;
padding: 10px}

table{
width: 100%;
background: #eee;
line-height: 140%;
margin: 30px 0;
padding: 20px;
border-radius: 3px;
border-spacing: 0}
table th{
font-size: 18px;
font-weight: 200;
text-align: left;
border-bottom: solid 1px #bfbfbf;
opacity: .5;
padding: 0 0 10px}

ul{
margin: 0 0 0 1.5em}

.container{
width: 830px;
margin: 40px auto auto;
Expand Down
94 changes: 76 additions & 18 deletions _stylesheets/core.scss
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,39 +2,66 @@ h1{
font-size: 46px;
font-weight: 200;
text-rendering: optimizeLegibility;
// text-align: center;
}
h2{
font-size: 200%;
// text-align: center;
line-height: 150%;
border-top: solid 1px #e5e5e5;
padding: 10px 0;
margin: 20px 0 0 0;
color: #222;
}
h2+p{
font-size: 125%;
font-weight: 200;
text-rendering: optimizeLegibility;
// text-align: center;
line-height: 150%;
opacity: .65;
margin: auto auto;
margin: auto auto 20px auto;
}
h3{
margin-top: 24px;
font-size: 125%;
margin: 20px 0 0 0;
color: #222;
}
p{
text-rendering: optimizeLegibility;
line-height: 150%;
opacity: .7;
// opacity: .7;
}
header{
background: #fff;
color: #ddd;
padding: 15px;

a{
color: #d9d9d9;

&:hover{
color: #d9d9d9;
& .logo{
margin-top: -32px;
opacity: 0;
}
}
}
nav{
float: right;
font-size: 14px;
line-height: 26px;

ul{
li{
display: inline-block;
margin-left: 10px;
}
}

.button{
padding: 8px;
border: solid 1px #eee;
border-radius: 5px;
}
}

.octicon{
Expand All@@ -55,24 +82,55 @@ header{
opacity: .15;
}
}
}
section{
width: 100%;
float: left;
}

a{
color: #d9d9d9;

&:hover{
color: #d9d9d9;
code{
font-family: "Courier New", Courier, monospace;
color: #63b83e;
border-radius: 3px;
}
pre{
width: 100%;
background: #222;
line-height: 140%;
margin: 30px 0;
border-radius: 3px;

& .logo{
margin-top: -32px;
opacity: 0;
}
}
code{
display: block;
padding: 10px;
}
}
section{
table{
width: 100%;
float: left;
background: #eee;
line-height: 140%;
margin: 30px 0;
padding: 20px;
border-radius: 3px;
border-spacing:0;

th{
font-size: 18px;
font-weight: 200;
text-align: left;
border-bottom: solid 1px #bfbfbf;
opacity: .5;
padding: 0 0 10px;
}
td{

}
}

ul{
margin: 0 0 0 1.5em
}

.container{
width: 830px;
margin: 40px auto auto;
Expand Down
Loading