diff --git a/about.html b/about.html new file mode 100644 index 000000000..af3f13e5d --- /dev/null +++ b/about.html @@ -0,0 +1,79 @@ + + + + + + + + About Canaan + + +
+ +

+ ...why'd my momma name me that and other questions I can answer +

+ +
+ +
+ utah +
+
+

Canaan West

+
+

Vision

+

+ 20/20 but deteriorating +

+
+
+

Passion

+

+ fruit +

+ +
+
+

Purpose

+

+ -lessness +

+
+
+
+
+ + + diff --git a/index.html b/index.html new file mode 100644 index 000000000..e6a118599 --- /dev/null +++ b/index.html @@ -0,0 +1,60 @@ + + + + + + + + Canaan + + +
+ +

+ +

+ +
+ +
+
+
+ me! +
+ +
+ +
+ + + diff --git a/pics/background.jpeg b/pics/background.jpeg new file mode 100644 index 000000000..4a5fe5571 Binary files /dev/null and b/pics/background.jpeg differ diff --git a/pics/dirty_hands.jpg b/pics/dirty_hands.jpg new file mode 100644 index 000000000..e43422df9 Binary files /dev/null and b/pics/dirty_hands.jpg differ diff --git a/pics/hammock.jpg b/pics/hammock.jpg new file mode 100644 index 000000000..53570abe9 Binary files /dev/null and b/pics/hammock.jpg differ diff --git a/pics/hotel.png b/pics/hotel.png new file mode 100644 index 000000000..503016d89 Binary files /dev/null and b/pics/hotel.png differ diff --git a/pics/meowspace.27.30 PM.png b/pics/meowspace.27.30 PM.png new file mode 100644 index 000000000..b9e6293ad Binary files /dev/null and b/pics/meowspace.27.30 PM.png differ diff --git a/pics/portfolio.jpg b/pics/portfolio.jpg new file mode 100644 index 000000000..eeb403a06 Binary files /dev/null and b/pics/portfolio.jpg differ diff --git a/pics/utah.jpg b/pics/utah.jpg new file mode 100644 index 000000000..e70489fad Binary files /dev/null and b/pics/utah.jpg differ diff --git a/pics/utah_edit.png b/pics/utah_edit.png new file mode 100644 index 000000000..99e77fa94 Binary files /dev/null and b/pics/utah_edit.png differ diff --git a/poetry.html b/poetry.html new file mode 100644 index 000000000..caf979889 --- /dev/null +++ b/poetry.html @@ -0,0 +1,105 @@ + + + + + + + + Poetry + + +
+ +

+ ...why'd my momma name me that and other questions I can answer +

+ +
+ +
+

her:water

+
+
+

her water

+

+ Held her
+ Chased the desert from her lips
+ Chased her
+

+
+ +
+

for: Softness

+

+ For softness
+ I set myself aside and pressed
+ Your head to my chest.
+ Listen to me breathe:
+ I swallow up barren gardens
+ And my pulses lose their synchrony.

+ You plant more flowers in protest.

+ Can you just set down your spectacles?
+ Let your god-given eyes do their work
+ without the scrutiny of the dead
+ hanging in the air around you?
+ Let the light bend itself
+ with the force of your breathing.
+ Let the light bounce.
+ Let it bend itself.
+

+ +
+ +
+

dancing

+

you called for me
+ and I called you Love in a new tongue,
+ your name encircling me waist deep:
+ as alive as
+ water in the bayou
+ stand closer to me and I will
+ teach you my feet,
+ in the traditions of my mothers
+ whisper swamp songs to you,
+ the sun at our backs.
+

+ +
+ +
+
+ + + + + diff --git a/portfolio.html b/portfolio.html new file mode 100644 index 000000000..d9e43c44b --- /dev/null +++ b/portfolio.html @@ -0,0 +1,91 @@ + + + + + + + + My Work + + + +
+ + +

+ ..my work? more like my fun! +

+ + +
+ + +
+

Lemme Tell Ya What I'm Doin'

+
+ canaan at work +

+ Although I'm a fairly new developer, I have accumulated a great body of work. These projects are just a few from my time at Ada! More can be found on my github. +

