diff --git a/components/BaseCheatsheet.vue b/components/BaseCheatsheet.vue new file mode 100644 index 0000000..ce22c7b --- /dev/null +++ b/components/BaseCheatsheet.vue @@ -0,0 +1,65 @@ + + + + + + + + + + + diff --git a/components/BaseDivider.vue b/components/BaseDivider.vue index 4e41ef9..ac43d4f 100644 --- a/components/BaseDivider.vue +++ b/components/BaseDivider.vue @@ -36,11 +36,11 @@ $c: ".c-base-divider"; align-items: center; #{$c}__category { - font-size: 18px; + margin-right: 40px; color: #ffffff; text-transform: uppercase; font-weight: bold; - margin-right: 40px; + font-size: 18px; } #{$c}__line { diff --git a/layouts/default.vue b/layouts/default.vue index cdc735e..def537b 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -42,7 +42,7 @@ $c: ".l-default"; html { overflow-y: scroll; box-sizing: border-box; - padding: 60px 0 100px; + padding: 60px 0 40px; min-height: 100%; background-color: #1b2431; color: white; @@ -96,8 +96,8 @@ html { #{$c} { #{$c}__copyright { position: fixed; - bottom: 0; right: 0; + bottom: 0; } } diff --git a/pages/index.vue b/pages/index.vue index cd2db89..a60233c 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -15,11 +15,20 @@ section( v-for="(category, index) in categories" + :key="category.name" class="c-index__category" ) base-divider( :category="'0' + (index + 1) + '. ' + category.name" + class="c-index__divider" ) + .c-index__cheatsheets + base-cheatsheet( + v-for="cheatsheet in category.cheatsheets" + :key="cheatsheet.name" + :name="cheatsheet.name" + :thumbnail="cheatsheet.thumbnail" + )