aboutsummaryrefslogtreecommitdiff
path: root/sass/themes
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--sass/themes/classic/_partials.scss (renamed from source/sass/themes/classic/_partials.scss)10
-rw-r--r--sass/themes/classic/_style.scss (renamed from source/sass/themes/classic/_style.scss)4
-rw-r--r--sass/themes/classic/core/_layout.scss94
-rw-r--r--sass/themes/classic/core/_theme.scss (renamed from source/sass/themes/classic/core/_theme.scss)0
-rw-r--r--sass/themes/classic/core/_typography.scss (renamed from source/sass/themes/classic/core/_typography.scss)21
-rw-r--r--sass/themes/classic/media/_480.scss16
-rw-r--r--sass/themes/classic/media/_768.scss16
-rw-r--r--sass/themes/classic/media/_992.scss3
-rw-r--r--sass/themes/classic/partials/_blog.scss (renamed from source/sass/themes/classic/partials/_blog.scss)3
-rw-r--r--sass/themes/classic/partials/_footer.scss (renamed from source/sass/themes/classic/partials/_footer.scss)0
-rw-r--r--sass/themes/classic/partials/_header.scss (renamed from source/sass/themes/classic/partials/_header.scss)6
-rw-r--r--sass/themes/classic/partials/_navigation.scss67
-rw-r--r--sass/themes/classic/partials/_page.scss (renamed from source/sass/themes/classic/partials/_page.scss)4
-rw-r--r--sass/themes/classic/partials/_search.scss0
-rw-r--r--sass/themes/classic/partials/_shared.scss (renamed from source/sass/themes/classic/partials/_shared.scss)0
-rw-r--r--sass/themes/classic/partials/_sidebar.scss20
-rw-r--r--sass/themes/classic/partials/_syntax.scss (renamed from source/sass/themes/classic/partials/_syntax.scss)0
-rw-r--r--sass/themes/classic/partials/_twitter.scss (renamed from source/sass/themes/classic/partials/_twitter.scss)0
18 files changed, 237 insertions, 27 deletions
diff --git a/source/sass/themes/classic/_partials.scss b/sass/themes/classic/_partials.scss
index c88faaac..e1e72490 100644
--- a/source/sass/themes/classic/_partials.scss
+++ b/sass/themes/classic/_partials.scss
@@ -1,8 +1,8 @@
-@import "partials/shared";
-@import "partials/syntax";
-@import "partials/search";
-@import "partials/sidebar";
-@import "partials/twitter";
+//@import "partials/shared";
+//@import "partials/syntax";
+//@import "partials/search";
+//@import "partials/sidebar";
+//@import "partials/twitter";
/* layout partials */
@import "partials/header";
diff --git a/source/sass/themes/classic/_style.scss b/sass/themes/classic/_style.scss
index f36aaa18..70421360 100644
--- a/source/sass/themes/classic/_style.scss
+++ b/sass/themes/classic/_style.scss
@@ -1,4 +1,4 @@
-@import "core/layout";
@import "core/theme";
+@import "core/layout";
@import "core/typography";
-//@import "partials";
+@import "partials";
diff --git a/sass/themes/classic/core/_layout.scss b/sass/themes/classic/core/_layout.scss
new file mode 100644
index 00000000..b245fd1f
--- /dev/null
+++ b/sass/themes/classic/core/_layout.scss
@@ -0,0 +1,94 @@
+a {
+ color: $link_color;
+ &:hover, &:focus {
+ color: saturate(darken($link_color, 15), 20); }
+ &:visited {
+ color: darken(adjust_hue($link_color, 70), 10);
+ }
+}
+
+$min-width: 320px;
+$max-width: 1440px;
+$default-border-radius: 4px;
+
+.group { @include pie-clearfix; }
+.core-layout { > div { @extend .inner-wrap; } }
+
+body {
+ > header, > nav, > footer {
+ @extend .core-layout;
+ min-width: $min-width;
+ }
+}
+
+
+@mixin media-layout($page-pad, $sidebar-width, $sidebar-pad) {
+ $side-nav: $sidebar-width - $page-pad - $sidebar-pad;
+
+ .inner-wrap {
+ padding: 0 $page-pad;
+ position: relative;
+ margin: 0 auto;
+ max-width: $max-width;
+ @extend .group;
+ }
+
+ body > nav + div {
+ @extend .group;
+ padding: 0;
+ max-width: $max-width + $page-pad*2;
+ margin: 0 auto;
+ > div {
+ @extend .group;
+ margin-right: $sidebar-width;
+ }
+ }
+ body > nav > div > div { width: $side-nav;
+ .search { width: $side-nav - 70px; }
+ }
+
+ #articles {
+ float: left;
+ width: 100%;
+ padding-top: 25px;
+ padding-bottom: 25px;
+ > * {
+ padding-right: $page-pad;
+ padding-left: $page-pad;
+ }
+ > article {
+ margin-bottom: 1.5em;
+ padding-bottom: 1.5em;
+ padding-right: $page-pad;
+ padding-left: $page-pad;
+ }
+ + aside {
+ display: block;
+ float: left;
+ width: $sidebar-width - $sidebar-pad*2;
+ margin: 0 -100% 0 0;
+ padding: $sidebar-pad;
+ }
+ }
+}
+
+@media only screen and (min-width: 320px) {
+ @import "../media/480";
+}
+
+@media only screen and (min-width: 768px) {
+ @include media-layout(15px, 240px, 15px);
+ @import "../media/768";
+}
+
+@media only screen and (min-width: 992px) {
+ @include media-layout(40px, 320px, 30px);
+ @import "../media/992";
+}
+
+
+//*{
+ //transition: width .5s;
+ //-moz-transition: width .5s;
+ //-webkit-transition: margin .5s;
+//}
diff --git a/source/sass/themes/classic/core/_theme.scss b/sass/themes/classic/core/_theme.scss
index a69b11d7..a69b11d7 100644
--- a/source/sass/themes/classic/core/_theme.scss
+++ b/sass/themes/classic/core/_theme.scss
diff --git a/source/sass/themes/classic/core/_typography.scss b/sass/themes/classic/core/_typography.scss
index 473f0744..5916c82e 100644
--- a/source/sass/themes/classic/core/_typography.scss
+++ b/sass/themes/classic/core/_typography.scss
@@ -7,6 +7,7 @@ $blockquote: $type-border !default; //darken($type-border, 20) !default;
// Fonts
@include font-face("Adelle", font-files("adellebasic_bold-webfont.woff", woff, "adellebasic_bold-webfont.ttf", truetype, "adellebasic_bold-webfont.svg#webfontKykxqSyz", svg), $eot: "adellebasic_bold-webfont.eot" );
.heading-font { font-family: Adelle, "Helvetica Neue", Helvetica, Arial, sans; }
+.sans-font { font-family: "Helvetica Neue", Helvetica, Arial, sans; }
body > header h1 {
font-size: 3em;
@@ -24,17 +25,17 @@ body {
}
article {
- margin-bottom: 1.5em;
- padding-bottom: 1.5em;
- padding-top: 1em;
- + article { border-top: 3px solid $type-color-light; }
&:last-child { border-bottom: none; }
h2 {
padding-top: 0.8em;
border-top: 3px double $type-border;
}
- .author, time { text-transform: uppercase; }
- .updated { font-size: .8em; color: $type-color-light; }
+ .byline + time:before, .byline + time +time:before {
+ content: "\2022 ";
+ padding: 0 .3em 0 .2em;
+ display: inline-block;
+ @include opacity(.5);
+ }
time span {
font-size: .7em;
line-height: 0;
@@ -47,13 +48,7 @@ article {
font-size: .8em;
color: $type-color-light;
font-family: Palatino, Times, "Times New Roman";
- //margin-top: -1.2em;
- //border: {
- top-width: 1px;
- //bottom-width: 1px;
- //style: dashed;
- //color: $type-border;
- //}
+ margin-top: -1.4em;
}
}
}
diff --git a/sass/themes/classic/media/_480.scss b/sass/themes/classic/media/_480.scss
new file mode 100644
index 00000000..e6f0613a
--- /dev/null
+++ b/sass/themes/classic/media/_480.scss
@@ -0,0 +1,16 @@
+body {
+ > header, > nav, > footer {
+ > div {
+ padding-left: .5em;
+ padding-right: .5em;
+ }
+ }
+ > header { font-size: .7em; padding: .5em 0; }
+}
+#articles { font-size: .9em; line-height: 1.5em;
+ > article { padding: .5em; }
+ + aside { display: none; }
+}
+body > nav > div > div { width: 180px;
+ .search { width: 110px; }
+}
diff --git a/sass/themes/classic/media/_768.scss b/sass/themes/classic/media/_768.scss
new file mode 100644
index 00000000..d8c61d57
--- /dev/null
+++ b/sass/themes/classic/media/_768.scss
@@ -0,0 +1,16 @@
+body > header, body #articles {
+ font-size: .95em;
+}
+
+//body {
+ //> header, > nav, > footer {
+ //> div { padding: 0 15px; }
+ //}
+//}
+//#page > div {
+ //margin-right: 0;
+ //#main { float: none; }
+ //> aside { margin: 0; float: none; }
+//}
+//page > div > aside { float: none; }
+//#main > * { padding-left: 15px; padding-right: 15px; }
diff --git a/sass/themes/classic/media/_992.scss b/sass/themes/classic/media/_992.scss
new file mode 100644
index 00000000..f7c643b6
--- /dev/null
+++ b/sass/themes/classic/media/_992.scss
@@ -0,0 +1,3 @@
+body > header, body #articles {
+ font-size: 1.05em;
+}
diff --git a/source/sass/themes/classic/partials/_blog.scss b/sass/themes/classic/partials/_blog.scss
index 47b48878..1dd255dd 100644
--- a/source/sass/themes/classic/partials/_blog.scss
+++ b/sass/themes/classic/partials/_blog.scss
@@ -1,7 +1,4 @@
article {
- h2 {
- padding-top: 0;
- margin-bottom: 0.1em; }
.title {
text-decoration: none;
&:hover {
diff --git a/source/sass/themes/classic/partials/_footer.scss b/sass/themes/classic/partials/_footer.scss
index 08e6138c..08e6138c 100644
--- a/source/sass/themes/classic/partials/_footer.scss
+++ b/sass/themes/classic/partials/_footer.scss
diff --git a/source/sass/themes/classic/partials/_header.scss b/sass/themes/classic/partials/_header.scss
index a4964af9..ba7993a8 100644
--- a/source/sass/themes/classic/partials/_header.scss
+++ b/sass/themes/classic/partials/_header.scss
@@ -1,11 +1,13 @@
body > header {
background-color: $header_bg;
border-bottom: 1px solid $header_border;
- padding: 25px 0;
h1 {
display: inline-block;
margin: 0;
a, a:visited {
font-weight: normal;
color: $title_color;
- text-decoration: none; } } }
+ text-decoration: none;
+ }
+ }
+}
diff --git a/sass/themes/classic/partials/_navigation.scss b/sass/themes/classic/partials/_navigation.scss
new file mode 100644
index 00000000..30685034
--- /dev/null
+++ b/sass/themes/classic/partials/_navigation.scss
@@ -0,0 +1,67 @@
+body > nav {
+ > div > div {
+ float: right;
+ position: relative;
+ padding: .45em 0 0 0;
+ a {
+ float: right;
+ @include replace-text-with-dimensions('rss.png');
+ }
+ form {
+ margin: 0; padding: 0;
+ @include background-clip(padding-box);
+ input[type='text']{
+ margin: 0;
+ @include border-radius(1em);
+ float: left;
+ border: 1px solid #ccc;
+ color: #888;
+ background: image-url('search.png') no-repeat .5em .4em #f6f6f6;
+ padding: .4em .8em .1em 1.8em;
+ line-height: 1.35em;
+ font-size: .85em;
+ &:focus {
+ color: #444;
+ border-color: #80b1df;
+ @include box-shadow(#80b1df 0 0 4px, #80b1df 0 0 3px inset);
+ background-color: #fff;
+ outline: none;
+ }
+ }
+ }
+ }
+ @extend .group;
+ position: relative;
+ z-index: 1;
+ background-color: $nav-bg;
+ @include background-image(linear-gradient(#fcfcfc, #f4f4f4 0.3, #dddddd));
+ border: {
+ top: 1px solid $nav-border-top;
+ bottom: 1px solid $nav-border-bottom; };
+ ul {
+ position: relative;
+ @include horizontal-list;
+ margin: 0 auto;
+ padding: .5em 0;
+ }
+ ul li {
+ padding: 0 1em;
+ margin: 0;
+ border-left: 1px solid $nav-border-left;
+ border-right: 1px solid $nav-border-right;
+ &:first-child {
+ border-left: none;
+ padding-left: 0; }
+ &:last-child {
+ border-right: 0; }
+ a {
+ display: inline-block;
+ color: $nav-color;
+ line-height: 150%;
+ text-decoration: none;
+ &:hover {
+ color: $nav-color-hover;
+ }
+ }
+ }
+}
diff --git a/source/sass/themes/classic/partials/_page.scss b/sass/themes/classic/partials/_page.scss
index 2a1503b4..414a37e9 100644
--- a/source/sass/themes/classic/partials/_page.scss
+++ b/sass/themes/classic/partials/_page.scss
@@ -2,7 +2,7 @@ body {
background-color: $sidebar_bg;
}
-#page > div {
+body > div > div {
background-color: $main_bg; border-right: 1px solid $sidebar_border;
- @include box-shadow(rgba(#000, .1) 0 0 18px);
+ //@include box-shadow(rgba(#000, .1) 0 0 18px);
}
diff --git a/sass/themes/classic/partials/_search.scss b/sass/themes/classic/partials/_search.scss
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/sass/themes/classic/partials/_search.scss
diff --git a/source/sass/themes/classic/partials/_shared.scss b/sass/themes/classic/partials/_shared.scss
index a97b6051..a97b6051 100644
--- a/source/sass/themes/classic/partials/_shared.scss
+++ b/sass/themes/classic/partials/_shared.scss
diff --git a/sass/themes/classic/partials/_sidebar.scss b/sass/themes/classic/partials/_sidebar.scss
new file mode 100644
index 00000000..faab4152
--- /dev/null
+++ b/sass/themes/classic/partials/_sidebar.scss
@@ -0,0 +1,20 @@
+#articles + aside {
+ section {
+ @extend .sans-font;
+ font-size: .8em;
+ line-height: 1.5em;
+ margin-bottom: 1.5em;
+ }
+ ul {
+ margin-bottom: 0.5em;
+ }
+ li {
+ list-style: none;
+ padding: .5em 0;
+ margin: 0;
+ border-bottom: 1px solid #ddd;
+ p:last-child {
+ margin-bottom: 0;
+ }
+ }
+}
diff --git a/source/sass/themes/classic/partials/_syntax.scss b/sass/themes/classic/partials/_syntax.scss
index b06a5a10..b06a5a10 100644
--- a/source/sass/themes/classic/partials/_syntax.scss
+++ b/sass/themes/classic/partials/_syntax.scss
diff --git a/source/sass/themes/classic/partials/_twitter.scss b/sass/themes/classic/partials/_twitter.scss
index 5d8b7d97..5d8b7d97 100644
--- a/source/sass/themes/classic/partials/_twitter.scss
+++ b/sass/themes/classic/partials/_twitter.scss