cleaning up stylesheets

This commit is contained in:
Tetsuro
2015-01-26 20:32:10 -05:00
parent e661b5a275
commit 79ec1506de
3 changed files with 45 additions and 20 deletions

View File

@@ -4,13 +4,12 @@
{% include head.html %}
<body>
<div class="wrapper">
<div class="sidebar">
<h1 class="logo"><a href="/">Liquid</a></h1>
</div>
<div class="content">
{{ content }}
</div>
{% include footer.html %}
</body>
</html>

View File

@@ -16,8 +16,7 @@ body {
font-size: $base-font-size;
line-height: $base-line-height;
font-weight: 300;
color: $text-color;
background-color: $background-color;
color: $color-slate;
-webkit-text-size-adjust: 100%;
}
@@ -75,15 +74,15 @@ h1, h2, h3, h4, h5, h6 {
* Links
*/
a {
color: $brand-color;
// color: $brand-color;
text-decoration: none;
&:visited {
color: darken($brand-color, 15%);
// color: darken($brand-color, 15%);
}
&:hover {
color: $text-color;
// color: $text-color;
text-decoration: underline;
}
}
@@ -94,8 +93,8 @@ a {
* Blockquotes
*/
blockquote {
color: $grey-color;
border-left: 4px solid $grey-color-light;
//color: $grey-color;
// border-left: 4px solid $grey-color-light;
padding-left: $spacing-unit / 2;
font-size: 18px;
letter-spacing: -1px;
@@ -114,7 +113,7 @@ blockquote {
pre,
code {
font-size: 15px;
border: 1px solid $grey-color-light;
// border: 1px solid $grey-color-light;
border-radius: 3px;
background-color: #eef;
}

View File

@@ -1,8 +1,8 @@
---
# Only the main Sass file needs front matter (the dashes are enough)
# Liquid Docs Main Styles
---
@charset "utf-8";
@charset "utf-8";
// Our variables
@@ -10,20 +10,26 @@ $base-font-family: Helvetica, Arial, sans-serif;
$base-font-size: 16px;
$small-font-size: $base-font-size * 0.875;
$base-line-height: 1.5;
$spacing-unit: 40px;
$spacing-unit: 30px;
// Liquid Docs Blues. 1 --> 5, lightest --> darkest.
$text-color: #111;
$background-color: #fdfdfd;
$brand-color: #2a7ae2;
$color-blue-1: #E8F8FF;
$color-blue-2: #B4DCED;
$color-blue-3: #91C9E8;
$color-blue-4: #67B8DE;
$color-blue-5: #3399CC;
$color-white: #fff;
$color-slate: #5E5E5E;
/*
$grey-color: #828282;
$grey-color-light: lighten($grey-color, 40%);
$grey-color-dark: darken($grey-color, 25%);
*/
// Width of the content area
$content-width: 800px;
$on-palm: 600px;
$on-laptop: 800px;
@@ -47,3 +53,24 @@ $on-laptop: 800px;
;
/***** Layout Styles ******/
* {
box-sizing: border-box;
}
body {
display: flex;
}
.sidebar {
background: $color-blue-5;
flex: 0 1 250px;
height: 100vh;
padding: $spacing-unit;
}
.content {
}