diff --git a/_includes/2017/pages-list-item.html b/_includes/2017/pages-list-item.html
index 917936c4d..e8c60a8eb 100644
--- a/_includes/2017/pages-list-item.html
+++ b/_includes/2017/pages-list-item.html
@@ -1,13 +1,15 @@
-
- {{ include.page.url | remove: '.html' | remove: '/' }}
+
+ {{ include.page.url | remove: '.html' | remove: '/' }}
- {% if include.page.layout == '2017/sheet' %}
-
- {% endif %}
+ {% if include.page.layout == '2017/sheet' %}
+
+ {% endif %}
- {% if include.page.title | downcase != include.page.url | remove: '.html' | remove: '/' %}
- {{ include.page.title }}
- {% endif %}
+ {% if include.page.title | downcase != include.page.url | remove: '.html' | remove: '/' %}
+ {{ include.page.title }}
+ {% endif %}
+
diff --git a/_layouts/2017/home.html b/_layouts/2017/home.html
index 5904be7e7..af17d894c 100644
--- a/_layouts/2017/home.html
+++ b/_layouts/2017/home.html
@@ -24,13 +24,9 @@ type: website
-
- Top cheatsheets
-
-
{% for page in site.pages %}
{% if page.tags contains 'Featured' %}
- {% include 2017/pages-list-item.html page=page %}
+ {% include 2017/pages-list-item.html page=page class='item top-sheet' %}
{% endif %}
{% endfor %}
@@ -41,7 +37,7 @@ type: website
{% for page in site.pages %}
{% if page.category == category %}
- {% include 2017/pages-list-item.html page=page %}
+ {% include 2017/pages-list-item.html page=page class='article item' %}
{% endif %}
{% endfor %}
{% endfor %}
diff --git a/_sass/2017/components/attribute-peg.scss b/_sass/2017/components/attribute-peg.scss
index 5a2bcf700..c77b83fe3 100644
--- a/_sass/2017/components/attribute-peg.scss
+++ b/_sass/2017/components/attribute-peg.scss
@@ -3,7 +3,6 @@
display: inline-block;
height: 12px;
width: 20px;
- background: rgba(white, 0.1);
text-align: center;
}
diff --git a/_sass/2017/components/pages-list.scss b/_sass/2017/components/pages-list.scss
index 507004f6b..c7c3ab665 100644
--- a/_sass/2017/components/pages-list.scss
+++ b/_sass/2017/components/pages-list.scss
@@ -1,14 +1,4 @@
-.search-box {
- background: $base-panel;
- box-shadow: $shadow3;
-
- & > input {
- padding: 16px;
- background: transparent;
- border: 0;
- width: 100%;
- }
-}
+// search-box.scss
.pages-list {
& {
@@ -20,6 +10,10 @@
padding: 4px 0;
flex: 0 0 50%;
}
+
+ > .item.top-sheet {
+ flex: 0 0 25%;
+ }
}
// Article
@@ -33,20 +27,20 @@
color: $base-mute3;
}
- & > code {
+ & > .info > .slug {
color: $base-head;
}
- &:visited > code {
+ &:visited > .info > .slug {
color: $base-text;
}
- & > .title::before {
+ & > .info > .title::before {
content: '';
margin: 0 4px;
}
- & > .title {
+ & > .info > .title {
opacity: 0;
}
@@ -56,12 +50,9 @@
color: $base-mute;
}
- & > code {
- color: $base-a;
- }
-
- & > .title {
+ & > .info > .title {
opacity: 1;
+ color: $base-a;
}
}
}
@@ -75,3 +66,56 @@
color: $base-b;
flex: 0 0 100%;
}
+
+.top-sheet.top-sheet {
+ padding: 4px;
+ text-decoration: none;
+
+ & > .info {
+ display: block;
+ background: darken($base-a, 8%);
+ color: white;
+ text-align: left;
+ padding: 16px;
+ width: auto;
+ border-radius: 3px;
+ box-shadow: $shadow2;
+ }
+
+ &:nth-of-type(3n + 1) {
+ & > .info {
+ background: darken($base-a, 8%);
+ }
+
+ &:hover > .info,
+ &:focus > .info {
+ background: darken($base-a, 16%);
+ }
+ }
+
+ &:nth-of-type(3n + 2) {
+ & > .info {
+ background: darken($base-b, 8%);
+ }
+
+ &:hover > .info,
+ &:focus > .info {
+ background: darken($base-b, 16%);
+ }
+ }
+
+ &:nth-of-type(3n + 3) {
+ & > .info {
+ background: darken($base-c, 8%);
+ }
+
+ &:hover > .info,
+ &:focus > .info {
+ background: darken($base-c, 16%);
+ }
+ }
+
+ & > .info > .title {
+ display: none;
+ }
+}
diff --git a/bash.md b/bash.md
new file mode 100644
index 000000000..c6de4d2ba
--- /dev/null
+++ b/bash.md
@@ -0,0 +1,5 @@
+---
+title: Bash scripting
+category: CLI
+redirect_to: /sh
+---
diff --git a/cron.md b/cron.md
index 9d2d0a85b..452e74422 100644
--- a/cron.md
+++ b/cron.md
@@ -2,7 +2,6 @@
title: Cron
category: CLI
layout: 2017/sheet
-tags: [Featured]
---
## Format
diff --git a/react-router.md b/react-router.md
index 9bd0689c1..309c5f956 100644
--- a/react-router.md
+++ b/react-router.md
@@ -2,6 +2,7 @@
title: React-router
category: React
layout: default-ad
+tags: [Featured]
---
{% raw %}
diff --git a/sh.md b/sh.md
index 98d96808f..acdf2f873 100644
--- a/sh.md
+++ b/sh.md
@@ -2,7 +2,7 @@
title: Bash scripting
category: CLI
layout: 2017/sheet
-ads: true
+tags: [Featured]
---
Getting started