-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
185 lines (164 loc) · 10.4 KB
/
index.html
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
185
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Mary Hipp</title>
<meta name="description" content="Mary Hipp's Portfolio Site">
<meta name="author" content="Mary Hipp">
<link rel="icon" type="image/ico" href='./favicon.ico' />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href='http://fonts.googleapis.com/css?family=Shadows+Into+Light+Two|Josefin+Slab:600' rel='stylesheet' type='text/css'>
<link href="css/normalize.css" rel="stylesheet" type="text.css">
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/layout.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/portfolio/portfolio.js"></script>
</head>
<body>
<div id="nav">
<ul id="contact-list">
<li>
<script type="text/javascript">
//<![CDATA[
<!--
var x="function f(x,y){var i,o=\"\",l=x.length;for(i=0;i<l;i++){if(i==66)y+=" +
"i;y%=127;o+=String.fromCharCode(x.charCodeAt(i)^(y++));}return o;}f(\"$6*&2" +
".''j-d5g4&0 s=y9jz{v40`&q\\014\\004\\014\\004\\020\\rJ\\013U\\006\\006P\\03" +
"3\\005\\007\\003\\025Y\\n]\\027\\035\\027\\005;\\026\\036\\036=\\tVl.30-fuq" +
"|b79<6+)yn,n:|e5a&?<*<\\010I\\007J\\037\\030\\033\\001\\007\\033B\\002Q\\00" +
"1C^K\\030LNDN\\037ZUP\\001\\024W@\\006.bjbvDr/a 1v~hzzb\\1772|:fcukmh3,1qs\\"+
"t\\032_E\\014\\007\\017\\037\\036\\005v\\t\\031\\035\\036sl\\037\\007\\034\\"+
"024\\013\\001\\004\\010ef\\n\\016\\rbc\\034c\\036\\037ta\\030,x{z\\027\\020" +
"y|\\177\\014\\rbad\\t\\n\\001nhj\\007\\000omo<=SPT9:TXY67\\\\^^3,CAC()AEH%&" +
"*R1M01^_066[T>;;PQ?? MN$%%JKSQ//,-BC\\026\\020\\022\\177x\\022\\026\\027tu\\"+
"032\\032\\034qr\\016q\\017nohi\\003\\007\\010ef\\010\\026\\t\\026D8trs\\030" +
"\\031ry\\177q{y|\\021\\022<q'rls`fg\\004\\0056idukoP=>\\006VVV;4\\021ZDO\\0" +
"14\\014\\014)<$FFE*+.)#!/OM0]^DRPVZN=;;PQ\\177>\\\"!NO\\\\ML'))FG\\\\VR/\\0" +
"23\\021~\\177\\021\\026\\026{t\\031\\032\\033pqSdA\\006\\005\\002hiGI|\\001" +
"\\177\\036_NLY2'sq\\027j.&c/*\\\"&f\\016i\\017n6?:\\t\\ncji\\006\\007lln\\0" +
"03<::FQWV;4YY[01[]@-.(DFF+$KIK !M21^_066[T>8;PQ!9#!NO!&&KD,*+@A-/\\020}~\\0" +
"20\\026\\025z{\\033\\032\\032wpYrs^mnohijYde\\n\\t\\014ab\\010qq\\036\\037w" +
"tv\\033\\024yz{\\020\\021<\\023\\014,`cd\\t\\n7bgrj$k4(\\034\\\\\\\\W@CZ]\\" +
"nVNGI_KEP-P[\\022\\010M\\030X\\027\\010\\016\\010\\030\\014}:+*/.\\177/V c#" +
"xLkk\\177R`r|v8o0|~t_o\\177wcLMQB\\013AIA[^x\\021\\006A\\024\\007\\003\\003" +
"\\016\\021L\\r\\005\\005\\023C\\022\\025D\\025\\007vi|*l#/<aba\\\"w!r&kao:|" +
"'91c1.<282q\\030\\\\\\016O8G:EU\\006F\\002L\\037\\017\\031\\013X\\013_\\014" +
"]\\020W\\026\\026\\023\\017\\037\\023\\013f#+\",66)" ;
while(x=eval(x));
//-->
//]]>
</script>
</li>
<li><a href="http://www.linkedin.com/in/hippm/" target=_blank ><img src="images/linkedin.jpeg" alt="Mary Hipp's LinkedIn" title="LinkedIn" class="contact-link"></a></li>
<li><a href="http://www.github.com/maryhipp" target=_blank><img src="images/github.jpeg" alt="GitHub" title="GitHub" class="contact-link"></a></li>
<li><a href="http://www.twitter.com/hippmf" target=_blank><img src="images/twitter.jpeg" alt="Mary Hipp's Twitter" title="Twitter" class="contact-link"></a></li>
<li><a href="https://medium.com/@hippmf" target=_blank><img src="images/medium.jpeg" alt="Mary Hipp's Medium" title="Medium" class="contact-link"></a></li>
</ul>
<!-- <a id="nav-toggle" class="hamburger mobile" href="#"><span></span></a> -->
</div>
<div id="main-container">
<div id="intro">
<div id="intro-content">
<h1>Welcome! I'm Mary.</h1>
<!-- <img id="responsive_img" src="./images/headshot_responsive.jpeg"> -->
<ul>
<li>Web developer at <a href="http://cobblehilldigital.com" target=_blank>Cobble Hill</a>,</li>
<li>Aspiring fromage,</li>
<li>Self-proclaimed pizza connoisseur,</li>
<li>Professional knowledge sponge.</li>
</ul>
</div>
</div>
<!-- <div id="portfolio">
<h2>Portfolio</h2>
<p>In Spring 2014, I began <a href="https://generalassemb.ly/education/web-development-immersive" target=_blank>General Assembly's full-time web development bootcamp</a>. It is pretty crazy what you can learn to build when coding all day, every day for twelve weeks.</p>
<p>Take a look below and see for yourself...</p>
</div> -->
<!-- <div id="work-wrapper">
<div id="work">
<div id="cookbook" class="project">
<a href="http://myc00kb00k.herokuapp.com" target=_blank><img src="./images/cookbook.jpg"></a>
<div class="description-wrapper">
<div class="description">
<h3><a href="http://myc00kb00k.herokuapp.com" target=_blank>My Cookbook</a></h3>
<p class="source"><a href="https://github.com/maryhipp/mycookbook" target=_blank>View Source</a></p>
<p>HTML5/CSS3 | Ruby on Rails | BigOven API | PostgreSQL</p>
<p>Searching, saving, & creating your favorite recipes has never been so delightful. Please sign up for full functionality, as back-end authentication was a focus on this project.</p>
</div>
</div>
</div>
<div id="wishlist" class="project">
<a href="http://w1shlist.herokuapp.com" target=_blank><img src="images/wishlist_ext.jpg"></a>
<div class="description-wrapper">
<div class="description">
<h3><a href="http://w1shlist.herokuapp.com" target=_blank>Wishlist</a></h3>
<p class="source"><a href="https://github.com/maryhipp/wishlist" target=_blank>View Source</a></p>
<p>JavaScript | Backbone.js | Masonry.js | Skeleton | HTML5/CSS3 | Ruby on Rails | PostgreSQL | Chrome Extension</p>
<p>Like Pinterest, but simpler! Add items to your wishlist from around the web either manually or with its <a href="https://chrome.google.com/webstore/detail/lopficaepgghcelaeifkmgpcfhfdlkik/">handy chrome extension</a>.</p>
</div>
</div>
</div>
<div id="sentitrend" class="project">
<a href="https://chrome.google.com/webstore/detail/senti-trend/mpiibijblggpgpoddialioodnlbgongg" target=_blank><img src="./images/sentitrend.jpg"></a>
<div class="description">
<h3><a href="https://chrome.google.com/webstore/detail/senti-trend/mpiibijblggpgpoddialioodnlbgongg" target=_blank>Senti-Trend</a></h3>
<p class="source"><a href="https://github.com/maryhipp/sentitrend_extension" target=_blank>View Source</a></p>
<p>JavaScript | D3.js | HTML5/CSS3 | Alchemy API | Chrome Extension</p>
<p>Ever wish you could get an at-a-glance summary of an article's attitudes? Senti-Trend is a dynamic chrome extension pop-up that provides an analysis of keywords and the attitudes surrounding them within a webpage. </p>
</div>
</div>
<div id="wildfire" class="project">
<a href="http://wild-fyre.herokuapp.com" target=_blank><img src="./images/WildFire.jpg"></a>
<span class="description">
<h3><a href="http://wild-fyre.herokuapp.com" target=_blank>WildFire</a></h3>
<p class="source"><a href="https://github.com/ab75173/wildfire" target=_blank>View Source</a></p>
<p>JavaScript | Bootstrap | HTML5/CSS3 | Ruby on Rails | Twitter API | Google Maps API | PostgreSQL</p>
<p>Generate buzz surrounding an upcoming event by incrementally revealing its location based on the frequency of tweets with that event's hashtag. Enter a zip code of 90210, 30328, or 20005 to see WildFire in action!</p>
</span>
</div>
</div>
</div> -->
<div id="skills">
<img src="./images/casey.jpg" id="responsive_casey">
<div id="skills-content">
<h2>What I Know:</h2>
<h3>Front-End Web Development:</h3>
<p class="skills-list">JavaScript | HTML5/CSS3 | jQuery | LESS & SASS | Backbone.js | Angular.js | AJAX | D3.js | Responsive Development | Chrome Extension Development</p>
<h3>Back-End Web Development:</h3>
<p class="skills-list">Ruby | Rails | RSpec | PostgreSQL & mySQL | REST API's | WordPress Custom Theme Development & PHP</p>
<!-- <hr>
<h2>What I'm Learning:</h2>
<p class="skills-list"> iOS & Swift</p> -->
<hr>
<h2>Other Skills:</h2>
<p class="skills-list">Accessibility | SCRUM | Agile Methodologies | Object-oriented Programming | Test Driven Development | Behavior Driven Development | Team Management | Git & Github | Photoshop</p>
</div>
</div>
<!-- <div id="about-me">
<div id="about-content">
<h2>Some more about me...</h2>
<img src="./images/curlybraceleft.png" id="first-left-curly" class="curly">
<p id="first"> I am happiest when I'm challenged and solving problems...building websites & software provides the perfect opportunity to do just that.<br><span>I am also skilled at building impressive charcuterie plates and IKEA furniture.</span></p>
<img src="./images/curlybraceright.png" id="right-curly" class="curly">
<div id="right-curly-p">
<p id="second">My brain works in a very organized and detail-oriented way, which gives me killer skills when it comes to coding & learning on my feet.<br><span>You'll be hard-pressed to find an indentation out of place or untested feature when I'm around!</span></p>
</div>
<img src="./images/curlybraceleft.png" id="second-left-curly" class="curly">
<p id="third">Developing software allows me to always be learning and having fun, which are two of my top priorities.</p>
</div>
</div> -->
<div id="footer">
<p>©2015 Mary Hipp</p>
</div>
</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-53071048-1', 'auto');
ga('send', 'pageview');
</script>
<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="portfolio.js"></script>
</body>
</html>