moved old sass files, redid comment form styles

1 files changed, 265 insertions, 0 deletions

diff --git a/design/old/v8/_homepage.scss b/design/old/v8/_homepage.scss
new file mode 100644
index 0000000..db375ed
--- /dev/null
+++ b/design/old/v8/_homepage.scss
@@ -0,0 +1,265 @@
+.homepage--section {
+    @include constrain_wide;
+    @extend %clearfix;
+    &:before {
+        margin-top: 3em;
+    }
+}
+.homepage--arc-header {
+    @include fontsize(14);
+    font-family: sans-serif;
+    font-weight: 500;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+    margin-bottom: 2em;
+    @include breakpoint(beta) {
+        text-align: left;
+    }
+}
+.homepage--archives {
+    max-width: 100%;
+    margin-top: 0;
+    @include breakpoint(beta) {
+        article {
+            display: block;
+            width: 100%;
+            text-align: left;
+        }
+    }
+    @include breakpoint(gamma) {
+        float: left;
+        margin-top: 0;
+        margin-right: 3em;
+        article {
+            width: 620px;
+            margin-left: 0;
+        }
+    }
+    @include breakpoint(delta) {
+        article {
+            width: 780px;
+            margin-left: 0;
+        }
+    }
+}
+
+.homepage--bright {
+    max-width: 100%;
+    article { 
+        margin-top: 0;
+        margin-bottom: 20px;
+        max-width: 100%;
+    }
+    .odd, .even { margin-left: 0; margin-right: 0; padding-left: 0; min-height: 270px;}
+    @include breakpoint(delta) {
+        margin-left: 0;
+        float: right;
+        max-width: 33%;
+        article {
+            float: left;
+            width: 45%;
+            margin-left: 1em;
+        }
+        .odd { margin-right: 10px;}
+    }
+    @include breakpoint(gamma) {
+        float: right;
+        max-width: 33%;
+        margin-top: 0;
+        article {
+            max-width: 100%;
+        }
+    }
+    @include breakpoint(beta) {
+        margin-top: 0;
+        article {
+            max-width: 50%;
+        }
+    }
+    @include breakpoint(beta-2) {
+        margin-top: 0;
+        article {
+            max-width: 47%;
+        }
+        .odd { margin-right: 10px;}
+    }
+    .post--image {
+        margin-left: 0 !important;
+        margin-bottom: .5em;
+        max-height: 130px;
+        overflow: hidden;
+        img {
+            max-width: 100%;
+            width: 100%;
+            display: block; 
+            /* just in case, to force correct aspect ratio */
+            height: auto !important;
+            width: auto\9; /* ie8+9 */
+            /* lt ie8 */
+            -ms-interpolation-mode: bicubic; 
+        }
+        @include breakpoint(epsilon){
+            max-height: 160px;
+        }
+    }
+}
+.homepage--arc-big {
+    max-width: 100%;
+    @include breakpoint(gamma) {
+        float: left;
+        max-width: 63%;
+        article {
+            max-width: 47%;
+            width: 47%;
+        }
+    }
+    @include breakpoint(delta) {
+        float: left;
+        max-width: 63%;
+        article {
+            max-width: 49%;
+            
+        }
+    }
+}
+.popular {
+    @include breakpoint(gamma) {
+        article {
+            width: 100%;
+            max-width: 100%;
+        }
+    }
+    @include breakpoint(epsilon) {
+        float: right;
+        max-width: 33%;
+    }
+}
+.homepage--next {
+    @extend %clearfix;
+    text-align: center;
+    clear: left;
+    padding-top: 3em;
+    a {
+        @include fontsize(14);
+        font-family: sans-serif;
+        font-weight: 500;
+        text-transform: uppercase;
+        letter-spacing: 1px;
+        text-decoration: none;
+        padding: 9px 10px 8px;
+        border: $link_color 1px solid;
+    }
+    a:after {
+        content: "\21E2";
+        margin-left: 4px;
+    }
+    a:hover {
+        background: $link_color;
+        color: white;
+    }
+}
+.has-hero {
+    .header-wrapper {
+        margin-bottom: 0;
+    }
+    .homepage--hero {
+        border: 0;
+        padding: 0;
+        max-width: 100%;
+        position: relative;
+        z-index: 1;
+        width: 100vw;
+    }
+    .hero--wrapper {
+        @include constrain_wide;
+        position: relative;
+        z-index: 100;
+        background: rgb(0, 0, 0);
+        background: rgba(0, 0, 0, 0.6);
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
+        filter: alpha(opacity = 70);
+        color: $body_font_light;
+        font-weight: 400;
+        padding-bottom: 30px;
+        p { max-width: 100%; }
+        a { color: $body_font_light;}
+        time {display: none;}
+        .btn {text-decoration: none; color: white; }
+        @include breakpoint(gamma) {
+            margin-top: -218px;
+            max-width: 100%;
+            padding-left: 5px;
+            .btn { margin-top: -15px}
+        }
+    }
+    .main--header {
+        margin-bottom: 12px;
+        margin-top: .67em; 
+        font-family: 'robotoslab', Georgia, Times;
+        font-weight: normal;
+        @include fontsize(36);
+        padding-top: .25em;
+        a {
+            color: white;
+            text-decoration: none;
+        }
+    }
+    .main--location {
+        @include fontsize(9);
+        text-align: center;
+        margin-top: -12px; 
+        margin-bottom: 22px; 
+    }
+    .main--tag {
+        color: white;
+        text-align: center;
+        @include breakpoint(gamma) {
+            margin-top: -10px;
+        }
+    }
+}
+.homepage--about {
+    &:after, &:before {
+        @include faded_line_after;
+    }
+    &:before { margin-bottom: 50px;}
+    @include breakpoint(gamma) {
+    p { 
+        @include fontsize(18);
+    }
+}
+}
+.black {
+    .post--title a {
+        color: white;
+    }
+    .homepage--archives {
+        .post--location a {
+            color: $body_font_light;
+        }
+        img { @include img_plain; }
+    }
+}
+.black .homepage--about {
+    &:after, &:before {
+        @include lighter_faded_line_after;
+    }
+}
+.v082016 {
+    .header-wrapper {
+        @include breakpoint(beta) {
+            border-bottom: none;
+        }
+    }
+    .banner .post--image {
+        @include breakpoint(gamma) {
+            max-height: 800px;
+            overflow: hidden;
+        }
+    }
+    .hero--wrapper {
+        @include breakpoint(gamma) {
+            margin-top: -225px;
+        }
+    }
+}