starting sidebar coding

This commit is contained in:
Tetsuro
2015-01-26 20:41:04 -05:00
parent 79ec1506de
commit a8dc349f01
3 changed files with 22 additions and 6 deletions
+1
View File
@@ -7,6 +7,7 @@
<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" | prepend: site.baseurl }}">
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'>
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
<link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" />
</head>
+1 -1
View File
@@ -5,7 +5,7 @@
<body>
<div class="sidebar">
<h1 class="logo"><a href="/">Liquid</a></h1>
<h1 class="sidebar--logo"><a href="/">Liquid</a></h1>
</div>
<div class="content">
{{ content }}
+20 -5
View File
@@ -4,9 +4,8 @@
@charset "utf-8";
// Our variables
$base-font-family: Helvetica, Arial, sans-serif;
$base-font-family: 'Droid Sans', sans-serif;
$base-font-size: 16px;
$small-font-size: $base-font-size * 0.875;
$base-line-height: 1.5;
@@ -53,7 +52,6 @@ $on-laptop: 800px;
;
/***** Layout Styles ******/
* {
@@ -64,13 +62,30 @@ body {
display: flex;
}
/***** Sidebar ******/
.sidebar {
background: $color-blue-5;
flex: 0 1 250px;
height: 100vh;
padding: $spacing-unit;
}
.sidebar--logo {
font-size: $base-font-size * 2;
font-weight: bold;
text-align: center;
padding: $spacing-unit;
border-bottom: 1px solid $color-blue-4;
a {
color: $color-white;
}
}
/***** Content ******/
.content {
padding: $spacing-unit;
flex: 0 1 auto;
}