├── .gitignore ├── less ├── README.md ├── aiplat.less ├── cmreset.less └── cmstyle.less ├── less.js ├── package.json ├── lib ├── aiplat.min.css ├── aiplat.min.wxss ├── aiplat.css ├── aiplat.wxss ├── cmreset.min.css ├── cmreset.min.wxss ├── cmreset.css ├── cmreset.wxss ├── cmstyle.min.css └── cmstyle.min.wxss ├── LICENSE └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .vscode/ 3 | .idea/ 4 | .vs/ 5 | nbproject/ 6 | npm-debug.log -------------------------------------------------------------------------------- /less/README.md: -------------------------------------------------------------------------------- 1 | #创建者:womendi@qq.com 2 | #日期:2017-12-01 3 | #只需要在lessConf.js配置需要生成css的less文件 -------------------------------------------------------------------------------- /less.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | global.buildDir = path.join(__dirname, 'less'); 3 | global.staticDir = path.join(__dirname, 'lib'); 4 | require('./build/npmCss')(); -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cmui", 3 | "version": "1.0.0", 4 | "description": "aiplat.com", 5 | "author": "aiplat.com", 6 | "private": true, 7 | "scripts": { 8 | "build": "node less.js" 9 | }, 10 | "dependencies": {}, 11 | "devDependencies": { 12 | "less": "^2.7.3", 13 | "less-middleware": "^2.2.1" 14 | } 15 | } -------------------------------------------------------------------------------- /lib/aiplat.min.css: -------------------------------------------------------------------------------- 1 | img[lazy=loading]{background:#f4f4f4;border-radius:.5em}img[lazy=error]{background:#f4f4f4;border-radius:.5em}.cm_c1b{background:#fd1414 !important}.cm_c1c{color:#fd1414 !important}.cm_c2b{background:#000 !important}.cm_c2c{color:#000 !important}.cm_c3b{background:#696867 !important}.cm_c3c{color:#696867 !important}.cm_c4b{background:#9b9b9b !important}.cm_c4c{color:#9b9b9b !important}.cm_c5b{background:#dfddda !important}.cm_c5c{color:#dfddda !important}.cm_c6b{background:#efefee !important}.cm_c6c{color:#efefee !important}.cm_c7b{background:#fff !important}.cm_c7c{color:#fff !important}.cm_c8b{background:#fd1414 !important}.cm_c8c{color:#fd1414 !important}.cm_c9b{background:#ff8200 !important}.cm_c9c{color:#ff8200 !important} -------------------------------------------------------------------------------- /lib/aiplat.min.wxss: -------------------------------------------------------------------------------- 1 | img[lazy=loading]{background:#f4f4f4;border-radius:.5em}img[lazy=error]{background:#f4f4f4;border-radius:.5em}.cm_c1b{background:#fd1414 !important}.cm_c1c{color:#fd1414 !important}.cm_c2b{background:#000 !important}.cm_c2c{color:#000 !important}.cm_c3b{background:#696867 !important}.cm_c3c{color:#696867 !important}.cm_c4b{background:#9b9b9b !important}.cm_c4c{color:#9b9b9b !important}.cm_c5b{background:#dfddda !important}.cm_c5c{color:#dfddda !important}.cm_c6b{background:#efefee !important}.cm_c6c{color:#efefee !important}.cm_c7b{background:#fff !important}.cm_c7c{color:#fff !important}.cm_c8b{background:#fd1414 !important}.cm_c8c{color:#fd1414 !important}.cm_c9b{background:#ff8200 !important}.cm_c9c{color:#ff8200 !important} -------------------------------------------------------------------------------- /less/aiplat.less: -------------------------------------------------------------------------------- 1 | /*by womendi*/ 2 | img[lazy=loading] { 3 | background: #f4f4f4; 4 | border-radius: 0.5em; 5 | } 6 | img[lazy=error] { 7 | background: #f4f4f4; 8 | border-radius: 0.5em; 9 | } 10 | /*重置*/ 11 | .cm_c1b{background:rgb(253,20,20)!important;} 12 | .cm_c1c{color:rgb(253,20,20)!important;}/*c1*/ 13 | .cm_c2b{background:rgb(0,0,0)!important;} 14 | .cm_c2c{color:rgb(0,0,0)!important;}/*c2*/ 15 | .cm_c3b{background:rgb(105,104,103)!important;} 16 | .cm_c3c{color:rgb(105,104,103)!important;}/*c3*/ 17 | .cm_c4b{background:rgb(155,155,155)!important;} 18 | .cm_c4c{color:rgb(155,155,155)!important;}/*c4*/ 19 | .cm_c5b{background:rgb(223,221,218)!important;} 20 | .cm_c5c{color:rgb(223,221,218)!important;}/*c5*/ 21 | .cm_c6b{background:rgb(239,239,238)!important;} 22 | .cm_c6c{color:rgb(239,239,238)!important;}/*c6*/ 23 | .cm_c7b{background:rgb(255,255,255)!important;} 24 | .cm_c7c{color:rgb(255,255,255)!important;}/*c7*/ 25 | .cm_c8b{background:#fd1414!important;} 26 | .cm_c8c{color:#fd1414!important;}/*c8*/ 27 | .cm_c9b{background:rgb(255,130,0)!important;} 28 | .cm_c9c{color:rgb(255,130,0)!important;}/*c9*/ -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2011-2016 Twitter, Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /lib/aiplat.css: -------------------------------------------------------------------------------- 1 | /*by womendi*/ 2 | img[lazy=loading] { 3 | background: #f4f4f4; 4 | border-radius: 0.5em; 5 | } 6 | img[lazy=error] { 7 | background: #f4f4f4; 8 | border-radius: 0.5em; 9 | } 10 | /*重置*/ 11 | .cm_c1b { 12 | background: #fd1414 !important; 13 | } 14 | .cm_c1c { 15 | color: #fd1414 !important; 16 | } 17 | /*c1*/ 18 | .cm_c2b { 19 | background: #000000 !important; 20 | } 21 | .cm_c2c { 22 | color: #000000 !important; 23 | } 24 | /*c2*/ 25 | .cm_c3b { 26 | background: #696867 !important; 27 | } 28 | .cm_c3c { 29 | color: #696867 !important; 30 | } 31 | /*c3*/ 32 | .cm_c4b { 33 | background: #9b9b9b !important; 34 | } 35 | .cm_c4c { 36 | color: #9b9b9b !important; 37 | } 38 | /*c4*/ 39 | .cm_c5b { 40 | background: #dfddda !important; 41 | } 42 | .cm_c5c { 43 | color: #dfddda !important; 44 | } 45 | /*c5*/ 46 | .cm_c6b { 47 | background: #efefee !important; 48 | } 49 | .cm_c6c { 50 | color: #efefee !important; 51 | } 52 | /*c6*/ 53 | .cm_c7b { 54 | background: #ffffff !important; 55 | } 56 | .cm_c7c { 57 | color: #ffffff !important; 58 | } 59 | /*c7*/ 60 | .cm_c8b { 61 | background: #fd1414!important; 62 | } 63 | .cm_c8c { 64 | color: #fd1414!important; 65 | } 66 | /*c8*/ 67 | .cm_c9b { 68 | background: #ff8200 !important; 69 | } 70 | .cm_c9c { 71 | color: #ff8200 !important; 72 | } 73 | /*c9*/ 74 | -------------------------------------------------------------------------------- /lib/aiplat.wxss: -------------------------------------------------------------------------------- 1 | /*by womendi*/ 2 | img[lazy=loading] { 3 | background: #f4f4f4; 4 | border-radius: 0.5em; 5 | } 6 | img[lazy=error] { 7 | background: #f4f4f4; 8 | border-radius: 0.5em; 9 | } 10 | /*重置*/ 11 | .cm_c1b { 12 | background: #fd1414 !important; 13 | } 14 | .cm_c1c { 15 | color: #fd1414 !important; 16 | } 17 | /*c1*/ 18 | .cm_c2b { 19 | background: #000000 !important; 20 | } 21 | .cm_c2c { 22 | color: #000000 !important; 23 | } 24 | /*c2*/ 25 | .cm_c3b { 26 | background: #696867 !important; 27 | } 28 | .cm_c3c { 29 | color: #696867 !important; 30 | } 31 | /*c3*/ 32 | .cm_c4b { 33 | background: #9b9b9b !important; 34 | } 35 | .cm_c4c { 36 | color: #9b9b9b !important; 37 | } 38 | /*c4*/ 39 | .cm_c5b { 40 | background: #dfddda !important; 41 | } 42 | .cm_c5c { 43 | color: #dfddda !important; 44 | } 45 | /*c5*/ 46 | .cm_c6b { 47 | background: #efefee !important; 48 | } 49 | .cm_c6c { 50 | color: #efefee !important; 51 | } 52 | /*c6*/ 53 | .cm_c7b { 54 | background: #ffffff !important; 55 | } 56 | .cm_c7c { 57 | color: #ffffff !important; 58 | } 59 | /*c7*/ 60 | .cm_c8b { 61 | background: #fd1414!important; 62 | } 63 | .cm_c8c { 64 | color: #fd1414!important; 65 | } 66 | /*c8*/ 67 | .cm_c9b { 68 | background: #ff8200 !important; 69 | } 70 | .cm_c9c { 71 | color: #ff8200 !important; 72 | } 73 | /*c9*/ 74 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # cmui 2 | ## 超萌框架,快捷布局 3 | - 自己写的布局框架,自适应跨平台设备 4 | - 可应用于web、app、小程序 5 | - 下一版本将添加组件形式 6 | 7 | - 实例1 webapp网站 AI智能空间 https://aiplat.com 8 | - 实例2 跨平台app 亲信地铁 腾讯应用宝或苹果appstore搜索‘亲信地铁’、web访问http://m.aiplat.com/metro 9 | - 实例3 微信小程序 娱乐计分器 10 | 11 | - cmui包含cmreset.css和cmstyle.css、aiplat.css三个css文件,同时生成可用于微信小程序开发的wxss文件 12 | - 三个文件,gzip压缩后12k 13 | 14 | --- 15 | 16 | # cmreset.css说明 17 | - 1,盒模型采用IE盒子,即css3中的box-sizing值为border-box 18 | 19 | --- 20 | 21 | # cmstyle.css说明 22 | ## 1,栅格系统 23 | - 请在cmstyle.css文件搜索 ‘栅格系统’ 24 | - 兼容pc与mobile写法:(pc端以1200px居中,mobile以100%适配) 25 |
\
26 |
\
27 |
\