Skip to content

Commit ca1d449

Browse files
lukesneeringertimburks
authored andcommitted
[chore] Make this look like Google documentation. (#18)
* [chore] Set up for local development. * [chore] Try to conform to standards.google.
1 parent 7b22d22 commit ca1d449

File tree

6 files changed

+354
-2
lines changed

6 files changed

+354
-2
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Google APIs
1+
## Google APIs
22

33
The [googleapis](https://github.com/googleapis) organization hosts tools,
44
technical articles, and issues related to Google API design and practice.

_config.yml

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
1-
theme: jekyll-theme-primer
1+
---
2+
markdown: kramdown
3+
url: https://github.com/googleapis/googleapis.github.io

_includes/svgs.html

Lines changed: 124 additions & 0 deletions
Large diffs are not rendered by default.

_includes/toc.html

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
{% comment %}
2+
Taken from https://github.com/allejo/jekyll-toc
3+
Original file is Copyright © 2017, Vladimir Jimenez
4+
(Dual-licensed BSD / MIT)
5+
{% endcomment %}
6+
{% capture tocWorkspace %}
7+
{% comment %}
8+
Version 1.0.6
9+
https://github.com/allejo/jekyll-toc
10+
11+
"...like all things liquid - where there's a will, and ~36 hours to spare, there's usually a/some way" ~jaybe
12+
13+
Usage:
14+
{% include toc.html html=content sanitize=true class="inline_toc" id="my_toc" h_min=2 h_max=3 %}
15+
16+
Parameters:
17+
* html (string) - the HTML of compiled markdown generated by kramdown in Jekyll
18+
19+
Optional Parameters:
20+
* sanitize (bool) : false - when set to true, the headers will be stripped of any HTML in the TOC
21+
* class (string) : '' - a CSS class assigned to the TOC
22+
* id (string) : '' - an ID to assigned to the TOC
23+
* h_min (int) : 1 - the minimum TOC header level to use; any header lower than this value will be ignored
24+
* h_max (int) : 6 - the maximum TOC header level to use; any header greater than this value will be ignored
25+
* ordered (bool) : false - when set to true, an ordered list will be outputted instead of an unordered list
26+
* item_class (string) : '' - add custom class(es) for each list item; has support for '%level%' placeholder, which is the current heading level
27+
* baseurl (string) : '' - add a base url to the TOC links for when your TOC is on another page than the actual content
28+
* anchor_class (string) : '' - add custom class(es) for each anchor element
29+
30+
Output:
31+
An ordered or unordered list representing the table of contents of a markdown block. This snippet will only
32+
generate the table of contents and will NOT output the markdown given to it
33+
{% endcomment %}
34+
35+
{% capture my_toc %}{% endcapture %}
36+
{% assign orderedList = include.ordered | default: false %}
37+
{% assign minHeader = include.h_min | default: 1 %}
38+
{% assign maxHeader = include.h_max | default: 6 %}
39+
{% assign nodes = include.html | split: '<h' %}
40+
{% assign firstHeader = true %}
41+
{% capture listModifier %}{% if orderedList %}1.{% else %}-{% endif %}{% endcapture %}
42+
{% for node in nodes %}
43+
{% if node == "" %}
44+
{% continue %}
45+
{% endif %}
46+
{% assign headerLevel = node | replace: '"', '' | slice: 0, 1 | times: 1 %}
47+
{% if headerLevel < minHeader or headerLevel > maxHeader %}
48+
{% continue %}
49+
{% endif %}
50+
{% if firstHeader %}
51+
{% assign firstHeader = false %}
52+
{% assign minHeader = headerLevel %}
53+
{% endif %}
54+
{% assign indentAmount = headerLevel | minus: minHeader | add: 1 %}
55+
{% assign _workspace = node | split: '</h' %}
56+
{% assign _idWorkspace = _workspace[0] | split: 'id="' %}
57+
{% assign _idWorkspace = _idWorkspace[1] | split: '"' %}
58+
{% assign html_id = _idWorkspace[0] %}
59+
{% capture _hAttrToStrip %}{{ _workspace[0] | split: '>' | first }}>{% endcapture %}
60+
{% assign header = _workspace[0] | replace: _hAttrToStrip, '' %}
61+
{% assign space = '' %}
62+
{% for i in (1..indentAmount) %}
63+
{% assign space = space | prepend: ' ' %}
64+
{% endfor %}
65+
{% unless include.item_class == blank %}
66+
{% capture listItemClass %}{:.{{ include.item_class | replace: '%level%', headerLevel }}}{% endcapture %}
67+
{% endunless %}
68+
{% capture my_toc %}{{ my_toc }}
69+
{{ space }}{{ listModifier }} {{ listItemClass }} [{% if include.sanitize %}{{ header | strip_html }}{% else %}{{ header }}{% endif %}]({% if include.baseurl %}{{ include.baseurl }}{% endif %}#{{ html_id }}){% if include.anchor_class %}{:.{{ include.anchor_class }}}{% endif %}{% endcapture %}
70+
{% endfor %}
71+
{% if include.class %}
72+
{% capture my_toc %}{:.{{ include.class }}}
73+
{{ my_toc | lstrip }}{% endcapture %}
74+
{% endif %}
75+
{% if include.id %}
76+
{% capture my_toc %}{: #{{ include.id }}}
77+
{{ my_toc | lstrip }}{% endcapture %}
78+
{% endif %}
79+
{% endcapture %}{% assign tocWorkspace = '' %}{{ my_toc | markdownify | strip }}

_layouts/default.html

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
<!DOCTYPE html>
2+
<html lang="{{ site.lang | default: 'en-US' }}" class="glue-flexbox">
3+
<head>
4+
<meta charset='utf-8'>
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width,maximum-scale=2">
7+
<link href="//fonts.googleapis.com/css?family=Roboto:100,300,400,500,700|Google+Sans:400,500|Product+Sans:400&amp;lang=en" rel="stylesheet"></link>
8+
<link rel="stylesheet" type="text/css" media="screen" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
9+
<script src="//www.gstatic.com/glue/latest/glue-detect.min.js"></script>
10+
{% seo %}
11+
</head>
12+
<body class="h-c-page">
13+
{% include svgs.html %}
14+
<div class="hercules-header h-c-header h-c-header--product-marketing-one-tier">
15+
<div class="h-c-header__bar">
16+
<div class="h-c-header__hamburger h-c-header__hamburger--first-tier">
17+
<div class="h-c-header__hamburger-wrapper">
18+
<button type="button"
19+
data-g-event="home"
20+
data-g-action="mobile: open global nav"
21+
data-g-label="global nav"
22+
class="h-js-header__hamburger-link h-c-header__hamburger-link"
23+
aria-controls="h-js-header__drawer"
24+
aria-expanded="false"
25+
aria-label="Open the navigation drawer">
26+
<svg role="img" class="h-c-header__hamburger-img
27+
h-c-header__hamburger-img--standard">
28+
<use xlink:href="#h-burger"></use>
29+
</svg>
30+
31+
<svg role="img" class="h-c-header__hamburger-img
32+
h-c-header__hamburger-img--reversed">
33+
<use xlink:href="#h-burger"></use>
34+
</svg>
35+
</button>
36+
</div>
37+
</div>
38+
39+
<div class="h-c-header__lockup">
40+
<div class="h-c-header__company-logo">
41+
<a data-g-event="home"
42+
data-g-action="logo"
43+
data-g-label="global nav"
44+
href="/"
45+
class="h-c-header__company-logo-link" title="Google">
46+
<svg role="img" class="h-c-header__company-logo-img
47+
h-c-header__company-logo-img--standard">
48+
<use xlink:href="#h-color-google-logo"></use>
49+
</svg>
50+
51+
<svg role="img" class="h-c-header__company-logo-img
52+
h-c-header__company-logo-img--reversed">
53+
<use xlink:href="#h-white-google-logo"></use>
54+
</svg>
55+
</a>
56+
</div>
57+
58+
<div class="h-c-header__product-logo">
59+
<a data-g-event="home"
60+
data-g-action="logo"
61+
data-g-label="global nav"
62+
href="/"
63+
class="h-c-header__product-logo-link">
64+
<span class="h-c-header__product-logo-text gmp-logo-text">APIs</span>
65+
</a>
66+
</div>
67+
<a href="#jump-content" class="h-c-header__jump-to-content"
68+
data-glue-jump-link="#jump-content" data-cached-tabindex="auto"
69+
tabindex="-1">
70+
<span class="h-c-header__jump-to-content-text">Skip to Content</span>
71+
</a>
72+
</div>
73+
74+
<div class="h-c-header__hamburger h-c-header__hamburger--second-tier">
75+
<div class="h-c-header__hamburger-wrapper">
76+
<button type="button" class="h-js-header__hamburger-link h-c-header__hamburger-link"
77+
aria-controls="h-js-header__drawer" aria-expanded="false"
78+
aria-label="Open the navigation drawer" tabindex="-1">
79+
<svg role="img" class="h-c-header__hamburger-img h-c-header__hamburger-img--standard">
80+
<use xlink:href="#h-burger"></use>
81+
</svg>
82+
<svg role="img" class="h-c-header__hamburger-img h-c-header__hamburger-img--reversed">
83+
<use xlink:href="#h-burger"></use>
84+
</svg>
85+
</button>
86+
</div>
87+
</div>
88+
89+
<nav class="h-c-header__nav">
90+
<ul class="h-c-header__nav-list">
91+
<li class="h-c-header__nav-li" aria-level="1">
92+
<a href="/" class="h-c-header__nav-li-link" tabindex="-1">Home</a>
93+
</li>
94+
<!--
95+
<li class="h-c-header__nav-li" aria-level="1">
96+
<a href="/usage/" class="h-c-header__nav-li-link" tabindex="-1">Usage</a>
97+
</li>
98+
-->
99+
</ul>
100+
</nav>
101+
</div>
102+
</div>
103+
104+
<div class="h-c-grid">
105+
<div class="h-c-grid__col h-c-grid__col--9" role="main" id="jump-content">
106+
{{ content }}
107+
</div>
108+
<div class="h-c-grid__col h-c-grid__col--3" style="margin-top: 40px;">
109+
{% include toc.html html=content %}
110+
</div>
111+
</div>
112+
</div>
113+
114+
<!-- Closing scripts -->
115+
<script src="https://www.gstatic.com/external_hosted/hammerjs/v2_0_2/hammer.min.js"></script>
116+
<script src="//www.gstatic.com/glue/v18_0/glue-vanilla.min.js"></script>
117+
<script src="//www.gstatic.com/glue/v18_0/hercules.min.js"></script>
118+
</body>
119+
</html>

assets/css/style.scss

Lines changed: 28 additions & 0 deletions
Large diffs are not rendered by default.

0 commit comments

Comments
 (0)