Update and beautify the about-page

更新美化关于页面

CHANGELOG.md

@@ -3,6 +3,14 @@
 > 同时也欢迎大家的参与！感谢各位朋友的支持！ .TAT.
 
 ## 2016/04
+
+### /23
+  1. 更新美化关于页面
+
+### /22
+  1. 修补 aspx 连接和文件管理的 Bug // &2:Thanks [@Medicean][medicaean-github]
+  2. 新添加了 aspx base64 编码器
+
 ### /16 `(v1.2.0)`
   1. 重新架构核心模块编码器
   2. 优化shellmanager添加/编辑功能

source/modules/settings/about.jsx

+/**
+ * 设置中心::关于
+ */
+
 const LANG = antSword['language']['settings'];
 
 class About {
@@ -10,21 +14,26 @@ class About {
     });
     const cell = sidebar.cells('about');
     cell.attachHTMLString(`
-      <div align="center">
-        <img src="../static/imgs/logo.png" style="width: 30%;-webkit-user-select: none;" />
-      </div>
-      <div style="padding: 10px; font-family: sans-serif;text-indent: 2em;">
-        <p><strong>中国蚁剑是一款开源的网站管理工具，它主要面向于合法授权的渗透测试网络安全爱好者以及常规的网站操作管理人员，任何人不得用于非法用途以及盈利目的，否则后果自行承担。</strong></p>
-        <p>中国蚁剑采用Electron作为外壳，ES6作为前端框架语言。完全模块化的代码架构，让你轻易地对各种功能进行最大化自由的修改添加。目前支持三大主流操作系统：windows、linux、osx，支持三大主流网站脚本：php、asp、aspx，以及自定义数据格式的custom脚本。除此之外，你可以参考代码轻易地修改添加支持脚本类型，还可以编写编码模块对源数据进行编码加密等处理操作，以绕过各种WAF以及保护自己的数据安全。</p>
-        <p>当前支持三大主模块功能：文件管理、数据库管理、虚拟终端操作，以及正在开发中的插件管理功能，完全满足你的需求。<strong>目前脚本代码均来源于伟大的中国菜刀，本人只是进行了解密以及一些改动。在此向中国菜刀致敬！</strong></p>
-        <hr style="border:0;width:95%;border-bottom: solid 1px #CCC;" />
-        <ul style="list-style-type: none;padding: 0;margin: 0;">
-          <li><strong>微博：</strong>http://weibo.com/antoor</li>
-          <li><strong>交流群：</strong>130993112</li>
+      <div align="center" class="about">
+        <img src="../static/imgs/logo.png" />
+        <hr/>
+        <h2>中国蚁剑</h2>
+        <p>
+          <a href="https://github.com/antoor/antSword"><i class="fa fa-github-alt"></i> GitHub</a> |
+          <a href="http://uyu.us"><i class="fa fa-home"></i> 主页</a> |
+          <a href="http://weibo.com/antoor"><i class="fa fa-weibo"></i> 微博</a> |
+          <a href="http://shang.qq.com/wpa/qunwpa?idkey=51997458a52d534454fd15e901648bf1f2ed799fde954822a595d6794eadc521"><i class="fa fa-qq"></i> Q群</a>
+        </p>
       </div>
     `);
+
+    // 在默认浏览器中打开链接
+    $('.about').on('click', 'a', function(e) {
+      e.preventDefault();
+      antSword['shell'].openExternal(this.href);
+    });
   }
 
 }
 
-export default About;
\ No newline at end of file
+export default About;

static/css/index.css

@@ -164,3 +164,38 @@ html, body, #container, #loading {
           transform: translate(0, -6.25px);
   top: 25px;
   left: 100px; }
+
+
+/*关于*/
+.about {
+  font-family: sans-serif;
+  -webkit-user-select: none;
+}
+.about > img {
+  width: 30%;
+}
+.about > img:hover {
+ -webkit-animation: tada 1s .2s ease both;
+ -moz-animation: tada 1s .2s ease both;
+ }
+@-moz-keyframes tada{0%{-moz-transform:scale(1);}10%,20%{-moz-transform:scale(0.9) rotate(-3deg);}30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg);}40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg);}100%{-moz-transform:scale(1) rotate(0);}}
+@-webkit-keyframes tada{0%{-webkit-transform:scale(1);}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);}100%{-webkit-transform:scale(1) rotate(0);}}
+
+.about > hr {
+  width: 66%;
+  border-color: #ececec;
+  border-top: none;
+}
+
+.about > p {
+  color: #ececec;
+}
+.about a {
+  text-decoration: blink;
+  color: #795548;
+  transition: all .5s linear;
+  font-size: 14px;
+}
+.about a:hover {
+  color: #009688;
+}