Authored by ccbikai

完善基础设施

1 -<h1>Index</h1> 1 +<h1>公有样式示例</h1>
  2 +
  3 +<h2>color</h2>
  4 +统一色号(css 中使用统一变量)
  5 +
  6 +主色调:
  7 +底色:
  8 +红色:
  9 +
  10 +<h2>icon</h2>
  11 +iconfont 新建项目,使用 class 控制图标样式,不要用 unicode
  12 +
  13 +<h2>button</h2>
  14 +三种尺寸,圆角直角,实心空心,选中未选中
  15 +
  16 +<h2>badge</h2>
  17 +一个数字的时候是圆形,数字长的时候圆角长方形,类似跑道
  18 +
  19 +<h2>checkbox</h2>
  20 +单选,多选,开关,选中不选中。
  21 +纯 CSS 实现,不能依赖 JS,原理参考 http://forsigner.com/magic-check/
  22 +
  23 +<h2>tip</h2>
  24 +可以控制显示,隐藏
  25 +支持设置,自动消失
  26 +
  27 +<h2>modal</h2>
  28 +支持 一个按钮,两个按钮,多个按钮
  29 +每个按钮支持自定义事件
  30 +
  31 +<h2>Vue 示例</h2>
  32 +
2 <div id="app"> 33 <div id="app">
3 <app></app> 34 <app></app>
4 -</div>  
  35 +</div>
@@ -6,6 +6,8 @@ @@ -6,6 +6,8 @@
6 6
7 module.exports = app => { 7 module.exports = app => {
8 8
9 - // 组件  
10 - app.use('/example', require('./apps/example')); 9 + // 组件示例
  10 + if (app.locals.devEnv) {
  11 + app.use('/example', require('./apps/example'));
  12 + }
11 }; 13 };
@@ -9,7 +9,8 @@ @@ -9,7 +9,8 @@
9 module.exports = () => { 9 module.exports = () => {
10 return (req, res, next) => { 10 return (req, res, next) => {
11 let yoho = { 11 let yoho = {
12 - pageChannel: {} 12 + pageChannel: {},
  13 + yohoTitle: 'Yoho!BLK'
13 }; 14 };
14 const channel = req.query.channel || req.cookies._Channel || 'boys'; 15 const channel = req.query.channel || req.cookies._Channel || 'boys';
15 16
@@ -2,14 +2,13 @@ @@ -2,14 +2,13 @@
2 <html> 2 <html>
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 - <title>{{title}}</title> 5 + <title>{{title}} {{#unless noYohoTitle}}{{yohoTitle}}{{/unless}}</title>
6 <meta name="keywords" content="{{keywords}}"> 6 <meta name="keywords" content="{{keywords}}">
7 <meta name="description" content="{{description}}"> 7 <meta name="description" content="{{description}}">
8 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> 8 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
9 - <meta http-equiv="cleartype" content="on">  
10 - <meta name="apple-mobile-web-app-status-bar-style" content="black" />  
11 - <meta content="telephone=no" name="format-detection" />  
12 - <meta content="email=no" name="format-detection" /> 9 + <meta name="apple-mobile-web-app-status-bar-style" content="black">
  10 + <meta content="telephone=no" name="format-detection">
  11 + <meta content="email=no" name="format-detection">
13 <link rel="dns-prefetch" href="//cdn.yoho.cn"> 12 <link rel="dns-prefetch" href="//cdn.yoho.cn">
14 <link rel="dns-prefetch" href="//static.yohobuy.com"> 13 <link rel="dns-prefetch" href="//static.yohobuy.com">
15 <script type="text/javascript"> 14 <script type="text/javascript">
@@ -23,13 +22,7 @@ @@ -23,13 +22,7 @@
23 </head> 22 </head>
24 <body {{#if isPassportPage}}class=passport-body{{/if}} {{#if isStarIndexPage}} class="star-index-bg"{{/if}} {{#if isStarDetailPage}}class="star-class-body"{{/if}}> 23 <body {{#if isPassportPage}}class=passport-body{{/if}} {{#if isStarIndexPage}} class="star-index-bg"{{/if}} {{#if isStarDetailPage}}class="star-class-body"{{/if}}>
25 <div class="main-wrap"> 24 <div class="main-wrap">
26 - {{#if systemUpdate}}  
27 - {{> updata}}  
28 - {{/if}}  
29 -  
30 - {{> header}}  
31 {{{body}}} 25 {{{body}}}
32 - {{> footer}}  
33 </div> 26 </div>
34 27
35 {{#wechatShare}} 28 {{#wechatShare}}
1 @import "reset"; 1 @import "reset";
2 -@import "font";  
3 @import "common"; 2 @import "common";
  3 +@import "color";
  4 +@import "icon";
  5 +@import "tip";
  6 +@import "modal";
4 @import "swiper"; 7 @import "swiper";