improve(doc) rm iconfont qrcode, replace via svg directly

spmjs · Jan 8, 2015 · de5e84a · de5e84a
1 parent 4edb151
commit de5e84a
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 30 deletions.
diff --git a/lib/theme/static/css/site.css b/lib/theme/static/css/site.css
@@ -461,45 +461,28 @@ body.spmjs {
   100% { transform: rotate(360deg); }
 }
 
-
-/** iconfont **/
-
-@font-face {font-family: "iconfont";
-  src: url('../font/iconfont.eot'); /* IE9*/
-  src: url('../font/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
-  url('../font/iconfont.woff') format('woff'), /* chrome、firefox */
-  url('../font/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
-  url('../font/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
-}
-
-.qrcode-wrapper .iconfont {
-  font-family:"iconfont" !important;
-  font-size:16px;
-  font-style:normal;
-  -webkit-font-smoothing: antialiased;
-  -webkit-text-stroke-width: 0.2px;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.qrcode-wrapper .icon-erweima:before { content: "\3433"; }
-
-/** qrcode **/
-
 .qrcode-wrapper {
   position:relative;
   margin-top: 8px;
 }
-.qrcode-wrapper .iconfont {
+
+.qrcode-wrapper .icon {
   font-size:30px;
-  color:#666;
 }
+
+.qrcode-wrapper .icon-qrcode {
+  width: 24px;
+  height: 24px;
+  overflow: hidden;
+}
+
 .qrcode-wrapper .qrcode {
   display: none;
   position:absolute;
   left:0;
   top:0;
 }
-.qrcode-wrapper .iconfont:hover .qrcode {
+.qrcode-wrapper .icon:hover .qrcode {
   display: block;
 }
 .qrcode-wrapper .qrcode canvas {

diff --git a/lib/theme/templates/layout.html b/lib/theme/templates/layout.html
@@ -49,8 +49,16 @@ <h1>
         {%- block subsidebar %}
         {%- endblock %}
         <div class="qrcode-wrapper">
-          <i class="icon iconfont">
-            &#x3433;
+          <i class="icon">
+            <div class="icon-qrcode">
+              <svg width="1024" height="1024" viewBox="0 0 1024 1024">
+                <g class="transform-group">
+                  <g transform="translate(0, 18) scale(1, -1) scale(0.024, 0.024)">
+                    <path d="M116.8 792.062v0 0zM334.523 138.877v-72.569h-72.569v72.569h72.569zM334.523 574.339v-72.569h-72.569v72.569h72.569zM769.984 574.339v-72.569h-72.569v72.569h72.569zM189.369-5.705h217.723v217.167h-217.723v-217.167zM189.369 429.185h217.723v217.723h-217.723v-217.723zM624.831 429.185h217.723v217.723h-217.723v-217.723zM479.677 284.031v-362.877h-362.877v362.877h362.877zM769.984-6.277v-72.569h-72.569v72.569h72.569zM915.138-6.277v-72.569h-72.569v72.569h72.569zM915.138 284.031v-217.723h-217.723v72.569h-72.569v-217.723h-72.569v362.877h217.723v-72.569h72.569v72.569h72.569zM479.677 719.493v-362.877h-362.877v362.877h362.877zM915.138 719.493v-362.877h-362.877v362.877h362.877z" fill="#555"></path>
+                  </g>
+                </g>
+              </svg>
+            </div>
             <div class="qrcode" id="qrcode"></div>
           </i>
         </div>
@@ -80,7 +88,6 @@ <h1>
     };
     ready(function() {
       NProgress.inc(0.6);
-
       seajs.use("{{static_url('js/arale-qrcode.js')}}?nowrap", function(QRCode) {
         var url = location.href;
         if (location.hostname === 'localhost' || location.hostname === '127.0.0.1') {