dan/api_docs
1
0
Fork 0
mirror of https://github.com/danbulant/api_docs synced 2026-05-19 04:08:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add table of contents footer links feature

Browse source 
Now you can add links to the bottom of your table of contents!
Documentation has also been changed to reflect this new
feature.

Please note that if you have a custom variables.scss, you'll have
to merge in this line:

    $nav-footer-border-color: #666;
This commit is contained in:
Robert Lord 2013-10-21 14:04:05 -07:00
parent 81b9110cad
commit dc33dfe0a7
5 changed files with 53 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
README.md
View file

@ -125,6 +125,19 @@ Done! Language renamed. You can keep all your codeblocks for shell, but it'll lo
Just replace `source/images/logo.png` with your logo.
### How do I change the links that appear below the Table of Contents?
Just edit, at the top of `index.md`,
toc_footers:
- <a href='#'>Sign Up for a Developer Key</a>
- <a href='http://github.com/tripit/slate'>Documentation Powered by Slate</a>
Add more lines or remove lines as needed. Just make sure they start with the dash. If you don't want any footer links at all, just remove `toc_footers` altogether, and the link section should just disappear.
Feel free to remove the "Documentation Powered by Slate" if you'd like, although we appreciate having that there since it helps more people discover Slate!
### How do I get my code samples to line up with the content I want them next to?
Try putting code blocks and annotations right after headers. See the default `source/index.md` for an example, or file an issue if you're having trouble.

5
source/index.md
View file

@ -1,9 +1,14 @@
---
title: API Reference
language_tabs:
- shell
- ruby
- python
toc_footers:
- <a href='#'>Sign Up for a Developer Key</a>
- <a href='http://github.com/tripit/slate'>Documentation Powered by Slate</a>
---
# Introduction

12
source/layouts/layout.erb
View file

@ -62,9 +62,17 @@ under the License.
</head>
<body class="<%= page_classes %>">
<div id="toc">
<div class="tocify-wrapper">
<%= image_tag "logo.png" %>
<!-- table of contents will be inserted here -->
<div id="toc">
</div>
<% if current_page.data.toc_footers %>
<ul class="toc-footer">
<% current_page.data.toc_footers.each do |footer| %>
<li><%= footer %></li>
<% end %>
</ul>
<% end %>
</div>
<div class="page-wrapper">
<div class="content">

26
source/stylesheets/all.css.scss
View file

@ -36,7 +36,7 @@ html, body {
// TABLE OF CONTENTS
////////////////////////////////////////////////////////////////////////////////
.tocify {
.tocify-wrapper {
overflow-y: auto;
overflow-x: hidden;
position: fixed;
@ -54,7 +54,7 @@ html, body {
margin-bottom: $logo-margin;
}
.tocify-item>a {
.tocify-item>a, .toc-footer li {
padding: 0 $nav-padding 0 $nav-padding;
display:block;
overflow-x:hidden;
@ -114,6 +114,28 @@ html, body {
box-shadow: none; // otherwise it'll overflow out of the subheader
}
}
.toc-footer {
padding: 1em 0;
margin-top: 1em;
border-top: 1px dashed $nav-footer-border-color;
li,a {
color: $nav-text;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
li {
font-size: 0.8em;
line-height: 1.7;
text-decoration: none;
}
}
}

1
source/stylesheets/variables.scss
View file

@ -79,6 +79,7 @@ $h1-margin-bottom: 21px; // padding under the largest header tags
// OTHER
////////////////////
$nav-active-shadow: #000;
$nav-footer-border-color: #666;
$nav-embossed-border-top: 1px solid #000;
$nav-embossed-border-bottom: 1px solid #404040;
$main-embossed-text-shadow: 0px 1px 0px #fff;