spike out styling

This commit is contained in:
Joel Glovier
2015-07-21 11:57:33 -04:00
parent 5bf4c71597
commit c15084da80
6 changed files with 99 additions and 7 deletions
+12 -1
View File
@@ -11,4 +11,15 @@ sass:
# Resume settings # Resume settings
resume_name: "Homer J. Simpson" resume_name: "Homer J. Simpson"
resume_title: "Nuclear Safety Inspector" resume_title: "Nuclear Safety Inspector"
resume_contact_email: "homerjsimpson@youremailaddress.com" resume_contact_email:
"homerjsimpson@youremailaddress.com"
# Resume social links
# Design settings
resume_theme: default
# Note: when editing locally, remember to restart
# your Jekyll server when you edit this file. Changes
# to _congif.yml are only recognized when the server starts
+6
View File
@@ -4,6 +4,12 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title> <title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title>
<!-- Google font typography settings - defined in _config.yml -->
{% if site.resume_theme == 'default' %}
<link href='http://fonts.googleapis.com/css?family=Lora:400,700|Open+Sans:400,300,800,700' rel='stylesheet' type='text/css'>
{% endif %}
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}"> <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
+3 -1
View File
@@ -3,7 +3,7 @@
{% include head.html %} {% include head.html %}
<body> <body class="theme-{% if site.resume_theme %}{{ site.resume_theme }}{% endif %}">
<div class="wrapper"> <div class="wrapper">
@@ -20,9 +20,11 @@
<h2 class="header-title">{{ site.resume_title }}</h2> <h2 class="header-title">{{ site.resume_title }}</h2>
<!-- annnd guess where these are defined? Yup, you guessed it: the _config.yml file --> <!-- annnd guess where these are defined? Yup, you guessed it: the _config.yml file -->
{% if site.resume_links %}
<ul class="icon-links"> <ul class="icon-links">
<li class="icon-link"><a href="" class=""></a></li> <li class="icon-link"><a href="" class=""></a></li>
</ul> </ul>
{% endif %}
</div> </div>
<div class="executive-summary"> <div class="executive-summary">
+2 -2
View File
@@ -11,7 +11,7 @@ html {
} }
body{ body{
@include sans; @include serif;
color: $text_color; color: $text_color;
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
@@ -21,7 +21,7 @@ body{
.wrapper:after { content:""; display:table; } .wrapper:after { content:""; display:table; }
.wrapper:after { clear: both; } .wrapper:after { clear: both; }
.wrapper { .wrapper {
max-width: 1084px; max-width: 680px;
padding: 0 30px; padding: 0 30px;
margin: 0 auto; margin: 0 auto;
zoom: 1; zoom: 1;
+15 -1
View File
@@ -55,7 +55,7 @@
// type utilities // type utilities
@mixin sans { @mixin sans {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
} }
@mixin sans_light { @mixin sans_light {
@@ -82,3 +82,17 @@
@include sans; @include sans;
font-weight: 800; font-weight: 800;
} }
@mixin serif {
font-family: "Lora", "Minion Pro", Palatino, Georgia, serif;
}
@mixin serif_regular {
@include serif;
font-weight: 400;
}
@mixin serif_bold {
@include serif;
font-weight: 700;
}
+60 -1
View File
@@ -1,2 +1,61 @@
// Home styles // Resme styles
// ---------------------------------------/ // ---------------------------------------/
// util
.section-header {
border-top: 4px solid #c7c7c7;
border-bottom: 2px solid #c7c7c7;
padding: .5rem 0;
h2 {
@include sans;
font-weight: 900;
font-size: 1.75rem;
letter-spacing: -.05rem;
margin: 0;
}
}
// page header styles
.page-header {
padding: 1.5rem 0;
.avatar {
width: 95px;
max-width: 100%;
overflow: hidden;
@include border-radius(100px);
margin: 0 auto;
display: block;
}
.header-name {
@include sans;
font-size: 3rem;
font-weight: 900;
text-align: center;
letter-spacing: -.15rem;
line-height: 1;
margin: 1rem 0 2rem;
}
.title-bar {
border-top: 4px solid #c7c7c7;
border-bottom: 2px solid #c7c7c7;
padding: .5rem 0;
.header-title {
@include sans;
font-weight: 300;
font-size: 1.75rem;
letter-spacing: -.05rem;
margin: 0;
}
}
}