diff --git a/about.html b/about.html new file mode 100644 index 0000000..74828b9 --- /dev/null +++ b/about.html @@ -0,0 +1,32 @@ + + + + + + + + Document + + + + + + +
+ +

About

+ +

Michael is a man who loves puppies and is looking for a job. + This page wasn't a part of the assignment. But he thought an About tab would look great + on the navbar.

+

© Here's a copyright symbol.

+ +
+ + + \ No newline at end of file diff --git a/contact-form.html b/contact-form.html new file mode 100644 index 0000000..9617a23 --- /dev/null +++ b/contact-form.html @@ -0,0 +1,98 @@ + + + + + + + + Document + + + + + +
+ +

Contact

+ +
+ + +
+ +
+
+ + +
+ +
+
+ + +
+ +
+
+ + +
+ + +
+ + +
+
+ + +
+ +
+
+ + +
+ +
+
+ + +
+ +
+ +
+ +
+ +
+ +
+ +
+
+ + +
+ +
+
+ + + +
+ +
+ + + \ No newline at end of file diff --git a/images/avatar.jpg b/images/avatar.jpg new file mode 100644 index 0000000..7f62e4d Binary files /dev/null and b/images/avatar.jpg differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0695ec4 --- /dev/null +++ b/index.css @@ -0,0 +1,51 @@ +/* This is for CSS that only index.html uses. Global styles are in styles.css */ + +img { + border-radius: 50%; + width: 12em; + float: right; + + transition: 0.2s; +} + +img:hover { + cursor: pointer; + opacity: 0.9; +} + +.hover-transition { + border-left: 0px solid var(--secondary-text-color); + transition: 0.4s; +} + +.hover-transition:hover { + background-color: #d88f53; + border-left: 6px solid var(--secondary-text-color); + padding-left: 10px; +} + +.company { + font-weight: bold; +} + +.position { + font-style: bold; + color: var(--secondary-text-color); +} + +.date { + font-style: italic; + color: var(--secondary-text-color); +} + +.main-text { + display: block; +} + +@media (max-width: 1072px) { + img { + float: none; + display: block; + margin: auto; + } +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..9b4d195 --- /dev/null +++ b/index.html @@ -0,0 +1,80 @@ + + + + + + + + + Resume + + + + + + + +
+ +

Michael McMasters

+ + An image of the author + +

+ Objective: To secure long-term employment in the field of Computer Science. To advance my + position and become a full-stack developer; To secure a challenging position that will expand my skills and let + me program anything I want. +

+ +

+ Education: High School Degree +

+ +

+ Skills: Javascript ∙ HTML ∙ CSS ∙ Git ∙ Unity ∙ C# +

+ +

+ Awards: Employee of the year at My Alarm Center. Invited by Facebook to be an Oculus Start + member for indie game developers. +

+
+
+ +
+ Doordash: Independent Contractor
+ November 2016 - Present
+ Worked full-time around the Philly metro area driving passengers to their destinations; + picked up food from various restaurants and delivered to customers + +
+ +

+ Hop Energy: Independent Contractor: Database Entry + Clerk
+ February 2016 - November 2016
+ Scanned hard copy contracts into computer database; + updated and organized customer account information; trained staff + +

+ +

+ My Alarm Center: Installation Coordinator
+ March 2014 - January 2016
+ Liaison between Sales reps and field technicians; solely responsible for new customer + shell accounts; created work orders; processed customer billing; handled technician payments; organized + technician inventory + +

+ +
+ + + + \ No newline at end of file diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..2a1f733 --- /dev/null +++ b/styles.css @@ -0,0 +1,83 @@ +/* This is for global styles that all pages use */ + +body { + --primary-text-color: #222527; + --secondary-text-color: rgb(70, 70, 70); + --background-color: #f4a261; + --background-color-hover: #d88f53; + --border-color: var(--secondary-text-color); + + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, + "Open Sans", "Helvetica Neue", sans-serif; + + color: var(--primary-text-color); + + background-color: #2a9d8f; +} + +#navbar { + margin: -10px -10px 20px -10px; /* Negative so div goes to edge of screen */ + padding: 35px 25%; + background-color: #222; + + display: flex; + flex-direction: row; + color: green; + list-style: none; +} + +#navbar a { + padding: 15px; + font-size: 18px; + border-radius: 20px; + + transition: 0.2s; +} + +#navbar :nth-child(4) { + margin-left: auto; +} + +a:link { + color: green; +} + +a:visited { + color: var(--background-color-hover); +} + +a:hover { + color: yellow; + background-color: #18343f; + border-radius: 20px; +} + +.main-content-wrapper { + margin: auto; + padding: 0 20px 20px; + width: 50%; + background-color: var(--background-color); + border-radius: 40px; + box-shadow: 13px 13px 0 #222; +} + +.primary-text { + color: var(--primary-text-color); +} + +.secondary-text { + color: var(--secondary-text-color); +} + +.title { + text-align: center; + margin-top: 10px; + padding: 10px 0px; + border-radius: 40px 40px 0 0; + border-bottom: 1px solid var(--border-color); + + transition: 0.2s; +} +.title:hover { + background-color: var(--background-color-hover); +}