gatorpazz.github.io/index.html at master · gatorpazz/gatorpazz.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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
<!doctype html>
<html lang="">

<head>
  <meta charset="utf-8">
  <meta name="description" content="">
  <meta name="viewport" content =" initial-scale = 1, maximum-scale = 1, user-scalable = no" />
  <title>Michael Pascuzzi Portfolio Site</title>
  <!-- build:css styles/vendor.css -->
  <!-- bower:css -->
  <!-- endbower -->
  <!-- endbuild -->

  <!-- build:css styles/main.css -->
  <link rel="stylesheet"
        href="http://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900,300italic,400italic,500italic,700italic,900italic">
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.css">
  <link rel="stylesheet" href="styles/main.css">
  <!-- endbuild -->

</head>

<body ng-app="Portfolio" layout="column">
  <!-- Single column -->
  <div layout="column" layout-fill>
    <md-toolbar>
      <div class="md-toolbar-tools">
        Gatorpazz
        <span flex></span>
        <md-button href="#aboutMe">
          About
        </md-button>
        <md-button href="#projects">
          Projects
        </md-button>
        <md-button href="#contact">
          Contact
        </md-button>
      </div>
    </md-toolbar>
    <md-content flex>
      <div class="aboutMe" id="aboutMe">
        <h1 class="md-display-3 center">Michael Pascuzzi</h1>
        <h2 class="md-display-1 center">A Little About Me</h2>
        <div layout-gt-xs="row" layout-xs="column">
          <section flex>
            <h2 class="md-display-1 center">Who am I?</h2>
            <p class="md-padding">I am a graduate of The Iron Yard Orlando's Front End Engineering twelve week coding boot camp. I currently serve as the Front End Developer for Florida Cruise Ports. I am also a Florida National Guard soldier dedicated to not only making crazy awesome websites, but serving our country as well.</p>
          </section>
          <div flex>
            <h2 class="md-display-1 center">What do I do?</h2>
            <p class="md-padding">I strive to bring solid functionality to websites and making sure that above all the user has a good experience. I focus on making sure that things look clean and concise rather than flashy and over the top. I'd much rather make a blood hound than a poodle.</p>
          </div>
          <div flex>
            <h2 class="md-display-1 center">Why do I love it?</h2>
            <p class="md-padding">Simply put, I love to help people. Helping others drives me to go the extra mile and bring meaning to my life. Also computers are awesome and I want to learn everything I can about them.</p>
          </div>
        </div>
      </div>
      <h3 class="md-display-2 center" id="projects">Projects</h3>
      <md-tabs md-border-bottom md-align-tabs="bottom" md-dynamic-height md-center-tabs>
        <md-tab label="Picture">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Florida Cruise Ports</h2>
            <a href="https://goportcanaveral.com"><img src="/images/gpc.jpg" alt="Florida Cruise Ports Homepage"/ height="200" width="400"></a>
          </md-content>
        </md-tab>
        <md-tab label="Description">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Description</h2>
            <p class="md-body-1 description tabContent">
              Florida Cruise Ports is an travel company that sells hotel and transportation packages for travellers cruising out of Port Canaveral. I serve as the Front End developer for the site, implementing page designs given to me by the UX designer. Major projects worked on include the header, footer, and new homepage of the website. Live link is found <a class="sitelink" href="http://goportcanaveral.com">here</a>.
            </p>
          </md-content>
        </md-tab>
        <md-tab label="Techs Used">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Techs Used</h2>
            <ul class="description tabContent">
              <li>AngularJS</li>
              <li>jQuery</li>
              <li>jQueryUI</li>
              <li>PHP</li>
              <li>Sass</li>
            </ul>
          </md-content>
        </md-tab>
      </md-tabs>
      <md-tabs md-border-bottom md-align-tabs="bottom" md-dynamic-height md-center-tabs>
        <md-tab label="Picture">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Life of A Story</h2>
            <a href="https://life-of-a-story.firebaseapp.com/"><img src="/images/Life_of_a_Story.jpg" alt="Life of a Story Homepage"/ height="200" width="400"></a>
          </md-content>
        </md-tab>
        <md-tab label="Description">
          <md-content class="md-padding center">
            <h2 class="md-display-1 center">Description</h2>
            <p class="md-body-1 description tabContent">
              Life of a Story is a website designed as a sort of book diary, a place to record what books your reading and reflect upon them via notes for each book you read. LoaS will also help you pick your next book with a handy search feature and automatically add that book to your account. Live version can be found <a class="sitelink" href="https://life-of-a-story.firebaseapp.com/">here</a> and the source code can be found <a class="sitelink" href="https://github.com/gatorpazz/Life-of-a-Story">here</a>.
            </p>
          </md-content>
        </md-tab>
        <md-tab label="Techs Used">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Techs Used</h2>
            <ul class="description tabContent">
              <li>AngularJS</li>
              <li>Firebase</li>
              <li>OAuth</li>
              <li>Google Books API</li>
              <li>Sass</li>
            </ul>
          </md-content>
        </md-tab>
      </md-tabs>
      <md-tabs md-border-bottom md-align-tabs="bottom" md-dynamic-height md-center-tabs>
        <md-tab label="Picture">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Performer Stuff</h2>
            <a href="https://performerstuff.com"></a>
          </md-content>
        </md-tab>
        <md-tab label="Description">
          <md-content class="md-padding center">
            <h2 class="md-display-1 center">Description</h2>
            <p class="md-body-1 description tabContent">
              Performer Stuff is an ecommerce site that sells sheet music, monologues, and audition cuts of performance music. Live version can be found <a class="sitelink" href="https://performerstuff.com">here</a>.
            </p>
          </md-content>
        </md-tab>
        <md-tab label="Techs Used">
          <md-content class="md-padding center">
            <h2 class="md-display-1">Techs Used</h2>
            <ul class="description tabContent">
              <li>AngularJS</li>
              <li>Laravel</li>
              <li>Sass</li>
            </ul>
          </md-content>
        </md-tab>
      </md-tabs>
      <div class="center" id="contact">
        <h2 class="md-display-1 center">Contact Me</h2>
        <md-button aria-label="LinkedIn" class="md-icon-button" href="https://www.linkedin.com/in/michael-pascuzzi-b0090592">
          <md-icon md-svg-icon="linkedin-box"></md-icon>
        </md-button>
        <md-button aria-label="Twitter" class="md-icon-button" href="https://twitter.com/gatorpazz">
          <md-icon md-svg-icon="twitter-circle"></md-icon>
        </md-button>
        <md-button aria-label="Github" class="md-icon-button" href="https://github.com/gatorpazz">
          <md-icon md-svg-icon="github-circle"></md-icon>
        </md-button>
        <md-button aria-label="email" class="md-icon-button" href="mailto:gatorpazz@gmail.com">
          <md-icon md-svg-icon="email"></md-icon>
        </md-button>
      </div>
    </md-content>
    <md-toolbar>
      <div class="md-toolbar-tools">
        Copyright © Michael Pascuzzi 2016. All Rights Reserved
      </div>
    </md-toolbar>
  </div>
  <!-- build:js scripts/vendor.js -->
  <!-- bower:js -->
  <!-- endbower -->
  <!-- endbuild -->

  <!-- build:js scripts/main.js -->
  <!-- endbuild -->
  <!-- Angular Material requires Angular.js Libraries -->
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-aria.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-messages.min.js"></script>

  <!-- Angular Material Library -->
  <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"></script>
  <script src="scripts/main.js"></script>

</body>

</html>