From b70f6aa222bb895d0c3483f052aaf9033a1598fc Mon Sep 17 00:00:00 2001 From: Adam Cooper Date: Wed, 27 Jul 2022 08:45:35 -0400 Subject: [PATCH] First commit of slimmed repo --- .gitignore | 0 css/reset.css | 48 ++++ css/stylesheet.css | 693 +++++++++++++++++++++++++++++++++++++++++++++ deploy.sh | 14 + index.html | 30 ++ sftp_upload.bat | 4 + wrong-email.html | 40 +++ 7 files changed, 829 insertions(+) create mode 100644 .gitignore create mode 100644 css/reset.css create mode 100644 css/stylesheet.css create mode 100755 deploy.sh create mode 100644 index.html create mode 100644 sftp_upload.bat create mode 100644 wrong-email.html diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e69de29 diff --git a/css/reset.css b/css/reset.css new file mode 100644 index 0000000..af94440 --- /dev/null +++ b/css/reset.css @@ -0,0 +1,48 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} \ No newline at end of file diff --git a/css/stylesheet.css b/css/stylesheet.css new file mode 100644 index 0000000..3b27b57 --- /dev/null +++ b/css/stylesheet.css @@ -0,0 +1,693 @@ +@font-face { + font-family: 'Neona'; + src: url('../fonts/neona.ttf'); +} + +html { + font-size: 62.5%; /* The Snook Font Size */ +} + +.container-fluid { /* This was .container */ + position: relative; + width: 100%; + margin: 0; + padding-left: 0; + padding-right: 0; +} + +#lowercase { + position: absolute; + z-index: 3; + margin-top: 120px; + left: 33%; +} + +#mlowercase { + opacity: 0.0; +} + +#backdrop { + position: absolute; + top: 0; + z-index: -1; +} + +video { + margin: 0 auto; + padding-left: 0; + padding-right: 0; + width: 1400px; +} + + +html, body { + margin: 0; + height: 100%; + width: 100%; +} + + +div { + text-align: center; + vertical-align: middle; +} + +#topSpacer { + margin-bottom: 70px; +} + +.nt { + min-width: 95px; + font: normal 120px/ 120px 'Neona', Helvetica, sans-serif; + color: #EEDDE0; + text-shadow: 0 0 18px #EC637B, + 0 0 6px rgba(230, 161, 173, 0.41), + 0 0 60px #E6A1AD, + 0 0 300px #F36780, + 3px 5.4px 3px rgba(0, 0, 0, 0.5); +} + +.nt .off { + color: rgba(46, 46, 46, 0.61); + text-shadow: 4.2px 4.2px 3px rgba(0, 0, 0, 0.5); +} + +.nm { + min-width: 95px; + /*margin-top: 50px;*/ + text-align: right; + font: normal 60.0px/ 60.0px 'Neona', Helvetica, sans-serif; + color: #EEDDE0; + text-shadow: 0 0 9.0px #EC637B, + 0 0 3.0px rgba(230, 161, 173, 0.41), + 0 0 30.0px #E6A1AD, + 0 0 150.0px #F36780, + 1.5px 2.7px 1.5px rgba(0, 0, 0, 0.5); +} + +.nm .off { + color: rgba(46, 46, 46, 0.61); + text-shadow: 2.1px 2.1px 1.5px rgba(0, 0, 0, 0.5); +} + +.ticker { + display: none; +} + +.ghost { + font: normal 120px/ 120px 'Neona', Helvetica, Arial; + color: rgba(238, 221, 224, 0); + text-shadow: none; +} + +.underline { + text-decoration: underline; +} + +.alwaysHidden { + display: none; +} + +.ahidden { + display: none; +} + +.current { + display: block; +} + +nav > ul { + list-style: none; + text-align: center; + -moz-padding-start: 0; + -webkit-padding-start: 0; +} + +nav > ul > li { + display: inline; + font-size: 40%; +} + +nav a { + color: inherit; +} + +#floatingNav { + opacity: 0.0; + z-index: 1; + position: absolute; + width: 285px; + top: 0; + left: 500px; + /*margin: 0 auto;*/ + font-family: 'Roboto Mono', monospace; + color: #f7cac9; +} + +.nn { + font-family: 'Roboto Mono', monospace; + color: #EEDDE0; + text-shadow: 0 0 9.0px #EC637B, + 0 0 3.0px rgba(230, 161, 173, 0.41), + 0 0 30.0px #E6A1AD, + 0 0 80.0px #F36780, + 1.5px 2.7px 1.5px rgba(0, 0, 0, 0.5); +} + +.nnwhite { + font-family: 'Roboto Mono', monospace; + color: #EEDDE0; +} + +.navBullet { + font-size: 3rem; + font-size: 30px; + line-height: 3rem; + line-height: 30px; +} + +.navText { + font-size: 2rem; + font-size: 20px; + line-height: 3rem; + line-height: 30px; +} + +/*.hoverShow { + font-family: 'Roboto', sans-serif; + font-size: 3rem; + font-size: 30px; + color: #f7cac9; +}*/ + +.navLink { + margin-left: auto; + margin-right: auto; +} + +#fHomeShow, #fAboutShow, #fProjectsShow { + opacity: 0.0; +} + +#fNavTop { + /*width: 33%;*/ + margin: 0 auto; +} + +#fHomeLink { + margin-top: 60px; +} + +#homeHoverHide { display: block; } +#homeHoverShow { display: none; } +#fHomeLink:hover #homeHoverHide { display: none; } +#fHomeLink:hover #homeHoverShow { display: block; } + +#fProjectsLink { + margin-top: 40px; +} + +#projectsHoverHide { display: block; } +#projectsHoverShow { display: none; } +#fProjectsLink:hover #projectsHoverHide { display: none; } +#fProjectsLink:hover #projectsHoverShow { display: block; } + +#fLateralLink:before { + clear: both; +} + +#fLateralLink { + margin-top: 40px; + overflow: hidden; +} + +.lateralHoverHide { display: block; } +.lateralHoverShow { display: none; } +#fLateralLink:hover .lateralHoverHide { display: none; } +#fLateralLink:hover .lateralHoverShow { display: block; } + +#fLateralLink:after { + clear: both; +} + +#fPhotoLink { + width: 44%; + height: 36px; + text-align: right; + float: left; +} + +#fAboutSlash { + width: 11%; + text-align: center; + float: left; +} + +#fBioLink { + width: 44%; + text-align: left; + float: right; +} + +#fContactLinks { + margin-top: 40px; +} + +#fContactLinks ul { + list-style: none; + text-align: center; + -moz-padding-start: 0; + -webkit-padding-start: 0; +} + +#fContactLinks ul li { + display: block; + height: 64px; + /*margin-top: 40px;*/ + margin-bottom: 10px; +} + + +#fContactLinks ul li:first-child { + display: block; + margin-top: 0; + margin-bottom: 10px; +} + +#fContactLinks img { + margin: 0 auto; +} + +#gmailHoverHide, +#githubHoverHide, +#linkedinHoverHide, +#wordpressHoverHide { + display: block; +} + +#gmailHoverShow, +#githubHoverShow, +#linkedinHoverShow, +#wordpressHoverShow { + display: none; +} + +#fGmailLink:hover #gmailHoverHide { display: none; } +#fGmailLink:hover #gmailHoverShow { display: block; } +#fGithubLink:hover #githubHoverHide { display: none; } +#fGithubLink:hover #githubHoverShow { display: block; } +#fLinkedinLink:hover #linkedinHoverHide { display: none; } +#fLinkedinLink:hover #linkedinHoverShow { display: block; } +#fWordpressLink:hover #wordpressHoverHide { display: none; } +#fWordpressLink:hover #wordpressHoverShow { display: block; } + +#photoPanel { + opacity: 0.0; + position: absolute; + float: left; + left: 0; + top: 0; + width: 1280px; + z-index: 1; + margin-top: 0; + padding-right: 10px; + /*padding: 20px;*/ +} + +#middlePanel { + /*background-image: url(../images/adam_background_3.jpg);*/ + background-image: url(../images/adam_background_1b.jpg); + background-size: 150%; + background-position: -150px -150px; + opacity: 0.0; + position: absolute; + float: left; + top: 0; + left: 1280px; + width: 1280px; + height: 725px; + z-index: 1; +} + +#bioPanel { + background-color: rgba(204,204,204,0.0); + opacity: 0.0; + position: absolute; + float: left; + top: 0px; + left: 2560px; + width: 1280px; + z-index: 1; + margin-top: 0; + padding: 120px 20px 20px; +} + +#bioHeader { + opacity: 0.0; + font-family: 'Neona'; + color: #EEDDE0; + font-size: 3.5rem; + font-size: 30px; + margin: 10px auto; +} + +#photoPanel img { + height: 600px; + margin-top: 40px; +} + +#projectsPanel { + opacity: 0.0; + position: absolute; + left: 0; + top: 0; + width: 100%; + padding-left: 350px; + padding-right: 100px; + z-index: 1; +} + +#projectsHeader { + opacity: 0.0; + font-family: 'Neona'; + color: #EEDDE0; + font-size: 3.5rem; + font-size: 30px; + margin: 10px auto; +} + +.projectSummary h3 { + text-align: left; + letter-spacing: 2px; +} + +.projectSummary { + margin-bottom: 60px; +} + +.projectGitHubLink { + margin-left: 10px; + position: relative; + top: -3px; +} + +.projectGitHubLink img { + width: 36px; +} + +#bioText { + width: 600px; + height: 600px; + margin: 10px auto 80px; +} + +h3 { + font-family: 'Roboto'; + font-weight: 400; + color: #333333; +} + +.longText { + font-family: 'Roboto'; + font-weight: 100; + font-size: 2rem; + font-size: 20px; + line-height: 4rem; + line-height: 40px; + color: #333333; + text-align: justify; + padding-right: 50px; + background-color: rgba(255,255,255,0.2); +} + +#contact > ul { + list-style: none; + text-align: center; + -moz-padding-start: 0; + -webkit-padding-start: 0; +} + +#contact > ul > li { + display: inline; +} + +#contact li:last-child img { + margin-right: initial; +} + +#contact img { + margin-right: 19%; +} + +a:link { + text-decoration: none; + color: inherit; + /* + color: rgb(0,0,60); + color: rgba(0,0,60,1); + */ +} + +a:visited { + text-decoration: none; + color: inherit; + /* + color: rgb(0,0,0); + color: rgba(0,0,0,1); + */ +} + +#jive { + margin-top: 50px; +} + +#jive img { + margin: 0 auto; +} + +#contactsPanel { + opacity: 0.0; +} + +/*@media only screen and (max-device-width: 750px) {*/ + + #lowercase { + opacity: 0.0; + } + + #mlowercase { + opacity: 1.0; + position: static; + left: 0; + width: 100%; + height: 570px; + margin-top: 0; + padding-top: 120px; + padding-left: 20%; + padding-right: 20%; + padding-bottom: 120px; + background-image: url(../images/thumbnails/adam_vintage_letters_clip.png); + -webkit-background-size: cover; + background-size: cover; + } + + .nt { + font: normal 60px/ 60px 'Neona', Helvetica, sans-serif; + } + + .nm { + font: normal 40px/ 40px 'Neona', Helvetica, sans-serif; + } + + .nm.willHide { + padding-right: 25%; + } + + #mprojectsLink { + z-index: 3; + } + + video { + opacity: 0.0; + } + + #backdrop { + position: absolute; + z-index: -1; + } + + #middlePanel { + opacity: 0.0; + } + + #floatingNav { + opacity: 0.0; + } + + #photoPanel { + position: static; + opacity: 1.0; + width: 100%; + padding: 0; + float: none; + } + + #photoPanel img { + width: 100%; + height: inherit; + margin: 0px auto; + } + + #bioPanel { + position: static; + opacity: 1.0; + float: none; + left: 0; + width: 100%; + } + + #bioHeader { + opacity: 1.0; + font: normal 30.0px/ 30.0px 'Neona', Helvetica, sans-serif; + color: #EEDDE0; + text-shadow: 0 0 4.5px #EC637B, + 0 0 1.5px rgba(230, 161, 173, 0.41), + 0 0 15.0px #E6A1AD, + 0 0 75.0px #F36780, + 0.75px 1.35px 0.75px rgba(0, 0, 0, 0.5); + } + + #bioHeader.off { + color: rgba(46, 46, 46, 0.61); + text-shadow: 1.05px 1.05px 0.75px rgba(0, 0, 0, 0.5); + } + + #bioText { + width: 80%; + height: inherit; + } + + .longText { + padding: 10px; + font-size: 2.0rem; + font-size: 20px; + } + + #talk { + color: #edaab6; + cursor: pointer; + } + + #projectsPanel { + position: static; + opacity: 1.0; + padding: 20px; + } + + #projectsHeader { + opacity: 1.0; + font: normal 30.0px/ 30.0px 'Neona', Helvetica, sans-serif; + color: #EEDDE0; + text-shadow: 0 0 4.5px #EC637B, + 0 0 1.5px rgba(230, 161, 173, 0.41), + 0 0 15.0px #E6A1AD, + 0 0 75.0px #F36780, + 0.75px 1.35px 0.75px rgba(0, 0, 0, 0.5); + } + + #projectsHeader.off { + color: rgba(46, 46, 46, 0.61); + text-shadow: 1.05px 1.05px 0.75px rgba(0, 0, 0, 0.5); + } + + .projectSummary h3 { + text-align: center; + } + + .projectSummary .longText { + padding: 10px 25%; + text-align: center; + } + + #contactsPanel { + position: static; + opacity: 1.0; + margin-top: 60px; + } + + #contactsHeader { + opacity: 1.0; + font: normal 30.0px/ 30.0px 'Neona', Helvetica, sans-serif; + color: #EEDDE0; + text-shadow: 0 0 4.5px #EC637B, + 0 0 1.5px rgba(230, 161, 173, 0.41), + 0 0 15.0px #E6A1AD, + 0 0 75.0px #F36780, + 0.75px 1.35px 0.75px rgba(0, 0, 0, 0.5); + } + + #contactsHeader.off { + color: rgba(46, 46, 46, 0.61); + text-shadow: 1.05px 1.05px 0.75px rgba(0, 0, 0, 0.5); + } + + #mContactLinks { + margin-top: 20px; + } + + #mContactLinks > ul { + list-style: none; + text-align: center; + -moz-padding-start: 0; + -webkit-padding-start: 0; + } + + #mContactLinks > ul > li { + display: inline; + } + + #mContactLinks li:last-child img { + margin-right: initial; + } + + #mContactLinks img { + margin-right: 12%; + } + +/*}*/ +.container { + font-family: serif; + font-size: 1.6rem; + text-align: left; + padding: 10px 25% 0 25%; +} + +.container-mono { + font-family: monospace; + font-size: 1.6rem; + text-align: left; + padding: 10px 25% 0 25%; +} + +.container a { + text-decoration-line: underline; +} + +.intro { + margin-bottom: 20px; + text-align: center; +} + +.contact-list { + list-style-type: none; + padding-left: 0; +} + +.contact-list li { + margin-bottom: 5px; +} + +.small-text { + font-size: 1.2rem; +} + diff --git a/deploy.sh b/deploy.sh new file mode 100755 index 0000000..5351e9e --- /dev/null +++ b/deploy.sh @@ -0,0 +1,14 @@ +#!/bin/bash + +# Copy to Linode + +set -euo pipefail + +echo "**********************" +echo "* DEPLOYING Homepage *" +echo "**********************" +echo "" +echo "Copying files..." +sftp -i /home/adam/.ssh/id_rsa_linode -P 39793 -b sftp_upload.bat my_webapp@theadamcooper.com +echo "Done!" +echo "Deployment complete. Visit http://theadamcooper.com to confirm." diff --git a/index.html b/index.html new file mode 100644 index 0000000..2923f1a --- /dev/null +++ b/index.html @@ -0,0 +1,30 @@ + + + + .:!~Adam Cooper~!:. + + + + + + + + + +
+

