-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
157 lines (137 loc) · 11 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
<!DOCTYPE html>
<html id="html" lang='ja'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="css/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@600;700;800&family=Roboto+Mono:wght@300&display=swap" rel="stylesheet">
<title>resume</title>
<meta property="og:locale" content="ja_JP">
<meta property="og:title" content="resume">
<meta property="og:site_name" content="ysgraph">
<meta property="og:description" content="resume | ysgraph">
<meta property="og:type" content="website">
<meta property="og:url" content="https://ysgraph.github.io/">
<meta property="og:image" content="https://raw.githubusercontent.com/ysgraph/ysgraph.github.io/master/img/ogp.png">
<meta property="og:locale" content="ja_JP">
<meta name="twitter:card" content="summary_large_image">
<script src="js/script.js" defer></script>
</head>
<body>
<header>
<div class="header-wrapper">
<p class="page-title">ysgraph.github.io</p>
<button id="btn" class="social-link">
<svg class="theme-switch-dark" height="28" viewBox="0 0 28 28" width="28" xmlns="http://www.w3.org/2000/svg">
<path d="m14 24c-2.7778 0-5.13889-.9722-7.08333-2.9167-1.94445-1.9444-2.91667-4.3055-2.91667-7.0833s.97222-5.13889 2.91667-7.08333c1.94444-1.94445 4.30553-2.91667 7.08333-2.91667.1481 0 .3056.00463.4722.01389.1667.00926.3797.02315.6389.04167-.6667.59259-1.1852 1.32407-1.5555 2.19444-.3704.87037-.5556 1.78704-.5556 2.75 0 1.6667.5833 3.0833 1.75 4.25s2.5833 1.75 4.25 1.75c.963 0 1.8796-.1713 2.75-.5139s1.6019-.8194 2.1944-1.4305c.0186.2222.0325.4027.0417.5416.0093.1389.0139.2732.0139.4028 0 2.7778-.9722 5.1389-2.9167 7.0833-1.9444 1.9445-4.3055 2.9167-7.0833 2.9167zm0-1.6667c2.0185 0 3.7778-.625 5.2778-1.875s2.4352-2.7176 2.8055-4.4027c-.4629.2037-.9598.3564-1.4907.4583-.5309.1018-1.0617.1528-1.5926.1528-2.1239 0-3.9326-.7468-5.4262-2.2405-1.4937-1.4936-2.2405-3.3023-2.2405-5.4262 0-.44444.0463-.9213.1389-1.43056.0926-.50925.2593-1.08796.5-1.73611-1.8148.5-3.31942 1.51389-4.51387 3.04167-1.19444 1.5278-1.79166 3.2361-1.79166 5.125 0 2.3148.81018 4.2824 2.43055 5.9028 1.62037 1.6203 3.58798 2.4305 5.90278 2.4305z"/>
</svg>
<svg class="theme-switch-light" height="28" viewBox="0 0 28 28" width="28" xmlns="http://www.w3.org/2000/svg">
<path d="m13.9941 17.5c.9706 0 1.7976-.3397 2.4809-1.0191s1.025-1.5044 1.025-2.475-.3397-1.7976-1.0191-2.4809-1.5044-1.025-2.475-1.025-1.7976.3397-2.4809 1.0191-1.025 1.5044-1.025 2.475.3397 1.7976 1.0191 2.4809 1.5044 1.025 2.475 1.025zm.0059 1.5c-1.3833 0-2.5625-.4875-3.5375-1.4625s-1.4625-2.1542-1.4625-3.5375.4875-2.5625 1.4625-3.5375 2.1542-1.4625 3.5375-1.4625 2.5625.4875 3.5375 1.4625 1.4625 2.1542 1.4625 3.5375-.4875 2.5625-1.4625 3.5375-2.1542 1.4625-3.5375 1.4625zm-10.25-4.25c-.2125 0-.39062-.0723-.53437-.2169s-.21563-.3237-.21563-.5375c0-.2137.07188-.3914.21563-.5331s.32187-.2125.53437-.2125h2.5c.2125 0 .39063.0723.53438.2169s.21562.3237.21562.5375c0 .2137-.07187.3914-.21562.5331s-.32188.2125-.53438.2125zm18 0c-.2125 0-.3906-.0723-.5344-.2169-.1437-.1446-.2156-.3237-.2156-.5375 0-.2137.0719-.3914.2156-.5331.1438-.1417.3219-.2125.5344-.2125h2.5c.2125 0 .3906.0723.5344.2169.1437.1446.2156.3237.2156.5375 0 .2137-.0719.3914-.2156.5331-.1438.1417-.3219.2125-.5344.2125zm-7.7544-7.75c-.2137 0-.3914-.07187-.5331-.21562s-.2125-.32188-.2125-.53438v-2.5c0-.2125.0723-.39062.2169-.53437s.3237-.21563.5375-.21563c.2137 0 .3914.07188.5331.21563s.2125.32187.2125.53437v2.5c0 .2125-.0723.39063-.2169.53438s-.3237.21562-.5375.21562zm0 18c-.2137 0-.3914-.0718-.5331-.2155-.1417-.1438-.2125-.322-.2125-.5345v-2.5c0-.2125.0723-.3906.2169-.5344.1446-.1437.3237-.2156.5375-.2156.2137 0 .3914.0719.5331.2156.1417.1438.2125.3219.2125.5344v2.5c0 .2125-.0723.3907-.2169.5345-.1446.1437-.3237.2155-.5375.2155zm-5.9956-15.95-1.425-1.4c-.15-.15-.22191-.33002-.21572-.54007.00616-.21007.07721-.38924.21315-.5375.14826-.14829.32743-.22243.5375-.22243.21005 0 .39007.075.54007.225l1.4 1.425c.13333.15.2.325.2.525s-.06667.37083-.2.5125-.30417.2125-.5125.2125-.3875-.06667-.5375-.2zm12.35 12.375-1.4-1.425c-.1333-.15-.2-.3281-.2-.5344 0-.2062.0708-.3781.2125-.5156.1417-.15.3125-.225.5125-.225s.375.075.525.225l1.425 1.4c.15.15.2219.33.2157.5401-.0061.21-.0772.3892-.2131.5375-.1483.1483-.3275.2224-.5375.2224-.2101 0-.3901-.075-.5401-.225zm-1.4-12.375c-.15-.15-.225-.325-.225-.525s.075-.375.225-.525l1.4-1.425c.15-.15.33-.22191.5401-.21572.21.00616.3892.07721.5375.21315.1483.14826.2224.32743.2224.5375 0 .21005-.075.39007-.225.54007l-1.425 1.4c-.1333.13333-.303.2-.5091.2s-.3863-.06667-.5409-.2zm-12.37757 12.3776c-.14829-.1483-.22243-.3275-.22243-.5375 0-.2101.075-.3901.225-.5401l1.425-1.4c.14667-.15.32083-.225.5225-.225s.37424.075.51773.225c.15651.15.23477.325.23477.525s-.075.375-.225.525l-1.4 1.425c-.15.15-.33002.2219-.54007.2157-.21007-.0061-.38924-.0772-.5375-.2131z"/>
</svg>
</button>
</div>
</header>
<section id="hero">
<div class="fv-wrapper fade-in">
<h1 class="copy">Resume<span class="color">.</span></h1>
<div class="fv-caption">
<p>The personal website</p>
<p>User Interface Designer based in Japan.</p>
</div>
<div class="fluid"></div>
</div>
</section>
<section id="career">
<div class="wrapper fade-in">
<h2>EXPERIENCE</h2>
<ul>
<li>
<dl class="container">
<dt>DMM.com LLC</dt>
<dd>2021.04 -</dd>
<dd>Design, Web Cording & Development, Growth</dd>
</dl>
</li>
<li>
<dl class="container">
<dt>Enju Inc.</dt>
<dd>2021.07 - 2021.09</dd>
<dd>“Vink” UI Design</dd>
</dl>
</li>
<li>
<dl class="container">
<dt>Gracia Inc.</dt>
<dd>2020.08 - 2021.03</dd>
<dd>“TANP” Web & UI Design</dd>
</dl>
</li>
<li>
<dl class="container">
<dt>Micoworks Inc.</dt>
<dd>2019.04 - 2020.02</dd>
<dd>“digmee” Product Design</dd>
</dl>
</li>
<li>
<dl class="container">
<dt>NPC Corporation</dt>
<dd>2017.10 - 2019.3</dd>
<dd>Graphic Design</dd>
</dl>
</li>
</ul>
</div>
</section>
<section id="wip">
<div class="wrapper fade-in">
<h2>WORK IN PROGRESS</h2>
<ul>
<li>
<dl class="container">
<dt>Kalta</dt>
<dd>2020.10 -</dd>
<dd>Product Design, Web Cording, Product Management</dd>
</dl>
</li>
</ul>
</div>
</section>
<section id="education">
<div class="wrapper fade-in">
<h2>EDUCATION</h2>
<ul>
<li>
<dl class="container">
<dt>Kwansei Gakuin Univ.</dt>
<dd>2015.04 - 2019.03</dd>
<dd>Faculty of Law, Department of Politics</dd>
</dl>
</li>
</ul>
</div>
</section>
<footer>
<div class="footer-wrapper fade-in">
<small>©︎ 2022 Yudai Suzuki</small>
<div class="social">
<a href="https://twitter.com/ysgraph" class="social-link" target="_blank" rel="noopener noreferrer">
<svg class="social-icon" width="28" height="28" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg">
<title>My Twitter Account</title>
<path d="M10.7205 22.1667C17.9847 22.1667 21.9579 16.3323 21.9579 11.2727C21.9579 11.1071 21.954 10.9421 21.9463 10.7778C22.7171 10.2374 23.3878 9.56334 23.9167 8.79527C23.2091 9.09982 22.4476 9.3051 21.6483 9.39762C22.4638 8.92366 23.0898 8.17343 23.3847 7.27994C22.6216 7.71884 21.7761 8.03758 20.8768 8.20925C20.1568 7.46579 19.1304 7 17.9947 7C15.8133 7 14.0446 8.71465 14.0446 10.8286C14.0446 11.1294 14.0792 11.4213 14.147 11.7013C10.8652 11.5415 7.95389 10.0179 6.00655 7.70093C5.66698 8.26677 5.4714 8.92436 5.4714 9.62529C5.4714 10.954 6.16901 12.126 7.22851 12.812C6.58096 12.7926 5.9719 12.6201 5.43983 12.3327C5.43906 12.3484 5.43906 12.3649 5.43906 12.3813C5.43906 14.2355 6.80041 15.7837 8.60763 16.1345C8.27571 16.2218 7.92694 16.2689 7.56656 16.2689C7.31246 16.2689 7.06454 16.2442 6.82426 16.1995C7.3271 17.7207 8.78473 18.8277 10.5141 18.8584C9.16203 19.8855 7.45951 20.4976 5.60923 20.4976C5.29045 20.4976 4.97629 20.4797 4.66675 20.4445C6.41465 21.5329 8.4898 22.1667 10.7205 22.1667Z"/>
</svg>
</a>
<a href="https://github.com/ysgraph" class="social-link" target="_blank" rel="noopener noreferrer">
<svg class="social-icon" width="28" height="28" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg">
<title>My GitHub Account</title>
<path d="M14 5.25C9.16872 5.25 5.25 9.2673 5.25 14.2201C5.25 18.1824 7.77303 21.5393 11.2086 22.75C11.638 22.805 11.7991 22.5298 11.7991 22.3098C11.7991 22.0896 11.7991 21.5393 11.7991 20.7689C9.38344 21.3192 8.8466 19.5582 8.8466 19.5582C8.47088 18.5126 7.88037 18.2374 7.88037 18.2374C7.07513 17.6871 7.93403 17.6871 7.93403 17.6871C8.79293 17.7421 9.27605 18.6226 9.27605 18.6226C10.0813 19.9984 11.316 19.6132 11.7991 19.3931C11.8528 18.7877 12.1211 18.4025 12.3359 18.1824C10.4034 17.9623 8.36348 17.1918 8.36348 13.7248C8.36348 12.7343 8.6856 11.9638 9.27605 11.3035C9.22238 11.1383 8.90032 10.2028 9.38344 8.99214C9.38344 8.99214 10.1349 8.77199 11.7991 9.92769C12.4969 9.70754 13.2485 9.65253 14 9.65253C14.7515 9.65253 15.5031 9.76255 16.2009 9.92769C17.8651 8.77199 18.6166 8.99214 18.6166 8.99214C19.0997 10.2028 18.7776 11.1383 18.724 11.3585C19.2607 11.9638 19.6365 12.7893 19.6365 13.7798C19.6365 17.2468 17.5966 17.9623 15.6641 18.1824C15.9862 18.4575 16.2546 19.0079 16.2546 19.8333C16.2546 21.044 16.2546 21.9795 16.2546 22.3098C16.2546 22.5298 16.4156 22.805 16.8451 22.75C20.3344 21.5393 22.8037 18.1824 22.8037 14.2201C22.75 9.2673 18.8313 5.25 14 5.25Z"/>
</svg>
</a>
</div>
</div>
</footer>
</body>
</html>