diff --git a/Images/1.png b/Images/1.png deleted file mode 100644 index 69a17f8..0000000 Binary files a/Images/1.png and /dev/null differ diff --git a/Images/2.png b/Images/2.png deleted file mode 100644 index 3f6b42d..0000000 Binary files a/Images/2.png and /dev/null differ diff --git a/Images/3.png b/Images/3.png deleted file mode 100644 index d9fa45c..0000000 Binary files a/Images/3.png and /dev/null differ diff --git a/Images/4.png b/Images/4.png deleted file mode 100644 index cb98ead..0000000 Binary files a/Images/4.png and /dev/null differ diff --git a/Images/Fluke Corporation.png b/Images/Fluke Corporation.png deleted file mode 100644 index 002b3b3..0000000 Binary files a/Images/Fluke Corporation.png and /dev/null differ diff --git a/Images/Leap Forward.png b/Images/Leap Forward.png deleted file mode 100644 index 5ceed14..0000000 Binary files a/Images/Leap Forward.png and /dev/null differ diff --git a/Images/email-brown-background.png.png b/Images/email-brown-background.png.png new file mode 100644 index 0000000..b5d9490 Binary files /dev/null and b/Images/email-brown-background.png.png differ diff --git a/Images/github-brown-background.png.png b/Images/github-brown-background.png.png new file mode 100644 index 0000000..f2994c6 Binary files /dev/null and b/Images/github-brown-background.png.png differ diff --git a/Images/github.png.png b/Images/github.png.png new file mode 100644 index 0000000..e9ad129 Binary files /dev/null and b/Images/github.png.png differ diff --git a/Images/intro-image (2).png b/Images/intro-image (2).png deleted file mode 100644 index 830d281..0000000 Binary files a/Images/intro-image (2).png and /dev/null differ diff --git a/Images/linkedin-logo.png.png b/Images/linkedin-logo.png.png new file mode 100644 index 0000000..c8084ca Binary files /dev/null and b/Images/linkedin-logo.png.png differ diff --git a/index.html b/index.html index 4a89a40..77f8f87 100644 --- a/index.html +++ b/index.html @@ -97,25 +97,45 @@

About Me


+
+

Portfolio

+

My Project Collection


+

Below are a handful of projects that I have created or + been a part of over the course of my career and studies.
For more + projects you can visit my + github. +

+

Click on a project to open

+
-
-

Portfolio

-

My Project Collection


-

Below are a handful of projects that I have created or - been a part of over the course of my career and studies.
For more - projects you can visit my - github. -

+
+

Fluke Corporation Website

+

I currently take on responsibilities for editing and maintaning website content and functionality.

+

Drupal, HTML, CSS, JavaScript

+
+
+

Leap Forward Website

+

A website created for a non-profit. I was responsible for both Front and Back End features on this project.

+

HTML, CSS, JavaScript, jQuery, Bootstrap

+
+
+

Fluke eMobility Landing Page

+

A microsite I created from start to finish with the help of creative services and the UX team.

+

Eloqua, HTML, CSS, JavaScript, jQuery, Bootstrap

+
+
+

Mock Pricing Page

+

A pricing page I created for a mock AI company including three packages.

+

HTML, CSS, JavaScript

+
+
+ + +
diff --git a/style.css b/style.css index 17588ac..ba6d0c8 100644 --- a/style.css +++ b/style.css @@ -262,44 +262,49 @@ button:hover { } .portfolio-projects { - flex-direction: column !important; -} - -.grid-container { display: grid; - width: 70%; - height: auto; - gap: 10px; - grid-template-rows: 33.33% 33.33%; - grid-template-columns: 33.33% 33.33% 33.33%; - + grid-template-columns: 1fr 1fr 1fr; + grid-template-rows: auto; + gap: 50px; + max-width: 1000px; + margin: auto; } -.grid-container img { - width: 100% !important; - height: auto; +.portfolio-projects a { + text-decoration: none !important; } -#grid-item-1 { - grid-row-start: 1; - grid-column-start: 1; - grid-column-end: 2; +.portfolio-projects-child { + text-align: center; + display: flex; flex-direction: column; align-items: center; + border: 1px solid #588157; + border-radius: 10px; + padding: 20px; + transition: 0.5s; + color: #362417; + position: relative; + height: 300px; } -#grid-item-2 { - grid-column: 3; - grid-row-start: 1; - grid-row-end: 2; +.portfolio-projects-child:hover { + box-shadow: 5px 5px 5px 5px #ebe6eb; } -#grid-item-3 { - grid-column: 1; - grid-row: 2; +@media screen and (max-width: 815px) { + .portfolio-projects { + grid-template-columns: 1fr 1fr; + grid-template-rows: auto; + } } -#grid-item-4 { - grid-column: 2; - grid-row: 2; +@media screen and (max-width: 515px) { + .portfolio-projects { + grid-template-columns: 1fr; + grid-template-rows: auto; + } + .portfolio-projects-child { + height: 250px; + } } .about-me-main-div { @@ -347,4 +352,18 @@ button:hover { #right-star-about-me { top: 20px; } -} \ No newline at end of file +} + +.footer { + background-color: #362417; +} + +.footer-img-container { + margin: auto; + width: 50%; + display: flex; flex-direction: row; + justify-content: center; + padding-top: 20px; + padding-bottom: 20px; + gap: 10px; +} \ No newline at end of file