diff --git a/README.md b/README.md index 933cd500b..41dc2eb1e 100644 --- a/README.md +++ b/README.md @@ -65,9 +65,9 @@ Present the elements on the page as you see fit by using the following at least Both of these containers do not need to be on the same page. Try using one for one page, and the other for another page!
-If you need some inspiration, here are two common layouts you can replicate +If you need some inspiration, here are two common layouts you can replicate -![Personal Portfolio Wfireframe Example 1](./assets/personal-portfolio_wireframe1.png) +![Personal Portfolio Wfireframe Example 1](./assets/personal-portfolio_wireframe1.png) ![Personal Portfolio Wfireframe Example 2](./assets/personal-portfolio_wireframe2.png)
diff --git a/about-me-style-sheet.css b/about-me-style-sheet.css new file mode 100644 index 000000000..041b814f1 --- /dev/null +++ b/about-me-style-sheet.css @@ -0,0 +1,107 @@ +* {margin:0;padding:0;} + +.container{ + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr 10fr 1fr; +} + +header{ + background-color: darkgray; + grid-column: 1/3; + grid-row: 1/2; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; +} + +h4{ + color: #FCFBFE; + margin-left: 50px; + font-size: 25px; +} + +ul{ + justify-content: end; + margin-right: 50px; +} +ul li{ + list-style: none; + display: inline; + margin-left: 10px; + font-size: 15px; +} + +a{ + color: lightgray; + text-decoration: none; +} +a:link{ + text-decoration: none; + color: lightgray; +} +a:visited{ + text-decoration: none; + color: lightgray; +} +a:hover{ + text-decoration: none; + color: #FCFBFE; +} +#currentpage{ + color: #FCFBFE; +} + +section{ + padding-left: 15px; + background-color: #FCFBFE; + grid-row: 2/3; + grid-column: 1/2; + display: grid; + align-content: center; +} + +.hi{ + font-size: 50px; + margin-left: 50px; + margin-bottom: 20px; +} + +.paragraph{ + font-size: large; + margin-left: 50px; + max-width: 500px; + height: auto; +} + +.image{ + background-color: #FCFBFE; + grid-row: 2/3; + grid-column: 2/3; + display: grid; + flex-direction: row; + justify-content: space-around; + align-items: center; +} + +.pineapple{ + max-height: 700px; + width: auto; +} + +footer{ + background-color: darkgray; + grid-column: 1/3; + grid-row: 3/4; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} +footer .media{ + display: inline-block; + width: 50px; + height: auto; + margin: 10px; +} \ No newline at end of file diff --git a/about.html b/about.html new file mode 100644 index 000000000..812a76441 --- /dev/null +++ b/about.html @@ -0,0 +1,59 @@ + + + + + + + About Me + + + + +
+

+ Bio +

+ + +
+
+

Hi!
I'm Kindra,

+

+ a down to earth girl born and raised in Buffalo, NY (GO BILLS!) who wanted to change the world with travel. + So I packed my bags and went to school for International Hotel & Tourism Management. + Turns out student loans are expensive; and post graduation instead of changing the world by promoting small town economies via tourism, I started my 7 year career with Marriott. +

Now don't get me wrong, I loved my time managing front office and housekeeping teams at some of the largest hotels in NYC, + but when the pandemic furloughs hit I realized it was my chance to pivot to a career better aligned with my creative and analytical skill sets, + SOFTWARE ENGINEERING! +

I have a passion for continuous learning, process improvement, and coupling analytics with creativity to solve problems. + After completing my first course with SheCodes I found software engineering and web development fused my passions beautifully and became addicted! +

The learning didn't stop there, I'm now a proud C18 Adie with Ada Developers Academy. + Check out some of my projects, linked in my portfolio, to see what i've learned along the way. Seeking full time opportunites upon graduation in July 2023. +

+
+ +
+ Pineapple Drawing +
+ + + + diff --git a/index-style-sheet.css b/index-style-sheet.css new file mode 100644 index 000000000..38f69419e --- /dev/null +++ b/index-style-sheet.css @@ -0,0 +1,105 @@ +* {margin:0;padding:0;} + +.container{ + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr 10fr 1fr; +} + +header{ + background-color: darkgray; + grid-column: 1/3; + grid-row: 1/2; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; +} + +h4{ + color: #FCFBFE; + margin-left: 50px; + font-size: 25px; +} + +ul{ + justify-content: end; + margin-right: 50px; +} +ul li{ + list-style: none; + display: inline; + margin-left: 10px; + font-size: 15px; +} + +a{ + color: lightgray; + text-decoration: none; +} +a:link{ + text-decoration: none; + color: lightgray; +} +a:visited{ + text-decoration: none; + color: lightgray; +} +a:hover{ + text-decoration: none; + color: #FCFBFE; +} +#currentpage{ + color: #FCFBFE; +} + +.text{ + padding-left: 15px; + background-color: #FCFBFE; + grid-row: 2/3; + grid-column: 1/2; + display: grid; + align-content: center; + +} +.fullstack{ + font-size: 100px; + margin-left: 50px; +} + +.city{ + font-size: 30px; + color: lightgray; + margin-left: 50px; +} + +.image{ + background-color: #FCFBFE; + grid-row: 2/3; + grid-column: 2/3; + display: grid; + flex-direction: row; + justify-content: space-around; + align-items: center; +} + +.pineapple{ + max-height: 700px; + width: auto; +} + +footer{ + background-color: darkgray; + grid-column: 1/3; + grid-row: 3/4; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} +footer .media{ + display: inline-block; + width: 50px; + height: auto; + margin: 10px; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 000000000..702382324 --- /dev/null +++ b/index.html @@ -0,0 +1,51 @@ + + + + + + + Kindra K. Greenawalt + + + +
+

+ Kindra K. Greenawalt +

+ +
+
+ +
+

+ Full Stack
+ Developer +

+
+ Arlington, Virginia +
+
+ +
+ Pineapple Drawing +
+ + + diff --git a/pages/portfolio.html b/pages/portfolio.html deleted file mode 100644 index b4ae215c4..000000000 --- a/pages/portfolio.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - Document - - - - - \ No newline at end of file diff --git a/portfolio-style-sheet.css b/portfolio-style-sheet.css new file mode 100644 index 000000000..47bd9381c --- /dev/null +++ b/portfolio-style-sheet.css @@ -0,0 +1,153 @@ +* {margin:0;padding:0;} + +.container{ + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr 25fr 1fr; +} + +header{ + background-color: darkgray; + grid-column: 1/3; + grid-row: 1/2; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; +} + +h4{ + color: #FCFBFE; + margin-left: 50px; + font-size: 25px; +} + +nav ul{ + justify-content: end; + margin-right: 50px; +} +nav ul li{ + list-style: none; + display: inline; + margin-left: 10px; + font-size: 15px; +} + +a{ + color: lightgray; + text-decoration: none; +} +a:link{ + text-decoration: none; + color: lightgray; +} +a:visited{ + text-decoration: none; + color: lightgray; +} +a:hover{ + text-decoration: none; + color: #FCFBFE; +} +#currentpage{ + color: #FCFBFE; +} + +.projects{ + padding-left: 15px; + background-color: #FCFBFE; + grid-row: 2/3; + grid-column: 1/3; + display: grid; + align-content: center; + list-style: none; +} + +.projects li{ + font-size: large; + margin-left: 215px; + padding: 10px; + +} + +h6{ + font-size: 30px; +} + +p{ + font-size: large; + max-width: 500px; + height: auto; +} + +.image{ + background-color: #FCFBFE; + display: grid; + flex-direction: row; + justify-content: space-around; + align-items: center; + max-height: 200px; + width: auto; +} + +.project-container{ + /* display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1fr; */ + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; +} + +.project-container img{ + grid-column: 2/3; + border-radius: 10px; + padding: 5px; +} + +.project-description{ + /* grid-column: 1/2; */ + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + margin-right: 235px; + padding: 20px; +} + +.project-description h6{ + font-size: 25px; +} + +.project-description p{ + padding-top: 10px; + padding-bottom: 10px; + text-align: center; +} + +.project-description button{ + border-radius: 5px; + border-color: lightgray; + padding: 5px; + background-color: darkgray; + color: #FCFBFE; + +} + + +footer{ + background-color: darkgray; + grid-column: 1/3; + grid-row: 3/4; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} +footer .media{ + display: inline-block; + width: 50px; + height: auto; + margin: 10px; +} \ No newline at end of file diff --git a/portfolio.html b/portfolio.html new file mode 100644 index 000000000..627be6bed --- /dev/null +++ b/portfolio.html @@ -0,0 +1,193 @@ + + + + + + + Portfolio + + + +
+

Projects

+
+
+ + + + + + + + \ No newline at end of file