Add files via upload

MattMarquise · Jan 14, 2021 · c1d18dd · c1d18dd
1 parent 95e5aa3
commit c1d18dd
Show file tree

Hide file tree

Showing 6 changed files with 97 additions and 40 deletions.
diff --git a/about.html b/about.html
@@ -26,6 +26,12 @@
         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
 
     </head>
+    <style>
+        body{ 
+            background-color: black;
+            color: white;
+        }
+    </style>
         <header class="header">
 
             <a href="index.html" style="text-decoration: none; color: black" class="logo"><img src="/img/mattsmac.png" width="50" height="54" class="d-inline-block align-top" alt="hi">Matthew Marquise</a>
@@ -55,15 +61,16 @@ <h2 align="center">About Me:</h2>
 
             <!--BOX 1-->
             <div id="box">
-                <img width="400" height="100" src="/img/me.png" class="center" alt="Me! lol">
+                <img width="400" height="100" src="/img/me-black.png" class="center" alt="Me! lol">
                 <h1>Hello! I'm Matthew Marquise!</h1>
                 <h5>&nbsp;&nbsp;&nbsp;You can call me Matt! I'm a Front-End Developer who has a strong passion for designing high quality website and software UIs.</h5>
                 <div style="list-style-type:none;">
                     <li>💻 <b>Favorite OS:</b> MacOS X</li>
                     <li>🎮 <b>Current Favoirte Video Game:</b> Castle Crashers</li>
-                    <li>🍕 <b>Favoirte Food:</b> Pizza, Pasta, Lasagna, and Meatballs!</li>
+                    <li>🍕 <b>Favoirte Foods:</b> Pizza, Pasta, Lasagna, and Meatballs</li>
                     <li>🎧 <b>Favoirte Genre of Music:</b> Alternative</li>
                     <li>👟 <b>My Current Pair Of Sneakers:</b> ON Cloud Terry</li>
+                    <li>🎨 <b>Favoirte Color:</b> Light Blue, near #7dc4db</li>
                     <li>🏥 <b>Where Was I Born:</b> Tampa, FL</li>
                     <li>🏠 <b>Where Do I Currently Live:</b> Raleigh, NC</li>
                     <li>🚗 <b>Dream Car:</b> Tesla Model 3</li>
@@ -85,6 +92,7 @@ <h5 class="card-title"><i class="fa fa-github"></i> <a href="https://github.com/
                                 <h5 class="card-title"><i class="fa fa-linkedin-square"></i> <a href="https://www.linkedin.com/in/matthew-m-4a688019a/" style="text-decoration: none;">@Matthew M.</a></h5>
                                 <p class="card-text">Connect with me on LinkedIn to view my previous work experience and certifications!</p>
                             </div>
+                            <br>
                         </div>
                         <div class="card border-0" style="background-color: transparent;">
                             <div id="boxlift">
@@ -124,7 +132,8 @@ <h3> What I'm Learning/Expanding On:</h3>
                     </div>
                 </div>
             </div>
-
+        </div>
+        <br>
     </body>
 
     <!--FOOTER-->

diff --git a/blog.html b/blog.html
@@ -26,6 +26,12 @@
         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
 
     </head>
+    <style>
+        body{ 
+            background-color: black;
+            color: white;
+        }
+    </style>
         <header class="header">
 
             <a href="index.html" style="text-decoration: none; color: black" class="logo"><img src="/img/mattsmac.png" width="50" height="54" class="d-inline-block align-top" alt="hi">Matthew Marquise</a>
@@ -58,6 +64,17 @@ <h1>Recent Blog Posts:</h1>
             <div class="row">
                 <div class="col-sm-6">
                     <!--BOX 3-->
+                    <div id="box">
+                        <img width="500" height="200" src="/img/behindmac.png" class="center" alt="Me! lol">
+                        <h3>Steps To Creating Modern & Minimalist UI/UXs</h3>
+                        <p>I'm no minimalist myself, not sure if I ever could be, but modern and minimalist UI/UXs are my favorites. No one wants...</p>
+                        <a href="https://dev.to/mattmarquise/steps-to-creating-modern-minimalist-ui-uxs-46kp" class="btn btn-secondary btn-sm ">Continue Reading &#x2192;</a>
+                    </div>
+                    <br>
+                </div>
+
+                <div class="col-sm-6">
+                    <!--BOX 4-->
                     <div id="box">
                         <img width="500" height="200" src="/img/behindmac.png" class="center" alt="Me! lol">
                         <h3>My Experiences With Various Languages and Frameworks</h3>
@@ -66,9 +83,11 @@ <h3>My Experiences With Various Languages and Frameworks</h3>
                     </div>
                     <br>
                 </div>
+            </div>
 
+            <div class="row">
                 <div class="col-sm-6">
-                    <!--BOX 4-->
+                    <!--BOX 3-->
                     <div id="box">
                         <img width="500" height="200" src="/img/behindmac.png" class="center" alt="Me! lol">
                         <h3>My Journey To Becoming A Developer</h3>
