mirror of
https://github.com/Mibew/simple-icons.git
synced 2025-01-19 00:20:34 +03:00
Adds basic template with navbar
This commit is contained in:
parent
f30b4d9199
commit
e498a8d8c3
@ -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
3
_config.yml
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
sass:
|
||||||
|
sass_dir: _sass
|
||||||
|
style: compressed
|
22
_layouts/default.html
Normal file
22
_layouts/default.html
Normal 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>
|
38
_sass/_components.navbar.scss
Normal file
38
_sass/_components.navbar.scss
Normal 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
16
_sass/_elements.scss
Normal 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;
|
||||||
|
}
|
2
_sass/_settings.colours.scss
Normal file
2
_sass/_settings.colours.scss
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
$color-black: #263238;
|
||||||
|
$color-white: #FFFFFF;
|
8
css/styles.scss
Normal file
8
css/styles.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
|
@import "settings.colours";
|
||||||
|
|
||||||
|
@import "elements";
|
||||||
|
|
||||||
|
@import "components.navbar";
|
3
index.html
Normal file
3
index.html
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
---
|
||||||
|
layout: default
|
||||||
|
---
|
Loading…
Reference in New Issue
Block a user