initial commit
This commit is contained in:
椎名奈緒
commit
812bbac7bf
125
assets/css/index.css
Normal file
125
assets/css/index.css
Normal file
@ -0,0 +1,125 @@
|
|||||||
|
body {
|
||||||
|
background: url('../images/darknoise.png');
|
||||||
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, Arial, 'Microsoft YaHei', STXihei, 华文细黑, 微软雅黑, SimSun, 宋体, Heiti, 黑体, sans-serif;
|
||||||
|
padding: 5% 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account {
|
||||||
|
font-size: 1em;
|
||||||
|
line-height: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account a {
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account i {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 1.5em;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account span {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account.account-dark a {
|
||||||
|
color: #1E5184;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account.account-white a {
|
||||||
|
color: #DDD;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account.account-white i {
|
||||||
|
color: #EEE;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
background: #333;
|
||||||
|
color: #DDD;
|
||||||
|
display: block;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 2em;
|
||||||
|
margin-top: 2em;
|
||||||
|
padding: 0.8em 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer span {
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 0.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer span a {
|
||||||
|
color: #759BC2;
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header {
|
||||||
|
background: #385068;
|
||||||
|
padding: 1em 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header .content {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header .content h1 {
|
||||||
|
color: #E9E9E9;
|
||||||
|
font-size: 1.7em;
|
||||||
|
font-weight: 300;
|
||||||
|
line-height: 3em;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header .content h1 .name {
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#main-box {
|
||||||
|
background: white;
|
||||||
|
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.15);
|
||||||
|
display: block;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 64em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile-picture-container {
|
||||||
|
margin: 0 auto;
|
||||||
|
max-height: 16em;
|
||||||
|
max-width: 16em;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile-picture-container::before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
padding-top: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile-picture {
|
||||||
|
background: url('../images/headpic.png');
|
||||||
|
background-size: 100%;
|
||||||
|
border: 1px solid #AAA;
|
||||||
|
border-radius: 50%;
|
||||||
|
bottom: 1em;
|
||||||
|
display: block;
|
||||||
|
left: 1em;
|
||||||
|
position: absolute;
|
||||||
|
right: 1em;
|
||||||
|
top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#self-introduction p {
|
||||||
|
line-height: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tile h2 {
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
BIN
assets/images/darknoise.png
Normal file
BIN
assets/images/darknoise.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
BIN
assets/images/headpic.png
Normal file
BIN
assets/images/headpic.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 455 KiB |
23
bower.json
Normal file
23
bower.json
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
{
|
||||||
|
"name": "loopback.moe",
|
||||||
|
"authors": [
|
||||||
|
"Naoki Rinmous <sukareki@gmail.com>"
|
||||||
|
],
|
||||||
|
"description": "loopback.moe homepage",
|
||||||
|
"main": "index.html",
|
||||||
|
"license": "MIT",
|
||||||
|
"homepage": "https://loopback.moe/",
|
||||||
|
"private": true,
|
||||||
|
"ignore": [
|
||||||
|
"**/.*",
|
||||||
|
"node_modules",
|
||||||
|
"bower_components",
|
||||||
|
"test",
|
||||||
|
"tests"
|
||||||
|
],
|
||||||
|
"dependencies": {
|
||||||
|
"normalize-css": "^4.1.1",
|
||||||
|
"unsemantic": "^1.1.3",
|
||||||
|
"font-awesome": "^4.6.3"
|
||||||
|
}
|
||||||
|
}
|
||||||
75
index.html
Normal file
75
index.html
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<link href="bower_components/normalize-css/normalize.css" rel="stylesheet">
|
||||||
|
<link href="bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">
|
||||||
|
<link href="bower_components/unsemantic/assets/stylesheets/unsemantic-grid-responsive-tablet.css" rel="stylesheet">
|
||||||
|
<link href="assets/css/index.css" rel="stylesheet">
|
||||||
|
<meta author="Naoki Rinmous">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Naoki Rinmous is here!</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="main-box">
|
||||||
|
<div class="grid-container" id="header">
|
||||||
|
<div class="grid-25">
|
||||||
|
<div id="profile-picture-container">
|
||||||
|
<span id="profile-picture"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid-75 content">
|
||||||
|
<h1>Hey, it's <span class="name">Naoki Rinmous!</span></h1>
|
||||||
|
<div class="account account-white">
|
||||||
|
<i class="fa fa-key" aria-hidden="true"></i>
|
||||||
|
<a href="https://keybase.io/amphineko">keybase.io/amphineko</a>
|
||||||
|
</div>
|
||||||
|
<div class="account account-white">
|
||||||
|
<i class="fa fa-github" aria-hidden="true"></i>
|
||||||
|
<a href="https://github.com/amphineko">@amphineko</a>
|
||||||
|
</div>
|
||||||
|
<div class="account account-white">
|
||||||
|
<i class="fa fa-twitter" aria-hidden="true"></i>
|
||||||
|
<a href="https://twitter.com/amphineko">@amphineko</a>
|
||||||
|
</div>
|
||||||
|
<div class="account account-white">
|
||||||
|
<i class="fa fa-weibo" aria-hidden="true"></i>
|
||||||
|
<a href="http://weibo.com/uncookie">@(uid=uncookie)</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid-container" id="body">
|
||||||
|
<div class="grid-50 tile" id="self-introduction">
|
||||||
|
<h2>who am I...</h2>
|
||||||
|
<p>
|
||||||
|
a simple & naïve senior student,<br />
|
||||||
|
in love with Computer Science & programming,<br />
|
||||||
|
trying to change the way to live for people
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="grid-50 tile" id="social-accounts">
|
||||||
|
<h2>how to reach?</h2>
|
||||||
|
<div class="account account-dark">
|
||||||
|
<i class="fa fa-plane" aria-hidden="true"></i>
|
||||||
|
<span>Ingress Agent</span>
|
||||||
|
<a href="http://weibo.com/uncookie">@NekoSauce</a>
|
||||||
|
</div>
|
||||||
|
<div class="account account-dark">
|
||||||
|
<i class="fa fa-steam" aria-hidden="true"></i>
|
||||||
|
<span>Steam</span>
|
||||||
|
<a href="http://weibo.com/uncookie">NekoSauce</a>
|
||||||
|
</div>
|
||||||
|
<div class="account account-dark">
|
||||||
|
<i class="fa fa-send" aria-hidden="true"></i>
|
||||||
|
<span>Telegram</span>
|
||||||
|
<a href="http://weibo.com/uncookie">@amphineko</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="footer">
|
||||||
|
<span>Copyright © 2016 Naoki Rinmous.</span>
|
||||||
|
<span>Powered by <a href="https://github.com/necolas/normalize.css/">normalize.css</a>, <a href="http://fontawesome.io/">Font Awesome</a> and <a href="http://unsemantic.com/">unsemantic</a>.</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue
Block a user