@@ -77,6 +96,12 @@ <h3>My Journey To Becoming A Developer</h3>
                     </div>
                     <br>
                 </div>
+
+                <div class="col-sm-6">
+                    <!--BOX 4-->
+
+                    <br>
+                </div>
             </div>
         </div>
     </body>

diff --git a/contact.html b/contact.html
@@ -26,6 +26,12 @@
         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
 
     </head>
+    <style>
+        body{ 
+            background-color: black;
+            color: white;
+        }
+    </style>
         <header class="header">
 
             <a href="index.html" style="text-decoration: none; color: black" class="logo"><img src="/img/mattsmac.png" width="50" height="54" class="d-inline-block align-top" alt="hi">Matthew Marquise</a>
@@ -71,6 +77,7 @@ <h5 class="card-title"><i class="fa fa-github"></i> <a href="https://github.com/
                                 <h5 class="card-title"><i class="fa fa-linkedin-square"></i> <a href="https://www.linkedin.com/in/matthew-m-4a688019a/" style="text-decoration: none;">@Matthew M.</a></h5>
                                 <p class="card-text">Connect with me on LinkedIn to view my previous work experience and certifications!</p>
                             </div>
+                            <br>
                         </div>
                         <div class="card border-0" style="background-color: transparent;">
                             <div id="boxlift">
@@ -85,8 +92,10 @@ <h5 class="card-title"><img width="30" height="30" src="https://d2fltix0v2e0sb.c
                     <li>📬 Send Me A Note: <a href="mailto:[email protected]" style="text-decoration: none;">[email protected]</a></li>
                 </div>
             </div>
+        </div>
+    </body>
 
-
+    <br><br><br><br><br><br><br>
 
     <!--FOOTER-->
     <footer class="bg-light text-center text-lg-start">

diff --git a/index.html b/index.html
@@ -26,6 +26,12 @@
         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
 
     </head>
+    <style>
+        body{ 
+            background-color: black;
+            color: white;
+        }
+    </style>
         <header class="header">
             <a href="index.html" style="text-decoration: none; color: black; font-size: 90" class="logo"><img src="/img/mattsmac.png" width="50" height="54" class="d-inline-block align-top" alt="hi">Matthew Marquise</a>
             <input class="menu-btn" type="checkbox" id="menu-btn" />
@@ -53,16 +59,17 @@ <h2 align="center">Welcome! 👋🏻</h2>
 
             <!--BOX 1-->
             <div id="box">
-                <img width="400" height="100" src="/img/me.png" class="center" alt="Me! lol">
-                <h1>Hello!</h1>
-                <h1> I'm Matthew Marquise!</h1>
-                <h5>&nbsp;&nbsp;&nbsp;You can call me Matt! I'm a Front-End Developer who has a strong passion for designing high quality website and software UIs.</h5>
+                <img width="400" height="100" src="/img/me-black.png" class="center" alt="Me! lol">
+                <h1>Hello! I'm Matthew Marquise!</h1>
+                <h5 align="center">You can call me Matt! I'm a Front-End Developer who has a strong passion for designing high quality website and software UIs.</h5>
+                <br>
                 <div style="list-style-type:none;">
                     <li>💻 <b>Favorite OS:</b> MacOS X</li>
                     <li>🎮 <b>Current Favoirte Video Game:</b> Castle Crashers</li>
-                    <li>🍕 <b>Favoirte Food:</b> Pizza, Pasta, Lasagna, and Meatballs!</li>
+                    <li>🍕 <b>Favoirte Foods:</b> Pizza, Pasta, Lasagna, and Meatballs</li>
                     <li>🎧 <b>Favoirte Genre of Music:</b> Alternative</li>
                     <li>👟 <b>My Current Pair Of Sneakers:</b> ON Cloud Terry</li>
+                    <li>🎨 <b>Favoirte Color:</b> Light Blue, near #7dc4db</li>
                     <li>🏥 <b>Where Was I Born:</b> Tampa, FL</li>
                     <li>🏠 <b>Where Do I Currently Live:</b> Raleigh, NC</li>
                     <li>🚗 <b>Dream Car:</b> Tesla Model 3</li>
@@ -106,10 +113,11 @@ <h5 class="card-title"><img width="30" height="30" src="https://d2fltix0v2e0sb.c
             <div id="box">
                 <div class="card-body">
                     <div class="justify-content-center" align="center" style="list-style-type:none;">
-                        <h3> My Favorite Languages:</h3>
-                            <li>- HTML</li>
-                            <li>- CSS</li>
-                            <li>- JS</li>
+                        <h3> My Top Skills:</h3>
+                            <li><i class="fa fa-html5"></i> HTML</li>
+                            <li><i class="fa fa-css3"></i> CSS</li>
+                            <li><i class="fa fa-bootstrap"></i> BootStrap</li>
+                            <li><i class="fab fa-js"></i></i> JS</li>
 
                         <br>
 
