Skip to content

Commit e6770a8

Browse files
woowaEchowoowaEcho
committed
Update resume
1 parent 74979b2 commit e6770a8

File tree

1 file changed

+112
-49
lines changed

1 file changed

+112
-49
lines changed

‎resume/index.html

Lines changed: 112 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -8,37 +8,50 @@
88
<meta property='og:title' content='Resume - ChoEun'>
99
<meta property='og:description' content='Resume'>
1010
<meta property='og:image' content='https://techhtml.github.io/resume/choeun.jpg'>
11-
<link href="https://fonts.googleapis.com/css?family=Roboto:400,900" rel="stylesheet">
11+
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
1212
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
1313
<style amp-custom>
1414
:root {
15-
--color-gray: #424242;
15+
--color-gray-300: #E0E0E0;
16+
--color-gray-700: #616161;
17+
--color-gray-800: #424242;
1618
--color-blue-500: #2196F3;
1719
--color-blue-800: #1565C0;
1820
--color-red-800: #D32F2F;
1921
}
2022
body {
2123
line-height:1.8em;
2224
font-family: "Roboto", sans-serif;
23-
color:var(--color-gray);
25+
color:var(--color-gray-800);
2426
}
25-
header h1, header h2 {
27+
.profile h1,
28+
.profile h2 {
2629
margin:0;
2730
color:#fff;
2831
}
29-
header h1 {
30-
font-size:2em;
32+
.thumb {
33+
position:relative;
34+
}
35+
.thumb::after {
36+
content:'';
37+
display:block;
38+
position:absolute;
39+
left:0;
40+
top:0;
41+
right:0;
42+
bottom:0;
43+
background:linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
44+
}
45+
.thumb h1 {
46+
position:absolute;
47+
left:0;
48+
bottom:0;
3149
padding:0.67em 0.6em;
32-
background:#6A1B9A;
50+
z-index:10;
3351
}
34-
header h2 {
35-
font-size:1.5em;
52+
.profile h2 {
3653
padding:0.83em;
37-
background:#8E24AA;
38-
}
39-
h2,h3,h4,h5,h6,dt {
40-
color:var(--color-blue-800);
41-
font-weight:900;
54+
background:#000000;
4255
}
4356

4457
a {
@@ -49,64 +62,114 @@
4962
color:var(--color-blue-800);
5063
}
5164

52-
/*
53-
* article padding
54-
*/
55-
.container, .wrapper {
56-
max-width: 960px;
57-
margin: auto;
65+
.contacts dl, .contacts dt, .contacts dd {
66+
margin:0;
67+
padding:0;
5868
}
59-
.contents {
60-
box-sizing:border-box;
61-
padding:1em;
62-
background:white;
69+
.contacts-inner {
70+
display:flex;
71+
align-items:center;
72+
padding:1em 1.5em;
73+
font-size:1em;
74+
line-height:1.5em;
75+
color:var(--color-gray-800);
76+
}
77+
.contacts-inner dd {
78+
color:var(--color-gray-700);
79+
}
80+
.contacts-inner:hover {
81+
color:inherit;
6382
}
64-
.contents dt {
65-
margin-top:1em;
83+
.contacts-row svg {
84+
margin-right:2em;
6685
}
67-
.contents dd {
68-
margin-left:1em;
86+
.contents {
87+
padding:1em;
6988
}
7089

7190
@media (min-width:720px) {
7291
body {
73-
font-size:14px;
92+
font-size:16px;
7493
}
7594
.container {
7695
display:flex;
7796
}
78-
header {
79-
margin-top:2em;
97+
.profile {
98+
margin-top:0;
8099
min-width:360px;
81100
}
101+
p:first-child {
102+
margin-top:0;
103+
}
82104
}
83105

84106
</style>
85107
<script async src="https://cdn.ampproject.org/v0.js"></script>
86108
</head>
87109
<body>
88110
<div class="container">
89-
<header>
90-
<amp-img src="choeun.jpg" alt="my profile picture" layout="responsive" width="720" height="720"></amp-img>
91-
<h1><div class="wrapper">Cho Eun</div></h1>
92-
<h2><div class="wrapper">UX Engineer</div></h2>
93-
</header>
111+
<div class="profile">
112+
<header>
113+
<div class="thumb">
114+
<amp-img src="choeun.jpg" alt="my profile picture" layout="responsive" width="720" height="720"></amp-img>
115+
<h1>Cho Eun</h1>
116+
</div>
117+
<h2>UX Engineer</h2>
118+
</header>
119+
<div class="contacts">
120+
<div class="contacts-row">
121+
<a href='tel:+821037619527' class="contacts-inner">
122+
<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
123+
<path d="M0 0h24v24H0z" fill="none"/>
124+
<path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/>
125+
</svg>
126+
<dl>
127+
<dt>010-3761-9527</dt>
128+
<dd>(Mobile)</dd>
129+
</dl>
130+
</a>
131+
</div>
132+
<div class="contacts-row">
133+
<a href='mailto:apes0123@gmail.com' class="contacts-inner">
134+
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24">
135+
<path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/>
136+
<path d="M0 0h24v24H0z" fill="none"/>
137+
</svg>
138+
<dl>
139+
<dt>apes0123@gmail.com</dt>
140+
<dd>(Personal)</dd>
141+
</dl>
142+
</a>
143+
</div>
144+
<div class="contacts-row">
145+
<div class="contacts-inner">
146+
<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
147+
<path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/>
148+
<path d="M0 0h24v24H0z" fill="none"/>
149+
</svg>
150+
<dl>
151+
<dt>South Korea</dt>
152+
<dd>(Seoul)</dd>
153+
</dl>
154+
</div>
155+
</div>
156+
<div class="contacts-row">
157+
<div class="contacts-inner">
158+
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24">
159+
<path d="M0 0h24v24H0z" fill="none"/>
160+
<path d="M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z"/>
161+
</svg>
162+
<dl>
163+
<dt>High School Graduation</dt>
164+
<dd>Pusan Information High School</dd>
165+
</dl>
166+
</div>
167+
</div>
168+
</div>
169+
</div>
94170
<main class="contents">
95171
<p>HI there, I'm Cho Eun lived in South Korea.
96172
I'd work for Woowahan Brothers that operate BaedalMinjok that for delivery foods. Basically I worked for UX and UI Engineering on the Web. Here is my <a href='https://github.com/techhtml/'>github</a>, <a href='https://www.facebook.com/eun.cho.161/'>facebook</a> and <a href='https://twitter.com/apes01234'>twitter</a>. If you want contant me, use anything that you want.</p>
97-
<h2>About me</h2>
98-
<dl>
99-
<dt>Name:</dt>
100-
<dd>Cho Eun (@techhtml)</dd>
101-
<dt>Contact:</dt>
102-
<dd><a href='tel:+821037619527'>010-3761-9527</a>, <a href='mailto:apes0123@gmail.com'>apes0123@gmail.com</a></dd>
103-
<dt>Birth of date:</dt>
104-
<dd>1993-12-28</dd>
105-
<dt>Education:</dt>
106-
<dd>High School graduation (Busan Information Highschool)</dd>
107-
<dt>Language:</dt>
108-
<dd>English, Japanese, Korean</dd>
109-
</dl>
110173
<h2>Projects</h2>
111174
<section>
112175
<h3>BaeminCook</h3>

0 commit comments

Comments
 (0)