-
Notifications
You must be signed in to change notification settings - Fork 7
/
index.html
127 lines (124 loc) · 9.89 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
<!DOCTYPE html>
<html amp>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1">
<title>techHTML</title>
<link rel="canonical" href="index.html">
<meta property='og:title' content='techhtml'>
<meta property='og:description' content='techhtml Blog'>
<meta property='og:image' content='https://techhtml.github.io/resume/choeun.jpg'>
<link href="https://fonts.googleapis.com/css?family=Barlow:400,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/earlyaccess/notosanskr.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700" rel="stylesheet">
<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>
<style amp-custom>
:root {
--color-light-gray: #F5F5F5;
--color-gray: #424242;
--color-blue-500: #2196F3;
--color-blue-800: #1565C0;
}
body {
font-size:1.2em;
line-height:1.8;
font-family: "Roboto", sans-serif;
word-break:keep-all;
}
li a {
display:block;
padding:0.675rem 1rem 0.75rem;
}
header {
background:#5F4B8B;
color:#ffffff;
}
header a {
display:inline-block;
color:inherit;
text-decoration: none;
margin-right:1em;
}
header a:hover {
color:inherit;
box-shadow:0 3px 0 #ffffff;
}
.wrapper {
max-width:960px;
margin:auto;
padding:3em 1.25em;
}
/*
* links
*/
a {
color:var(--color-blue-500);
}
a:hover {
color:var(--color-blue-800);
}
/*
* article padding
*/
.contents {
max-width:960px;
box-sizing:border-box;
padding:0 1.25em;
margin: auto;
}
.logo {
width:100px;
transition:.5s transform cubic-bezier(.68,-0.55,.27,1.55);
transform:rotate(0);
}
.logo:hover {
transform:rotate(15deg);
}
</style>
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>
<header>
<div class="wrapper">
<svg xmlns="http://www.w3.org/2000/svg" class="logo" viewBox="0 0 90.71 113.94"><defs><style>.a{fill:#3c2375;}</style></defs><title>choeun</title><path class="a" d="M30.46,53.35l6.12,1.4c2.83.64,4-3.7,1.2-4.35l-7.4-1.69a8.48,8.48,0,0,0-3.31-.35,11.21,11.21,0,0,0-6.49,3.94c-1.88,2.2,1.3,5.4,3.19,3.19a9,9,0,0,1,2.49-2.12,4.35,4.35,0,0,1,1.51-.58c-.05,0-.3-.07-.08-.07A13.17,13.17,0,0,1,30.46,53.35Z"/><path class="a" d="M53.15,50.21a46,46,0,0,1,5.13-3.35c1.08-.59,2.76-1.55,4-1.36a6.3,6.3,0,0,1,2.22,1.18c2.41,1.64,4.67-2.27,2.28-3.9-3.08-2.09-5.86-2-9.23-.58a35,35,0,0,0-6.7,4.11C48.56,48,50.81,51.94,53.15,50.21Z"/><path class="a" d="M63,94.67a2.56,2.56,0,0,0-3.79.34,3.55,3.55,0,0,0-3,1.18,3,3,0,0,0-3.75.92,4.34,4.34,0,0,0-7.11,1.3c-2.6-1-4.93,3-5.13,5.24s2.13,4.43,4.21,2.51c-.24,3-.84,6.31,2.68,7.55a4.43,4.43,0,0,0,5.79-4.09l.1-1.23c.46,1.78.92,4.44,2.87,5.14a2.77,2.77,0,0,0,3.62-2.93c6,2.51,4.74-5.66,4.07-8.48,1.5,1.38,4.63,2.41,5.2-.63C69.19,98.93,64.56,96.15,63,94.67Z"/><path class="a" d="M39.11,97.84c-1.51-2.34-3.9-.77-5.75.11a4.72,4.72,0,0,0-2.54,1.83,2.62,2.62,0,0,0,.06,2.53c1.47,2.36,3.94.75,5.75-.11a4.92,4.92,0,0,0,2.48-1.73A2.62,2.62,0,0,0,39.11,97.84Z"/><path class="a" d="M29.81,97.75c1.43-.7,2.41-1.85,1.95-3.55a2.82,2.82,0,0,0-3.6-1.85l-.77-.83a2.93,2.93,0,0,0,.32-3.9c-1-1.25-2.56-1.17-3.88-.57A44.12,44.12,0,0,1,18,75.41c-.42-1.3-.86-2.58-2.47-2.55A2.23,2.23,0,0,0,13.28,75a3.63,3.63,0,0,1-4.66-.55A4.07,4.07,0,0,1,8.89,69a3.21,3.21,0,0,1,2.45-1c1,.09,1.2,1,2,1.39a2.42,2.42,0,0,0,3.35-1.77c.16-1.88-2.32-3.43-3.87-3.85a7.29,7.29,0,0,0-6,1.14A8.68,8.68,0,0,0,4.25,76a8.32,8.32,0,0,0,10.4,3.35,49,49,0,0,0,5,9.62,2.88,2.88,0,0,0-1.87,1.78A3,3,0,0,0,18,93.1c1.19,2.09,3.44,1.2,5.13.43l.74.85c-1,.5-1.86,1-2.1,2.21a2.84,2.84,0,0,0,1.06,2.87,3,3,0,0,0,3,.22A24.09,24.09,0,0,0,29.81,97.75Z"/><path class="a" d="M65.28,69.5c6.72-2.7,8.42-11,7.29-17.48-.24-1.37-1.64-2.56-2.77-2.34L61.3,51.33c-2.57.5-5.25.84-7.76,1.59a7.13,7.13,0,0,0-5.32,5.83,2.17,2.17,0,0,0-.75,0l-3.08.65a4.63,4.63,0,0,0-4.12-2.63,47.51,47.51,0,0,0-9.46.89c-2.76.46-5.88.84-8.19,2.53-2.94,2.15-2,5-.6,7.91,1.83,3.76,5.06,6.88,9.33,7.29a2.1,2.1,0,0,0,.37,0H32a15.49,15.49,0,0,0,7-1.69,2.06,2.06,0,0,0,.19.47A8,8,0,0,0,41.74,77a81.59,81.59,0,0,0-11.66,7.26,2.72,2.72,0,0,0-.94,3.6,2.65,2.65,0,0,0,3.6.94,81.61,81.61,0,0,1,13.12-8,2.17,2.17,0,0,0,1.34-2.1,10.81,10.81,0,0,0,2.24-.17,9.72,9.72,0,0,0,2.33-.73A2.35,2.35,0,0,0,53.38,79a132.75,132.75,0,0,1,14.71,4.5c3.18,1.18,4.55-3.91,1.4-5.08a132.75,132.75,0,0,0-13.58-4.21,12.85,12.85,0,0,0,1.52-3.12,1.72,1.72,0,0,0,0-1A12.71,12.71,0,0,0,65.28,69.5ZM53.57,56.89c1.65-.81,3.76-1,5.53-1.31L69,53.64c.58,4.32-.47,10.16-4.68,12.18a8.71,8.71,0,0,1-12.09-5,2.12,2.12,0,0,0-.12-.3A2.09,2.09,0,0,0,52,60C51.46,58.79,52.59,57.37,53.57,56.89ZM31.72,71.71c-3.13-.19-5.32-3-6.54-5.63a9.39,9.39,0,0,1-.77-2.49c.83-.83,3.45-1.49,4.67-1.75a59.15,59.15,0,0,1,8.1-1.14c1.07-.08,2.95-.55,3.7.27a4.61,4.61,0,0,1,.75,3.1C41.37,69.15,36.25,71.75,31.72,71.71ZM53,70c-.65,2-1.89,4-4.32,4.55a4.93,4.93,0,0,1-5.57-2.36,1.92,1.92,0,0,0-.89-.85,11.17,11.17,0,0,0,2.17-3.22,11.72,11.72,0,0,0,.88-5.07l3.19-.68a1.52,1.52,0,0,0,.33-.11,12.21,12.21,0,0,0,5.46,6.48A2,2,0,0,0,53,70Z"/><path class="a" d="M6.69,38.57a2.8,2.8,0,0,0-1,3.87c-3.21,2.73,1.94,5.65,3.77,7A2.88,2.88,0,0,0,6.68,53c.44,1.68,2.64,2.71,3.95,3.64,0,1.35-.19,2.94,1.17,3.72a2.38,2.38,0,0,0,3.14-.82c3.17.77,4.59-3.43,2.11-5.21l-.3-.21c4.57-.49,1.88-4.8-.2-6.36a2.72,2.72,0,0,0,.7-.78,2.75,2.75,0,0,0-.17-3A3,3,0,0,0,19.36,40a7.73,7.73,0,0,0,2.18-2.58c3,2.4,7.26,2,10.43.08a7.78,7.78,0,0,0,.15,1.16,8.73,8.73,0,0,0,6.28,6.46c1,.26,3,.69,3.87,0s1.22-2.48-.29-2.7A5.22,5.22,0,0,1,40.54,42a1.64,1.64,0,0,0-.32-.27c-2.49-1.62-.43-4.94,1.09-6.28a8.5,8.5,0,0,0,7.07,4.52c2.74.16,5-1.73,1.82-3.35l-.08-.12a3.75,3.75,0,0,1-.59-3.34c.14-.22.29-.43.44-.64.59-.28,1.28-.6,1.48-1.29a10.54,10.54,0,0,0,8.18,1.5c0,1.92,1.94,3.8,4,2.59a3,3,0,0,0,.81,1.91,2.64,2.64,0,0,0,1.74.8c-1.18,2.52,2.28,5.52,4.56,3.17l.49-.48c1,1.81,2.42,6.61,5.26,5,3-1.71-.76-6.23-1.82-8.09,1.6-1.27,4.42-2.82,3-5.32A3,3,0,0,0,75.85,31a2.92,2.92,0,0,0-1.23-4.28,3.22,3.22,0,0,0-.6-1.9c4.41-3.8,3-10.89-2-13.38C76.2,3.56,65.28-4.47,59.48,2.93,54.22,1.11,47.71.79,44,5.76c-3.52-2-8.54-.89-11.19,2.09C24.53-3.64,6.65,4.1,9.37,18,.19,18-4.25,33,5.47,35.79A2.54,2.54,0,0,0,6.69,38.57Z"/><path class="a" d="M79.47,84.23l-2.78-1a7.18,7.18,0,0,0-2.57-.78A2.87,2.87,0,0,0,71.42,85a2.79,2.79,0,0,0-.9,4.55c-1.46-1-3.67,0-4.26,1.52-.89,2.39,1.32,3.74,3,5s3,2.41,4.91,1.14a3.05,3.05,0,0,0,0-5c1.25.91,2.37,2,4,1.27a2.76,2.76,0,0,0,1.46-3.81A2.86,2.86,0,0,0,79.47,84.23Z"/><path class="a" d="M90.36,55a7.71,7.71,0,0,0-6.94-5.69,7.21,7.21,0,0,0-7.15,5.42c-.65,2.83,3.7,4,4.35,1.2.78-3.37,5-2.18,5.51.76.66,3.93-3.93,5.53-6.73,3.59-1.48-1-2.9.07-3.22,1.45-.22.33-.26,9.68-.95,13.84-.47,2.84,3.88,4.06,4.35,1.2a63.86,63.86,0,0,0,.88-11.22C86.19,66.5,92.24,61.35,90.36,55Z"/></svg>
<h1>ChoEun</h1>
<a href="mailto:[email protected]">[email protected]</a>
<a href="tel:01037619527">+82 10 3761 9527</a>
<a href="https://twitter.com/apes01234">Twitter</a>
<a href="https://github.com/techhtml">github</a>
</div>
</header>
<main class="contents">
<h2>Blog</h2>
<ul>
<li><a href="/blog/2015/12/">번역회고록 - 왜 남의나라 말은 어려운가</a></li>
<li><a href="/blog/2016/05/">프론트엔드에 테스트를 도입</a></li>
<li><a href="/blog/2016/05/developer">나는 왜 갑자기 입개발자가 되었는가?</a></li>
<li><a href="/blog/2016/06/">Module CSS</a></li>
<li><a href="/blog/2016/09/">할 수 있는 일</a></li>
<li><a href="/blog/2016/09/education">누구나 쉽게하는 웹 프론트엔드</a></li>
</ul>
<h2>Translations</h2>
<ul class="lst-strong">
<li><a href="/css3-color">CSS 컬러 모듈 Level 3</a></li>
<li><a href="/2015/09/">웹 페이먼츠 워킹 그룹 프레스 릴리즈</a></li>
<li><a href="/css-style-attr">CSS 스타일 속성</a></li>
<li><a href="/css3-mediaqueries">미디어 쿼리</a></li>
<li><a href="/selectors">셀렉터 레벨 3</a></li>
<li><a href="/css3-namespace">CSS 네임스페이스 모듈 레벨 3</a></li>
<li><a href="/view-mode">'view-mode' 미디어 특성</a></li>
<li><a href="/page-visibility">페이지 가시성 (세컨드 에디션)</a></li>
<li><a href="/notifications">웹 알림 (Web Notifications)</a></li>
<li><a href="/performance-timeline">성능 타임라인 (Performance Timeline)</a></li>
<li><a href="/user-timing">유저 타이밍 (User Timing)</a></li>
<li><a href="/pointerevents">포인터 이벤트 (Pointer Events)</a></li>
<li><a href="/role-attribute">Role 속성 1.0 (Role Attribute 1.0)</a></li>
<li><a href="/vibration">진동 API (Vibration API)</a></li>
<li><a href="/rfc/RFC2119.html">RFC 2119 - RFC 내에서 요구하는 레벨을 탐지하기 위한 키워드들</a></li>
<li><a href="/ECMA-404/">JSON 데이터 교환 포맷</a></li>
<li><a href="/battery-status/">배터리 상태 API</a></li>
<li><a href="/payment-request/">결제 요청 API</a></li>
</ul>
</main>
</body>
</html>