BDMayhem.github.io/index.html at master · BDMayhem/BDMayhem.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<!DOCTYPE html>
<html >
  <head>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-109308975-1"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag("js", new Date());

      gtag("config", "UA-109308975-1");
    </script>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Brian Diaz Web Development Portfolio</title>

    <link href="https://fonts.googleapis.com/css?family=Open+Sans|Source+Sans+Pro" rel="stylesheet">
    <link rel="icon" type="image/png" href="assets/favicon-16.png" sizes="16x16">
    <link rel="stylesheet" href="style.css">

    <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
    <script src="index.js" defer></script>
  </head>

<body>
  <nav>
    <ul>
      <li class="logo"><a class="item" href="#about">Brian Diaz <em>Web Developer</em></a></li>
      <li><a class="item" href="#portfolio">Portfolio</a></li>
      <li><a class="item" href="#contact">Contact</a></li>
    </ul>
  </nav>

  <main>
    <section id="about" class="anchor">
      <article class="about">
        <figure>
          <img src="assets/me.jpg" class="young" alt="My younger self">
          <figcaption>Here I am, hard at work</figcaption>
        </figure>
        <div class="text">
          <h2>Hi.  I'm Brian.</h2>
          <p>I make responsive, mobile first web apps and sites.</p>
          <p>Some of the many languages, frameworks, libraries, and tools I use are:</p>
          <ul class="jargon">
            <li>HTML</li>
            <li>CSS</li>
            <li>Javascript</li>
            <li>React</li>
            <li>jQuery</li>
            <li>AJAX</li>
            <li>CSS Grid</li>
            <li>Flexbox</li>
            <li>Bootstrap</li>
            <li>Semantic UI</li>
            <li>Materialize CSS</li>
            <li>Photoshop</li>
            <li>Node.js</li>
            <li>Express</li>
            <li>EJS</li>
            <li>MongoDB</li>
            <li>Mongoose</li>
            <li>Git</li>
            <li>NPM</li>
            <li>Webpack</li>
            <li>Hexo</li>
            <li>Paper.js</li>
          </ul>
        <p></p>
        <p>I've also been a <a href="http://www.briandiazphotography.com" target="_blank">professional photographer</a>.</p>
          </div>
      </article>
    </section>


    <section id="portfolio" class="anchor portfolio">
      <h2>
        Portfolio
      </h2>
      <p>This is some of the stuff I've made.</p>

      <div class="port-items">
        <!-- port stuff from js -->
      </div>

    </section>


    <section id="contact" class="anchor">
      <h2>
        Contact Me
      </h2>
      <p>Drop me a line.</p>

      <form action="https://formspree.io/brianjdiaz@gmail.com"
      method="POST" class="email-form">
        <input type="hidden" name="_format" value="plain" />
        <label for="_replyto">Email
          <br>
          <input type="email" name="_replyto">
        </label>
        <label for="body">Body
          <br>
          <textarea name="body" id="" cols="30" rows="10"></textarea>
        </label>
        <input type="submit" value="Send">
      </form>

      <div class="contact-links">
        <a href="https://www.facebook.com/brian.diaz.52643" target="_blank" alt="Facebook"><i class="fab fa-facebook-square square"></i></a>
        <a href="https://www.linkedin.com/in/brian-diaz-6414b539" target="_blank" alt="LinkedIn"><i class="fab fa-linkedin square"></i></a>
        <a href="https://github.com/BDMayhem" target="_blank" alt="GitHub"><i class="fab fa-github-square square"></i></a>
        <a href="https://twitter.com/bdmayhem" target="_blank" alt="Twitter"><i class="fab fa-twitter-square square"></i></a>
        <a href="https://bdmayhem.github.io/blog" target="_blank" alt="Blog"><i class="fas fa-file-alt blog"></i></a>
      </div>
    </section>

  </main>
</body>
</html>