AdaGold · tiffanyt86 · Nov 18, 2022 · Nov 18, 2022 · Nov 18, 2022 · Nov 18, 2022
diff --git a/README.md b/README.md
diff --git a/about.html b/about.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Tiff Tran | SDE</title>
+    <link href="../styles/style.css" rel="stylesheet">
+</head>
+<body class="main-container">
+    <header class="top-container">
+        <div id="title">
+            TIFF TRAN
+        </div>
+        <div></div>
+        <div id="sub-title">
+            SDE / Pharmacist
+        </div>
+        <div></div>
+        <div></div>
+        <nav>
+            <ul>
+                <li><a href="index.html">Home</a></li>
+                <li><a href="index.html">About Me</a></li>
+                <li><a href="portfolio.html">Portfolio</a></li>
+            </ul>
+        </nav>
+    </header>
+    <div>      
+    </div>
+    <div class="text-1">
+        <p class="div-1">Hiya!</p>
+        <p>My name is Tiff (she/they) and I am a student software developer at Ada Developers Academy in Seattle, WA.  Previously, I worked in healthcare as a pharmacist specializing in geriatric and ambulatory medicine where I cared for over 90 patients at a time residing in Assisted Living Facilities or enrolled in PACE programs.
+        <p>I earned my Doctor of Pharmacy at the University of New England on the beautiful coast of Maine.  Prior to that, I received my Bachelor of Science in Environmental Science from the University of Washington in Seattle, WA.
+            While obtaining a formal education, my interest in technology never waivered.  In every step of my career, I developed small applications to increase the productivity of my work such as creating functions in Excel spreadsheets or by learning bits and pieces
+            of code to resolve or add features to pharmacy software.   
+        <p>As I retire my white coat for the dual monitors of a developer, I know that the analytical and problem-solving skills I have garnered as a pharmacist will be translatable to a successful career in tech.
+            I am passionate about working with gender expansive and BIPOC communities and changing the face of the industry to promote better inclusivity.  I am interested in working with companies who share this philosophy
+            and am positive that my background will provide provide me with the tools for a successful transition.
+        </p>
+        <p>When I'm not coding, you can find me outside playing endless games of catch with my partner and our dog Tobi.  I enjoy the simple things in life - like coffee.</p>
+        </div>
+    <footer class="bottom-container">
+        <div id="copyright-line">&copy; Tiff Tran | 2022</div>
+        <a href="#resume"><img src="../images/pdf-icon.png"></a>
+        <a href="https://www.linkedin.com/in/tiff-tran-73b404257/"><img src="../images/linkedin-icon.png"></a>
+        <a href="mailto:[email protected]"><img src="../images/email-icon.png"></a>
+
+    </footer>d
+</body>
+</html>
diff --git a/assets/personal-portfolio_wireframe1.png b/assets/personal-portfolio_wireframe1.png
diff --git a/assets/personal-portfolio_wireframe2.png b/assets/personal-portfolio_wireframe2.png
diff --git a/feedback.md b/feedback.md
diff --git a/images/email-icon.png b/images/email-icon.png
diff --git a/images/linkedin-icon.png b/images/linkedin-icon.png
diff --git a/images/pdf-icon.png b/images/pdf-icon.png
diff --git a/index.html b/index.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Tiff Tran | SDE</title>
+    <link href="personal-portfolio-site/styles/style.css" rel="stylesheet">
+</head>
+<body class="main-container">
+    <header class="top-container">
+        <div id="title">
+            TIFF TRAN
+        </div>
+        <div></div>
+        <div id="sub-title">
+            SDE / Pharmacist
+        </div>
+        <div></div>
+        <div></div>
+        <nav>
+            <ul>
+                <li><a href="index.html">Home</a></li>
+                <li><a href="about.html">About Me</a></li>
+                <li><a href="portfolio.html">Portfolio</a></li>
+            </ul>
+        </nav>
+    </header>
+    <div class="mid-container">
+        <h1>STAY CURIOUS</h1>
+    </div>
+    <footer class="bottom-container">
+        <div id="copyright-line">&copy; Tiff Tran | 2022</div>
+        <a href="#resume"><img src="https://github.com/tiffanyt86/personal-portfolio-site/blob/master/images/pdf-icon.png"></a>
+        <a href="https://www.linkedin.com/in/tiff-tran-73b404257/"><img src="https://github.com/tiffanyt86/personal-portfolio-site/blob/master/images/linkedin-icon.png"></a>
+        <a href="mailto:[email protected]"><img src="https://github.com/tiffanyt86/personal-portfolio-site/blob/master/images/email-icon.png"></a>
+
+    </footer>
+</body>
+</html>
diff --git a/pages/about.html b/pages/about.html
diff --git a/pages/index.html b/pages/index.html
diff --git a/pages/portfolio.html b/pages/portfolio.html
diff --git a/portfolio.html b/portfolio.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Tiff Tran | SDE</title>
+    <link href="../styles/style.css" rel="stylesheet">
+    <link href="../styles/portfolio.css" rel="stylesheet">
+</head>
+<body class="main-container">
+    <header class="top-container">
+        <div id="title">
+            TIFF TRAN
+        </div>
+        <div></div>
+        <div id="sub-title">
+            SDE / Pharmacist
+        </div>
+        <div></div>
+        <div></div>
+        <nav>
+            <ul>
+                <li><a href="index.html">Home</a></li>
+                <li><a href="index.html">About Me</a></li>
+                <li><a href="portfolio.html">Portfolio</a></li>
+            </ul>
+        </nav>
+    </header>
+    <div>      
+    </div>
+    <div class="middle-container">
+        <section class="portfolio-item-1">
+            <h3>CODING PROJECTS</h3>
+        </section>
+        <div class="portfolio-item-2">
+            <h3>Task List API</h3>
+            <p>Utilizing RESTful APIs, CRUD, and one-to-many relationships to deploy a Slackbot when tasks or goals are completed.</p>
+            <p><a href="https://github.com/tiffanyt86/task-list-api">GitHub</a></p>
+        </div>
+        <div class="portfolio-item-3">
+            <h3>Solar System API</h3>
+            <p>In pairs, deploy on Heroku a solar system database of planets and moons using SQLAlchemy, Flask, and Python.</p>
+            <p><a href="https://github.com/tiffanyt86/solar-system-api">GitHub</a></p>
+        </div>
+        <div class="portfolio-item-4">
+            <h3>Swap Meet</h3>
+            <p>Using Python to familiarize with OOP and co-working to implement a pseudo-marketplace where customers could swap items.</p>
+            <p><a href="https://github.com/tiffanyt86/swap-meet">GitHub</a></p>
+        </div>
+        <div class="portfolio-item-5">
+            <h3>Adagrams</h3>
+            <p>Built an anagram game in Python that allowed player to track the number of correct or incorrect guesses with visual representation of game progress.</p>
+            <p><a href="https://github.com/tiffanyt86/adagrams-py">GitHub</a></p>
+        </div>
+        <div class="portfolio-item-6">
+            <h3>Viewing Party</h3>
+            <p>Practice Python fundamentals such as nested data and loops to organize user and their friend's list of movies.</p>
+            <p><a href="https://github.com/tiffanyt86/viewing-party">GitHub</a></p>
+        </div>
+    </div>
+    <footer class="bottom-container">
+        <div id="copyright-line">&copy; Tiff Tran | 2022</div>
+        <a href="#resume"><img src="../images/pdf-icon.png"></a>
+        <a href="https://www.linkedin.com/in/tiff-tran-73b404257/"><img src="../images/linkedin-icon.png"></a>
+        <a href="mailto:[email protected]"><img src="../images/email-icon.png"></a>
+
+    </footer>
+</body>
+</html>
diff --git a/styles/portfolio.css b/styles/portfolio.css
@@ -0,0 +1,67 @@
+.middle-container {
+    background-color: white;
+    padding: 1rem;
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+    grid-auto-rows: auto;
+    gap: 1rem;
+    grid-template-areas: 
+        "item-1 item-1 item-1"
+        "item-2 item-3 item-4"
+        "item-5 . item-6";
+
+
+}
+section {
+    background-color: white;
+    font-size: 1.5rem;
+}
+.middle-container div {
+    background-color: white;
+    margin: 1rem;
+    width: 20rem;;
+    height: 15rem;
+    padding: 1rem;
+    -webkit-box-shadow: 5px 5px 15px 5px #000000; 
+    box-shadow: 5px 5px 15px 5px #000000;
+}
+
+.middle-container a {
+    background-color: white;
+    color: #256EFF;
+}
+
+.middle-container a:hover {
+    color: #95C623;
+}
+
+.portfolio-item-1 {
+    grid-area: item-1;
+    justify-self: left;
+}
+
+.portfolio-item-2 {
+    grid-area: item-2;
+
+}
+
+.portfolio-item-3 {
+    grid-area: item-3;
+}
+
+.portfolio-item-4 {
+    grid-area: item-4;
+}
+
+.portfolio-item-5 {
+    grid-area: item-5;
+}
+
+.portfolio-item-6 {
+    grid-area: item-6;
+}
+
+h3, p {
+    background-color: white;
+    color: black;
+}