From 47b79fd9d4329e73cef7929ed8f64d9eeb287ae5 Mon Sep 17 00:00:00 2001
From: luxagraf <sng@luxagraf>
Date: Fri, 15 Jan 2021 14:54:30 -0500
Subject: Proj: Massive design overhaul to simplify code

Cut out Sass syntax, deleted old CSS rules, changed HTML to use
fewer lists and more cascading instead of specific rules. Still requires
compiling with sass to strip comments and compress, but would in theory
work on its own.

Reduced CSS file size by 2/3
---
 design/sassold/_src.scss | 186 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 186 insertions(+)
 create mode 100644 design/sassold/_src.scss

(limited to 'design/sassold/_src.scss')

diff --git a/design/sassold/_src.scss b/design/sassold/_src.scss
new file mode 100644
index 0000000..1896979
--- /dev/null
+++ b/design/sassold/_src.scss
@@ -0,0 +1,186 @@
+pre{
+    white-space: pre-wrap;    
+}
+.latest {
+    @include constrain_narrow;
+    @include fontsize(12);
+    @include smcaps;        
+    font-weight: 400;
+}
+.src-archive {
+    @include constrain_narrow;
+    .topic-hed {
+        @include fontsize(20);
+        margin-top: 1.5em;
+        margin-bottom: 1.5em;
+        @include breakpoint(beta) {
+            @include fontsize(28);
+            margin-top: 1em;
+        }
+    }
+    article {
+        margin-bottom: 3em;
+        p { 
+            color: lighten($body_font_color, 15);
+        }
+    }
+    h2 {
+        @include fontsize(22);
+        font-weight: 400;
+        margin-bottom: .25em;
+        a {
+            color: $body_font_color;
+            color: lighten($body_font_color, 15);
+            text-decoration: none;
+        }
+    }
+
+    p {
+        text-align: left;
+        @include fontsize(16);
+    }
+
+    @include breakpoint(beta) {
+        text-align: left;
+    }
+}
+.src-topics {
+    @include smcaps;
+    @include fontsize(11);
+}
+.src article {
+    ul { 
+        @include constrain_narrow;
+        margin-top: 2em;
+        margin-bottom: 2em;
+    }
+    ul li {
+        text-align: left;
+        list-style: none;
+        margin-left: .5rem;
+        padding-left: .5rem;
+        font-size: 1.5rem;
+    }
+    ul li:before {
+         content:"·";
+         display: inline-block;
+         vertical-align: bottom;
+         font-size: 2.8rem;
+         margin-right: 1rem;
+         line-height: 2.8rem;
+    }
+    ol {
+        text-align: left;
+        @include constrain_narrow;
+        padding-left: 1em;
+        @include fontsize(18);
+        @include breakpoint(beta) {
+            max-width: 580px;
+            @include fontsize(17);
+        }
+        li {
+            margin-top: .75em;
+        }
+    }
+    .footnote ol {
+        list-style-position: outside;
+        @include breakpoint(beta) {
+            max-width: 680px;
+        }
+    }
+    p code, li code {
+        @include fontsize(20);
+        padding: 3px;
+        background: #eaeaea;
+    }
+    h3 {
+        font-family: $fancy_serif;
+        @include fontsize(32);
+        margin: 3.5rem 0 1rem;
+        //letter-spacing: 1px;
+        //border-bottom: 1px #a19d9d dotted;
+        //text-transform: uppercase;
+    }
+    h5 {
+        @include fontsize(22);
+        margin: 3rem 0 -.75rem 0;
+        text-transform: uppercase;
+        border-bottom: 1px #a19d9d dotted;
+        @include fancy_sans;
+        text-align: left;
+    }
+}
+
+.highlight {
+    padding: 1rem;
+    margin-bottom: 1em;
+    // this clever bit comes from https://css-tricks.com/full-width-containers-limited-width-parents/
+    // I tweaked it slightly to add a bit of margin
+    width: 50vw;
+    position: relative;
+    left: 33%;
+    right: 33%;
+    margin-left: -20vw;
+    margin-right: -20vw;
+    pre {
+    }
+}
+.go:before {
+    content: "$ ";
+}
+code > .comment::after {
+    display:none;
+}
+#book-page .book-list {
+    @include constrain_narrow;
+    @include breakpoint(beta) {
+        .book-list-item {
+            width: 45%; 
+        }
+    }
+}
+#book-page section {
+    @include constrain_narrow;
+    max-width: 100%;
+    @include breakpoint(gamma) {
+        margin-left: 80px;
+        p {
+            margin-left: 0;
+        }
+    }
+}
+.paypal-form-wrapper {
+    @include constrain_narrow;
+    text-align: left;
+        @include breakpoint(gamma) {
+        form {
+            margin: 2em 5em;
+        }
+    }
+}
+
+@include breakpoint(beta) {
+    .btn-top {
+        margin-left: 1.2em
+    }
+    .btn-bottom {
+        margin-left: 5em;
+    }
+}
+
+.dotted {
+    list-style-type: disc;
+    li {
+        margin-top: .5em;
+        margin-bottom: .5em;
+    }
+    @include breakpoint(gamma) {
+        font-size: 1.25rem;
+        line-height: 1.6;
+    }
+}
+#donate p {
+    @include fancy_sans;
+    @include fontsize(18);
+    line-height: 1.4;
+}
-- 
cgit v1.2.3