Words Legacy Template (for WordPress)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php /* Template Name: Words Legacy Template */ ?> | |
| <!DOCTYPE html> | |
| <html prefix="og: http://ogp.me/ns#" <?php language_attributes(); ?>> | |
| <head> | |
| <title><?php echo wp_title('', false, 'left'); ?> : Joe Crawford (ArtLung.com)</title> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" /> | |
| <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" /> | |
| <?php wp_head(); ?> | |
| </head> | |
| <?php | |
| $additional_class = 'words-legacy'; | |
| ?> | |
| <body <?php body_class($additional_class)?>> | |
| <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> | |
| <div <?php post_class()?>> | |
| <h1><?php the_title(); ?></h1> | |
| <div class="legacy-body"> | |
| <?php the_content("Read complete article→"); ?> | |
| </div> | |
| </div> | |
| <?php endwhile; else: ?> | |
| <?php endif; ?> | |
| <section class="legacy-footer"> | |
| <ul> | |
| <li><a href="/">ArtLung</a></li> | |
| <li><a href="/words/">Words</a></li> | |
| <li><span><?php echo wp_title('', false, 'left'); ?></span></li> | |
| </ul> | |
| </section> | |
| <div class="roanoke-search"> | |
| <?php get_search_form(); ?> | |
| </div> | |
| <div class="roanoke-search-opener"> | |
| <a href="#" class="open-search"><i class="fa fa-search fa-lg" title="Open Search"></i></a> | |
| </div> | |
| <?php wp_footer(); ?> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html { | |
| body { | |
| height: 100%; | |
| } | |
| } | |
| body.words-legacy { | |
| text-align: left; | |
| color: #666; | |
| background-color: #CCC; | |
| font-family: "century schoolbook", palatino, serif; | |
| margin: 1em auto 100px auto; | |
| a { | |
| text-decoration: none; | |
| &:hover { | |
| text-decoration: underline; | |
| } | |
| } | |
| div.page { | |
| color: #000; | |
| position: relative; | |
| box-sizing: border-box; | |
| width: 80%; | |
| min-width: 450px; | |
| padding: 40px; | |
| margin: 0 auto; | |
| background-color: #fff; | |
| border: 1px solid #ccc; | |
| h1 { | |
| margin-top: 0; | |
| em, i { | |
| font-weight: normal; | |
| } | |
| } | |
| h2 { | |
| margin-bottom: 0; | |
| } | |
| h2 + p { | |
| margin-top: 4px; | |
| } | |
| img { | |
| max-width: 100%; | |
| height: auto; | |
| } | |
| } | |
| /* main words page */ | |
| &.page-id-119046 { | |
| div.page { | |
| width: 60vw; | |
| .legacy-body { | |
| display: grid; | |
| grid-template-columns: 100px 1fr; | |
| grid-gap: 0 1em; | |
| h2.year { | |
| font-size: medium; | |
| font-style: italic; | |
| font-weight: normal; | |
| padding: 0; | |
| margin: 0; | |
| font-family: georgia, serif; | |
| } | |
| div.mentions { | |
| max-width: 400px; | |
| > * { | |
| font-family: sans-serif; | |
| font-weight: normal; | |
| font-size: small; | |
| } | |
| h2 { | |
| color: #999; | |
| border-bottom: 3px solid #ccc; | |
| padding: 0 0 3px 0; | |
| &:first-child { | |
| margin-top: 3px; | |
| } | |
| } | |
| .date { | |
| color: #666; | |
| font-style: italic; | |
| font-family: serif; | |
| } | |
| ul { | |
| padding: 0 0 0 2em; | |
| li { | |
| line-height: 1.3; | |
| list-style: none; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| } | |
| } | |
| } | |
| } | |
| } | |
| &.page-id-119013 { | |
| div.page { | |
| width: 580px; | |
| } | |
| } | |
| /* web integrator */ | |
| &.page-id-118992 { | |
| background-color: #fff; | |
| div.page { | |
| border: none; | |
| padding: 0; | |
| } | |
| } | |
| &.page-id-119038 { | |
| background-color: #006; | |
| color: #fff; | |
| div.page { | |
| background-color: #006; | |
| color: #fff; | |
| border: none; | |
| } | |
| div.legacy-body { | |
| background-color: #006; | |
| color: #fff; | |
| border-bottom-width: 1px; | |
| border-bottom-color: #F30; | |
| border-bottom-style: dotted; | |
| border-left-width: 1px; | |
| border-left-color: #F30; | |
| border-left-style: dotted; | |
| padding: 40px; | |
| margin: 0 0 50px 0; | |
| } | |
| h1 { | |
| font-size: 20px; | |
| font-family: georgia, times, serif; | |
| margin: 0 0 0 0; | |
| color: #fff; | |
| } | |
| p { | |
| font-family: courier, 'courier new', fixed-width; | |
| } | |
| div.two-ships-footer { | |
| font-size: x-small; | |
| font-family: verdana, sans-serif; | |
| background-color: #FFF; | |
| color: #000; | |
| padding: 0.5em; | |
| margin: 0 0 25px 0; | |
| width: 40vw; | |
| float: right; | |
| } | |
| } | |
| /* becoming */ | |
| &.page-id-119032 { | |
| background-color: #fff; | |
| body.words-legacy { | |
| background-color: #fff; | |
| color: #000; | |
| } | |
| div.page { | |
| border: none; | |
| width: 400px; | |
| margin: 0 auto; | |
| } | |
| h1, p { | |
| font-size: medium; | |
| } | |
| } | |
| /* lindows-pitch, forta-speaks */ | |
| &.page-id-119028, &.page-id-119041 { | |
| h1 { | |
| font-size: larger; | |
| } | |
| h1, h2 { | |
| color: #063; | |
| font-size: medium; | |
| font-family: Georgia, serif; | |
| line-height: 1.2; | |
| } | |
| p { | |
| font-family: Georgia, serif; | |
| line-height: 1.2; | |
| } | |
| .footer { | |
| margin-left: 100px; | |
| width: 400px; | |
| } | |
| } | |
| /* zappa */ | |
| &.page-id-119026 { | |
| background-color: #F6F; | |
| margin: 1em 1em 100px 1em; | |
| div { | |
| background-color: #fff; | |
| &.page { | |
| padding: 0; | |
| width: 100%; | |
| } | |
| } | |
| ul { | |
| line-height: 1.1; | |
| } | |
| h1 { | |
| background-image: url(https://artlung.com/archive/words/zappa/iamazappafan.gif); | |
| background-position: 50% 50%; | |
| background-size: contain; | |
| background-repeat: no-repeat; | |
| width: 50vw; | |
| height: 20vh; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| text-indent: 100%; | |
| margin: 0; | |
| } | |
| div.legacy-body { | |
| max-width: 600px; | |
| margin: 0 auto; | |
| } | |
| } | |
| /** web work */ | |
| &.page-id-119023 { | |
| div.page { | |
| background-color: #EFE; | |
| color: #000; | |
| h1, h2 { | |
| color: #063; | |
| } | |
| h2 { | |
| margin-bottom: 0; | |
| } | |
| p { | |
| margin-top: 5px; | |
| } | |
| div.footer { | |
| font-family: geneva, 'ms sans serif', sans-serif; | |
| padding: 5px; | |
| width: 100%; | |
| background-color: #EEE; | |
| color: #666; | |
| border-style: dotted; | |
| border-width: 2px; | |
| border-color: #063; | |
| } | |
| div.narrow { | |
| width: 400px; | |
| margin-left: 100px; | |
| } | |
| } | |
| } | |
| /** accessibility */ | |
| &.page-id-119005 { | |
| div.page { | |
| width: 600px; | |
| margin: 0 auto; | |
| } | |
| } | |
| &.page-id-118999, &.page-id-119019 { | |
| h1 { | |
| display: none; | |
| } | |
| .c { color: #060; } | |
| .q { font-style: italic; color: #090; font-weight: bold;} | |
| pre { text-align: left; } | |
| } | |
| /* what-is-a-web-integrator */ | |
| &.page-id-118992 { | |
| h1 { | |
| display: none; | |
| font-family: georgia, times, serif; | |
| font-weight: normal; | |
| margin: 0; | |
| &.custom-header { | |
| display: block; | |
| padding: 1.2em 0.5em; | |
| color: #000; | |
| background-color: #3C3; | |
| max-width: 600px; | |
| border: 3px dotted #fff; | |
| text-align: left; | |
| line-height: 1.2; | |
| } | |
| br { | |
| display: none; | |
| } | |
| em { | |
| display: block; | |
| font-size: medium; | |
| line-height: 1.1; | |
| } | |
| } | |
| } | |
| /* crossplatform */ | |
| &.page-id-118975 { | |
| div.page { | |
| font-family: georgia, times, serif; | |
| line-height: 1.2; | |
| h1 { | |
| font-size: 1.5em; | |
| font-weight: lighter; | |
| } | |
| .legacy-body { | |
| display: grid; | |
| grid-template-columns: 153px 1fr; | |
| justify-items: center; | |
| } | |
| .TI994A_Amiga { | |
| } | |
| .crossplatform-main { | |
| } | |
| .operating-systems-1997 { | |
| width: 240px; | |
| float: right; | |
| height: 30px * 3; | |
| a { | |
| height: 30px; | |
| width: 30px; | |
| display: flex; | |
| justify-content: space-around; | |
| align-content: center; | |
| align-items: center; | |
| &.os2 { | |
| width: 30px * 2; | |
| } | |
| } | |
| div.row1 { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr; | |
| width: 30px * 2; | |
| } | |
| div.row2 { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr 2fr 1fr 1fr; | |
| width: 30px * 6; | |
| margin-left: 30px * 2; | |
| } | |
| div.row3 { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; | |
| width: 30px * 6; | |
| margin-left: 30px * 2; | |
| } | |
| } | |
| } | |
| } | |
| /* flash mind reader */ | |
| &.page-id-119044 { | |
| div.page { | |
| width: auto; | |
| } | |
| } | |
| /* some poems */ | |
| &.page-id-118969, &.page-id-119034 { | |
| div.page { | |
| border-width: 1px; | |
| border-style: solid; | |
| border-color: #ccc #666 #666 #ccc; | |
| h1 { | |
| font-family: georgia, times, serif; | |
| font-weight: normal; | |
| } | |
| h2 { | |
| font-family: georgia,times,serif; | |
| color: #969; | |
| position: absolute; | |
| top: -26px; | |
| margin: 0; | |
| left: 0; | |
| } | |
| div.poem { | |
| box-sizing: border-box; | |
| border-width: 0 0 1px 1px; | |
| border-color: #969; | |
| border-style: dotted; | |
| position: relative; | |
| padding: 20px 0 20px 40px; | |
| margin: 50px 0 100px 0; | |
| max-width: 600px; | |
| p { | |
| font-family: "century schoolbook", palatino, serif; | |
| font-style: italic; | |
| line-height: 1.1; | |
| } | |
| } | |
| div.poem-footer { | |
| box-sizing: border-box; | |
| max-width: 600px; | |
| border-top: 1px dotted #ccc; | |
| padding: 30px 0 0 80px; | |
| color: #666; | |
| font-size: small; | |
| line-height: 2; | |
| font-family: "century schoolbook", palatino, serif; | |
| } | |
| } | |
| } | |
| } | |
| section.legacy-footer { | |
| position: fixed; | |
| bottom: 0; | |
| left: 0; | |
| background-color: #666; | |
| color: #fff; | |
| opacity: 0.9; | |
| z-index: 10; | |
| width: 100%; | |
| padding: 0; | |
| font-size: x-small; | |
| font-family: 'helvetica neue', helvetica, arial, sans-serif; | |
| height: 30px; | |
| overflow: hidden; | |
| &:hover { | |
| opacity: 1 | |
| } | |
| ul { | |
| list-style-type: none; | |
| margin: 0; | |
| padding: 0; | |
| li { | |
| min-width: 100px; | |
| height: 33px; | |
| display: inline-block; | |
| margin: 0; | |
| background-image: url(data:image/gif;base64,R0lGODlhEQBGAIAAAP///wAAACH5BAkAAAEALAAAAAARAEYAAAJPjA2nq8mPoHRy0Xoujjt3/3GfhpFlGJgTmqIq9MLuTI+1HcaMvt8bb/GdhBUgCNcxipI54grJbEJ/zoeyJY1Oh9oudVus9rLeMPlbNoMVBQA7); | |
| background-repeat: no-repeat; | |
| background-position: top right; | |
| text-align: center; | |
| padding: 0 33px 0 0; | |
| box-sizing: border-box; | |
| color: #ccc; | |
| &:first-child { | |
| padding-left: 0; | |
| } | |
| a, span { | |
| display: inline-block; | |
| min-width: 100px; | |
| color: #ccc; | |
| box-sizing: border-box; | |
| padding: 0; | |
| line-height: 3; | |
| } | |
| a { | |
| text-decoration: none; | |
| &:hover { | |
| color: #fff; | |
| text-decoration: underline; | |
| } | |
| } | |
| } | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment