diff --git a/source/index.html.md b/source/index.html.md
index fc26b19..8fd3b20 100644
--- a/source/index.html.md
+++ b/source/index.html.md
@@ -187,3 +187,53 @@ Parameter | Description
--------- | -----------
ID | The ID of the kitten to retrieve
+## Delete a Specific Kitten
+
+```ruby
+require 'kittn'
+
+api = Kittn::APIClient.authorize!('meowmeowmeow')
+api.kittens.delete(2)
+```
+
+```python
+import kittn
+
+api = kittn.authorize('meowmeowmeow')
+api.kittens.delete(2)
+```
+
+```shell
+curl "http://example.com/api/kittens/2"
+ -X DELETE
+ -H "Authorization: meowmeowmeow"
+```
+
+```javascript
+const kittn = require('kittn');
+
+let api = kittn.authorize('meowmeowmeow');
+let max = api.kittens.delete(2);
+```
+
+> The above command returns JSON structured like this:
+
+```json
+{
+ "id": 2,
+ "deleted" : ":("
+}
+```
+
+This endpoint retrieves a specific kitten.
+
+### HTTP Request
+
+`DELETE http://example.com/kittens/`
+
+### URL Parameters
+
+Parameter | Description
+--------- | -----------
+ID | The ID of the kitten to delete
+
diff --git a/source/javascripts/app/_toc.js b/source/javascripts/app/_toc.js
index ebd5194..17e785c 100644
--- a/source/javascripts/app/_toc.js
+++ b/source/javascripts/app/_toc.js
@@ -59,9 +59,12 @@
var $best = $toc.find("[href='" + best + "']").first();
if (!$best.hasClass("active")) {
+ // .active is applied to the ToC link we're currently on, and its parent s selected by tocListSelector
+ // .active-expanded is applied to the ToC links that are parents of this one
$toc.find(".active").removeClass("active");
+ $toc.find(".active-parent").removeClass("active-parent");
$best.addClass("active");
- $best.parents(tocListSelector).addClass("active");
+ $best.parents(tocListSelector).addClass("active").siblings(tocLinkSelector).addClass('active-parent');
$best.siblings(tocListSelector).addClass("active");
$toc.find(tocListSelector).filter(":not(.active)").slideUp(150);
$toc.find(tocListSelector).filter(".active").slideDown(150);
diff --git a/source/stylesheets/_variables.scss b/source/stylesheets/_variables.scss
index 6d01b56..3ec2c10 100644
--- a/source/stylesheets/_variables.scss
+++ b/source/stylesheets/_variables.scss
@@ -29,6 +29,7 @@ $code-bg: #292929 !default;
$code-annotation-bg: #1c1c1c !default;
$nav-subitem-bg: #262626 !default;
$nav-active-bg: #0F75D4 !default;
+$nav-active-parent-bg: #262626 !default; // parent links of the current section
$lang-select-border: #000 !default;
$lang-select-bg: #222 !default;
$lang-select-active-bg: $examples-bg !default; // feel free to change this to blue or something
@@ -45,6 +46,7 @@ $search-notice-bg: #c97a7e !default;
$main-text: #333 !default; // main content text color
$nav-text: #fff !default;
$nav-active-text: #fff !default;
+$nav-active-parent-text: #fff !default; // parent links of the current section
$lang-select-text: #fff !default; // color of unselected language tab text
$lang-select-active-text: #fff !default; // color of selected language tab text
$lang-select-pressed-text: #fff !default; // color of language tab text when mouse is pressed
diff --git a/source/stylesheets/screen.css.scss b/source/stylesheets/screen.css.scss
index 02516a4..3965742 100644
--- a/source/stylesheets/screen.css.scss
+++ b/source/stylesheets/screen.css.scss
@@ -159,6 +159,12 @@ html, body {
color: $nav-active-text;
}
+ // this is parent links of the currently selected ToC entry
+ .toc-link.active-parent {
+ background-color: $nav-active-parent-bg;
+ color: $nav-active-parent-text;
+ }
+
.toc-list-h2 {
display: none;
background-color: $nav-subitem-bg;