Skip to content

Commit 7e756c6

Browse files
committed
routine checkin
1 parent dc5354e commit 7e756c6

4 files changed

Lines changed: 116 additions & 49 deletions

File tree

css/about.css

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,16 @@
33
============================================================ */
44

55

6-
.about {
7-
padding: 1em;
8-
display: inline-block;
9-
margin: auto;
10-
}
6+
.about {}
117

128

139
.me {
14-
margin: auto;
15-
display: block;
16-
border-radius: 50%;
17-
max-width: 50%;
10+
background-color: aliceblue;
11+
color:
1812
}
1913

2014
.about-text {
21-
padding: 1em;
2215
text-align: left;
23-
max-width: 50%;
24-
margin: auto;
16+
background-color: aliceblue;
17+
color: midnightblue;
2518
}

css/main.css

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,18 @@ time, mark, audio, video {
2727
/*font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;*/
2828
}
2929

30+
html {
31+
overflow: hidden;
32+
position: relative;
33+
}
34+
body {
35+
position: absolute;
36+
top: 0;
37+
bottom: 0;
38+
left: 0;
39+
right: -17px; /* Increase/Decrease this value for cross-browser compatibility */
40+
overflow-y: scroll;
41+
}
3042

3143

3244
html, body {
@@ -38,10 +50,12 @@ html, body {
3850
background-color: #1A1110;
3951
text-align: center;
4052
display: inline-block;
53+
4154
}
4255

4356
section {
4457
height: 100vh;
58+
padding-top: 3em;
4559
}
4660
.hero {
4761
background-position: 50% 50%;
@@ -89,10 +103,46 @@ section {
89103
transform: rotate(180deg);
90104
}
91105

106+
@media (max-width: 500px) {
107+
.logo {
108+
-webkit-animation:spin 6s linear infinite;
109+
-moz-animation:spin 6s linear infinite;
110+
animation:spin 6s linear infinite;
111+
}
112+
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
113+
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
114+
}
115+
92116
#wrapper {
93117
position: relative;
94118
top:25vh;
95119
}
96120

121+
.testing {
122+
overflow:hidden;
123+
background-color: aquamarine;
124+
}
97125

126+
.testing div {
127+
height: 100%;
128+
}
129+
.one {
130+
background-color: cornflowerBlue;
131+
float:left;
132+
width:62vw;
133+
height: 100%;
134+
}
135+
.two {
136+
background-color: aliceblue;
137+
color: midnightblue;
138+
height: 100%;
139+
text-align: left;
140+
}
98141

142+
@media screen and (max-width: 400px) {
143+
.one {
144+
float: none;
145+
margin-right:0;
146+
width:auto;
147+
}
148+
}

css/portfolio.css

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11

22

3-
.menu {}
4-
.menu-label {
3+
.portfolio-nav {}
4+
.portfolio-nav-label {
55
font-size: medium;
66
}
77

@@ -40,15 +40,15 @@
4040
.spacer-hor {
4141
height:40vh;
4242
}
43-
43+
4444
}
4545

4646
@media (min-width: 1024px) and (max-width: 1180px){
4747
.spacer-hor {
4848
width: 100vw;
4949
height: 10vh;
5050
}
51-
51+
5252
}
5353

5454
@media (min-width: 1180px) {
@@ -57,5 +57,3 @@
5757
height: 3vh;
5858
}
5959
}
60-
61-

index.html

Lines changed: 57 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
77
<meta charset="utf-8">
88
<title>Meredith Hoo</title>
9-
<meta name="description"
9+
<meta name="description"
1010
content="An experienced software developer interested in Cognitive Science, human interation & AI, looking for internships wherever the wind takes her.">
1111
<meta name="author" content="Meredith Hoo">
1212

