-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
298 lines (286 loc) · 17.2 KB
/
index.html
File metadata and controls
298 lines (286 loc) · 17.2 KB
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
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FA-STUDIO</title>
<!-- webフォント -->
<link rel="stylesheet" href="https://use.typekit.net/zij1yya.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=Noto+Sans+JP:wght@400;700&family=Noto+Serif+JP:wght@400;700&display=swap" rel="stylesheet">
<!-- FontAwesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- aos.css -->
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<!-- vegas.css -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vegas@2.5.4/dist/vegas.min.css">
<!-- drawer.css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/drawer/3.2.2/css/drawer.min.css">
<link rel="stylesheet" href="./css/style.css">
<!-- favicon設置 -->
<link rel="apple-touch-icon" type="image/png" href="./favicons/FA_logo_maingreen.png" sizes="180x180">
<link rel="icon" type="image/png" href="./favicons/FA_logo_maingreen.png">
<link rel="icon" href="./favicons/FA_favicon.ico">
<!-- jQuery ※scriptを使う -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<!-- jQuery 1.8 or later, 33 KB -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- aos.js -->
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<!-- vegas.js -->
<script src="https://cdn.jsdelivr.net/npm/vegas@2.5.4/dist/vegas.min.js"></script>
<!-- iScroll.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/iScroll/5.2.0/iscroll.min.js"></script>
<!-- drawer.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/drawer/3.2.2/js/drawer.min.js"></script>
<script src="./js/common.js"></script>
<!-- import vue.js -->
<script src="https://unpkg.com/vue@next"></script>
<!-- Fotorama from CDNJS, 19 KB -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.js"></script>
</head>
<body class="drawer drawer--right">
<div id="app">
<div class="page-wrap">
<header>
<div class="header">
<h1 class="header__logo">
<a href="index.html"><img src="./img_works/FA_logo_maingreen.png" alt="HAJIME FUJII STUDIOのロゴ"></a>
</h1>
<nav>
<ul class="header-nav">
<li class="header-nav__link"><a href="index.html#works">Works</a></li>
<li class="header-nav__link"><a href="index.html#photos">Photos</a></li>
<li class="header-nav__link"><a href="index.html#profile">Profile</a></li>
<li class="header-nav__link"><a href="index.html#contact">Contact</a></li>
</ul>
</nav>
</div>
</header>
<header>
<div class="sp-header">
<h1>
<a href="index.html"><img src="./img_works/FA_logo_maingreen.png" alt="" class="sp-header__logo"></a>
</h1>
<div class="hamburger drawer-toggle drawer-hamburger">
<span class="drawer-hamburger-icon"></span>
</div>
<nav class="drawer-nav" role="navigation">
<ul class="drawer-menu">
<li><a class="drawer-menu-item" href="index.html#works"><i class="fas fa-network-wired"></i> Works</a></li>
<li><a class="drawer-menu-item" href="index.html#photos"><i class="fas fa-image"></i> Photos</a></li>
<li><a class="drawer-menu-item" href="index.html#profile"><i class="fas fa-user"></i> Profile</a></li>
<li><a class="drawer-menu-item" href="index.html#contact"><i class="fas fa-id-badge"></i> Contact</a></li>
</ul>
</nav>
</div>
</header>
<main>
<!-- <div class="sidebar">
<p>We Stand with Ukraine.</p>
</div> -->
<div class="sidebar1">
<img src="./img_works/We_stand-2.png" alt="">
</div>
<div class="main-visual">
<div class="headingBlock">
<h1 class="headingBlock__main">
<span class="headingBlock__main__sub">F</span>ujii h<span class="headingBlock__main__sub">A</span>jime STUDIO</h1>
</div>
</div>
<!-- My Works -->
<section>
<div class="section works" id="works">
<div class="section-headline">
<h2 class="section-headline__main">My Works</h2>
</div>
<div class="works-wrap">
<article class="article">
<a href="https://mymaintenancenote20210703.herokuapp.com/index" target="_blank" rel="noopener norefferrer">
<div class="works-content">
<div class="img-box">
<img src="./img_works/MyMaintenanceNote2021.png" alt="" class="works-content__img">
</div>
<h4 class="works-content__title">MyMaintenanceNote2021</h4>
<span class="works-content__comment">えべつ8期卒業制作作品</span>
</div>
</a>
</article>
<article class="article">
<a href="https://mymaintenancenote20210703.herokuapp.com/" target="_blank" rel="noopener norefferrer">
<div class="works-content">
<div class="img-box">
<img src="./img_works/WinkelMaintenanceRecord2021_logo.png" alt="" class="works-content__img">
</div>
<h4 class="works-content__title">Winkel メンテナンス記録</h4>
<span class="works-content__comment">MyMaintenanceNoteの応用作品</span>
</div>
</a>
</article>
<article class="article">
<a href="https://hajimefuji.github.io/woodenstudio/index.html" target="_blank" rel="noopener norefferrer">
<div class="works-content">
<div class="img-box">
<img src="./img_works/Woodenstudio.png" alt="" class="works-content__img">
</div>
<h4 class="works-content__title">Wooden STUDIO サイト</h4>
<span class="works-content__comment">ふろんとえんど1stの成果</span>
</div>
</a>
</article>
<article class="article">
<a href="https://hajimefuji.github.io/Pueo/" target="_blank" rel="noopener norefferrer">
<div class="works-content">
<div class="img-box">
<img src="./img_works/Pueo.png" alt="" class="works-content__img">
</div>
<h4 class="works-content__title">アイケア＆リフレクソロジー "Pueo"</h4>
<span class="works-content__comment">Under construction</span>
</div>
</a>
</article>
<article class="article">
<a href="https://task-app2-f07e1.firebaseapp.com/" target="_blank" rel="noopener norefferrer">
<div class="works-content">
<div class="img-box">
<img src="./img_works/To do and shop_2.png" alt="" class="works-content__img">
</div>
<h4 class="works-content__title">To do & shop アプリ</h4>
<span class="works-content__comment">Vue.cliを使った成果</span>
</div>
</a>
</article>
<article class="article">
<a href="./img_works/アルペン坊や2022.jpg">
<div class="works-content">
<div class="img-box">
<img src="./img_works/アルペン坊や2022.jpg" alt="" class="works-content__img">
</div>
<h4 class="works-content__title">アルペン坊や</h4>
<span class="works-content__comment">学生時代のクラブのアイコン</span>
</div>
</a>
</article>
</div>
</div>
</section>
<!-- Photo Gallery -->
<section>
<div class="section photos" id="photos">
<div class="section-headline">
<h2 class="section-headline__main">Photo Gallery</h2>
</div>
<div class="photos-wrap">
<article class="article">
<a href="animals.html" target="_blank" rel="noopener norefferrer">
<div class="photos-content">
<div class="img-box">
<img src="./img_photos/animals/north_fox_01.jpg" alt="" class="photos-content__img">
</div>
<h4 class="photos-content__title">Birds & Animals</h4>
</div>
</a>
</article>
<article class="article">
<a href="natures.html" target="_blank" rel="noopener norefferrer">
<div class="photos-content">
<div class="img-box">
<img src="./img_photos/natures/touyako_01.jpg" alt="" class="photos-content__img">
</div>
<h4 class="photos-content__title">Natures</h4>
</div>
</a>
</article>
</div>
</div>
</section>
<!-- Profile -->
<article>
<div class="section profile" id="profile">
<section>
<div class="section-headline" >
<h2 class="section-headline__main">Profile</h2>
</div>
<div class="profile-wrap">
<div class="textbox">
<h2 class="textbox__headline">知命（ちめい）の想い</h2>
<p class="textbox__text">
人生100年時代<br>
社会の流動性が高くなっている今、世の中で起きていることを知りたい、わかりたい。<br>
知命（自分に与えられた天命を自覚する）の境地に至る日を目指して。
</p>
<p class="textbox__text2">
1964年北海道札幌市生まれ<br>
現在江別市在住<br>
京都,横浜で計15年生活。<br>
結婚後,北海道にUターン転職。<br>
趣味:アウトドア,スポーツ全般観るのもやるのも<br>
夢:スーパーボウル生観戦,サンティアゴ巡礼の旅<br>
</p>
</div>
<img src="./img_works/profile.jpg" alt="" class="profile__img">
</div>
</section>
</div>
</article>
<!-- Contact -->
<section>
<div class="section contact" id="contact">
<div class="section-headline">
<h2 class="section-headline__main">Contact</h2>
</div>
<div class="contact-wrap">
<div class="textbox">
<p class="textbox__text">何かを創り上げていくことに興味のある方、<br class="mobile-none">
一緒に何かやってみませんか。
</p>
</div>
<div class="sns">
<div class="sns-link">
<a href="https://twitter.com/ebetsu8" class="sns-link__tw"><img src="./img_works/twitter_blue.png" alt=""></a>
<a href="https://www.facebook.com/hajime.fujii.395" class="sns-link__fb"><img src="./img_works/fb_logo.png" alt=""></i></a>
</div>
</div>
</div>
</div>
</section>
</main>
</div>
</div>
<footer>
<hr class="style2">
<div class="footer">
<div class="footer-wrap">
<div class="footer__info1">
<h1 class="footer__logo">
<a href="index.html"><img src="./img_works/FA_logo_maingreen.png" alt="HAJIME FUJII STUDIOのロゴ"></a>
<p class="footer__logo__text">Fujii hAjime STUDIO</p>
</h1>
<nav>
<ul class="footer-nav">
<li class="footer-nav__link"><a href="index.html#works">Works</a></li>
<li class="footer-nav__link"><a href="index.html#photos">Photos</a></li>
<li class="footer-nav__link"><a href="index.html#profile">Profile</a></li>
</ul>
</nav>
</div>
<div class="footer__info2">
<div class="ukraine">
<p class="footer__info2__text">We stand with Ukraine.</p>
<a href="https://support.savethechildren.org/site/TR;jsessionid=00000000.app30117a?px=5789981&fr_id=1541&pg=personal&NONCE_TOKEN=66C251A8F71E403DC3EEC0747251D6E3">
<img class="footer__info2__img" src="./img_works/Ukrine_1.png" alt="">
</a>
</div>
<div class="copyrights">
Copyright ©︎ Fujii hAjime STUDIO All Rights Reserved.
</div>
</div>
</div>
</div>
</footer>
<script src="./js/main.js"></script>
</body>
</html>