implement klavika, open sans

This commit is contained in:
Jason Costello 2017-02-27 16:54:39 -08:00
parent 9de8545875
commit 6906f6b2ef
7 changed files with 22 additions and 47 deletions

View File

@ -1,5 +1,5 @@
@mixin button {
font-family: $mono;
font-family: $font-family-open-sans;
height: $button-height;
line-height: $button-height;
background-color: transparent;

View File

@ -72,7 +72,6 @@ header .header {
}
h2 {
font-family: $serif;
font-size: 44px;
color: #7bc6b1;
margin: 0px;
@ -181,7 +180,7 @@ header .header {
color: #b1d631;
font-size: 14px;
font-weight: normal;
font-family: $mono;
font-family: $font-family-mono;
text-shadow: 0 0 0;
}
@ -203,7 +202,6 @@ header .header {
margin-right: 20px;
li {
font-family: $serif;
font-size: 17px;
line-height: (30/17) !important;
margin-bottom: $baseline;
@ -225,10 +223,8 @@ header .header {
}
div.alert {
font-family: $serif;
font-size: 17px;
line-height: 1.5;
letter-spacing: 1px;
margin-left: -135px;
margin-right: -135px;
padding-top: 40px;

View File

@ -19,7 +19,7 @@ $border-dark: #333;
// base measures
$baseline: 20px;
$base-font-size: 16px;
$base-line-height: 20px;
$base-line-height: 1.5;
$button-height: 60px;
.center {
@ -40,13 +40,13 @@ $sidebar-width: 250px;
//typography
$serif: 'myriad-pro', helvetica, Georgia, serif;
$sans: 'HeimatStencil-SemiBold', 'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$mono: 'Inconsolata', 'courier new', courier, monospace;
$font-family-open-sans: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$font-family-klavika: 'klavika-web', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$font-family-mono: 'Inconsolata', 'Monaco', 'courier new', courier, monospace;
.serif { font-family: $serif; }
.sans { font-family: $sans; }
.mono { font-family: $mono; }
.open-sans { font-family: $font-family-open-sans;}
.klavika { font-family: $font-family-klavika; }
.mono { font-family: $font-family-mono; }
.text-center { text-align: center !important; }
.text-left { text-align: left !important; }
@ -56,15 +56,6 @@ $mono: 'Inconsolata', 'courier new', courier, monospace;
.uppercase { text-transform: uppercase !important; }
@font-face {
font-family: 'HeimatStencil-SemiBold';
src: font-url('2772B2_0_0.eot');
src: font-url('2772B2_0_0.woff') format('woff'),
font-url('2772B2_0_0.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
//color
.dark-background {
background-color: #000;

View File

@ -9,7 +9,7 @@ form, input, textarea, button {
-khtml-border-radius: 0;
border-radius: 0;
background-color: transparent;
font-family: $mono;
font-family: $font-family-mono;
font-size: $base-font-size;
line-height: 1.0;
color: inherit;

View File

@ -3,7 +3,7 @@
max-width: 320px;
$border: 1px solid $gray-dark;
font-size: 16px;
font-family: $mono;
font-family: $font-family-mono;
color: $gray-light;
background-color: $sidebar-background-color;

View File

@ -17,19 +17,17 @@ html {
body {
background-color: $background;
font-family: $sans;
letter-spacing: 1px;
font-family: $font-family-open-sans;
font-size: $base-font-size;
line-height: $base-line-height;
}
h1, h2, h3, h4, h5, h6 {
letter-spacing: 2px;
font-family: $font-family-klavika;
font-weight: normal;
}
h1 {
font-family: $sans;
font-size: 70px;
line-height: (80/70);
@include respond-to(mobile) {
@ -39,7 +37,6 @@ h1 {
}
h2 {
font-family: $sans;
font-size: 40px;
line-height: (50/40);
@ -55,38 +52,31 @@ h2 {
}
h3 {
font-family: $sans;
font-size: 20px;
line-height: (30/20);
}
h4 {
font-family: $mono;
font-family: $font-family-mono;
font-size: 20px;
line-height: (30/20);
}
h5 {
font-family: $sans;
font-size: 16px;
line-height: (22/16);
}
h6 {
font-family: $mono;
font-family: $font-family-mono;
font-size: 16px;
line-height: (22/16);
}
p {
font-family: $serif;
font-size: 17px;
line-height: (30/17);
letter-spacing: 1px;
&.large-text {
font-size: 20px;
line-height: (35/20);
}
a {
@ -121,10 +111,8 @@ dt {
}
dd {
font-family: $serif;
font-size: 17px;
line-height: 1.5;
letter-spacing: 1px;
margin-bottom: 30px;
}
@ -159,7 +147,7 @@ pre {
}
table {
font-family: $mono;
font-family: $font-family-mono;
margin: ($baseline * 2) 0;
color: $gray-dark;

View File

@ -13,12 +13,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="shortcut icon" href="<%= image_path(" favicon.ico ") %>" type="image/x-icon">
<link rel="icon" href="<%= image_path(" favicon.ico ") %>" type="image/x-icon">
<script type="text/javascript" src="//use.typekit.net/apr3jjs.js"></script>
<script type="text/javascript">
try {
Typekit.load();
} catch (e) {}
</script>
<!-- Google Tag Manager -->
<script>
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
@ -28,6 +23,11 @@
})(window,document,'script','dataLayer','GTM-NR2SD7C');
</script>
<!-- End Google Tag Manager -->
<!-- Typekit script to import Klavika -->
<script src="https://use.typekit.net/wxf7mfi.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
</head>
<body id="page-<%= current_page.data.page_title ? "#{current_page.data.page_title}" : "home" %>" class="page-<%= current_page.data.page_title ? "#{current_page.data.page_title} layout-#{current_page.data.layout} page-sub" : "home layout-#{current_page.data.layout}" %>">
<!-- Google Tag Manager (noscript) -->