@@ -18,7 +18,7 @@
1818
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
1919
<!--link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css"-->
2020
<link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet">
21-
21+
2222
<!-- CSS
2323
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
2424
<link rel="stylesheet" href="css/pure-release-0.6.0/pure-min.css">
@@ -31,12 +31,13 @@
3131
<link rel="stylesheet" href="css/main.css">
3232
<link rel="stylesheet" href="css/menu.css">
3333
<link rel="stylesheet" href="css/about.css">
34-
34+
<link rel="stylesheet" href="css/portfolio.css">
35+
3536
<!-- Scripts
3637
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
3738
<script src="js/jquery-3.1.0.min.js"></script>
3839
<script src="js/main.js"></script>
39-
40+
4041
<!-- Favicon
4142
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
4243
<!--link rel="icon" type="image/png" href="assets/icon1.png"-->
@@ -47,13 +48,13 @@
4748
<ul class="snip1168">
4849
<li class="current"><a href="#" data-hover="Home">Home</a></li>
4950
<li><a href="#about-page" data-hover="About Us">About</a></li>
50-
<li><a href="/assets/Resume.pdf" data-hover="Resume">Resume</a></li>
51-
<li><a href="#" data-hover="Blog">Blog</a></li>
51+
<li><a href="assets/Resume.pdf" data-hover="Resume">Resume</a></li>
52+
<li><a href="#blog" data-hover="Blog">Blog</a></li>
5253
<li><a href="#projects" data-hover="Projects">Projects</a></li>
5354
<li><a href="#" data-hover="Contact">Contact</a></li>
5455
</ul>
5556
</nav>
56-
57+
5758
<!-- Landing page ––––––––––––––––––––––––––––––– -->
5859
<section class="hero">
5960
<div id="wrapper">
@@ -62,54 +63,79 @@ <h1 class="title"> meredith hoo </h1>
6263
<button id="enter_button" class="button">enter</button>
6364
<div>
6465
</section>
65-
66-
<!-- About ––––––––––––––––––––––––––––––––– -->
67-
<section id="about-page"class="about">
68-
<h1 id="about_title" class="title"> Meredith Hoo </h1>
69-
<img class="me" src="assets/me.jpg"/>
70-
<p class="about-text">
71-
I'm a software engineer based in New York, looking to solve complex problems wherever the code takes me.
72-
Over the last six years, I've become involved in the creative applications of machine learning,
73-
the software development of educational and socailly responsible expereinces. From my work in the classroom
74-
and in industry.
75-
</p>
76-
<p class="about-text">
77-
Please know that this site is experiemental, and in progress
78-
</p>
79-
66+
67+
<!-- About ––––––––––––––––––––––––––––––––– >
68+
<section id="blog"class="about">
69+
<div class="pure-g">
70+
<div class="pure-u-1-2">
71+
<img class="" src="assets/me4.jpg"/>
72+
</div>
73+
<div class="pure-u-1-2">
74+
<div class="about-text">
75+
<h1 id="about_title" class="title"> Meredith Hoo </h1>
76+
<p class="">
77+
I'm a software engineer based in New York, looking to solve complex problems wherever the code takes me.
78+
Over the last six years, I've become involved in the creative applications of machine learning,
79+
the software development of educational and socailly responsible expereinces. From my work in the classroom
80+
and in industry.
81+
</p>
82+
<p class="">
83+
Please know that this site is experiemental, and in progress
84+
</p>
85+
</div>
86+
</div>
87+
</div>
88+
</section-->
89+
90+
<section id="about-page"class="testing">
91+
<div class="testing">
92+
<div class="one"></div>
93+
<div class="two">
94+
<h1 id="about_title" class="title"> Meredith Hoo </h1>
95+
<p class="">
96+
I'm a software engineer based in New York, looking to solve complex problems wherever the code takes me.
97+
Over the last six years, I've become involved in the creative applications of machine learning,
98+
the software development of educational and socailly responsible expereinces. From my work in the classroom
99+
and in industry.
100+
</p>
101+
<p class="">
102+
Please know that this site is experiemental, and in progress
103+
</div>
104+
</div>
80105
</section>
81-
106+
107+
82108
<!-- Projects ––––––––––––––––––––––––––––––––– -->
83-
<section id="projects"class="menu">
109+
<section id="projects"class="portfolio-nav">
84110
<nav class="pure-g">
85111
<div class="pure-u-1-2 pure-u-lg-1-3">
86112
<img class="pure-img-responsive" src="assets/print1.jpg"/>
87-
<p class="menu-label">apps</p>
113+
<p class="portfolio-nav-label">apps</p>
88114
</div>
89115
<div class="pure-u-1-2 pure-u-lg-1-3">
90116
<img class="pure-img-responsive" src="assets/print2.png"/>
91-
<p class="menu-label">edutech</p>
117+
<p class="portfolio-nav-label">edutech</p>
92118
</div>
93119
<div class="pure-u-1-2 pure-u-lg-1-3">
94120
<img class="pure-img-responsive" src="assets/print3.png"/>
95-
<p class="menu-label">writing</p>
121+
<p class="portfolio-nav-label">writing</p>
96122
</div>
97123
<div class="pure-u-1-2 pure-u-lg-1-3">
98124
<img class="pure-img-responsive" src="assets/print4.jpg"/>
99-
<p class="menu-label">art</p>
125+
<p class="portfolio-nav-label">art</p>
100126
</div>
101127
<div class="pure-u-1-2 pure-u-lg-1-3">
102128
<img class="pure-img-responsive" src="assets/print7.jpg"/>
103-
<p class="menu-label">podcast</p>
129+
<p class="portfolio-nav-label">podcast</p>
104130
</div>
105131
<div class="pure-u-1-2 pure-u-lg-1-3">
106132
<img class="pure-img-responsive" src="assets/print8.png"/>
107-
<p class="menu-label">blog</p>
133+
<p class="portfolio-nav-label">blog</p>
108134
</div>
109135
</div>
110136
</section>
111137

112-
138+
113139
<!-- End Document ––––––––––––––––––––––––––––––– -->
114140
</body>
115141
</html>

0 commit comments

Comments
 (0)