summaryrefslogtreecommitdiff
path: root/design/old/v9
diff options
context:
space:
mode:
Diffstat (limited to 'design/old/v9')
-rw-r--r--design/old/v9/_archives.scss525
-rw-r--r--design/old/v9/_comments.scss122
-rw-r--r--design/old/v9/_details.scss601
-rw-r--r--design/old/v9/_fonts.scss43
-rw-r--r--design/old/v9/_footer.scss83
-rw-r--r--design/old/v9/_forms.scss113
-rw-r--r--design/old/v9/_global.scss267
-rw-r--r--design/old/v9/_header.scss187
-rw-r--r--design/old/v9/_images.scss108
-rw-r--r--design/old/v9/_leaflet.scss1
-rw-r--r--design/old/v9/_lttr.scss63
-rw-r--r--design/old/v9/_map.scss73
-rw-r--r--design/old/v9/_mixins.scss163
-rw-r--r--design/old/v9/_notes.scss160
-rw-r--r--design/old/v9/_pagination.scss44
-rw-r--r--design/old/v9/_photos.scss521
-rw-r--r--design/old/v9/_queries.scss30
-rw-r--r--design/old/v9/_resume.scss179
-rw-r--r--design/old/v9/_src.scss186
-rw-r--r--design/old/v9/_typography.scss10
-rw-r--r--design/old/v9/pdf_gen.scss140
-rw-r--r--design/old/v9/print.scss95
-rw-r--r--design/old/v9/screenv10.scss24
-rw-r--r--design/old/v9/screenv9.scss20
24 files changed, 3758 insertions, 0 deletions
diff --git a/design/old/v9/_archives.scss b/design/old/v9/_archives.scss
new file mode 100644
index 0000000..b5cb4af
--- /dev/null
+++ b/design/old/v9/_archives.scss
@@ -0,0 +1,525 @@
+// container for archive intros
+.intro {
+ @include constrain_wide;
+ font-family: $fancy_serif;
+ @include breakpoint(alpha){
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
+ grid-gap: 1rem;
+ }
+
+}
+// container for archive intros, narrow version
+.intro-narrow {
+ margin-top: 3rem;
+ @include constrain_narrow;
+ p {
+ @include fontsize(18);
+ font-style: italic;
+ }
+ h1 {
+ @include smcaps;
+ @include fontsize(18);
+ text-align: left;
+ }
+}
+.essay-intro {
+ font-family: $fancy_serif;
+ border-bottom: 3px double #efefef;
+ padding-bottom: 3rem;
+ margin-bottom: 4rem;
+ margin-top: 3rem;
+ p {
+ font-style: normal !important;
+ @include fontsize(18);
+ line-height: 1.5;
+ margin-top: 1.2rem !important;
+ &:first-of-type {
+ margin-top: 2rem !important;
+ }
+ }
+ a {
+ text-decoration: underline !important;
+ text-decoration-color: $orange !important;
+
+ }
+ ul {
+ padding-left: 1rem !important;
+ list-style-type: disc !important;
+ }
+ li {
+ margin-bottom: 4px !important;
+ }
+}
+.archive-list .essay-intro {
+ h2 {
+ @include fontsize(38);
+ }
+ h3 {
+ font-weight: normal;
+ font-family: $fancy_serif;
+ @include fontsize(22);
+ line-height: 1.3;
+ font-style: italic;
+ margin: .25rem 0 .5rem;
+ }
+}
+
+// container for archive grid items
+.archive-grid > article {
+ display: inline-block;
+ width: 32%;
+ vertical-align: top;
+}
+.archive-grid {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ @include constrain_wide;
+ display: grid;
+ margin-top: 3rem;
+ @include breakpoint(alpha){
+ grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
+ grid-gap: .75rem;
+ }
+ @include breakpoint(beta){
+ grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
+ grid-gap: .75rem;
+ }
+}
+.archive-circle-grid {
+ grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
+ grid-gap: 4rem;
+ grid-row-gap: 3rem;
+ margin-top: 5rem;
+ img {
+ width: 220px;
+ height: 220px;
+ border-radius: 50%;
+ border: 6px solid #333;
+ object-fit: cover;
+ }
+}
+
+// wrapper for archive pages, makes sure there isn't a narrow col width
+.meta-archive {
+ @include constrain_wide;
+}
+.archive-intro {
+ @include constrain_narrow;
+ border-bottom: 3px double #efefef;
+ padding-bottom: 3rem;
+ margin-bottom: 4rem;
+ margin-top: 3rem;
+ ul {
+ font-family: $fancy_serif;
+ @include fontsize(24);
+ }
+}
+
+@supports (display:grid) {
+ .archive-grid > article {
+ width: auto;
+ }
+}
+// body class archive, article header (usually inherits h2)
+.archive .post-title {
+ font-family: $fancy_serif;
+ @include fontsize(26);
+ line-height: 1.3;
+ font-style: italic;
+ margin: .25rem 0 .5rem;
+ a {
+ @include plain_a;
+ }
+}
+// the date and location are small caps
+.post-date, .post-location {
+ @include smcaps;
+ @include fontsize(14);
+ font-weight: bold;
+ color: $secondary-link-color;
+ line-height: 1.2;
+ text-align: left;
+ margin: 0;
+}
+// slightly larger summary than a p in this context
+.post-summary {
+ font-family: $fancy_serif;
+ @include fontsize(16);
+ line-height: $archive_p_line_height;
+ margin-top: .25rem;
+ text-align: left;
+ margin: 0;
+}
+
+.archive-list {
+ @include constrain_narrow;
+ @include breakpoint(epsilon) {
+ }
+ text-align: left;
+ h1, .list-title {
+ text-align: left;
+ @include fancy_sans;
+ @include fontsize(36);
+ font-weight: normal;
+ }
+ span {
+ @include fancy_sans;
+ @include smcaps;
+ @include fontsize(13);
+ font-weight: bold;
+ color: #999;
+ }
+ ul {
+ padding: 0;
+ list-style-type: none;
+ }
+ a {
+ text-decoration: none;
+ color: lighten($body_font_color, 20);
+ &:hover {
+ color: $link_color;
+ }
+ }
+ h2, .list-hed {
+ font-family: $fancy_serif;
+ @include fontsize(32);
+ margin: 0;
+ line-height: 1.1;
+ }
+ p {
+ margin: 0;
+ @include fontsize(20);
+ font-style: italic;
+ }
+}
+// Specific pages vary slightly
+// Books
+.book-grid {
+ @include breakpoint(alpha){
+ grid-gap: .75rem;
+ grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
+ }
+ @include breakpoint(beta){
+ grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+ grid-gap: .75rem;
+ }
+ .post-title {
+ @include fontsize(22);
+ line-height: 1.4;
+ }
+ .author {
+ @include smcaps;
+ font-weight: 400;
+ @include fontsize(12);
+ text-align: left;
+ margin: 0;
+
+ }
+ .book-stars {
+ display: block;
+ }
+}
+
+// Dialogues
+.dialogue-grid {
+ .post-title {
+ font-style: normal;
+ @include fontsize(22);
+ line-height: 1.4;
+ }
+}
+// Dialogues, used in both archives and details
+.sci {
+ font-style: italic;
+ @include fontsize(18);
+}
+
+// figments
+.figments-grid {
+ @include constrain_narrow;
+ .post-title {
+ font-style: normal;
+ @include smcaps;
+ @include fontsize(16);
+ }
+}
+
+.wide-list {
+ @include constrain_wide;
+ li {
+ margin-top: 3rem;
+ margin-left: auto;
+ margin-top: auto;
+ margin-bottom: 3rem;
+ }
+ .permalink {
+ display: block;
+ text-align: left;
+ }
+ @include breakpoint(gamma) {
+ li {
+ display: flex;
+ }
+ .wide-wrapper {
+ flex: 3 0px;
+ order: 1;
+ }
+ a {
+ flex: 3 0px;
+ order: 2;
+ }
+ .post-summary p {
+ @include fontsize(20);
+ margin-right: 2rem;
+ }
+ }
+}
+
+// Homepage
+#home .header-wrapper {
+ margin-bottom: 0;
+}
+#home section {
+ @extend %clearfix;
+ @include constrain_wide;
+ margin-top: 4rem;
+ margin-bottom: 4rem;
+}
+#home section.bio-short {
+ margin-bottom: 6rem;
+}
+@include breakpoint(gamma){
+ .recent {
+ max-width: 64%;
+ width: 64%;
+ float: left;
+ }
+ .popular {
+ max-width: 33%;
+ width: 33%;
+ float: right;
+ }
+}
+.banner {
+ margin-top: 0 !important;
+ .post-image {
+ overflow: hidden;
+ }
+ article {
+ position: relative;
+ }
+ figcaption {
+ border: none;
+ position: absolute;
+ margin: 0;
+ bottom: 0;
+ width: 100%;
+ 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);
+ font-weight: 400;
+ padding-bottom: 30px;
+ time {display: none;}
+ .btn {text-decoration: none; color: white; }
+ }
+ .hero-text-wrapper {
+ padding-top: 2rem;
+ @include constrain_narrow;
+ color: white;
+ font-family: $headline_font_serif;
+ .post-title, .post-subtitle {
+ font-style: normal;
+ text-align: center;
+ margin-bottom: 0;
+ line-height: 1;
+ @include fontsize(42);
+ a {
+ color: white;
+ margin-bottom: 0;
+ text-decoration: none;
+ }
+ }
+ .post-subtitle {
+ font-style: italic;
+ @include fontsize(22);
+ margin-top: .45rem;
+ }
+ .post-location {
+ text-align: center;
+ margin-top: .5rem;
+ .h-adr {
+ border-top: 1px solid #423f3f;
+ display: inline-block;
+ padding-top: .5rem;
+ }
+ }
+ a {
+ color: $body_font_light;
+ padding: 0;
+ border: none;
+ margin-top: .5rem;
+ }
+ }
+ .post-location {
+ color: lighten($body_font_light, 5);
+ a {
+ color: lighten($body_font_light, 5);
+ text-decoration: none;
+ @include fontsize(14);
+ }
+ }
+ .btn {
+ @include smcaps;
+ @include fancy_sans_bold;
+ @include fontsize(12);
+ line-height: 1;
+ display: block;
+ max-width: 40px;
+ background: #b53a04;
+ border-radius: .35em;
+ color: white !important;
+ text-transform: uppercase;
+ padding: .85rem 1rem .55rem !important;
+ text-align: center;
+ margin: 2rem auto 0;
+ }
+ @include breakpoint(gamma){
+ max-height: 900px;
+ .post-image {
+ max-height: 900px;
+ }
+ }
+}
+.homepage-map-img {
+ width: 350px;
+ height: auto;
+ @include breakpoint(delta){
+ float: left;
+ width: 350px;
+ margin-right: 2rem;
+ }
+
+}
+@include breakpoint(delta){
+ .addafter {
+ &:after {
+ content: "to the left";
+ }
+ }
+ .subcontent {
+ border: 0;
+ clip: rect(0 0 0 0);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ width: 1px;
+ }
+}
+.homepage-section-header {
+ @include fancy_sans;
+ @include fontsize(24);
+ font-weight: normal;
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(28);
+ line-height: 1.4;
+ }
+}
+.popular, .recent {
+ .post-title {
+ @include fontsize(22);
+ font-weight: 400;
+ }
+ .post-image {
+ max-height: 12rem;
+ overflow: hidden;
+ }
+ img {
+ margin-top: -20%
+ }
+}
+.homepage-next {
+ margin: 0 auto;
+ text-align: center;
+ a {
+ @include fontsize(14);
+ @include fancy_sans;
+ @include smcaps;
+ font-weight: 500;
+ text-decoration: none;
+ padding: 12px 10px 12px;
+ border: $link_color 1px solid;
+ &:after {
+ content: "\21E2";
+ margin-left: 4px;
+ }
+ &:hover {
+ background: $link_color;
+ color: white;
+ }
+ }
+}
+.essay-archive {
+ li {
+ margin-bottom: 2.8rem;
+ }
+}
+.fancy-archive-list {
+ li { margin-bottom: 3.8rem }
+ p {
+ line-height: 1.3;
+ margin-top: 4px;
+ }
+ h3.p-summary {
+ @include fontsize(22);
+ font-weight: 300;
+ font-family: $headline_font_serif;
+ font-style: italic;
+ margin-top: .25rem;
+ margin-bottom: .25rem;
+ line-height: 1.2;
+ }
+ .post-location {
+ margin: .5rem 0 0 0;
+ }
+}
+.circle-img-wrapper {
+ width: 106px;
+ height: 106px;
+ float: left;
+ overflow: hidden;
+ border-radius: 50%;
+ border: 3px solid #666;
+ margin-right: .5rem;
+ img {
+ width: 160px;
+ max-width: 160px;
+ }
+ @include breakpoint(gamma) {
+ margin-left: -128px;
+ margin-top: -4px;
+ }
+}
+
+
+//.note-pad-top {
+// //make a field note among photos stand out more
+// margin-top: 8rem !important;
+// &:before {
+// margin-bottom: 2.5rem;
+// @include faded_line_after;
+// }
+//}
+//.note-pad-bottom {
+// //make a field note among photos stand out more
+// margin-bottom: 8rem !important;
+// &:after {
+// @include faded_line_after;
+// }
+//}
diff --git a/design/old/v9/_comments.scss b/design/old/v9/_comments.scss
new file mode 100644
index 0000000..39c7930
--- /dev/null
+++ b/design/old/v9/_comments.scss
@@ -0,0 +1,122 @@
+//### COMMENTS AND FORMS ###
+.comments--header {
+ @include constrain_narrow;
+ @include fancy_sans;
+ line-height: 6em;
+ @include fontsize(16);
+ font-style: italic;
+ margin-top: 2em;
+}
+.comments--wrapper {
+ @include constrain_narrow();
+ text-align: left;
+ margin-top: -2em;
+}
+.comment {
+ margin-top: 2.5em;
+ margin-bottom: 2.5em;
+ padding-top: 3rem;
+ &:first-child {
+ margin-top: none;
+ }
+ &:after {
+ @include faded_line_after;
+ }
+ &:last-child:after {
+ display: none;
+ }
+}
+.comment--head, .comment--body {
+ @include breakpoint(alpha) {
+ margin-left: 80px;
+ margin-top: -2rem;
+ }
+}
+.comment--head {
+ margin-bottom: 1em;
+}
+.comment--body {
+ margin-bottom: 3em;
+ @include fontsize(22);
+ hr {
+ width: 20%;
+ overflow: visible;
+ padding: 0;
+ border: none;
+ border-top: 2px solid #d4d4d4;
+ color: #efefef;
+ background: none;
+ }
+}
+.who {
+ @include fancy_sans;
+ @include fontsize(22);
+}
+.when {
+ @include fancy_sans;
+ @include fontsize(15);
+ color: #999;
+ margin-left: 1em;
+}
+
+.gravatar {
+ border: 2px $brown solid;
+ background: transparent;
+ max-width: 100%;
+ padding: 0;
+ float: left;
+ margin-top: 5px;
+ margin-right: 8px;
+ @include breakpoint(alpha) {
+ margin-right: 0;
+ }
+}
+
+
+.comment--form--wrapper {
+ @include constrain_narrow();
+ p {
+ font-family: $fancy_serif;
+ }
+ input[type="submit"] {
+ display: inline-block;
+ @include fancy_sans;
+ @include fontsize(14);
+ font-weight: 600;
+ width: auto;
+ text-transform: uppercase;
+ padding: 8px 12px 7px;
+ }
+ .submit {
+ @extend %clearfix;
+ display: block;
+ margin-right: 0;
+ }
+ .submit .btn {
+ float: right;
+ &:first-of-type {
+ margin-left: 5px;
+ }
+ }
+ label {
+ left: 1.2rem !important;
+ }
+}
+.comment-form-border{
+ border-top: 3px double #efefef;
+}
+.comment--form--header {
+ margin-top: 2em;
+ .hed {
+ @include fontsize(28);
+ margin: 0;
+ }
+ .subhed {
+ font-style: italic;
+ @include fontsize(20);
+ line-height: 1.25;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+}
+
diff --git a/design/old/v9/_details.scss b/design/old/v9/_details.scss
new file mode 100644
index 0000000..53e819f
--- /dev/null
+++ b/design/old/v9/_details.scss
@@ -0,0 +1,601 @@
+.detail {
+ #article {
+ padding-bottom: 2rem;
+ border-bottom: 3px double #efefef;
+ }
+ article {
+ font-family: $fancy_serif;
+ @include constrain_narrow;
+ margin-top: 4rem;
+ h1 {
+ font-family: $fancy_serif;
+ line-height: 1em;
+ letter-spacing: -1px;
+ @include fontsize(48);
+ font-weight: normal;
+ margin-bottom: .25rem
+ }
+ ul {
+ text-align: left;
+ @include fontsize(18);
+ }
+ }
+ .post-subtitle {
+ font-style: italic;
+ font-size: 1.4rem;
+ line-height: 1.25;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+ .post-subtitle-segundo {
+ @include fancy_sans;
+ @include smcaps;
+ @include fontsize(13);
+ font-weight: bold;
+ color: #999;
+
+ }
+ .post-linewrapper {
+ margin-top: 1rem;
+ padding-top: 1rem;
+ display: inline-block;
+ border-top: 1px solid #efefef;
+ }
+ .post-location {
+ color: #b6b6b6;
+ text-align: center;
+ a {
+ color: #b6b6b6;
+ text-decoration: underline;
+ text-decoration-color: $orange;
+ }
+ @include breakpoint(gamma) {
+ text-align: left;
+ }
+ }
+ .post-date {
+ text-align: center;
+ @include breakpoint(alpha) {
+ text-align: left;
+ }
+ }
+ .map {
+ width: 100vw;
+ position: relative;
+ left: 50%;
+ right: 50%;
+ margin-left: -50vw;
+ margin-right: -50vw;
+ }
+ .post-header {
+ @include fancy_sans;
+ @include fontsize(18);
+ color: lighten($body_font_color, 20);
+ padding-bottom: 2.6rem;
+ border-bottom: 1px solid #efefef;
+ @include breakpoint(alpha) {
+ text-align: left;
+ }
+ time {
+ }
+ }
+ p:first-of-type {
+ margin-top: 2.6rem;
+ }
+ h4, h5 {
+ @include fancy_sans;
+ margin: 3rem 0 0 0;
+ }
+ h4 + p, .afterward h4 + p {
+ margin-top: .125rem;
+ }
+ h5 {
+ margin: 0
+ }
+ .afterward {
+ p {font-style: italic;}
+ h4 {
+ margin-bottom: 0;
+ }
+ }
+ p.small {
+ @include fontsize(18);
+ }
+ .sci {
+ text-align: center;
+ @include fontsize(24);
+ font-weight: 400;
+ margin: 0;
+
+ }
+ .sci:nth-child(3) {
+ @include fontsize(18);
+ margin-bottom: 2rem;
+ }
+ ul {
+ list-style: circle;
+ margin-left: 2.5em;
+ list-style-position: outside;
+ margin-bottom: 2.4em;
+ }
+ // Ack, id selector, so wrong, but easy handles the slightly different footer
+ // in the dialogue section that lists all the sightings
+ #endnode {
+ h5 {
+ @include fontsize(14);
+ @include smcaps;
+ @include fancy_sans;
+ margin-bottom: 1rem;
+ margin-top: 2rem;
+ }
+ ul {
+ margin-bottom: 2em;
+ list-style-type: none;
+ padding: 0;
+ li {
+ color: lighten($body_font_color, 30);
+ margin-bottom: 0;
+ margin-top: 0;
+ &:before {
+ content: "\2022";
+ color: lighten($body_font_color, 30);
+ margin-right: .35rem;
+ }
+ }
+ }
+ }
+ #detail-map-canvas {
+ height: 400px;
+ width: 98vw;
+ position: relative;
+ left: 49%;
+ right: 49%;
+ margin-left: -48vw;
+ margin-right: -49vw;
+ }
+}
+.post-dateline {
+ display: inline-block;
+ margin-top: 0em;
+ padding-top: 1rem;
+ padding-bottom: 2.6rem;
+ border-top: 1px solid #efefef;
+}
+header.tight {
+ margin-bottom: 3rem;
+ * {
+ margin: 0;
+ text-align: center;
+ }
+ h1 {
+ margin-bottom: 1rem;
+ }
+ h2 {
+ display: inline-block;
+ border-top: 1px solid darken(#efefef, 10);
+ padding-top: 1rem;
+ }
+ h3 {
+ margin-top: .35rem;
+ }
+}
+h4.post-source {
+ @include fontsize(14);
+ @include smcaps;
+ padding-bottom: 0em;
+ margin-bottom: 0;
+ margin-top: 0;
+ font-weight: bold;
+ color: #b6b6b6;
+ a {
+ color: #b6b6b6;
+ &:hover {
+ color: $link_color;
+ }
+ }
+}
+.post-location {
+ h3 {
+ display: inline;
+ @include fontsize(14);
+ }
+ a {
+ color: $secondary_link_color;
+ text-decoration: none;
+ }
+}
+.post-essay ~ p:first-child:first-letter {
+ @include fancy_sans;
+ font-size: 75px;
+ line-height: 60px;
+ padding-top: 4px;
+ padding-right: 8px;
+ padding-left: 3px;
+}
+//### GUIDE STUFF ###
+.product-card {
+ margin: 5rem 0;
+}
+.detail .product-link {
+ a {
+ display: block;
+ padding: 1rem;
+ background: #249bd6;
+ color: white;
+ text-transform: uppercase;
+ font-size: 16px;
+ text-decoration: none;
+ }
+}
+.buy-btn {
+ @include fancy_sans;
+ display: block;
+ padding: .5rem 1rem;
+ background: #249bd6;
+ color: white;
+ text-transform: uppercase;
+ @include fontsize(16);
+ text-decoration: none;
+ margin-right: 1rem;
+}
+.buy-btn-wrapper {
+ display: flex;
+ justify-content: start;
+ align-items: center;
+ align-content: space-between;
+ h4 {
+ margin: 0 1.5rem 0 0;
+ line-height: normal;
+ &:after {
+ content: ":";
+ }
+ }
+ h5 {
+ margin-right: 1rem;
+ }
+}
+.post-guide .buy-btn-wrapper {
+ margin-top: 4rem;
+ justify-content: center;
+}
+.detail .post-guide {
+ h3 {
+ @include fontsize(27);
+ margin: 4rem 0 .5rem 0;
+ & + p {
+ margin-top: 0;
+ }
+ }
+}
+//### PAGE NAVIGATION ###
+.nav-wrapper {
+ @include constrain_narrow();
+ border-bottom: 3px double #efefef;
+}
+#page-navigation {
+ margin: 2em auto;
+ text-align: center;
+ display: table;
+ ul {
+ list-style-type: none;
+ margin: 0 auto;
+ width: 100%;
+ text-align: center;
+ padding: 0;
+ }
+ li {
+ margin: 6px auto;
+ clear: both;
+ line-height: 24px;
+ text-align: center;
+ }
+ span {
+ @include fancy_sans;
+ @include fontsize(14);
+ min-width: 70px;
+ display: block;
+ text-align: right;
+ margin-right: 10px;
+ float: left;
+ }
+ a {
+ display: block;
+ float: left;
+ font-family: $fancy_serif;
+ text-align: left;
+ font-style: italic;
+ color: $brown;
+ text-decoration: none;
+ }
+}
+
+.article-afterward {
+ @extend %clearfix;
+ @include constrain_narrow;
+ padding-bottom: 2rem;
+ .article-card-mini {
+ margin-bottom: 0
+ }
+ .hedtinycaps {
+ display: inline-block;
+ margin-bottom: 2.5rem;
+ border-bottom: 2px solid #efefef;
+ }
+ @include breakpoint(gamma) {
+ @include constrain(960px);
+ }
+}
+.related-bottom {
+ @extend %clearfix;
+ &:after {
+ display: block;
+ content: '';
+ @include constrain_narrow;
+ height: 30px;
+ border-bottom: 3px double #efefef;
+ }
+}
+.article-card-list {
+ padding: 0 !important;
+ margin: 0 !important;
+ list-style-type: none !important;
+ margin: 0 auto !important;
+}
+.article-card-mini, .detail .article-card-mini {
+ margin-left: 0;
+ margin-right: 0;
+ margin-bottom: 2rem;
+ max-width: 100%;
+ a { text-decoration: none;}
+ .post-title {
+ @include fontsize(20);
+ text-align: center;
+ line-height: 1.2;
+ margin: 0;
+ }
+ .post-subtitle {
+ @include fontsize(18);
+ text-align: center;
+ font-family: $fancy_serif;
+ font-style: italic;
+ font-weight: normal;
+ margin: .25rem auto 0;
+ }
+ .post-summary, .post-date{
+ text-align: center;
+ display: inline-block;
+ line-height: 0.6 !important;
+ color: #b6b6b6;
+ }
+ @include breakpoint(omega) {
+ margin: 0 auto;
+ max-width: 70%;
+ margin-bottom: 0;
+ }
+ @include breakpoint(alpha) {
+ max-width: 50%;
+ }
+ @include breakpoint(beta) {
+ max-width: 47%;
+ float: left;
+ margin-right: 1rem;
+ margin-bottom: 1.5rem;
+ }
+ @include breakpoint(gamma) {
+ max-width: 230px;
+ float: left;
+ margin-right: .5rem;
+ }
+}
+.post-mini-image {
+ max-height: 220px;
+ overflow: hidden;
+ @include breakpoint(beta) {
+ margin-bottom: 1rem;
+ }
+ img {
+ margin-top: -20%;
+ }
+}
+
+
+.entry-footer {
+ @extend %clearfix;
+ @include constrain_narrow;
+ border-bottom: 3px double #efefef;
+ margin-top: 2em;
+ text-align: left;
+ h3 {
+ @include smcaps;
+ @include fontsize(16);
+ }
+ h3 + ul {
+ padding: 0;
+ }
+ li {
+ margin: .25em 0;
+ list-style-type: none;
+ }
+ li ul {
+ columns: 2 auto;
+ list-style-type: none;
+ margin-left: .5rem;
+ padding: 0;
+ }
+ li ul li:before {
+ content: "\2022";
+ margin-right: .45rem;
+ color: lighten($body_font_color, 40);
+ }
+ .grouper {
+ margin-top: 1em;
+ }
+ a {
+ text-decoration: none;
+ color: lighten($body_font_color, 20);
+ }
+ #wildlife li ul li {
+ color: lighten($body_font_color, 40);
+ a {
+ color: lighten($body_font_color, 10);
+ }
+ }
+ @include breakpoint(beta) {
+ padding-bottom: 2rem;
+ #wildlife {
+ max-width: 55%;
+ float: left;
+ margin-right: 1.2rem;
+ }
+ #recommended-reading{
+ ul {
+ list-style-type: none;
+ }
+ img {
+ max-width: 180px;
+ }
+ }
+ }
+ aside {
+ @extend %clearfix;
+ }
+}
+#field_notes {
+ @include breakpoint(beta) {
+ max-width: 33%;
+ float: left;
+ margin-top: .15em;
+ margin-left: 7em;
+ }
+ li:before {
+ content: "\2022";
+ margin-right: .35rem;
+ color: $body_font_light;
+ }
+}
+.rr-clear {
+ clear: left;
+}
+
+//### FOOTNOTES ###
+.footnote {
+ margin: 1em auto 0 auto;
+ padding: 0;
+ list-style-type: none;
+ p {
+ font-size: 1rem;
+ line-height: 1.4;
+ margin-top: 0 !important;
+ }
+ hr {display: none;}
+ ol {
+ padding-left: 1em;
+ @include breakpoint(alpha) {
+ margin-left: 1em;
+ }
+ }
+}
+sup {
+ line-height: 1;
+ .footnote-ref {
+ padding: 4px 3px;
+
+ }
+}
+
+//### Figments ###
+.downloads {
+ list-style-type: none;
+}
+
+// ### Books ###
+.book {
+ &:after {
+ display: block;
+ content: '';
+ height: 30px;
+ border-bottom: 3px solid #efefef;
+ width: 200px;
+ margin: 0 auto 3rem auto;
+ padding-left: 30px;
+ }
+}
+.book-metadata {
+ text-align: left;
+ @include fancy_sans;
+ dd {
+ display: inline;
+ margin: 0;
+ }
+ dd:after{
+ display: block;
+ content: '';
+ }
+ dt{
+ display: inline-block;
+ }
+ dt:after {
+ content: ":";
+ }
+}
+.thoughts, .highlights, .meta-cover, .dis {
+ @include constrain_narrow;
+ font-family: $fancy_serif;
+ text-align: left;
+ p {
+ max-width: 100%;
+ }
+}
+.book-cover-wrapper {
+ @include constrain_wide;
+ img {
+ float: left;
+ max-width: 20rem;
+ }
+}
+.thoughts {
+ margin-top: 4rem;
+ p:first-of-type {
+ margin-top: 0;
+ }
+}
+.thoughts h5, .highlights h4 {
+ font-weight: 500;
+ letter-spacing: 1px;
+ margin: 3em 0 .5em 0;
+ @include fancy_sans;
+ @include smcaps;
+ @include fontsize(14);
+}
+.highlights div:first-of-type p:first-of-type {
+ margin-top: 0;
+}
+.book-highlight p:last-of-type {
+ margin-bottom: 0;
+}
+.book p:last-of-type, .highlights div:first-of-type p:last-of-type{
+ margin-top: 8px;
+}
+.highlink {
+ @include fontsize(20);
+ margin-right: .5rem;
+ float: left;
+ line-height: 1.6;
+ text-decoration: none;
+ color: lighten($body_font_color, 60);
+ @include breakpoint(alpha) {
+ margin-top: 1px;
+ }
+ &:visited {
+ color: lighten($body_font_color, 60);
+ }
+}
+.foot {
+ margin-top: 16px;
+ @include fancy_sans;
+ @include fontsize(16);
+}
+.dis {
+ @include fontsize(16);
+ text-align: center;
+}
diff --git a/design/old/v9/_fonts.scss b/design/old/v9/_fonts.scss
new file mode 100644
index 0000000..1ae40f8
--- /dev/null
+++ b/design/old/v9/_fonts.scss
@@ -0,0 +1,43 @@
+@font-face {
+ font-family: 'carrois_gothicregular';
+ src: url('/media/fonts/carroisgothic-regular-webfont.eot');
+ src: url('/media/fonts/carroisgothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
+ url('/media/fonts/carroisgothic-regular-webfont.woff') format('woff'),
+ url('/media/fonts/carroisgothic-regular-webfont.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
+ font-display: swap;
+}
+@font-face {
+ font-family: 'mffweb';
+ src: url('/media/fonts/ffmpb.woff2') format('woff2');
+ src: url('/media/fonts/ffmpb.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+ font-display: swap;
+}
+@font-face {
+ font-family: 'mffweb';
+ src: url('/media/fonts/ffmbi.woff2') format('woff2');
+ src: url('/media/fonts/ffmbi.woff') format('woff');
+ font-weight: 400;
+ font-style: italic;
+ font-display: swap;
+}
+@font-face {
+ font-family: 'mffnweb';
+ src: url('/media/fonts/ffmn.woff2') format('woff2');
+ src: url('/media/fonts/ffmn.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+ font-display: swap;
+}
+@font-face {
+ font-family: 'mffnbweb';
+ src: url('/media/fonts/ffmn.woff2') format('woff2');
+ src: url('/media/fonts/ffmn.woff') format('woff');
+ font-weight: 700;
+ font-style: normal;
+ font-display: swap;
+}
+
diff --git a/design/old/v9/_footer.scss b/design/old/v9/_footer.scss
new file mode 100644
index 0000000..08c9942
--- /dev/null
+++ b/design/old/v9/_footer.scss
@@ -0,0 +1,83 @@
+footer {
+ margin-top: 5em;
+ @include breakpoint(gamma) {
+ max-width: 960;
+ }
+ &:before {
+ @include breakpoint(beta) {
+ @include faded_line_after;
+ margin-bottom: 1.2em;
+ }
+ }
+ .footer-nav {
+ list-style-type: none !important;
+ margin-left: 0 !important;
+ border-top: 1px $brown dotted;
+ border-bottom: 1px $brown dotted;
+ padding: .5rem 0;
+ @include breakpoint(beta) {
+ border: none;
+ }
+ }
+ li {
+ display: inline;
+ margin: 0 .25em;
+ &:after {
+ content: "\00b7";
+ color: #999999;
+ padding-left: 0.75em;
+ }
+ a {
+ color: $secondary-link-color;
+ text-decoration: none;
+ }
+ ul { display:inline;}
+ }
+ li:last-of-type {
+ margin-right: 0;
+ &:after {
+ content: " ";
+ }
+ }
+ p {
+ @include fontsize(10);
+ text-align: center;
+ margin-top: 1.5em;
+ margin-bottom: 1.5em;
+ }
+}
+.black footer, .dark footer {
+ &:before {
+ @include light_faded_line_after;
+ }
+ a {
+ color: $body_font_light;
+}
+}
+.donate-btn {
+ display: inline-block;
+ margin-left: .5rem;
+ input[type="submit"] {
+ background: url("img/pp_donate.gif") 0 0 no-repeat;
+ border: none;
+ width: 100px;
+ text-indent: -9999em;
+ line-height: 19px;
+ padding: 2px 7px 10px;
+ }
+}
+.liberapay-btn {
+ background: url("img/lpdonate.svg") 0 0 no-repeat;
+ text-indent: -9999em;
+ display: inline-block;
+ line-height: 25px;
+ padding: 5px 7px 3px;
+ text-decoration: none;
+ width: 70px;
+}
+#license {
+ @include fancy_sans;
+ @include fontsize(12);
+ text-transform: none;
+ letter-spacing: normal;
+}
diff --git a/design/old/v9/_forms.scss b/design/old/v9/_forms.scss
new file mode 100644
index 0000000..4e0227b
--- /dev/null
+++ b/design/old/v9/_forms.scss
@@ -0,0 +1,113 @@
+.generic-form {
+ margin: 2rem 0;
+ @extend %clearfix;
+ fieldset {
+ padding: 0;
+ border: none;
+ width: 100%;
+ position: relative;
+ }
+ input[type=email] {
+ width: 210px;
+ @include fontsize(18);
+ background-color: #fff;
+ border: 2px solid darken(#efefef, 10);
+ border-radius: 5px;
+ height: 2.2rem;
+ padding: 4px 4px 4px 8px;
+ margin-right: .5rem;
+ @include breakpoint(omega){
+ width: 92%;
+ }
+ @include breakpoint(alpha){
+ width: 96%;
+ }
+ }
+ label {
+ display: block;
+ visibility: hidden;
+ width: 0;
+ height: 0;
+ }
+ .btn-hollow {
+ @include fontsize(16);
+ display: inline-block;
+ padding: 10px 15px;
+ margin-bottom: 0;
+ line-height: 20px;
+ text-align: center;
+ vertical-align: middle;
+ cursor: pointer;
+ color: #ddd;
+ border: 0;
+ border-radius: 5px;
+ font-weight: bold;
+ transition: all 0.2s ease;
+ background: $orange;
+ &:hover {
+ color: white;
+ }
+ }
+}
+.flex {
+ display: flex;
+ .btn, .btn-hollow {
+ flex-basis: 10%;
+ }
+}
+
+
+form fieldset {
+ margin: 1rem 0;
+ padding: 0;
+ border: none;
+ width: 100%;
+ position: relative;
+}
+form fieldset label {
+ position: absolute;
+ -webkit-transform: translate3d(10px, 100%);
+ -moz-transform: translate3d(10px, 100%);
+ -ms-transform: translate3d(10px, 100%);
+ -o-transform: translate3d(10px, 100%);
+ transform: translate3d(10px, 100%);
+ @include fontsize(14);
+ @include fancy_sans;
+ color: lighten($body_font_color, 25);
+ line-height: 14px;
+ top: .7rem;
+ left: .75rem;
+ z-index: 1;
+}
+input, .textarea-rounded textarea {
+ border: 1px solid #dedddd;
+ border-radius: 4px;
+ padding: 2.2rem 0 .75rem .75rem;
+ width: 96%;
+ @include fontsize(24);
+ @include fancy_sans;
+}
+
+.btn {
+ @include fontsize(15);
+ display: inline-block;
+ border-radius: 4px;
+ -webkit-appearance: none;
+ text-decoration: none;
+ cursor: pointer;
+ background: $link_color;
+ color: #fff;
+ border: 1px solid $link_color;
+ padding: 7px 14px;
+ white-space: nowrap;
+ &:hover {
+ background: $link_color;
+ border: 1px solid $link_color;
+ }
+}
+.newsletter-subscribe {
+ margin: 3rem 0;
+ fieldset {
+ margin: 0;
+ }
+}
diff --git a/design/old/v9/_global.scss b/design/old/v9/_global.scss
new file mode 100644
index 0000000..5030dbf
--- /dev/null
+++ b/design/old/v9/_global.scss
@@ -0,0 +1,267 @@
+html {
+ border-top: 0.25em solid $brown;
+}
+
+body {
+ margin: 0 auto;
+ padding: 0;
+ overflow-x: hidden;
+ font:$body_p_font;
+ color: $body_font_color;
+ text-align: center;
+ background-color: transparent
+}
+ul {
+ padding: 0;
+}
+// eliminate touch delay on mobile safari
+a, button, input, select, textarea, label, summary {
+ touch-action: manipulation;
+}
+a {
+ color: $body_font_color;
+ -webkit-transition: all 0.1s ease;
+ -moz-transition: all 0.1s ease;
+ -ms-transition: all 0.1s ease;
+ transition: all 0.1s ease;
+ text-decoration-color: $orange;
+ &:hover {
+ text-decoration: none;
+ }
+ &:visited {
+ color: $body_font_color;
+ }
+}
+p {
+ text-align: left;
+ font-family: $fancy_serif;
+ @include fontsize(20);
+ @include breakpoint(alpha){
+ @include fontsize(22);
+ line-height: 1.5;
+ }
+ @include breakpoint(beta){
+ @include fontsize(24);
+ line-height: 1.6;
+ }
+}
+time {
+ @include smcaps;
+ @include fontsize(11);
+ display: block;
+ span {
+ @include fontsize(13);
+ }
+}
+abbr {
+ cursor: help;
+}
+pre {
+ text-align: left;
+ @include breakpoint(alpha){
+ @include fontsize(18);
+ line-height: 1.5;
+ }
+}
+object, embed, video {
+ max-width: 100%;
+ width: 100%;
+ height: auto;
+}
+audio {
+ max-width: 100%;
+ width: 100%;
+}
+blockquote {
+ @include fontsize(18);
+ display: block;
+ border-top: 4px solid lighten($body_font_light, 20);
+ border-bottom: 4px solid lighten($body_font_light, 20);
+ margin: 3rem 0;
+ position: relative;
+ text-align: left;
+ font-style: italic;
+ cite {
+ display: block;
+ text-align: right;
+ }
+ @include breakpoint(alpha){
+ @include fontsize(20);
+ line-height: 1.5;
+ }
+ @include breakpoint(beta){
+ @include fontsize(22);
+ line-height: 1.6;
+ }
+}
+blockquote:before {
+ @include fancy_sans;
+ @include fontsize(68);
+ content: '\201C';
+ position: absolute;
+ top: -1.35rem;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 3rem;
+ height: 2rem;
+ color: #666;
+ text-align: center;
+}
+hr {
+ border: 0;
+ height: 1px;
+ @include faded_line_after;
+ margin: 3rem 0;
+}
+img {
+ max-width: 100%;
+}
+figure {
+ margin: 0;
+}
+figcaption {
+ text-align: left;
+}
+figcaption, figcaption a {
+ @include fancy_sans;
+ @include fontsize(16);
+ text-align: left;
+ line-height: 1.9;
+ padding: .3rem .5rem .3rem 0;
+ color: #666;
+ border-bottom: 1px lighten($body_font_light, 20) solid;
+ margin-bottom: 1rem;
+}
+figcaption a:visited {
+ color: #666;
+}
+h1 {
+ font-family: $headline_font_serif;
+ @include fontsize(36);
+ font-weight: normal;
+}
+h2 {
+ font-family: $headline_font_serif;
+ @include fontsize(28);
+ font-weight: normal;
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(30);
+ line-height: 1.6;
+ }
+}
+h3 {
+ font-family: $fancy_sans;
+ @include fontsize(24);
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(28);
+ line-height: 1.4;
+ }
+}
+h4 {
+ @include fontsize(20);
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(22);
+ line-height: 1.4;
+ }
+}
+h5 {
+ @include fontsize(16);
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(18);
+ line-height: 1.4;
+ }
+}
+.subhead {
+ font-size: 26px !important;
+ font-style: italic;
+ margin-top: 0;
+ margin-bottom: 0;
+}
+.subhead + p {
+ margin-top: .75rem !important;
+}
+.essay-intro .subhead + p:first-of-type {
+ margin-top: .75rem !important;
+}
+//************** Universals ************************
+.hide {
+ display: none;
+}
+
+.strike {
+ text-decoration: line-through;
+}
+
+.yes {
+ background: green !important;
+ color: white;
+}
+
+.no {
+ background: red !important;
+ color: white;
+}
+
+.alert {
+ color: red !important;
+}
+//************** other global classes ************************
+.sans {
+ @include generic_sans;
+}
+.bl {
+ @include smcaps;
+ @include fontsize(12);
+ font-weight: 600;
+ color: $secondary-link-color;
+}
+.italic {
+ font-style: italic;
+}
+.small {
+ font-size: 90%;
+}
+.divide-after:after {
+ margin-bottom: 3em;
+ @include faded_line_after;
+}
+.margin-left-none {
+ margin-left: 0 !important;
+}
+//**************** Page Breadcrumbs ************************
+
+#breadcrumbs {
+ @include constrain_wide();
+ padding: 0;
+ list-style-type: none;
+ text-align: center;
+ li {
+ display: inline;
+ }
+ a {
+ color: $secondary-link-color;
+ }
+ @include breakpoint(gamma) {
+ text-align: left;
+ }
+}
+
+.black #breadcrumbs a, .dark #breadcrumbs a {
+ color: $body_font_light;
+}
+//************* Dark Pages *********************
+
+.dark body {
+ background: $brown;
+ color: $body_font_light
+}
+
+.black body {
+ background: #000;
+ color: $body_font_light
+}
+
diff --git a/design/old/v9/_header.scss b/design/old/v9/_header.scss
new file mode 100644
index 0000000..4bba7a7
--- /dev/null
+++ b/design/old/v9/_header.scss
@@ -0,0 +1,187 @@
+.header-wrapper {
+ @include breakpoint(beta) {
+ border-bottom: 1px #f3efef solid;
+ }
+}
+.site-banner {
+ @extend %clearfix;
+ margin: 0 auto;
+ @include constrain_wide;
+ @include smcaps;
+ #logo {
+ a {
+ @include fontsize(32);
+ text-decoration: none;
+ display: block;
+ font-weight: 300;
+ font-family: 'carrois_gothicregular', Helvetica, sans-serif;
+ color: $brown;
+ &:before {
+ display: block;
+ content: "home-icon";
+ text-indent: -9999em;
+ background: url("logo-new-@2x-treeonly.png") center top no-repeat;
+ width: 95px;
+ height: 65px;
+ background-size: 95px;
+ background-size: 85px;
+ //if sox
+ //background: url("img/soxlogo.svg") center top no-repeat;
+ //background-size: 60px;
+ display: block;
+ margin: 5px auto 0;
+ }
+ }
+ .sitesubtitle {
+ display: block;
+ margin-top: -8px;
+ font-family: $fancy_serif;
+ font-style: italic;
+ font-weight: 300;
+ @include fontsize(12);
+ }
+ }
+ nav {
+ border-top: 1px #444444 dotted;
+ border-bottom: 1px #444444 dotted;
+ //box-shadow: 0 3px 8px 0 #e6e6e6
+ padding-left: 20px;
+ padding-right: 20px;
+ margin-right: -20px;
+ margin-left: -20px;
+ margin-top: 1em;
+ padding: 0.25em 0.5em;
+ a {
+ text-decoration: none;
+ color: lighten(#505050, 5);
+ &:visited {
+ color: lighten(#505050, 5);
+ }
+ }
+ ul {
+ @include smcaps;
+ @include fancy_sans;
+ @include fontsize(13);
+ max-width: 100%;
+ font-weight: 600;
+ margin-top: 0.5em;
+ margin-bottom: 0.5em !important;
+ padding: 0;
+ @include constrain(85%);
+ }
+ li {
+ display: inline;
+ margin: 0 0.25em;
+ color: lighten(#505050, 30);
+ &:after {
+ content: "\00b7";
+ color: #999999;
+ padding-left: 0.75em;
+ }
+ &:last-of-type {
+ margin-right: 0;
+ &:after {
+ content: " ";
+ }
+ }
+ }
+ @include breakpoint(beta) {
+ }
+ }
+ @include breakpoint(beta) {
+ height: 90px;
+ position: relative;
+ #logo {
+ float: left;
+ text-align: left;
+ a {
+ width: 360px;
+ line-height: 2.5em;
+ &:before {
+ display: inline-block;
+ background-size: 102px;
+ //if sox
+ //background: url("img/soxlogo.svg") center bottom no-repeat;
+ //background-size: 70px;
+ height: 85px;
+ width: 105px;
+ //if sox
+ //width: 80px;
+ margin-right: 10px;
+ }
+ }
+ .sitesubtitle {
+ margin-left: 116px;
+ //if sox
+ //margin-left: 90px;
+ margin-top: -30px;
+ }
+ }
+ nav {
+ float: right;
+ border: none;
+ margin: 42px 0 0 0;
+ padding: 0;
+ ul {
+ max-width: 50em;
+ }
+ }
+ }
+}
+
+.black header h1 a, .dark header h1 a {
+ color: $body_font_light;
+ &:before {
+ background: url("logo-new-@2x-treeonly.png") center -75px no-repeat;
+ background-size: 92px;
+ }
+ @include breakpoint(gamma) {
+ &:before {
+ background-position-y: -65px;
+ }
+ }
+}
+
+
+.black nav[role="navigation"] a, .dark nav[role="navigation"] a {
+ color: $body_font_light;
+}
+
+
+.header-wrapper {
+ @extend %clearfix;
+ margin-bottom: 1em;
+ @include breakpoint(beta) {
+ border-bottom: 1px #f3efef solid;
+ position: relative;
+ }
+ @include breakpoint(gamma) {
+ max-width: $breakpoint-gamma;
+ margin-left: auto;
+ margin-right: auto;
+ }
+ @include breakpoint(delta) {
+ margin-top: 1.3rem;
+ max-width: $breakpoint-delta;
+ }
+ @include breakpoint(epsilon) {
+ margin-top: 1.3rem;
+ max-width: $max_width;
+ }
+}
+.detail .header-wrapper, .detail #breadcrumbs {
+ transition: opacity .5s;
+ @include breakpoint(epsilon) {
+ opacity: .8;
+ &:hover {
+ opacity: 1;
+ }
+ }
+}
+
+.black .header-wrapper, .dark .header-wrapper {
+ @include breakpoint(beta) {
+ border-bottom: 1px $body_font_light solid;
+ }
+}
+
diff --git a/design/old/v9/_images.scss b/design/old/v9/_images.scss
new file mode 100644
index 0000000..4c0951c
--- /dev/null
+++ b/design/old/v9/_images.scss
@@ -0,0 +1,108 @@
+.picwide, .cluster, .pic960 {
+ // 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: 96vw;
+ position: relative;
+ left: 48%;
+ right: 48%;
+ margin-left: -46vw;
+ margin-right: -50vw;
+ @include breakpoint(gamma) {
+ width: 98vw;
+ position: relative;
+ left: 49%;
+ right: 49%;
+ margin-left: -48.5vw;
+ margin-right: -49.5vw;
+ }
+ @include breakpoint(epsilon) {
+ $margin: ($max_width - $narrow-max-width)/2;
+ left: 0;
+ right: 0;
+ margin-left: -$margin;
+ margin-left: -$margin;
+ width: $max_width;
+ max-width: $max_width;
+ }
+}
+p + .picwide {
+ margin-top: 1.5rem;
+ @include breakpoint(gamma) {
+ margin-top: 2.5rem;
+ }
+}
+.picwide + p {
+ margin-top: 1.5rem;
+ @include breakpoint(gamma) {
+ margin-top: 2.5rem;
+ }
+}
+.cluster {
+ margin-bottom: 2rem;
+ margin-top: 2rem;
+ @include breakpoint(gamma) {
+ margin-bottom: 3rem;
+ margin-top: 3rem;
+ }
+}
+.row-2 {
+ a:last-of-type img, figure:last-of-type {
+ width: 49.7%;
+ float: right;
+ margin-right: 0;
+ }
+ a:first-of-type img, figure:first-of-type {
+ width: 49.7%;
+ float: left;
+ margin-left: 0;
+ margin-right: .3%;
+ }
+ &:after {
+ @extend %clearfix;
+ margin-bottom: .5rem;
+ }
+ figure:first-of-type img, figure:last-of-type img {
+ width: 100%;
+ }
+}
+.banner .post-image {
+ // 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: 100vw;
+ position: relative;
+ left: 50%;
+ right: 50%;
+ margin-left: -50vw;
+ margin-right: -50vw;
+}
+.embed-wrapper {
+ @include constrain_wide;
+ @include breakpoint(gamma) {
+ margin-left: auto;
+ margin-right: auto;
+ }
+}
+.embed-container {
+ position: relative;
+ padding-bottom: 56.25%;
+ height: 0;
+ overflow: hidden;
+ max-width: 100%;
+ margin-bottom: 1rem;
+}
+.embed-container iframe, .embed-container object, .embed-container embed {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+.pullpicleft {
+ display: none;
+ @include breakpoint(gamma) {
+ display: block;
+ float: left;
+ margin-left: -280px;
+ padding-right: 1rem;
+ }
+}
diff --git a/design/old/v9/_leaflet.scss b/design/old/v9/_leaflet.scss
new file mode 100644
index 0000000..b65ffb8
--- /dev/null
+++ b/design/old/v9/_leaflet.scss
@@ -0,0 +1 @@
+.leaflet-map-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-pane,.leaflet-tile-container,.leaflet-overlay-pane,.leaflet-shadow-pane,.leaflet-marker-pane,.leaflet-popup-pane,.leaflet-overlay-pane svg,.leaflet-zoom-box,.leaflet-image-layer,.leaflet-layer{position:absolute;left:0;top:0}.leaflet-container{overflow:hidden;-ms-touch-action:none}.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow{-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.leaflet-marker-icon,.leaflet-marker-shadow{display:block}.leaflet-container img{max-width:none !important}.leaflet-container img.leaflet-image-layer{max-width:15000px !important}.leaflet-tile{filter:inherit;visibility:hidden}.leaflet-tile-loaded{visibility:inherit}.leaflet-zoom-box{width:0;height:0}.leaflet-overlay-pane svg{-moz-user-select:none}.leaflet-tile-pane{z-index:2}.leaflet-objects-pane{z-index:3}.leaflet-overlay-pane{z-index:4}.leaflet-shadow-pane{z-index:5}.leaflet-marker-pane{z-index:6}.leaflet-popup-pane{z-index:7}.leaflet-vml-shape{width:1px;height:1px}.lvml{behavior:url(#default#VML);display:inline-block;position:absolute}.leaflet-control{position:relative;z-index:7;pointer-events:auto}.leaflet-top,.leaflet-bottom{position:absolute;z-index:1000;pointer-events:none}.leaflet-top{top:0}.leaflet-right{right:0}.leaflet-bottom{bottom:0}.leaflet-left{left:0}.leaflet-control{float:left;clear:both}.leaflet-right .leaflet-control{float:right}.leaflet-top .leaflet-control{margin-top:10px}.leaflet-bottom .leaflet-control{margin-bottom:10px}.leaflet-left .leaflet-control{margin-left:10px}.leaflet-right .leaflet-control{margin-right:10px}.leaflet-fade-anim .leaflet-tile,.leaflet-fade-anim .leaflet-popup{opacity:0;-webkit-transition:opacity .2s linear;-moz-transition:opacity .2s linear;-o-transition:opacity .2s linear;transition:opacity .2s linear}.leaflet-fade-anim .leaflet-tile-loaded,.leaflet-fade-anim .leaflet-map-pane .leaflet-popup{opacity:1}.leaflet-zoom-anim .leaflet-zoom-animated{-webkit-transition:-webkit-transform .25s cubic-bezier(0,0,.25,1);-moz-transition:-moz-transform .25s cubic-bezier(0,0,.25,1);-o-transition:-o-transform .25s cubic-bezier(0,0,.25,1);transition:transform .25s cubic-bezier(0,0,.25,1)}.leaflet-zoom-anim .leaflet-tile,.leaflet-pan-anim .leaflet-tile,.leaflet-touching .leaflet-zoom-animated{-webkit-transition:none;-moz-transition:none;-o-transition:none;transition:none}.leaflet-zoom-anim .leaflet-zoom-hide{visibility:hidden}.leaflet-clickable{cursor:pointer}.leaflet-container{cursor:-webkit-grab;cursor:-moz-grab}.leaflet-popup-pane,.leaflet-control{cursor:auto}.leaflet-dragging .leaflet-container,.leaflet-dragging .leaflet-clickable{cursor:move;cursor:-webkit-grabbing;cursor:-moz-grabbing}.leaflet-container{background:#ddd;outline:0}.leaflet-container a{color:#0078A8}.leaflet-container a.leaflet-active{outline:2px solid orange}.leaflet-zoom-box{border:2px dotted #38f;background:rgba(255,255,255,.5)}.leaflet-container{font:12px/1.5 "Helvetica Neue",Arial,Helvetica,sans-serif}.leaflet-bar{box-shadow:0 1px 5px rgba(0,0,0,.65);border-radius:4px}.leaflet-bar a,.leaflet-bar a:hover{background-color:#fff;border-bottom:1px solid #ccc;width:26px;height:26px;line-height:26px;display:block;text-align:center;text-decoration:none;color:black}.leaflet-bar a,.leaflet-control-layers-toggle{background-position:50% 50%;background-repeat:no-repeat;display:block}.leaflet-bar a:hover{background-color:#f4f4f4}.leaflet-bar a:first-child{border-top-left-radius:4px;border-top-right-radius:4px}.leaflet-bar a:last-child{border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-bottom:none}.leaflet-bar a.leaflet-disabled{cursor:default;background-color:#f4f4f4;color:#bbb}.leaflet-touch .leaflet-bar a{width:30px;height:30px;line-height:30px}.leaflet-control-zoom-in,.leaflet-control-zoom-out{font:bold 18px 'Lucida Console',Monaco,monospace;text-indent:1px}.leaflet-control-zoom-out{font-size:20px}.leaflet-touch .leaflet-control-zoom-in{font-size:22px}.leaflet-touch .leaflet-control-zoom-out{font-size:24px}.leaflet-control-layers{box-shadow:0 1px 5px rgba(0,0,0,.4);background:#fff;border-radius:5px}.leaflet-control-layers-toggle{background-image:url(images/layers.png);width:36px;height:36px}.leaflet-retina .leaflet-control-layers-toggle{background-image:url(images/layers-2x.png);background-size:26px 26px}.leaflet-touch .leaflet-control-layers-toggle{width:44px;height:44px}.leaflet-control-layers .leaflet-control-layers-list,.leaflet-control-layers-expanded .leaflet-control-layers-toggle{display:none}.leaflet-control-layers-expanded .leaflet-control-layers-list{display:block;position:relative}.leaflet-control-layers-expanded{padding:6px 10px 6px 6px;color:#333;background:#fff}.leaflet-control-layers-selector{margin-top:2px;position:relative;top:1px}.leaflet-control-layers label{display:block}.leaflet-control-layers-separator{height:0;border-top:1px solid #ddd;margin:5px -10px 5px -6px}.leaflet-container .leaflet-control-attribution{background:#fff;background:rgba(255,255,255,.7);margin:0}.leaflet-control-attribution,.leaflet-control-scale-line{padding:0 5px;color:#333}.leaflet-control-attribution a{text-decoration:none}.leaflet-control-attribution a:hover{text-decoration:underline}.leaflet-container .leaflet-control-attribution,.leaflet-container .leaflet-control-scale{font-size:11px}.leaflet-left .leaflet-control-scale{margin-left:5px}.leaflet-bottom .leaflet-control-scale{margin-bottom:5px}.leaflet-control-scale-line{border:2px solid #777;border-top:none;line-height:1.1;padding:2px 5px 1px;font-size:11px;white-space:nowrap;overflow:hidden;-moz-box-sizing:content-box;box-sizing:content-box;background:#fff;background:rgba(255,255,255,.5)}.leaflet-control-scale-line:not(:first-child){border-top:2px solid #777;border-bottom:none;margin-top:-2px}.leaflet-control-scale-line:not(:first-child):not(:last-child){border-bottom:2px solid #777}.leaflet-touch .leaflet-control-attribution,.leaflet-touch .leaflet-control-layers,.leaflet-touch .leaflet-bar{box-shadow:none}.leaflet-touch .leaflet-control-layers,.leaflet-touch .leaflet-bar{border:2px solid rgba(0,0,0,.2);background-clip:padding-box}.leaflet-popup{position:absolute;text-align:center}.leaflet-popup-content-wrapper{padding:1px;text-align:left;border-radius:12px}.leaflet-popup-content{margin:13px 19px;line-height:1.4}.leaflet-popup-content p{margin:18px 0}.leaflet-popup-tip-container{margin:0 auto;width:40px;height:20px;position:relative;overflow:hidden}.leaflet-popup-tip{width:17px;height:17px;padding:1px;margin:-10px auto 0;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:white;box-shadow:0 3px 14px rgba(0,0,0,.4)}.leaflet-container a.leaflet-popup-close-button{position:absolute;top:0;right:0;padding:4px 4px 0 0;text-align:center;width:18px;height:14px;font:16px/14px Tahoma,Verdana,sans-serif;color:#c3c3c3;text-decoration:none;font-weight:700;background:transparent}.leaflet-container a.leaflet-popup-close-button:hover{color:#999}.leaflet-popup-scrolled{overflow:auto;border-bottom:1px solid #ddd;border-top:1px solid #ddd}.leaflet-oldie .leaflet-popup-content-wrapper{zoom:1}.leaflet-oldie .leaflet-popup-tip{width:24px;margin:0 auto;-ms-filter:"progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678,M12=0.70710678,M21=-0.70710678,M22=0.70710678)";filter:progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678,M12=0.70710678,M21=-0.70710678,M22=0.70710678)}.leaflet-oldie .leaflet-popup-tip-container{margin-top:-1px}.leaflet-oldie .leaflet-control-zoom,.leaflet-oldie .leaflet-control-layers,.leaflet-oldie .leaflet-popup-content-wrapper,.leaflet-oldie .leaflet-popup-tip{border:1px solid #999}.leaflet-div-icon{background:#fff;border:1px solid #666}
diff --git a/design/old/v9/_lttr.scss b/design/old/v9/_lttr.scss
new file mode 100644
index 0000000..ea59eec
--- /dev/null
+++ b/design/old/v9/_lttr.scss
@@ -0,0 +1,63 @@
+.large-top-image {
+ background: #f7f7f7;
+ img {
+ max-width: 100%;
+ margin: 4rem 0;
+ }
+}
+.lttr {
+ @include constrain_narrow;
+ margin-top: 6rem;
+ header {
+ padding-bottom: 3rem;
+ border-bottom: 1px #f0edeb solid
+ }
+}
+.lttr-box {
+ //background: #faf7f5;
+ text-align: center;
+ padding: .5rem;
+ display: inline-block;
+ //border: 1px #e0dedc solid;
+}
+.lttr-cover {
+ margin-right: 1.2rem;
+}
+#recommended-reading {
+ .book-title {
+ @include fontsize(28);
+ font-weight: 400;
+ margin-bottom: 0;
+ }
+ h6 {
+ margin-top: 0;
+ @include fontsize(18);
+ font-weight: 400;
+ }
+}
+
+#page-navigation img {
+ width: 300px;
+ height: 160px;
+ object-fit: cover;
+}
+#page-navigation h4 {
+ text-align: center;
+ @include fontsize(22);
+ @include fancy_sans;
+ color: #333;
+}
+#page-navigation .nav-title {
+ @include fontsize(22);
+ line-height: 1.5;
+}
+#page-navigation .photo-arrow-next {
+ text-align: left;
+}
+.page-nav-photo li {
+ display: inline-block;
+ margin: 0 0 0 3rem !important;
+ &:first-of-type {
+ margin-left: 0 !important;
+ }
+}
diff --git a/design/old/v9/_map.scss b/design/old/v9/_map.scss
new file mode 100644
index 0000000..e4bd5e4
--- /dev/null
+++ b/design/old/v9/_map.scss
@@ -0,0 +1,73 @@
+.map--wrapper {
+ @include constrain_wide;
+ max-width: 99%;
+ margin-top: 2em;
+}
+#map-canvas {
+ height: 300px;
+ img { max-width: 100%; padding: 0; margin: 0; background: none;}
+ @include breakpoint(alpha) {
+ height: 400px;
+ }
+ @include breakpoint(beta) {
+ height: 500px;
+ }
+ @include breakpoint(gamma) {
+ border: 10px $brown solid;
+ width: 80%;
+ float: right;
+ }
+ @include breakpoint(delta) {
+ height: 600px;
+ width: 84%;
+ }
+}
+
+.map-legend {
+ @include constrain_wide;
+ text-align: left;
+ &:after {
+ content: " ";
+ display: table;
+ clear: both;
+ }
+ h4 {
+ font-family: sans-serif;
+ @include fontsize(14);
+ @include smcaps;
+ font-weight: bold;
+ margin: 1em 0 0.25em;
+ @include breakpoint(gamma) {
+ @include fontsize(13);
+ }
+ }
+ a { color: $body_font_color;}
+ li {
+ display: inline;
+ &:after {
+ content: ",";
+ }
+ @include breakpoint(gamma) {
+ display: block;
+ @include fontsize(13);
+ &:after {
+ content: "";
+ }
+ }
+ }
+}
+
+.infowin {
+ h4 {
+ margin: 0 0 5px 0;
+ font-weight: normal;
+ }
+ .date {
+ text-transform: uppercase;
+ font-size: 11px;
+ letter-spacing: 1px;
+ }
+ p {
+ font-size: 1em;
+ }
+}
diff --git a/design/old/v9/_mixins.scss b/design/old/v9/_mixins.scss
new file mode 100644
index 0000000..9ccd750
--- /dev/null
+++ b/design/old/v9/_mixins.scss
@@ -0,0 +1,163 @@
+$brown: #201a11;
+$brown: #222;
+$light: #ccc;
+$orange: #b53a04;
+$link_color: #b53a04;
+
+$headline_font_serif: mffweb, Georgia, 'Times New Roman', serif;
+$fancy_serif: mffweb, Georgia, 'Times New Roman', serif;
+$fancy_sans: mffnweb, Helvetica, sans-serif;
+
+
+$body_p_font: normal 100% / 1.5 Georgia, Cambria, "Times New Roman", Times, serif;
+$body_font_color: $brown;
+$body_font_light: #b3aeae;
+$secondary-link-color: #838383;
+
+$archive_p_line_height: 1.6;
+//$light;
+$narrow-beta-width: 720px;
+$narrow-max-width: 750px;
+$max_width: 1440px;
+
+@mixin smcaps {
+ @include fancy_sans;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+}
+@mixin plain_a {
+ border: none;
+ text-decoration: none;
+ color: $body_font_color;
+}
+
+@function calc-rem($size) {
+ $remsize: $size/16;
+ @return #{$remsize}rem;
+}
+
+@mixin fontsize($size) {
+ font-size: $size + px;
+ font-size: calc-rem($size);
+}
+
+@function calc-em($target-px, $context) {
+ @return $target-px / $context * 1em;
+}
+
+@mixin img_plain {
+ padding: 0;
+ max-width: 100%;
+ background: none;
+}
+@mixin generic-sans {
+ font-family: sans-serif;
+}
+@mixin fancy-sans {
+ font-family: mffnweb, Helvetica, sans-serif;
+}
+@mixin fancy-sans-bold {
+ font-family: mffnbweb, Helvetica, sans-serif;
+ font-weight: 700;
+}
+@mixin fancy-serif {
+ font-family: Georgia, Palatino, serif;
+}
+%clearfix {
+ *zoom: 1;
+ &:before {
+ content: " ";
+ display: table;
+ }
+ &:after {
+ content: " ";
+ display: table;
+ clear: both;
+ }
+}
+
+@mixin transparent_class {
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
+ filter: alpha(opacity = 90);
+ opacity: 0.9;
+}
+
+@mixin faded_line_after {
+ display: block;
+ content: "";
+ margin-top: 3em;
+ height: 1px;
+ width: 100%;
+ background: -webkit-linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0));
+ background: -moz-linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0));
+ background: -o-linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0));
+ background: linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0));
+}
+
+//for overriding the above on dark pages:
+@mixin light_faded_line_after {
+ background: -webkit-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+ background: -moz-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+ background: -o-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+ background: linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+}
+
+@mixin lighter_faded_line_after {
+ background: -webkit-linear-gradient(left, rgba(243,237,219,.1),rgba(243,237,219,0.3),rgba(243,237,219,.1));
+ background: -moz-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+ background: -o-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+ background: linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0));
+}
+
+//generic constrain function
+@mixin constrain($size) {
+ max-width: $size;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+//set an element to centered, narrowish column width
+//used mostly on columns of text
+@mixin constrain_narrow() {
+ max-width: 90%;
+ margin-left: auto;
+ margin-right: auto;
+ @include breakpoint(beta) {
+ max-width: $narrow-beta-width;
+ }
+ @include breakpoint(gamma) {
+ max-width: $narrow-max-width;
+ }
+}
+
+@mixin constrain_archive() {
+ max-width: 94%;
+ margin-left: auto;
+ margin-right: auto;
+ @include breakpoint(alpha) {
+ max-width: 380px;
+ float: left;
+ }
+ @include breakpoint(gamma) {
+ max-width: 680px;
+ }
+}
+
+//set an element to centered, wideish column width
+@mixin constrain_wide() {
+ max-width: 90%;
+ margin-left: auto;
+ margin-right: auto;
+ @include breakpoint(gamma) {
+ max-width: $breakpoint-gamma;
+ }
+ @include breakpoint(delta) {
+ max-width: $breakpoint-delta;
+ }
+ @include breakpoint(epsilon) {
+ max-width: $max_width;
+ }
+}
+
+
+
diff --git a/design/old/v9/_notes.scss b/design/old/v9/_notes.scss
new file mode 100644
index 0000000..1386751
--- /dev/null
+++ b/design/old/v9/_notes.scss
@@ -0,0 +1,160 @@
+//**************** Notes Structure ************************
+
+.notes main, .notes--permalink main {
+ @include constrain_narrow();
+ margin-top: 1em;
+ h1 {
+ margin-bottom: 0;
+ @include fontsize(28);
+ @include breakpoint(beta) {
+ @include fontsize(28);
+ text-align: left;
+ }
+ }
+}
+.notes .h-entry, .notes--permalink .h-entry {
+ @extend %clearfix;
+ border: none;
+ padding: 0;
+ margin-top: 3em;
+ @include breakpoint(beta) {
+ margin-top: 2em;
+ }
+ &:first-of-type {
+ margin-top: 1em;
+ }
+ &:after {
+ @include faded_line_after;
+ @include breakpoint(beta) {
+ margin-top: 8.5em;
+ }
+ }
+}
+.note--title {
+ @include constrain_narrow;
+ text-align: left;
+ font-weight: 400;
+ font-size: 1.5em;
+ letter-spacing: 0px;
+ margin-bottom: .5rem !important;
+ a {
+ text-decoration: none;
+ color: $body_font_color !important;
+ }
+}
+
+.note--date {
+ @include smcaps;
+ @include fontsize(11);
+ text-align: center;
+ margin-bottom: 4px;
+ @include breakpoint(beta) {
+ float: right;
+ margin-top: 0;
+ }
+ a {
+ color: $brown;
+ text-decoration: none;
+ }
+}
+.note--date-container{
+ @extend %clearfix;
+
+}
+.e-content {
+ @extend %clearfix;
+}
+.note--location {
+ text-align: center;
+ margin-top: 0;
+ @include breakpoint(beta) {
+ float: left;
+ }
+}
+.note--footer {
+ margin-top: 1.7em;
+ @include breakpoint(beta) {
+ margin-top: 0;
+ }
+}
+.month--divider {
+ margin-top: 2em;
+}
+.month--header {
+ @include constrain_narrow();
+ @include smcaps;
+ @include fontsize(12);
+ font-weight: normal;
+ font-family: sans-serif;
+ text-align: left;
+ margin-bottom: 3em;
+ border-bottom: 1px dotted rgba(0, 0, 0, 0.2);
+}
+.notes--permalink {
+ .h-entry {
+ margin-top: 3em;
+ @include breakpoint(gamma) {
+ margin-top: 5em;
+ }
+ }
+ .e-content figure.picwide { margin-left: -300px !important}
+ &:after {
+ background: none;
+ }
+ .note--title {
+ // @include fontsize(24);
+ }
+ .note--footer {
+ margin-top: 2em;
+ @include constrain_narrow();
+ @include breakpoint(beta) {
+ margin-top: 1em;
+ }
+ }
+ #page-navigation {
+ clear: both;
+ margin-top: 10em;
+ }
+}
+/*
+@include breakpoint(beta) {
+ .notes {
+ main h1 {
+ float: none;
+ margin-bottom: 1em;
+ width: 100%;
+ }
+ main {
+ @include constrain(680px);
+ margin-bottom: 5em;
+ }
+ article footer {
+ margin-top: 1em;
+ }
+ article p {
+ float: none;
+ }
+ .note--location {
+ float: left;
+ }
+ .note--date {
+ float: right;
+ }
+ .note--twitter {
+ clear: both;
+ float: right;
+ padding-top: 1em;
+ }
+ time {
+ display: inline;
+ float: right;
+ }
+ }
+
+ .permalink {
+ main {
+ margin-top: 5em;
+ }
+ }
+}
+*/
diff --git a/design/old/v9/_pagination.scss b/design/old/v9/_pagination.scss
new file mode 100644
index 0000000..7dc9cb1
--- /dev/null
+++ b/design/old/v9/_pagination.scss
@@ -0,0 +1,44 @@
+.pagination {
+ @include generic_sans;
+ margin-top: 2em;
+ margin-bottom: 2em;
+ font-weight: 400;
+ line-height: 2.3;
+ li {
+ display: inline;
+ }
+ a {
+ text-decoration: none;
+ border: 1px solid lighten($body_font_color, 30);
+ color: lighten($body_font_color, 20);
+ padding: 9px 6px 6px 6px;
+ margin-left: .25em;
+ margin-right: .25em;
+ }
+ .prev {
+ border: none;
+ &:before {
+ content: "\2190";
+ }
+ }
+ .next {
+ border: none;
+ &:after {
+ content: "\2192";
+ margin-left: .35em;
+ }
+ }
+ @include breakpoint(beta) {
+ .prev {
+ margin-right: 2em;
+ }
+ .next {
+ margin-left: 2em;
+ }
+ .current {
+ color: $link_color;
+ margin-right: .5em;
+ margin-left: .5em;
+ }
+ }
+}
diff --git a/design/old/v9/_photos.scss b/design/old/v9/_photos.scss
new file mode 100644
index 0000000..95d6c45
--- /dev/null
+++ b/design/old/v9/_photos.scss
@@ -0,0 +1,521 @@
+// ##############################################
+// Photo Gallery pages
+// ##############################################
+
+// Add padding and create grid layout at various widths:
+.image-gallery--list {
+ @include constrain_wide;
+ margin-top: 3em;
+ li {
+ display: inline-block;
+ margin-bottom: 10px;
+ }
+}
+@include breakpoint(alpha) {
+ .first, .third {
+ padding-right: 10px;
+ }
+}
+@include breakpoint(gamma) {
+ .first, .third {
+ padding-right: 0;
+ }
+ .one {
+ padding-right: 6px;
+ }
+ .two {
+ padding-left: 6px;
+ padding-right: 6px;
+ }
+ .three {
+ padding-left: 6px;
+ }
+}
+@include breakpoint(delta) {
+ .one, .two, .three {
+ padding: 0;
+ }
+ .first {
+ padding-right: 6px;
+ }
+ .second, .third {
+ padding-left: 6px;
+ padding-right: 6px;
+ }
+ .fourth {
+ padding-left: 6px;
+ }
+}
+
+//########### GALLERY FIGURES AND CAPTIONS ################
+.image-gallery--figure {
+ position: relative;
+ margin: 0;
+ width: 280px;
+ .image-gallery--legend {
+ display: block;
+ @include transparent_class;
+ position: absolute;
+ left: 0;
+ bottom: -10px;
+ width: 272px;
+ background: $brown;
+ color: #999999;
+ }
+ h1 {
+ @include smcaps;
+ @include fontsize(13);
+ margin: 8px 0 4px 8px;
+ text-align: left;
+ color: white;
+ }
+ p {
+ @include fontsize(12);
+ margin: 8px 0 4px 8px;
+ padding-bottom: 6px;
+ }
+}
+
+.image-gallery--wrapper {
+ @include constrain_wide;
+ .figcaption {
+ background: lighten(#000, 12);
+ margin: -6px 0 0 0;
+ padding: 1em 1em .5em 1em;
+ border-radius: 0 0 0.5em 0.5em;
+ &:after {
+ content: " ";
+ display: table;
+ clear: both;
+ }
+ }
+ h6 a {
+ color: darken($body_font_light, 20);
+ text-decoration: none;
+ font-family: sans-serif;
+ }
+ img { background: none; max-width: 100%; padding: 0;}
+}
+.directions {
+ color: darken($body_font_light, 35);
+ text-align: center;
+ @include fontsize(13);
+ margin-top: 3em;
+ display: none;
+}
+.caption {
+ float: left;
+ font-family: sans-serif;
+ min-height: 32px;
+ padding-right: 1.5em;
+ @include breakpoint(beta) {
+ width: 50%;
+ border-right: darken($body_font_light, 45) 1px solid;
+ min-height: 55px;
+ }
+ @include breakpoint(gamma) {
+ width: 65%;
+ padding-right: 2.5em;
+ }
+ @include breakpoint(delta) {
+ width: 70%;
+ }
+}
+.figcaption--title, .figcaption--date {
+ float: left;
+ font-weight: normal;
+ line-height: 24px;
+ vertical-align: bottom;
+ margin: 0;
+ display: block;
+}
+.figcaption--title {
+ margin-right: 1em;
+}
+.figcaption--date {
+ margin-top: 2px;
+}
+.caption .map-link {
+ @include smcaps;
+ @include fontsize(13);
+ float: right;
+ text-decoration: none;
+ padding: 7px 14px 5px;
+ background: lighten(#000, 18);
+ color: $body_font_light;
+ border-radius: 25px;
+ &:hover {
+ background: $orange;
+ }
+}
+.figcaption--desc {
+ @include fontsize(13);
+ padding-top: .5em;
+ margin-bottom: 0;
+ clear: left;
+ margin-left: 0;
+ text-align: left;
+}
+.photo-options {
+ float: right;
+ font-family: sans-serif;
+ p{
+ @include fontsize(13);
+ margin-top: 12px;
+ margin-bottom: 2px;
+ color: darken($body_font_light, 35);
+ &:first-of-type {
+ margin-top: 4px;
+ }
+ }
+ a { color: darken($body_font_light, 35);}
+}
+.photo-options, .caption .map-link {
+ display: none;
+}
+@include breakpoint(beta) {
+ .photo-options, .caption .map-link, .directions {
+ display: block;
+ }
+}
+.fig { position: relative;}
+.image-gallery--wrapper .map-container {
+ left: -3%;
+ background: url("/media/img/mapbg-black.png") no-repeat top left !important;
+ @include breakpoint(beta) {
+ left: 4%;
+ }
+ @include breakpoint(gamma) {
+ left: 22%;
+ }
+ @include breakpoint(delta) {
+ left: 34%;
+ }
+}
+
+.map-wrapper {
+ width: 400px;
+ height: 328px;
+ position: absolute;
+ bottom: 27px;
+ margin: 0px 0 0 44px;
+}
+
+.daily-figure {
+ figcaption {
+ max-width: 1432px;
+ }
+}
+
+//.figcaption {
+// clear: both;
+// background: #1a1713;
+// -moz-border-radius: 0 0 0.5em 0.5em;
+// -webkit-border-radius: 0 0 0.5em 0.5em;
+// border-radius: 0 0 0.5em 0.5em;
+// color: white;
+// margin: -0.25em 0 0 0;
+// padding: 1em 0 1em 0;
+// z-index: 100;
+//}
+//
+//.caption {
+// width: 100%;
+// float: none;
+// p {
+// font: normal 0.75em Helvetica, Verdana, sans-serif;
+// margin: 0.5em 0 0 0.75em;
+// padding-bottom: 0.25em;
+// }
+//}
+
+.circle-pic {
+ border-radius: 50%;
+ border: 3px solid #000;
+}
+#about-luxagraf .circle-pic {
+ float: left;
+ margin-left: -250px;
+}
+
+//lightbox stuff from https://github.com/felixhagspiel/jsOnlyLightbox/blob/master/css/lightbox.scss
+
+/**
+* VARS
+**/
+
+// font-sizes
+$font-size-huge: 2.8em;
+$font-size-big: 2em;
+$font-size-medium: 1.4em;
+
+$def-color-1: #FFFFFF;
+$def-color-2: #B9CED2;
+
+$border-color-1: #9C9FA5;
+
+$def-font-color: #6c7176;
+$font-color-highlight: #A99929;
+$font-color-hover-1: #C3B919;
+
+$darkblue: #3F658B;
+@mixin prefixr($var, $val) {
+ -webkit-#{$var}: $val;
+ -moz-#{$var}: $val;
+ -o-#{$var}: $val;
+ -ms-#{$var}: $val;
+ $var: $val;
+}
+
+/* IE8 Stuff */
+.jslghtbx-ie8.jslghtbx {
+ background-image: url('../img/trans-bck.png');
+ display: none;
+ &.jslghtbx-active {
+ display: block;
+ }
+ .jslghtbx-contentwrapper > img {
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+ display: block;
+ }
+ .jslghtbx-contentwrapper.jslghtbx-wrapper-active > img {
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+ }
+}
+
+/* Main wrapper */
+.jslghtbx {
+ font-family: sans-serif;
+ overflow: auto;
+ visibility: hidden;
+ position: fixed;
+ z-index: 2;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0);
+ &.jslghtbx-active {
+ visibility: visible;
+ background-color: rgba(0, 0, 0, 0.85);
+ }
+}
+
+/* loading-animation */
+.jslghtbx-loading-animation {
+ margin-top: -60px;
+ margin-left: -60px;
+ width: 120px;
+ height: 120px;
+ top: 50%;
+ left: 50%;
+ display: none;
+ position: absolute;
+ z-index: -1;
+ & > span {
+ display: inline-block;
+ width: 20px;
+ height: 20px;
+ border-radius: 20px;
+ margin: 5px;
+ background-color: #fff;
+ @include prefixr(transition, all .3s ease-in-out);
+ &.jslghtbx-active {
+ margin-bottom: 60px;
+ }
+ }
+}
+
+.jslghtbx.jslghtbx-loading .jslghtbx-loading-animation {
+ display: block;
+}
+
+.jslghtbx-nooverflow {
+ overflow: hidden !important; // prevent showing of scrollbars on prev/next
+}
+
+.jslghtbx-contentwrapper {
+ margin: auto;
+ visibility: hidden;
+ & > img {
+ background: #fff;
+ padding: .5em;
+ display: none;
+ height: auto;
+ margin-left: auto;
+ margin-right: auto;
+ opacity: 0;
+ }
+}
+
+.jslghtbx-contentwrapper.jslghtbx-wrapper-active {
+ visibility: visible;
+ & > img {
+ display: block;
+ opacity: 1;
+ }
+}
+
+/* Caption */
+.jslghtbx-caption {
+ display: none;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 5px;
+ margin-bottom: 5px;
+ max-width: 450px;
+ color: #fff;
+ text-align: center;
+ font-size: .9em;
+}
+
+.jslghtbx-active .jslghtbx-caption {
+ display: inline;
+ margin-right: 1em;
+}
+
+/* Animation Stuff */
+.jslghtbx-contentwrapper.jslghtbx-animate > img {
+ opacity: 0;
+}
+
+.jslghtbx-contentwrapper > img.jslghtbx-animate-transition {
+ @include prefixr(transition, opacity .2s ease-in-out);
+}
+
+.jslghtbx-contentwrapper > img.jslghtbx-animating-next {
+ opacity: 1;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+}
+
+.jslghtbx-contentwrapper > img.jslghtbx-animating-prev {
+ opacity: 1;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+}
+
+.jslghtbx-contentwrapper > img.jslghtbx-animate-init {
+ opacity: 1;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+}
+
+.jslghtbx-contentwrapper > img.jslghtbx-animate-transition {
+ cursor: pointer;
+}
+
+/* Controls */
+.jslghtbx-close {
+ position: fixed;
+ right: 23px;
+ top: 23px;
+ margin-top: -4px;
+ font-size: 2em;
+ color: $def-color-1;
+ cursor: pointer;
+ @include prefixr(transition, all .3s ease-in-out);
+ &:hover {
+ text-shadow: 0 0 10px #fff;
+ }
+ @media screen and(max-width: 1060px) {
+ font-size: 1.5em;
+ }
+}
+
+.jslghtbx-next,
+.jslghtbx-prev {
+ display: none;
+ position: fixed;
+ top: 50%;
+ max-width: 6%;
+ max-height: 250px;
+ cursor: pointer;
+ @include prefixr(transition, all .2s ease-in-out);
+ &.jslghtbx-active {
+ display: block;
+ }
+ & > img {
+ width: 100%;
+ }
+
+}
+
+.jslghtbx-next {
+ right: .6em;
+ &.jslghtbx-no-img:hover {
+ border-left-color: #787878;
+ }
+ @media screen and(min-width: 451px) {
+ right: .6em;
+ &.jslghtbx-no-img {
+ border-top: 20px solid transparent;
+ border-bottom: 20px solid transparent;
+ border-left: 20px solid #FFF;
+ }
+ }
+ @media screen and(max-width: 600px) {
+ &.jslghtbx-no-img {
+ right: 5px;
+ padding-left: 0;
+ border-top: 60px solid transparent;
+ border-bottom: 60px solid transparent;
+ border-left: 15px solid #FFF;
+ }
+ }
+ @media screen and(max-width: 450px) {
+ right: .2em;
+ padding-left: 20px;
+ }
+}
+
+.jslghtbx-prev {
+ left: .6em;
+ &.jslghtbx-no-img:hover {
+ border-right-color: #787878;
+ }
+ @media screen and(min-width: 451px) {
+ left: .6em;
+ &.jslghtbx-no-img {
+ border-top: 20px solid transparent;
+ border-bottom: 20px solid transparent;
+ border-right: 20px solid #FFF;
+ }
+ }
+ @media screen and(max-width: 600px) {
+ &.jslghtbx-no-img {
+ left: 5px;
+ padding-right: 0;
+ border-top: 60px solid transparent;
+ border-bottom: 60px solid transparent;
+ border-right: 15px solid #FFF;
+ }
+ }
+ @media screen and(max-width: 450px) {
+ left: .2em;
+ padding-right: 20px;
+ }
+}
+
+.jslghtbx-thmb {
+ @media screen and(min-width: 451px) {
+ margin: 1em;
+ }
+ @media screen and(max-width: 450px) {
+ margin: 1em 0;
+ }
+ padding: 2px;
+ max-width: 100%;
+ max-height: 140px;
+ cursor: pointer;
+ box-shadow: 0px 0px 3px 0px #000;
+ @include prefixr(transition, all .3s ease-in-out);
+ &:hover {
+ box-shadow: 0px 0px 14px 0px #000;
+ }
+}
+
+.p-link {
+ color: white !important;
+ @include fontsize(14);
+ &:after {
+ content: "\2197";
+ }
+}
diff --git a/design/old/v9/_queries.scss b/design/old/v9/_queries.scss
new file mode 100644
index 0000000..8a0eec2
--- /dev/null
+++ b/design/old/v9/_queries.scss
@@ -0,0 +1,30 @@
+$breakpoint-omega: 420px; //728
+$breakpoint-alpha: 728px; //728
+$breakpoint-beta: 824px; //784
+$breakpoint-gamma: 960px;
+$breakpoint-delta: 1170px;
+$breakpoint-epsilon: $max_width;
+
+@mixin breakpoint($point) {
+ @if $point == "omega" {
+ @media screen and (min-width:$breakpoint-omega ){ @content; }
+ }
+ @if $point == "alpha" {
+ @media screen and (min-width:$breakpoint-alpha ){ @content; }
+ }
+ @else if $point == "beta" {
+ @media screen and (min-width: $breakpoint-beta) { @content; }
+ }
+ @else if $point == "beta-2" {
+ @media screen and (min-width: $breakpoint-beta-2) { @content; }
+ }
+ @else if $point == "gamma" {
+ @media screen and (min-width: $breakpoint-gamma) { @content; }
+ }
+ @else if $point == "delta" {
+ @media screen and (min-width: $breakpoint-delta) { @content; }
+ }
+ @else if $point == "epsilon" {
+ @media screen and (min-width: $breakpoint-epsilon) { @content; }
+ }
+}
diff --git a/design/old/v9/_resume.scss b/design/old/v9/_resume.scss
new file mode 100644
index 0000000..41fc8e1
--- /dev/null
+++ b/design/old/v9/_resume.scss
@@ -0,0 +1,179 @@
+.head {
+ @extend %clearfix;
+ @include constrain(780px);
+ margin-top: 4em;
+}
+.resume main header {
+ width: 100%;
+ h1 {
+ @include fontsize(36);
+ text-transform: uppercase;
+ letter-spacing: 3px;
+ font-weight: 600;
+ line-height: 1;
+ margin-bottom: 0;
+ color: #444;
+ }
+ h2 {
+ margin-top: .5em !important;
+ @include fontsize(14);
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ font-style: italic;
+ color: #333;
+ }
+ @include breakpoint(gamma) {
+ width: 60%;
+ float: left;
+ text-align: left;
+ margin-top: .5em;
+ }
+}
+.h-resume {
+ h3,h2 {
+ @include constrain_narrow;
+ text-align: left;
+ }
+ h3 {
+ font-family: sans-serif;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ font-size: 0.75rem;
+ margin-top: 4em;
+ margin-bottom: 3em;
+ border-bottom: 1px dotted #333;
+ }
+ h2 {
+ margin-top: 2.5em;
+ margin-bottom: .25em;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ font-size: 1rem;
+ }
+ h2 a, h2 a:visited {
+ text-decoration: none;
+ color: #444;
+ }
+}
+.meta {
+ list-style-type: none;
+ display: inline;
+ @include constrain_narrow;
+ text-align: left;
+ margin-bottom: 1em;
+ time{
+ display: inline;
+ }
+}
+.p-experience {
+ &:after {
+ @include faded_line_after;
+ }
+ &:last-of-type:after {
+ background: #fff;
+ }
+}
+.p-organization {
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ @include fontsize(13);
+
+}
+.p-skill {
+ font-weight: bold;
+}
+.contact {
+ margin: 2em 0 1.5em;
+ @include constrain_narrow;
+ li {
+ display: block;
+ @extend %clearfix;
+ }
+ @include breakpoint(gamma) {
+ width: 160px;
+ float: right;
+ margin: 1.9em 0 1.5em;
+ li {
+ display: block;
+ }
+ }
+ h6, a {
+ font-size: 13px;
+ font-size: 0.8125rem;
+ line-height: 1.8;
+ margin: 0;
+ display: block;
+ float: left;
+ }
+ h6 {
+ font-size: 11px;
+ font-size: 0.6875rem;
+ line-height: 2.1;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ &:after {
+ content: ":";
+ margin-right: 5px;
+ }
+ }
+ a {
+ font-family: sans-serif;
+ }
+}
+.publications-list {
+ list-style-type: none;
+ text-align: left;
+ @include constrain_narrow;
+ h2 {
+ @include smcaps;
+ @include fontsize(11);
+ font-weight: 400;
+ text-align: left;
+ border-bottom: 1px dotted #333;
+ margin-bottom: 2em;
+ &:first-of-type {
+ margin-top: 3em;
+ }
+ }
+ h3, time {
+ display: inline;
+ }
+ h3 {
+ @include fontsize(20);
+ @include fancy_serif;
+ }
+ time:before {
+ content: "\00a0 \00a0"
+ }
+ ul {
+ list-style-type: none;
+ }
+}
+.publisher {
+ margin-top: 1em;
+ margin-bottom: 1em;
+}
+.pub-title {
+ margin-bottom: 1.75em;
+ a {
+ color: $brown;
+ text-decoration: none;
+ font-weight: 400;
+ }
+}
+.resume h6 {
+ @include constrain_narrow;
+ text-align: left;
+ font-weight: 400;
+ @include fontsize(12);
+}
+.toc {
+ @include constrain_narrow;
+ text-align: left;
+ a {
+ color: $brown;
+ }
+ ul {
+ list-style-type: none;
+ }
+}
diff --git a/design/old/v9/_src.scss b/design/old/v9/_src.scss
new file mode 100644
index 0000000..1896979
--- /dev/null
+++ b/design/old/v9/_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;
+}
diff --git a/design/old/v9/_typography.scss b/design/old/v9/_typography.scss
new file mode 100644
index 0000000..b4e3793
--- /dev/null
+++ b/design/old/v9/_typography.scss
@@ -0,0 +1,10 @@
+.hedtinycaps {
+ @include fontsize(16);
+ @include fancy_sans;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+}
+.article-afterward > .hedtinycaps, p > .hedtinycaps {
+ text-align: left;
+}
+
diff --git a/design/old/v9/pdf_gen.scss b/design/old/v9/pdf_gen.scss
new file mode 100644
index 0000000..b5072cd
--- /dev/null
+++ b/design/old/v9/pdf_gen.scss
@@ -0,0 +1,140 @@
+@import "_fonts.scss";
+@import "_mixins.scss";
+
+body {
+ @include fancy_sans;
+}
+.subhead {
+ text-align: right;
+ width: 4cm;
+ float: right;
+ @extend %clearfix;
+ > * {
+ margin: 0;
+ font-weight: 400;
+ }
+}
+header, .row {
+ @extend %clearfix;
+ margin-top: 1cm;
+}
+.print-box {
+ width: 49%;
+ float: left;
+ > * {
+ padding: .125cm;
+ margin: 0;
+ }
+ h5, h4 {
+ @include smcaps;
+ font-size: 9pt;
+ line-height: .5;
+ }
+ h4 {
+ margin-top: -10pt;
+ font-size: 16pt;
+ line-height: 1.5;
+ }
+}
+#bill-from, #bill {
+ border: none;
+ width: 47%;
+ float: left;
+}
+#bill {
+ float: right;
+}
+#bill-to {
+ width: 47%;
+ float: right;
+}
+table {
+ font-family: "Open Sans", sans-serif;
+ line-height: 1;
+ border: 1px solid #ccc;
+ border-collapse: collapse;
+ margin: 1cm 0 0 0;
+ padding: 0;
+ width: 625px;
+}
+table caption {
+ text-align: left;
+ font-size: 10pt;
+ text-transform: uppercase;
+ font-weight: 600;
+ margin: .5em 0 .75em;
+ &:after {
+ content: ":";
+ }
+}
+table tr {
+ border: 1px solid #ddd;
+ padding: .35em;
+}
+table tr.odd { background: #f6f4f4cc;}
+thead {display: table-header-group; }
+table th,
+table td {
+ padding: .625em .625em .625em 1em;
+ text-align: left;
+ border-right: 1px solid #ddd;
+}
+table td {
+ white-space: -o-pre-wrap;
+ word-wrap: break-word;
+ white-space: pre-wrap;
+ white-space: -moz-pre-wrap;
+ white-space: -pre-wrap;
+ font-size: 8pt;
+}
+table th {
+ font-size: 7pt;
+ letter-spacing: .1em;
+ text-transform: uppercase;
+ background: #f6f4f4;
+}
+
+table .blank {
+ white-space: normal;
+ td {
+ padding: 1rem;
+ white-space: normal;
+ &:last-of-type {
+ text-align: left;
+ min-width: 1.2cm;
+ }
+ }
+}
+table .right {
+ text-align: right;
+}
+table th a {
+ text-decoration: none;
+ position: relative;
+ span {
+ position: absolute;
+ top: -2px;
+ }
+}
+.smfield { min-width: 50pt;}
+table .total { font-size: 9pt !important;}
+.thanks {
+ margin-top: 40pt;
+ font-family: times, times new roman;
+ font-style: italic;
+ font-weight: 300;
+ text-align: center;
+ color: #333;
+}
+
+@page {
+ @bottom-right{
+ @include fancy_sans;
+ @include smcaps;
+ content: "Page " counter(page) " of " counter(pages);
+ font-size: 6pt;
+ color: #666;
+ width: 2cm;
+ }
+}
+
diff --git a/design/old/v9/print.scss b/design/old/v9/print.scss
new file mode 100644
index 0000000..666a797
--- /dev/null
+++ b/design/old/v9/print.scss
@@ -0,0 +1,95 @@
+@import "_fonts.scss";
+@import "_mixins.scss";
+
+body {
+ font-family: $fancy_serif;
+ background: white;
+ color: black;
+ max-width: 660px;
+ font-size: 11pt;
+ margin: 0 auto;
+ line-height: 1.6;
+}
+.header-wrapper, #breadcrumbs, #page-navigation, .post-subtitle, .comment--form--wrapper, footer {
+ display: none;
+}
+.post-source { display: none;}
+.highlight {
+ background: #f7f5f5 !important;
+}
+code, pre {
+ background: #f7f5f5 !important;
+ font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace;
+}
+a {
+}
+pre {
+ background: #f7f5f5 !important;
+ padding: .5cm .25cm;
+}
+p code {
+ padding: 0 .25cm;
+}
+.cluster img, .picwide img, .picfull img {
+ width: 80%;
+ margin: 0 auto;
+ filter: grayscale(100%);
+}
+.row-2 img {
+ width: 50%;
+ margin: 0;
+ float:left;
+ filter: grayscale(100%);
+}
+.post-body p {
+ font-size: 11pt;
+}
+.post-body h3 {
+ font-size: 19pt;
+}
+.post-body h5 {
+ font-size: 14pt;
+}
+.go:before {
+ content: "$ ";
+}
+@page {
+ @bottom-right{
+ @include fancy_sans;
+ @include smcaps;
+ content: "Page " counter(page) " of " counter(pages);
+ font-size: 6pt;
+ color: #666;
+ width: 2cm;
+ }
+}
+main .post--body {
+ max-width: 660px;
+ margin: 0;
+}
+figure {
+ width: 100%;
+ margin: 0;
+}
+figcaption {
+ @include fancy_sans;
+ color: #999;
+ font-size: 9pt;
+ margin-top: 0;
+}
+.post-location {
+ @include fancy_sans;
+ color: #333;
+ font-size: 12pt;
+ a {
+ text-decoration: none;
+ display: none;
+ }
+ .region {
+ display: inline;
+ color: #333 !important;
+ }
+}
+.entry-footer, .article-afterward, .jslghtbx {
+ display: none;
+}
diff --git a/design/old/v9/screenv10.scss b/design/old/v9/screenv10.scss
new file mode 100644
index 0000000..dadd9ee
--- /dev/null
+++ b/design/old/v9/screenv10.scss
@@ -0,0 +1,24 @@
+@import "_fonts.scss";
+
+
+
+
+//@import "_mixins.scss";
+//@import "_queries.scss";
+//@import "_global.scss";
+//@import "_pagination.scss";
+//@import "_header.scss";
+//@import "_images.scss";
+//@import "_comments.scss";
+//@import "_leaflet.scss";
+//@import "_map.scss";
+//@import "_forms.scss";
+//@import "_typography.scss";
+//@import "_lttr.scss";
+//@import "_footer.scss";
+//@import "_archives.scss";
+//@import "_details.scss";
+//@import "_src.scss";
+//@import "_resume.scss";
+//@import "_photos.scss";
+//@import "_notes.scss";
diff --git a/design/old/v9/screenv9.scss b/design/old/v9/screenv9.scss
new file mode 100644
index 0000000..e8666ca
--- /dev/null
+++ b/design/old/v9/screenv9.scss
@@ -0,0 +1,20 @@
+@import "_fonts.scss";
+@import "_mixins.scss";
+@import "_queries.scss";
+@import "_global.scss";
+@import "_pagination.scss";
+@import "_header.scss";
+@import "_archives.scss";
+@import "_details.scss";
+@import "_images.scss";
+@import "_comments.scss";
+@import "_leaflet.scss";
+@import "_map.scss";
+@import "_src.scss";
+@import "_resume.scss";
+@import "_photos.scss";
+@import "_notes.scss";
+@import "_forms.scss";
+@import "_typography.scss";
+@import "_lttr.scss";
+@import "_footer.scss";
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-15 19:44:44 +0000