em is awesome with fonts
This commit is contained in:
parent
c5264a85da
commit
41895acbab
|
@ -4,9 +4,6 @@
|
||||||
- title: about
|
- title: about
|
||||||
url: /me
|
url: /me
|
||||||
|
|
||||||
- title: portfolio
|
|
||||||
url: /work
|
|
||||||
|
|
||||||
- title: github
|
- title: github
|
||||||
url: https://github.com/getmicah
|
url: https://github.com/getmicah
|
||||||
|
|
||||||
|
|
|
@ -9,11 +9,3 @@
|
||||||
- title: GetPeppers
|
- title: GetPeppers
|
||||||
category: website
|
category: website
|
||||||
url: http://getpeppers.com
|
url: http://getpeppers.com
|
||||||
|
|
||||||
- title: Fatso
|
|
||||||
category: theme
|
|
||||||
url: https://github.com/getmicah/fatso
|
|
||||||
|
|
||||||
- title: Beam
|
|
||||||
category: theme
|
|
||||||
url: https://github.com/getmicah/beam
|
|
|
@ -16,4 +16,5 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<link rel="icon" href="/assets/img/favicon.png">
|
<link rel="icon" href="/assets/img/favicon.png">
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet" type="text/css">
|
||||||
<link rel="stylesheet" type="text/css" href="/assets/css/main.css">
|
<link rel="stylesheet" type="text/css" href="/assets/css/main.css">
|
||||||
|
|
|
@ -1,3 +1,7 @@
|
||||||
// COLORS
|
// COLORS
|
||||||
$color-primary: #272727;
|
$color-primary: #272727;
|
||||||
$color-background: #FFFFFF;
|
$color-background: #FFFFFF;
|
||||||
|
|
||||||
|
// FONT
|
||||||
|
$font-url: "https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic";
|
||||||
|
$font-family: "'Ubuntu Mono', ";
|
||||||
|
|
|
@ -15,7 +15,7 @@ time, mark, audio, video {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
border: 0;
|
border: 0;
|
||||||
font-size: 100%;
|
font-size: 1em;
|
||||||
font: inherit;
|
font: inherit;
|
||||||
vertical-align: baseline;
|
vertical-align: baseline;
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,6 +7,8 @@
|
||||||
body {
|
body {
|
||||||
color: $color-primary;
|
color: $color-primary;
|
||||||
background: $color-background;
|
background: $color-background;
|
||||||
|
font-family: 'Inconsolata', ;
|
||||||
|
font-size: 100%;
|
||||||
}
|
}
|
||||||
h1, h2 {
|
h1, h2 {
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
|
@ -38,26 +40,25 @@ ul {
|
||||||
.wrapper {
|
.wrapper {
|
||||||
max-width: 600px;
|
max-width: 600px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding: 15px;
|
padding: 30px;
|
||||||
@media screen and (min-width: 570px) {
|
padding-top: 60px;
|
||||||
padding: 30px;
|
@media screen and (max-width: 570px) {
|
||||||
|
padding: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
margin-bottom: 30px;
|
display: flex;
|
||||||
padding-bottom: 15px;
|
justify-content: space-between;
|
||||||
border-bottom: 1px solid #000;
|
align-items: baseline;
|
||||||
@media screen and (min-width: 570px) {
|
padding-bottom: 40px;
|
||||||
display: flex;
|
@media screen and (max-width: 570px) {
|
||||||
justify-content: space-between;
|
display: block;
|
||||||
align-items: baseline;
|
|
||||||
padding-bottom: 5px;
|
|
||||||
}
|
}
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 36px;
|
font-size: 2em;
|
||||||
margin-right: 20px;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
ul {
|
ul {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
@ -69,29 +70,38 @@ ul {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.blog {
|
.work {
|
||||||
|
padding-bottom: 30px;
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 26px;
|
font-size: 1.4em;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.blog {
|
||||||
|
padding-bottom: 30px;
|
||||||
|
h1 {
|
||||||
|
font-size: 1.4em;
|
||||||
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.post {
|
.post {
|
||||||
|
padding-bottom: 30px;
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 26px;
|
font-size: 1.4em;
|
||||||
}
|
margin-bottom: 5px;
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.portfolio {
|
|
||||||
h1 {
|
|
||||||
font-size: 26px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.about {
|
.about {
|
||||||
|
padding-bottom: 30px;
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 26px;
|
font-size: 1.4em;
|
||||||
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
19
index.html
19
index.html
|
@ -3,11 +3,24 @@ layout: default
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div class="blog">
|
<div class="work">
|
||||||
|
<h1>Web Design:</h1>
|
||||||
<ul>
|
<ul>
|
||||||
{% for post in site.posts %}
|
{% for websites in site.data.websites %}
|
||||||
<li>
|
<li>
|
||||||
<span class="date">{{ post.date | date: '%b %d %Y' }}</span> | <a href="{{ post.url }}">{{ post.title }}</a>
|
<a href="{{ websites.url }}">{{ websites.url }}</a>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="blog">
|
||||||
|
<h1>Blog Posts:</h1>
|
||||||
|
<ul>
|
||||||
|
{% for post in site.posts %}
|
||||||
|
<li>
|
||||||
|
<span class="date">{{ post.date | date: '%b %d %Y' }}</span> - <a href="{{ post.url }}">{{ post.title }}</a>
|
||||||
</li>
|
</li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
@ -4,5 +4,5 @@ layout: default
|
||||||
|
|
||||||
|
|
||||||
<div class="about">
|
<div class="about">
|
||||||
<h1>About</h1>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,14 +0,0 @@
|
||||||
---
|
|
||||||
layout: default
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
<div class="portfolio">
|
|
||||||
<ul>
|
|
||||||
{% for project in site.data.projects %}
|
|
||||||
<li>
|
|
||||||
<a href="{{ project.url }}">{{ project.title }}</a>
|
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
Loading…
Reference in New Issue