diff --git a/about.html b/about.html new file mode 100644 index 0000000..6e0b266 --- /dev/null +++ b/about.html @@ -0,0 +1,116 @@ + + + + + + About + + + + +
+ +
+ Home + About + Portfolio + Contact +
+
+
+

About

+
+

Who I am:

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad + minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+
+

Some things I like doing:

+
+

Cooking

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad + minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+ My go-to recipe is three-cup chicken. +
+
+
+

Video Games

+ I currently mostly play Final Fantasy XIV in my free time. +

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad + minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+
+
+
+

Reading

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad + minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+ One of my favorite recent reads is Crying in H Mart. +
+
+ + + diff --git a/assets/icons/fa-envelope.svg b/assets/icons/fa-envelope.svg new file mode 100644 index 0000000..ccafaa6 --- /dev/null +++ b/assets/icons/fa-envelope.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/icons/fa-github.svg b/assets/icons/fa-github.svg new file mode 100644 index 0000000..d1ad057 --- /dev/null +++ b/assets/icons/fa-github.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/icons/fa-linkedin.svg b/assets/icons/fa-linkedin.svg new file mode 100644 index 0000000..40c31a7 --- /dev/null +++ b/assets/icons/fa-linkedin.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/images/amazon-but-scuffed.png b/assets/images/amazon-but-scuffed.png new file mode 100644 index 0000000..ca90369 Binary files /dev/null and b/assets/images/amazon-but-scuffed.png differ diff --git a/assets/images/broodl.png b/assets/images/broodl.png new file mode 100644 index 0000000..b425dd4 Binary files /dev/null and b/assets/images/broodl.png differ diff --git a/assets/images/react-jobs.png b/assets/images/react-jobs.png new file mode 100644 index 0000000..59c09c6 Binary files /dev/null and b/assets/images/react-jobs.png differ diff --git a/contact.html b/contact.html new file mode 100644 index 0000000..89ad475 --- /dev/null +++ b/contact.html @@ -0,0 +1,60 @@ + + + + + + Contact + + + +
+ +
+ Home + About + Portfolio + Contact +
+
+
+

Contact

+

Say Hello!

+
+

Subject:

+ +

Body:

+ +
+ +
+ + + diff --git a/css/about.css b/css/about.css new file mode 100644 index 0000000..0b8459c --- /dev/null +++ b/css/about.css @@ -0,0 +1,39 @@ +.hobby-container { + display: grid; + grid-template-columns: 3fr 1fr; + + p { + grid-column: 1; + } + + img { + height: 10%; + grid-column: 2; + height: 25vh; + } +} + +.hobby-container-reverse { + display: grid; + grid-template-columns: 1fr 3fr; + + p { + grid-column: 2; + } + + img { + height: 10%; + grid-column: 1; + height: 25vh; + } +} + +@media (width < 600px) { + body { + margin: 0; + } + + main img { + display: none; + } +} diff --git a/css/contact.css b/css/contact.css new file mode 100644 index 0000000..e69de29 diff --git a/css/home.css b/css/home.css new file mode 100644 index 0000000..b62e38f --- /dev/null +++ b/css/home.css @@ -0,0 +1,28 @@ +main { + display: grid; + grid-template-rows: 2; + grid-template-columns: 2; +} + +h1 { + grid-row: 1; + grid-column: 1 / -1; +} + +p { + grid-row: 2; + grid-column: 1; +} + +img { + grid-row: 2; + grid-column: 2; +} + +.quote { + grid-row: 3; + grid-column: 1 / -1; +} + +@media (width < 600px) { +} diff --git a/css/portfolio.css b/css/portfolio.css new file mode 100644 index 0000000..2611cf8 --- /dev/null +++ b/css/portfolio.css @@ -0,0 +1,28 @@ +.portfolio-card { + display: grid; + grid-template-columns: 2; + grid-template-rows: 3; + width: 80vh; +} + +.card-banner { + grid-column: 1 / 3; + grid-row: 1; + width: 100%; +} + +.project-title { + grid-column: 1 / 3; + grid-row: 2; + text-decoration: none; +} + +.project-description { + grid-column: 1; + grid-row: 3; +} + +.project-stack { + grid-column: 2; + grid-row: 3; +} diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..740e093 --- /dev/null +++ b/css/style.css @@ -0,0 +1,85 @@ +* { + box-sizing: border-box; + margin: 0; + padding: 0; + font-size: 20px; +} + +body { + background-color: #c8d5b9; + margin-left: 100px; + margin-right: 100px; + display: flex; + flex-direction: column; +} + +header { + background-color: #8fc0a9; + height: 50px; + display: flex; + justify-content: space-between; + position: fixed; + left: 0; + right: 0; + top: 0; + + a { + color: black; + text-decoration: none; + } +} + +main { + background-color: #faf3dd; + flex-grow: 1; + padding-top: 100px; + padding-bottom: 100px; +} + +footer { + background-color: #8fc0a9; + height: 50px; + text-align: center; + display: flex; + justify-content: space-around; + position: fixed; + left: 0; + right: 0; + bottom: 0; +} + +div { + margin: 5px; + padding: 5px; +} + +hr { + margin-left: 5px; + margin-right: 5px; + margin-top: 10px; + margin-bottom: 10px; +} + +.header-nav { + display: flex; + justify-content: space-between; + gap: 10px; + + a { + text-decoration: none; + } +} + +.footer-icon { + height: 50px; +} + +@media (width < 600px) { + body { + margin: 0; + } + + main img { + display: none; + } +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..9cf4a70 --- /dev/null +++ b/index.html @@ -0,0 +1,75 @@ + + + + + + Document + + + + +
+ +
+ Home + About + Portfolio + Contact +
+
+
+

Homepage

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim + veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea + commodo consequat. Duis aute irure dolor in reprehenderit in voluptate + velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint + occaecat cupidatat non proident, sunt in culpa qui officia deserunt + mollit anim id est laborum. +

+ glorp-temp +
+

+ “Looking back on my work, I feel that I was doing nothing more than + mistakes, blunders and serious omissions. But I am proud of the + achievements. Although I did one mistake after another, my mistakes + and failures never occurred for the same reasons.” +

+

— Soichiro Honda

+
+
+ + + diff --git a/js/index.js b/js/index.js new file mode 100644 index 0000000..66a1661 --- /dev/null +++ b/js/index.js @@ -0,0 +1 @@ +console.log('Alex Takamizawa'); diff --git a/js/portfolio.js b/js/portfolio.js new file mode 100644 index 0000000..e69de29 diff --git a/portfolio.html b/portfolio.html new file mode 100644 index 0000000..049151f --- /dev/null +++ b/portfolio.html @@ -0,0 +1,159 @@ + + + + + + Portfolio + + + + +
+ +
+ Home + About + Portfolio + Contact +
+
+
+

Portfolio

+

Some things I've worked on:

+
+
+ amazon clone screenshot +

+ + We Have Amazon At Home + +

+
+

What I Used:

+
    +
  • HTML
    • +
  • CSS
    • +
  • JavaScript
    • +
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim + ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+
+
+
+ react jobs screenshot +

+ + React Jobs + +

+
+

What I Used:

+
    +
  • React
    • +
  • Tailwind
    • +
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim + ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+
+
+
+ broodl screenshot +

+ + Broodl + +

+

What I Used:

+
+
    +
  • React
    • +
  • Tailwind
    • +
  • Firebase
    • +
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim + ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut + aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in + culpa qui officia deserunt mollit anim id est laborum. +

+
+
+
+ + +