update layout

This commit is contained in:
amphineko 2018-05-02 02:17:07 +08:00
parent 994d98925d
commit d898f83ceb
3 changed files with 168 additions and 166 deletions

View File

@ -44,6 +44,8 @@
.identity-category {
background: rgba(255, 255, 255, 0.975);
box-shadow: 0 0 0.15em 0.15em rgba(0, 0, 0, 0.125);
margin-bottom: 1em;
padding-bottom: 1.6em;
padding-top: 1em;
}

View File

@ -45,10 +45,9 @@ html {
color: #acd;
}
.main-container {
background: #476685;
.inset-container {
background: rgba(71, 102, 133, 0.99);
box-shadow: inset 0 0 0.15em 0.15em rgba(0, 0, 0, 0.125);
padding-bottom: 1em;
}
.no-wrap {

View File

@ -1,171 +1,172 @@
<html>
<head>
<link href="assets/stylesheets/index.bundle.min.css" rel="stylesheet">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<title>about amphineko</title>
</head>
<body>
<div class="section shadow">
<a class="hosting" href="https://github.com/amphineko/amphineko"><i aria-hidden="true" class="fas fa-code-branch"></i> Fork this template on GitHub</a>
</div>
<div class="main-container">
<div class="section header grid-container">
<div class="picture-container grid-30">
<img class="picture" src="assets/images/amphineko.png">
</div>
<div class="grid-70">
<h1 class="greeting en">
Hey, it's <span class="no-wrap"><a class="chem-element" element="sodium" href="https://en.wikipedia.org/wiki/Sodium">Na</a>oki Rinmous</span>
</h1>
<h1 class="greeting cn">
<small class="prefix">好耶,</small><span class="name no-wrap">是饼干 <span class="face">(&lt;ゝω·) ~☆</span></span>
</h1>
<div class="labels">
<a alt="home" class="label" href="//futa.moe">
<i aria-hidden="true" class="fas fa-map-marker"></i>
<span class="title">五月研究所</span>
<span class="link">//futa.moe</span>
</a>
<div alt="languages" class="label">
<i aria-hidden="true" class="fas fa-language"></i>
<span class="title">LANG</span>
<span class="content">汉语 / 漢語 / English</span>
</div>
<div alt="education" class="label">
<i aria-hidden="true" class="fas fa-university"></i>
<span class="title">current</span>
<span class="content">Guangxi University</span>
</div>
<head>
<link href="assets/stylesheets/index.bundle.min.css" rel="stylesheet">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<title>about amphineko</title>
</head>
<body>
<div class="section shadow">
<a class="hosting" href="https://github.com/amphineko/amphineko">
<i aria-hidden="true" class="fas fa-code-branch"></i> Fork this template on GitHub</a>
</div>
<div class="inset-container">
<div class="section header grid-container">
<div class="picture-container grid-30">
<img class="picture" src="assets/images/amphineko.png">
</div>
<div class="grid-70">
<h1 class="greeting en">
Hey, it's
<span class="no-wrap">
<a class="chem-element" element="sodium" href="https://en.wikipedia.org/wiki/Sodium">Na</a>oki Rinmous</span>
</h1>
<h1 class="greeting cn">
<small class="prefix">好耶,</small>
<span class="name no-wrap">是饼干
<span class="face">(&lt;ゝω·) ~☆</span>
</span>
</h1>
<div class="labels">
<a alt="home" class="label" href="//futa.moe">
<i aria-hidden="true" class="fas fa-map-marker"></i>
<span class="title">五月研究所</span>
<span class="link">//futa.moe</span>
</a>
<div alt="languages" class="label">
<i aria-hidden="true" class="fas fa-language"></i>
<span class="title">LANG</span>
<span class="content">汉语 / 漢語 / English</span>
</div>
<div class="labels">
<div alt="browser" class="label">
<i aria-hidden="true" class="fab fa-chrome"></i>
<span class="content">beta</span>
</div>
<div alt="editor" class="label">
<i aria-hidden="true" class="far fa-keyboard"></i>
<span class="content">vim</span>
</div>
<div alt="spaces or tabs" class="label">
<i aria-hidden="true" class="fas fa-i-cursor"></i>
<span class="content">spaces</span>
</div>
<div alt="platforms" class="label">
<i aria-hidden="true" class="fab fa-windows"></i>
<span class="content">10</span>
<i aria-hidden="true" class="fab fa-linux"></i>
<span class="content">debian</span>
<span class="content">gentoo</span>
<i aria-hidden="true" class="fab fa-apple"></i>
<span class="content">sierra</span>
</div>
<div alt="education" class="label">
<i aria-hidden="true" class="fas fa-university"></i>
<span class="title">current</span>
<span class="content">Guangxi University</span>
</div>
</div>
<div class="labels">
<div alt="browser" class="label">
<i aria-hidden="true" class="fab fa-chrome"></i>
<span class="content">beta</span>
</div>
<div alt="editor" class="label">
<i aria-hidden="true" class="far fa-keyboard"></i>
<span class="content">vim</span>
</div>
<div alt="spaces or tabs" class="label">
<i aria-hidden="true" class="fas fa-i-cursor"></i>
<span class="content">spaces</span>
</div>
<div alt="platforms" class="label">
<i aria-hidden="true" class="fab fa-windows"></i>
<span class="content">10</span>
<i aria-hidden="true" class="fab fa-linux"></i>
<span class="content">debian</span>
<span class="content">gentoo</span>
<i aria-hidden="true" class="fab fa-apple"></i>
<span class="content">sierra</span>
</div>
</div>
</div>
<div class="section identity-category grid-container shadow">
<h2 class="title">
<i aria-hidden="true" class="fas fa-chevron-right"></i> Naoki Rinmous
<span class="no-wrap">
<small class="tag"><i aria-hidden="true" class="fas fa-tag"></i><del>designer</del></small>
<small class="tag"><i aria-hidden="true" class="fas fa-tag"></i>programmer</small>
</span>
</h2>
<ul class="identities grid-50">
<li class="identity">
<a href="https://github.com/amphineko">
<i aria-hidden="true" class="fab fa-github"></i>
<span class="where">github</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="https://keybase.io/amphineko">
<i aria-hidden="true" class="fas fa-key"></i>
<span class="where">keybase</span>
<span class="link">@amphineko</span>
</a>
</li>
</ul>
<ul class="identities grid-50">
<li class="identity">
<a href="https://plus.google.com/104160980463474768448">
<i aria-hidden="true" class="fab fa-google-plus"></i>
<span class="where">google plus</span>
<span class="link">+椎名奈緒</span>
</a>
</li>
<li class="identity">
<a href="https://telegram.me/amphineko">
<i aria-hidden="true" class="fab fa-telegram"></i>
<span class="where">telegram</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="https://twitter.com/amphineko">
<i aria-hidden="true" class="fab fa-twitter"></i>
<span class="where">twitter</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="http://weibo.com/uncookie">
<i aria-hidden="true" class="fab fa-weibo"></i>
<span class="where">weibo</span>
<span class="link">猫耳继电器</span>
</a>
</li>
</ul>
</div>
<div class="section identity-category grid-container shadow">
<h2 class="title">
<i aria-hidden="true" class="fas fa-chevron-right"></i> NekoSauce
<span class="no-wrap">
<small class="tag no-wrap"><i aria-hidden="true" class="fas fa-tag"></i>gamer</small>
<small class="tag no-wrap"><i aria-hidden="true" class="fas fa-tag"></i>simulation</small>
<small class="tag no-wrap"><i aria-hidden="true" class="fas fa-tag"></i>music-game</small>
</span>
</h2>
<ul class="identities grid-50">
<li class="identity">
<a href="#">
<i aria-hidden="true" class="fas fa-bicycle"></i>
<span class="where">scanner</span>
<span class="link">NekoSauce</span>
</a>
</li>
<li class="identity">
<a href="http://steamcommunity.com/id/amphineko">
<i aria-hidden="true" class="fab fa-steam-symbol"></i>
<span class="where">steam</span>
<span class="link">NekoSauce</span>
</a>
</li>
</ul>
<ul class="identities grid-50">
<li class="identity">
<a href="#">
<i aria-hidden="true" class="fas fa-registered"></i>
<span class="where">bemani</span>
<span class="link">NEKOSAUC</span>
</a>
</li>
<li class="identity">
<a href="https://osu.ppy.sh/u/Rukatan">
<i aria-hidden="true" class="fab fa-accessible-icon"></i>
<span class="where">osu!</span>
<span class="link">Rukatan</span>
</a>
</li>
</ul>
</div>
</div>
<div class="section shadow">
<a class="hosting" href="//futa.moe"><i aria-hidden="true" class="far fa-heart"></i> Hosted by 五月研究所 <span class="link">//futa.moe</span></a>
<div class="copyright">
Copyright © 2015-2017 Naoki Rinmous. Illustrations have their own licenses.
</div>
</div>
<div class="section grid-container">
<div class="identity-category grid-50">
<h2 class="title">
<i aria-hidden="true" class="fas fa-chevron-right"></i> Naoki Rinmous
</h2>
<ul class="identities">
<li class="identity">
<a href="https://github.com/amphineko">
<i aria-hidden="true" class="fab fa-github"></i>
<span class="where">github</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="https://keybase.io/amphineko">
<i aria-hidden="true" class="fas fa-key"></i>
<span class="where">keybase</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="https://plus.google.com/104160980463474768448">
<i aria-hidden="true" class="fab fa-google-plus"></i>
<span class="where">google plus</span>
<span class="link">+椎名奈緒</span>
</a>
</li>
<li class="identity">
<a href="https://telegram.me/amphineko">
<i aria-hidden="true" class="fab fa-telegram"></i>
<span class="where">telegram</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="https://twitter.com/amphineko">
<i aria-hidden="true" class="fab fa-twitter"></i>
<span class="where">twitter</span>
<span class="link">@amphineko</span>
</a>
</li>
<li class="identity">
<a href="http://weibo.com/uncookie">
<i aria-hidden="true" class="fab fa-weibo"></i>
<span class="where">weibo</span>
<span class="link">猫耳继电器</span>
</a>
</li>
</ul>
</div>
</body>
<div class="identity-category grid-45 prefix-5">
<h2 class="title">
<i aria-hidden="true" class="fas fa-chevron-right"></i> NekoSauce
</h2>
<ul class="identities">
<li class="identity">
<a href="#">
<i aria-hidden="true" class="fas fa-bicycle"></i>
<span class="where">scanner</span>
<span class="link">NekoSauce</span>
</a>
</li>
<li class="identity">
<a href="http://steamcommunity.com/id/amphineko">
<i aria-hidden="true" class="fab fa-steam-symbol"></i>
<span class="where">steam</span>
<span class="link">NekoSauce</span>
</a>
</li>
<li class="identity">
<a href="#">
<i aria-hidden="true" class="fas fa-registered"></i>
<span class="where">bemani</span>
<span class="link">NEKOSAUC</span>
</a>
</li>
<li class="identity">
<a href="https://osu.ppy.sh/u/Rukatan">
<i aria-hidden="true" class="fab fa-accessible-icon"></i>
<span class="where">osu!</span>
<span class="link">Rukatan</span>
</a>
</li>
</ul>
</div>
</div>
<div class="section shadow">
<a class="hosting" href="//futa.moe">
<i aria-hidden="true" class="far fa-heart"></i> Hosted by 五月研究所
<span class="link">//futa.moe</span>
</a>
<div class="copyright">
Copyright © 2015-2017 Naoki Rinmous. Illustrations have their own licenses.
</div>
</div>
</body>
</html>