Adds basic template with navbar

This commit is contained in:
Dan Leech 2017-04-23 17:31:56 +01:00
parent f30b4d9199
commit e498a8d8c3
9 changed files with 96 additions and 0 deletions

3
404.html Normal file
View File

@ -0,0 +1,3 @@
---
layout: default
---

View File

@ -8,6 +8,7 @@ SVG icons for popular brands. [See them all on one page at **simpleicons.org**](
- [ ] Jekyll code for sorting icons by hue - [ ] Jekyll code for sorting icons by hue
- [ ] JS search function - [ ] JS search function
- [ ] Analytics tracking for icon clicks - [ ] Analytics tracking for icon clicks
- [ ] Social sharing tags
- [ ] AMP support - [ ] AMP support
- [ ] New README.md - [ ] New README.md
- [ ] New CONTRIBUTING.md - [ ] New CONTRIBUTING.md

3
_config.yml Normal file
View File

@ -0,0 +1,3 @@
sass:
sass_dir: _sass
style: compressed

22
_layouts/default.html Normal file
View File

@ -0,0 +1,22 @@
<!doctype html>
<html lang="en-gb">
<head>
<meta charset="utf-8">
<meta content="initial-scale=1, width=device-width" name="viewport">
<link href="/css/styles.css" rel="stylesheet">
</head>
<body>
<header class="navbar" role="banner">
<ul class="navbar__nav" role="navigation">
<li class="navbar__nav-item navbar__nav-item--home"><a href="/">Simple Icons</a></li>
<li class="navbar__nav-item"><a href="https://github.com/danleech/simple-icons/blob/master/README.md">About</a></li>
<li class="navbar__nav-item"><a href="https://github.com/danleech/simple-icons">GitHub</a></li>
</ul>
</header>
<main role="main">
</main>
<footer role="contentinfo">
</footer>
</body>
</html>

View File

@ -0,0 +1,38 @@
.navbar {
background-color: $color-black;
}
.navbar__nav {
display: flex;
list-style: none;
margin: 0;
padding: 0;
@media (min-width: 720px) {
padding: 0 1.5rem;
}
}
.navbar__nav-item {
a {
color: #FFF;
display: block;
opacity: 0.5;
padding: 1.5rem 0.375rem;
&:focus, &:hover {
opacity: 1;
}
}
&:last-child {
a {
padding: 1.5rem 1.5rem 1.5rem 0.375rem;
}
}
}
.navbar__nav-item--home {
flex-grow: 1;
a {
opacity: 1;
padding: 1.5rem 0 1.5rem 1.5rem;
}
}

16
_sass/_elements.scss Normal file
View File

@ -0,0 +1,16 @@
:root {
font-size: 100%;
}
a {
text-decoration: none;
}
body {
background-color: $color-white;
color: $color-black;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-size: 0.875rem;
line-height: 1.5rem;
margin: 0;
}

View File

@ -0,0 +1,2 @@
$color-black: #263238;
$color-white: #FFFFFF;

8
css/styles.scss Normal file
View File

@ -0,0 +1,8 @@
---
---
@import "settings.colours";
@import "elements";
@import "components.navbar";

3
index.html Normal file
View File

@ -0,0 +1,3 @@
---
layout: default
---