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