+ Hi, I'm Adam. I'm a software developer in New York. +

+ +
+ + diff --git a/sftp_upload.bat b/sftp_upload.bat new file mode 100644 index 0000000..da546af --- /dev/null +++ b/sftp_upload.bat @@ -0,0 +1,4 @@ +put -p index.html www/ +put -p wrong-email.html www/ +put -p css/stylesheet.css www/css/ +quit diff --git a/wrong-email.html b/wrong-email.html new file mode 100644 index 0000000..274bb7f --- /dev/null +++ b/wrong-email.html @@ -0,0 +1,40 @@ + + + + + + + Wrong email | Adam Cooper + + + + +
+

Sorry, wrong email

+

I receive misdirected emails with a bizarrely high frequency. About + once a week, I receive an email at my old GMail address, addressed to + someone unknown to me hundreds or even thousands of miles away.

+

There’s not much mystery to it. I was an early adopter of GMail, and + grabbed a relatively common first-initial–middle-initial–surname username. + Once GMail went out of beta, a bunch of people got addresses similar to + mine. And from time to time they type their email address into a form and + forget to add the digits or whatever is tacked on after the surname in + their address, and next thing you know I’m getting a promo email from a + yoga studio in Hamilton, Ontario. Or I’m getting invited to a golfing + weekend in Florida or whatever.

+

They come from all over. Not just the unsurprising places in + Australia, Canada, New Zealand, United Kingdom, or USA. I get emails from + Chile and Mexico too. I can speak Spanish, so that’s helpful in those + instances.

+

I try to write a note to everyone, but honestly it’s been years of + this, so I started semiautomating the process to make it interesting. + If you’re technically savvy, you can check out the code here, + although it’s not very exciting. It just kind of gets the job done.

+

<- Back to the home page +

+
+ +