💻 Add footer with some social links #100DaysOfCode R1D28

This commit is contained in:
Dan Jones 2018-01-29 12:55:15 -06:00
commit 178b0cfc24
4 changed files with 32 additions and 7 deletions

View file

@ -5,3 +5,4 @@ gem 'jekyll-seo-tag', group: :jekyll_plugins
gem "jekyll-assets", "~> 2.4.0", group: :jekyll_plugins
gem 'bootstrap', '~> 4.0.0'
gem "font-awesome-sass", "~> 4.7"

View file

@ -1,24 +1,29 @@
---
---
@import 'bootstrap';
@import 'font-awesome-sprockets';
@import 'font-awesome';
.primary-container {
padding: 0;
}
.bd-sideboard.bg-dark {
.bd-sideboard {
aside {
padding: $table-cell-padding-sm;
}
header {
color: $light;
header {
h2 {
font-size: 1.7rem;
}
}
}
.bg-dark {
p, header {
color: $light;
}
}
dl {
& > dt + dd, & > dd + dd {
padding-left: 1em;

View file

@ -75,6 +75,7 @@ plugins:
- jekyll-seo-tag
- jekyll-assets
- bootstrap
- font-awesome-sass
# Exclude these files from your production _site
exclude:

View file

@ -2,8 +2,7 @@
<html>
<head>
{% seo %}
<link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/style.css" />
{% css style %}
<meta http-equiv="X-Clacks-Overhead" content="GNU Terry Pratchett" />
</head>
@ -21,6 +20,10 @@
<div class="row">
<div class="order-2 order-md-1 col-12 col-md-3 col-xl-2 bd-sideboard bg-dark">
<aside>
<p>{{ site.description }}</p>
</aside>
<aside>
<header>
<h2>My Links</h2>
@ -56,9 +59,24 @@
{{ content }}
</section>
</main>
</div>
</section>
<footer class="footer bg-dark">
<div class="container-fluid">
<p>{{ site.author.name }}
{% if site.author.facebook %}<a href="https://www.facebook.com/{{ site.author.facebook }}"><i class="fa fa-facebook"></i></a>{% endif %}
{% if site.author.flickr %}<a href="https://www.flickr.com/photos/{{ site.author.flickr }}/"><i class="fa fa-flickr"></i></a>{% endif %}
{% if site.author.github %}<a href="https://github.com/{{ site.author.github }}"><i class="fa fa-github"></i></a>{% endif %}
{% if site.author.instagram %}<a href="https://instagram.com/{{ site.author.instagram }}"><i class="fa fa-instagram"></i></a>{% endif %}
{% if site.author.linkedin %}<a href="https://www.linkedin.com/in/{{ site.author.linkedin }}"><i class="fa fa-linkedin"></i></a>{% endif %}
{% if site.author.twitter %}<a href="https://twitter.com/{{ site.author.twitter }}"><i class="fa fa-twitter"></i></a>{% endif %}
</p>
</div>
</footer>
{% js application %}
</body>
</html>