From 8ea8e0a2bc67996a4e73709fabd7638201bf1d36 Mon Sep 17 00:00:00 2001 From: amphineko Date: Sat, 7 Dec 2019 04:00:25 +0800 Subject: [PATCH] update content --- src/index.html | 224 +++++++++++++++-------------- src/index.js | 4 +- src/stylesheets/chem-elements.scss | 2 +- src/stylesheets/header.scss | 20 +-- src/stylesheets/labels.scss | 98 +++++-------- 5 files changed, 168 insertions(+), 180 deletions(-) diff --git a/src/index.html b/src/index.html index 90f805a..21b7367 100644 --- a/src/index.html +++ b/src/index.html @@ -21,64 +21,69 @@
- -
-
+
+ language + - 汉语 & 漢語 & English -
-
- - undergraduate -
+ 汉语 + + 漢語 + English
-
- - - Maeeko Laboratory - //futa.moe/maeeko/ - - - + +
+ +
+ project + + + Maeeko Laboratory + +
+ +
-
-
-
- - 10 -
-
- - high sierra -
-
- - debian -
-
-
-
- - - latest -
-
+ +
+ +
+ platforms + + + debian gentoo + + + + iOS macOS + + + + +
+ +
+ indents + + + spaces +
@@ -94,23 +99,28 @@

- @@ -123,65 +133,67 @@

-
-
-
- - K/S/T - NekoSauc -
+
+
+ music game + + + Arcade: NekoSauc + + + + osu! Rukatan +
- - - osu! - Rukatan - -
- - - Steam - NekoSauce - - - - CS:GO - - - - Uplay - NekoSauce2 - - - - R6:S - -
+
+ Steam + + + NekoSauce + + + CS:GO + +
-
- - - Ingress - REDACTED +
+ Uplay + + + AtomicAkarin + + + R6:S + +
+ +
+ Niantic + + + Ingress [CODENAME REDACTED] +
- \ No newline at end of file diff --git a/src/index.js b/src/index.js index 403da56..3a5e84b 100644 --- a/src/index.js +++ b/src/index.js @@ -1,2 +1,2 @@ -require('./index.html') -require('file-loader?name=[path][name].[ext]!./assets/images/amphineko.png') +import './index.html' +import 'file-loader?name=[path][name].[ext]!./assets/images/amphineko.png' diff --git a/src/stylesheets/chem-elements.scss b/src/stylesheets/chem-elements.scss index 88d65ab..49c1ca5 100644 --- a/src/stylesheets/chem-elements.scss +++ b/src/stylesheets/chem-elements.scss @@ -4,7 +4,7 @@ box-shadow: 0 0 0.1em 0.1em rgba(0, 0, 0, 0.05); color: #fff; margin-left: -0.35em; - margin-right: 0.1em; + margin-right: -0.25em; padding: 0.2em 0.1em 0.2em 0.35em; transition-duration: 0.5s; } diff --git a/src/stylesheets/header.scss b/src/stylesheets/header.scss index d6dcd82..1389906 100644 --- a/src/stylesheets/header.scss +++ b/src/stylesheets/header.scss @@ -1,4 +1,4 @@ -.header { +.section.header { background: rgba(0, 0, 0, 0.075); // box-shadow: 0 0 0.15em 0.15em rgba(0, 0, 0, 0.125); // margin-top: -3.2em; @@ -6,11 +6,11 @@ padding-bottom: 1.4em; } -.header .split { +.section.header .split { padding: 0 1em; } -.header .name { +.section.header .name { color: #f5f5f5; display: inline-block; font-weight: 300; @@ -20,11 +20,11 @@ text-shadow: 2px 2px 4px rgba(0,0,0,.25); } -.header .name .chem-element { +.section.header .name .chem-element { text-decoration: none; } -.header .name::after { +.section.header .name::after { bottom: 0em; color: #aaa; display: inline-block; @@ -32,19 +32,19 @@ position: relative; } -.header .name.lang-cn::after { +.section.header .name.lang-cn::after { content: 'zh-CN'; } -.header .name.lang-en::after { +.section.header .name.lang-en::after { content: 'en-US'; } -.header .name.lang-ja::after { +.section.header .name.lang-ja::after { content: 'ja-JP'; } -.header .picture { +.section.header .picture { background: white; border-radius: 50%; box-shadow: 0 0 0.15em 0.15em rgba(0, 0, 0, 0.15); @@ -53,6 +53,6 @@ width: 94%; } -.header .picture-container { +.section.header .picture-container { padding: 2em; } diff --git a/src/stylesheets/labels.scss b/src/stylesheets/labels.scss index 60bf84c..9450c1c 100644 --- a/src/stylesheets/labels.scss +++ b/src/stylesheets/labels.scss @@ -1,69 +1,45 @@ -.small-labels { - display: inline-block; -} - -.small-labels a { - text-decoration: none; -} - -.small-labels .label { - color: #333; - font-weight: 300; - padding: 0.5em 0; - vertical-align: bottom; -} - -.small-labels .label .content { - color: #555; -} - -.small-labels .label .link { - color: #0063cc; -} - -.small-labels .group, .small-labels .label { +.label-group { display: inline-block; + margin: 1.25em 0; + padding: 0 0.25em; position: relative; } -.small-labels .group>*, .small-labels>* { - vertical-align: middle; -} - -.small-labels .label>* { - margin-right: .25em; -} - -.small-labels .group .label { - margin: 0; -} - -.small-labels>.group, .small-labels>.label { - $small-label-group-padding-left: 0.75em; - - background: #eee; - border-radius: 0.35em; - border-bottom-left-radius: 0; - border-top-left-radius: 0; - box-shadow: 0 0 0.15em 0.15em rgba(0, 0, 0, 0.1); - line-height: 1em; - margin: 0.5em; - margin-left: 0; - padding-left: $small-label-group-padding-left; - padding-right: $small-label-group-padding-left; -} - -.small-labels>.group.alt, .small-labels>.label.alt { - margin-top: 1.75em; -} - -/* label alt text */ - -.small-labels .group.alt::before, .small-labels .label.alt::before { - content: attr(data-alt); +.label-group .header { + color: white; + display: block; font-size: 0.8em; left: 0; + padding: 0; position: absolute; - text-shadow: 2px 2px 4px rgba(0,0,0,.25); + text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.25); top: -1.75em; -} \ No newline at end of file +} + +.label-group .header.alt { + color: #333; +} + +.label-group .label { + background: #eee; + box-shadow: 0 0 0.15em 0.15em rgba(0, 0, 0, 0.1); + color: #333; + display: inline-block; + line-height: 2.2em; + padding: 0 0.6em; +} + +.label-group .label:last-child { + $radius: 0.5em; + + border-bottom-right-radius: $radius; + border-top-right-radius: $radius; +} + +.label-group a.label { + text-decoration: none; +} + +.label-group .label i { + margin-right: 0.25em; +}