@@ -135,9 +143,9 @@ <h1>Recent Blog Posts:</h1>
                     <!--BOX 3-->
                     <div id="box">
                         <img width="500" height="200" src="/img/behindmac.png" class="center" alt="Me! lol">
-                        <h3>My Experiences With Various Languages and Frameworks</h3>
-                        <p>I've tried learning many coding languages and even though I understood the concepts and always tinkered with each one...</p>
-                        <a href="https://dev.to/mattmarquise/my-experiences-with-various-languages-and-frameworks-m59" class="btn btn-secondary btn-sm ">Continue Reading &#x2192;</a>
+                        <h3>Steps To Creating Modern & Minimalist UI/UXs</h3>
+                        <p>I'm no minimalist myself, not sure if I ever could be, but modern and minimalist UI/UXs are my favorites. No one wants...</p>
+                        <a href="https://dev.to/mattmarquise/steps-to-creating-modern-minimalist-ui-uxs-46kp" class="btn btn-secondary btn-sm ">Continue Reading &#x2192;</a>
                     </div>
                     <br>
                 </div>
@@ -146,9 +154,9 @@ <h3>My Experiences With Various Languages and Frameworks</h3>
                     <!--BOX 4-->
                     <div id="box">
                         <img width="500" height="200" src="/img/behindmac.png" class="center" alt="Me! lol">
-                        <h3>My Journey To Becoming A Developer</h3>
-                        <p>Once upon a time I was introduced to HTML, CSS, and JS. Fast forward years later and I've taken numerous classes, and have expanded my knowledge...</p>
-                        <a href="https://dev.to/mattmarquise/my-journey-to-becoming-a-developer-2m96" class="btn btn-secondary btn-sm ">Continue Reading &#x2192;</a>
+                        <h3>My Experiences With Various Languages and Frameworks</h3>
+                        <p>I've tried learning many coding languages and even though I understood the concepts and always tinkered with each one...</p>
+                        <a href="https://dev.to/mattmarquise/my-experiences-with-various-languages-and-frameworks-m59" class="btn btn-secondary btn-sm ">Continue Reading &#x2192;</a>
                     </div>
                     <br>
                 </div>

diff --git a/main.css b/main.css
@@ -1,6 +1,4 @@
     body {
-        background-color: white;
-        color: black;
         font-size: 25px;
         font-family: 'Roboto', sans-serif;
     }
@@ -83,8 +81,8 @@
 
     /* NIGHT MODE */
     .dark-mode{
-        background-color: black;
-        color: white;
+        background-color: white;
+        color: black;
     }
 
 

diff --git a/portfolio.html b/portfolio.html
@@ -26,22 +26,30 @@
         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
 
     </head>
-        <header class="header">
-
-            <a href="index.html" style="text-decoration: none; color: black" class="logo"><img src="/img/mattsmac.png" width="50" height="54" class="d-inline-block align-top" alt="hi">Matthew Marquise</a>
-            <input class="menu-btn" type="checkbox" id="menu-btn" />
-            <label class="menu-icon" for="menu-btn"><span class="navicon"></span></label>
-
-            <ul class="menu">
-                    <span align="center">
-                    <li class="nav-item"><a href="about.html" class="nav-link" id="nav">About</a></li>
-                    <li class="nav-item"><a href="portfolio.html" class="nav-link" id="nav">Portfolio</a></li>
-                    <li class="nav-item"><a href="blog.html" class="nav-link" id="nav">Blog</a></li>
-                    <li class="nav-item"><a href="contact.html" class="nav-link" id="nav">Contact</a></li>
-                    <li class="nav-item"><a role="button" onclick="darkmode()">🌜 | 🌞</a></li>
-                    </span>
-            </ul>
-        </header>
+
+    <style>
+        body{ 
+            background-color: black;
+            color: white;
+        }
+    </style>
+
+    <header class="header">
+
+        <a href="index.html" style="text-decoration: none; color: black" class="logo"><img src="/img/mattsmac.png" width="50" height="54" class="d-inline-block align-top" alt="hi">Matthew Marquise</a>
+        <input class="menu-btn" type="checkbox" id="menu-btn" />
+        <label class="menu-icon" for="menu-btn"><span class="navicon"></span></label>
+
+        <ul class="menu">
+                <span align="center">
+                <li class="nav-item"><a href="about.html" class="nav-link" id="nav">About</a></li>
+                <li class="nav-item"><a href="portfolio.html" class="nav-link" id="nav">Portfolio</a></li>
+                <li class="nav-item"><a href="blog.html" class="nav-link" id="nav">Blog</a></li>
+                <li class="nav-item"><a href="contact.html" class="nav-link" id="nav">Contact</a></li>
+                <li class="nav-item"><a role="button" onclick="darkmode()">🌜 | 🌞</a></li>
+                </span>
+        </ul>
+    </header>
 
     <body onload="onload()">
         <br><br><br>