add translation for index

resources/assets/src/sass/index.scss

@@ -2,7 +2,7 @@
  * @Author: printempw
  * @Date:   2016-06-04 20:54:53
  * @Last Modified by:   printempw
- * @Last Modified time: 2016-12-11 15:10:01
+ * @Last Modified time: 2016-12-11 21:36:02
  */
 
 @import "style.scss";
@@ -18,20 +18,39 @@ body {
     background-repeat: no-repeat;
     background-position: center 0;
 
-    .main-header .navbar {
+    .main-header {
-        transition: color 0.25s ease-in-out,
+        .navbar {
-                    border-color 0.25s ease-in-out,
+            transition: color 0.25s ease-in-out,
-                    background-color 0.25s ease-in-out;
+                        border-color 0.25s ease-in-out,
-    }
+                        background-color 0.25s ease-in-out;
 
-    .main-header .navbar-brand {
+            .user-menu .user-image {
-        font-family: Minecraft, 'Segoe UI', 'Microsoft Yahei', 'Microsoft Jhenghei', sans-serif;
+                border-radius: 10%;
-        border-right: 0;
+            }
-    }
 
-    .main-header .navbar .navbar-nav {
+            .navbar-custom-menu .navbar-nav > li {
-        .user-menu .user-image {
+                a.btn.btn-login {
-            border-radius: 10%;
+                    background-color: transparent;
+                    border-radius: 5px;
+                    border: 1px solid #fff;
+                    color: #fff !important;
+                    margin-top: 7px;
+                    margin-left: 10px;
+                    padding: 8px 20px;
+                    transition: border-color 0.25s ease-in-out,
+                                background-color 0.3s ease-in-out;
+                }
+
+                a.btn.btn-login:hover,
+                a.btn.btn-login:focus {
+                    background-color: #006acc !important;
+                }
+            }
+        }
+
+        .navbar-brand {
+            font-family: Minecraft, 'Segoe UI', 'Microsoft Yahei', 'Microsoft Jhenghei', sans-serif;
+            border-right: 0;
         }
     }
 
@@ -68,7 +87,7 @@ body {
             }
 
             .navbar-custom-menu .navbar-nav > li {
-                a.btn {
+                a.btn.btn-login {
                     background-color: #0078e7;
                     border: 1px solid #0078e7;
                 }
@@ -80,14 +99,6 @@ body {
         }
     }
 
-    .main-header .navbar .navbar-custom-menu .navbar-nav > li {
-        a.btn {
-            border-radius: 5px;
-                    background: transparent;
-                    border: 1px solid #fff;
-        }
-    }
-
     .content-wrapper {
         background-color: transparent;
         border: none;
@@ -157,21 +168,6 @@ body {
     font-family: Ubuntu, 'Segoe UI', 'Microsoft Yahei', 'Microsoft Jhenghei', sans-serif;
 }
 
-.navbar-custom-menu .navbar-nav > li {
-    a.btn.btn-login {
-        background-color: #0078e7;
-        color: #fff !important;
-        margin-top: 7px;
-        margin-left: 10px;
-        padding: 8px 20px;
-    }
-
-    a.btn.btn-login:hover,
-    a.btn.btn-login:focus {
-        background-color: #006acc !important;
-    }
-}
-
 /* Mobile phone */
 @media (max-width: 48em) {
     .splash-head {
@@ -277,7 +273,6 @@ hr {
 /* Copyright Wrap */
 
 #copyright {
-    border-top: #2f2f2f solid 5px;
     background: #222222;
     padding: 16px 0 20px;
     color: white

resources/lang/en/index.yml

@@ -0,0 +1,16 @@
+features:
+  multi-player:
+    name: Multi Player
+    desc: You can add many players with only one account.
+
+  sharing:
+    name: Sharing
+    desc: Explore the skin library, give a 'like' and share them with your friends.
+
+  free:
+    name: Free
+    desc: It is free forever. No ads. No subscription fees.
+
+introduction: :sitename provides the service of uploading and hosting Minecraft skins. By coordinating with skin mods e.g. CustomSkinLoader, you can set skins & capes for your game character, and make it visible to other players.
+
+start: Join Us

resources/lang/zh-CN/index.yml

@@ -0,0 +1,16 @@
+features:
+  multi-player:
+    name: 多角色
+    desc: 一个账户可绑定多个游戏角色
+
+  sharing:
+    name: 分享
+    desc: 浏览皮肤库，添加喜爱的皮肤并与好友分享
+
+  free:
+    name: 永久免费
+    desc: 我们承诺永不收取任何费用
+
+introduction: :sitename 提供 Minecraft 角色皮肤的上传以及托管服务。配合 CustomSkinLoader 等换肤 MOD，您可以为您的游戏角色设置皮肤与披风，并让其他玩家在游戏中看到。
+
+start: 开始使用

resources/views/index.tpl

@@ -106,18 +106,18 @@
                 <br>
                 <div class="col-lg-4">
                     <i class="fa fa-users" aria-hidden="true"></i>
-                    <h3>多角色</h3>
+                    <h3>{{ trans('index.features.multi-player.name') }}</h3>
-                    <p>一个账户可绑定多个游戏角色</p>
+                    <p>{{ trans('index.features.multi-player.desc') }}</p>
                 </div>
                 <div class="col-lg-4">
                     <i class="fa fa-share-alt" aria-hidden="true"></i>
-                    <h3>分享</h3>
+                    <h3>{{ trans('index.features.sharing.name') }}</h3>
-                    <p>浏览皮肤库，添加喜爱的皮肤并与好友分享</p>
+                    <p>{{ trans('index.features.sharing.desc') }}</p>
                 </div>
                 <div class="col-lg-4">
                     <i class="fa fa-cloud" aria-hidden="true"></i>
-                    <h3>永久免费</h3>
+                    <h3>{{ trans('index.features.free.name') }}</h3>
-                    <p>我们承诺永不收取任何费用</p>
+                    <p>{{ trans('index.features.free.desc') }}</p>
                 </div>
             </div>
             <br>
@@ -127,11 +127,11 @@
     <div id="footerwrap">
         <div class="container">
             <div class="col-lg-6">
-                {{ option('site_name') }} 提供 Minecraft 角色皮肤的上传以及托管服务。配合 CustomSKinLoader 等换肤 MOD，您可以为您的游戏角色设置皮肤与披风，并让其他玩家在游戏中看到。
+                {{ trans('index.introduction', ['sitename' => option('site_name')]) }}
             </div>
 
             <div class="col-lg-6">
-                <a href="{{ url('auth/register') }}" id="btn-register" class="button">开始使用</a>
+                <a href="{{ url('auth/register') }}" id="btn-register" class="button">{{ trans('index.start') }}</a>
             </div>
         </div>
     </div>