+
+ +
+ +
+ +
+ + + + + + + diff --git a/resume.html b/resume.html new file mode 100644 index 000000000..e69de29bb diff --git a/styles/about.css b/styles/about.css new file mode 100644 index 000000000..88463ddc2 --- /dev/null +++ b/styles/about.css @@ -0,0 +1,70 @@ +main { + position: relative; + top: 10vw; +} + +body { + border: none; +} + +.background { + position: fixed; + left: 0; + top: 7.2vw; + height: 100%; + z-index: 2; + opacity: 1; +} + +.say_this h1 { + text-align: left; + padding-left: 5vw; + margin: 5vw; + margin-top: 0; + border-bottom: solid; + border-width: 60%; +} + + +.articles h1 { + z-index: 1; +} + +.say_this { + z-index: 2; + display: block; + position: relative; + width: 80%; + text-align: center; + background: #EBF7F7; + opacity: .8; + padding-top: 5vw; + padding-bottom: 5vw; + margin: 5vw 0; + margin: 5vw; +} + + + +.say_this article:nth-child(n) { + text-align: center; + border: 10px solid #25A0A0; + padding: 1vw; + margin: 2vw; + max-height: 15vw; + width: 20vw; + height: 12vw; + position: relative; + left: 5%; + opacity: 1; + +} + +.say_this article:nth-child(2n) { + position: relative; + left: 42%; +} + +.say_this article:nth-child(n) h2 { + border: #25A0A0; +} diff --git a/styles/general_styles.css b/styles/general_styles.css new file mode 100644 index 000000000..445fc8712 --- /dev/null +++ b/styles/general_styles.css @@ -0,0 +1,135 @@ + +@import url('https://fonts.googleapis.com/css?family=Arima+Madurai'); +@import url('https://fonts.googleapis.com/css?family=Arima+Madurai|Overlock'); + +h1, h2, li, p, a { + font-family: 'Arima Madurai', cursive; +} + +h1 { + color: #9C873C; +} + +main p { + color: #9C873C +} + +body { + position: relative; + background: #EBF7F7; + margin: 10vw; + padding: 0; + box-sizing: content-box; +} + +a { + text-decoration: none; + color: #FDF7E1; +} + +ul { + display: inline-block; + list-style: none; + text-align: left; +} + +li { + text-decoration: none; + display: inline-block; + padding: 2vw; + height: 100%; + font-family: 'Arima Madurai', cursive; + margin-top: 2vw; +} + +nav ul li:hover { + text-transform: uppercase; + color: #19647E; + margin-bottom: 1vw; +} + +header { + position: fixed; + display: flex; + top: 0; + left: 0; + width: 100%; + height: 6vw; + background: #19647E; + color: #FDF7E1; + font-family: 'Arima Madurai', cursive; + z-index: 1000; +} + +.header { + position: relative; + margin: 0; + padding: 0; + +} + +.header li{ + display: inline-block; + margin: 0; + padding: 0; + font-size: 1.5vw; +} + +.header li:hover { + text-transform: uppercase; + padding-bottom: 1vw; +} + + +header p { + position: absolute; + top: 4.7vw; + left: 0; + padding-left: 10vw; + font-family: 'Arima Madurai', cursive; + font-size: 1.2vw; + min-width: 300px; + color: #FDF7E1; + font-style: italic; + background: #1F271B; + width: 100%; +} + +header nav { + display: inline-block; + position: absolute; + right: 2vw; + bottom: 0; + height: 100%; + margin: 0; + padding-bottom: 2.5vw; + text-decoration: none; +} + + + +/*FOOTER*/ + +footer { + position: fixed; + bottom: 0; + left: 0; + background :#1F271B; + left:0; + bottom: 0; + margin: 0; + margin-top: 5vw; + width: 100%; + max-height: 4vw; + z-index: 1000; +} + +footer nav { + float: right; + position: relative; + bottom: 2vw; +} + +footer li{ + margin: 0; +} diff --git a/styles/index.css b/styles/index.css new file mode 100644 index 000000000..39014f9d1 --- /dev/null +++ b/styles/index.css @@ -0,0 +1,80 @@ +/*main*/ +@import url('https://fonts.googleapis.com/css?family=Arima+Madurai'); +@import url('https://fonts.googleapis.com/css?family=Arima+Madurai|Overlock'); + +main { + z-index: 0; + margin-left: 15vw; + margin-right: 15vw; + margin-top: 0; + position: relative; + overflow: hidden; + border: #19647E 10px double; +} + +main h1, main p, main h2{ + font-family: 'Overlock', cursive; +} + + +.intro { + position: relative; + display: block; + padding-top: 2vw; + width: 70%; + max-width: 500px; + max-height: 700px; + margin: 0 auto; + margin-bottom: 5vw; +} + +.intro h1 { + text-align: center; + font-size: 4vw; + border-bottom: #EE964B double 10px; + border-top: #EE964B double 10px; + padding: 2vw; + max-width: 600px; + margin-bottom: 0; +} + +.intro h1 a { + color: #9C873C; +} + +.intro h1 a:hover { + color: #19647E;; +} + +#profile_img img{ + max-height: 20vw; + border-radius: 50%; + border: solid 1px #9C873C; + display: block; + margin: 0 auto; + margin-bottom: 2vw; +} + +.intro article { + display: inline-block; + text-align: center; + padding: 5vw; + padding-top: 0; + border: solid 4px #9C873C; + max-width: 400px; +} + + + + +/*main*/ + + +/*colors: +dark green: #1F271B +dark blue: #19647E +light sea green: #28AFB0 +blond: #FDF7E1 +peach bluff: #F8D8BD + +*/ diff --git a/styles/normalize.css b/styles/normalize.css new file mode 100644 index 000000000..fa4e73dd4 --- /dev/null +++ b/styles/normalize.css @@ -0,0 +1,447 @@ +/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in + * IE on Windows Phone and in iOS. + */ + +html { + line-height: 1.15; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers (opinionated). + */ + +body { + margin: 0; +} + +/** + * Add the correct display in IE 9-. + */ + +article, +aside, +footer, +header, +nav, +section { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + * 1. Add the correct display in IE. + */ + +figcaption, +figure, +main { /* 1 */ + display: block; +} + +/** + * Add the correct margin in IE 8. + */ + +figure { + margin: 1em 40px; +} + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** + * 1. Remove the gray background on active links in IE 10. + * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. + */ + +a { + background-color: transparent; /* 1 */ + -webkit-text-decoration-skip: objects; /* 2 */ +} + +/** + * 1. Remove the bottom border in Chrome 57- and Firefox 39-. + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** + * Prevent the duplicate application of `bolder` by the next rule in Safari 6. + */ + +b, +strong { + font-weight: inherit; +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font style in Android 4.3-. + */ + +dfn { + font-style: italic; +} + +/** + * Add the correct background and color in IE 9-. + */ + +mark { + background-color: #ff0; + color: #000; +} + +/** + * Add the correct font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + */ + +audio, +video { + display: inline-block; +} + +/** + * Add the correct display in iOS 4-7. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Remove the border on images inside links in IE 10-. + */ + +img { + border-style: none; +} + +/** + * Hide the overflow in IE. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers (opinionated). + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { + font-family: sans-serif; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { /* 1 */ + text-transform: none; +} + +/** + * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` + * controls in Android 4. + * 2. Correct the inability to style clickable types in iOS and Safari. + */ + +button, +html [type="button"], /* 1 */ +[type="reset"], +[type="submit"] { + -webkit-appearance: button; /* 2 */ +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * 1. Add the correct display in IE 9-. + * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { + display: inline-block; /* 1 */ + vertical-align: baseline; /* 2 */ +} + +/** + * Remove the default vertical scrollbar in IE. + */ + +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10-. + * 2. Remove the padding in IE 10-. + */ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-cancel-button, +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in IE 9-. + * 1. Add the correct display in Edge, IE, and Firefox. + */ + +details, /* 1 */ +menu { + display: block; +} + +/* + * Add the correct display in all browsers. + */ + +summary { + display: list-item; +} + +/* Scripting + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + */ + +canvas { + display: inline-block; +} + +/** + * Add the correct display in IE. + */ + +template { + display: none; +} + +/* Hidden + ========================================================================== */ + +/** + * Add the correct display in IE 10-. + */ + +[hidden] { + display: none; +} diff --git a/styles/poetry.css b/styles/poetry.css new file mode 100644 index 000000000..c886a9c48 --- /dev/null +++ b/styles/poetry.css @@ -0,0 +1,61 @@ +main { + /*border-left: #25A0A0 10px double; + border-right: #25A0A0 10px double;*/ + margin: 10vw; + padding: 3vw; +} + + +.background { + margin: 0; + padding: 0; + width: 100%; + position: absolute; + left: 0; +} + +main h1 { + font-size: 5vw; + margin-bottom: 0; +} + +.poetry { + border-left: #25A0A0 10px double; + border-right: #25A0A0 10px double; + border-bottom: #25A0A0 10px solid; + border-top: #25A0A0 10px solid +} + +.poetry :nth-child(n) h2 { + text-align: center; + border-top: #9C873C 10px double; + border-bottom: #9C873C 10px double; +} + + +.poetry article:nth-child(n){ + padding: 5vw; + padding-top: 3vw; + padding-bottom: 0; + color: #3E517A; + margin-left: 5vw; + margin-right: 5vw; +} + +/*.poetry article:nth-child(2n){ + position: relative; + left: 15vw; + max-width: 60%; + +}*/ + +.poetry article:nth-child(n) p { + padding: 2vw; + padding-bottom: 3vw; +} + +/* +.poetry article:nth-child(2n+1){ + display: inline-block; + max-width: 60%;*/ +} diff --git a/styles/portfolio.css b/styles/portfolio.css new file mode 100644 index 000000000..783b9d16a --- /dev/null +++ b/styles/portfolio.css @@ -0,0 +1,70 @@ +main h1 { + position: relative; + top: 10vw; + text-align: center; + font-size: 5vw; +} + +.intro_work { + position: relative; + top: 10vw; + border-top: #EE964B double 10px; + border-bottom: #EE964B double 10px; + padding: 5vw; +} + +#port_pic { + display: inline-block; + width: 30%; + z-index: 1; + border-radius: 50%; + padding: 1vw; + background: #19647E; +} + + +.intro_work p{ + display: inline-block; + position: absolute; + top: 10vw; + right: 6vw; + background-color: none; + width: 50%; + /*padding: 5vw;*/ + text-align: center; + margin-left: 2vw; +} + +.intro_work a, .my_work a { + color: black; + text-decoration: underline; +} + +.my_work { + position: relative; + margin-top: 10vw; + padding: 0; +} + +.my_work img { + position: relative; + top: 5vw; + width: 40%; +} + +.my_work p { + position: relative; + top: 5vw; + width: 50%; +} + +.my_work li { + display: inline-block; + width: 50%; + border-radius: 50%; + padding: 0; +} + +.my_work li:hover { + width: 150%; +} diff --git a/styles/resume.css b/styles/resume.css new file mode 100644 index 000000000..e69de29bb