lookitui 0.1.1.beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +15 -0
 - data/README.mkdn +0 -0
 - data/lib/seeui.rb +28 -0
 - data/stylesheets/_lookitui.scss +5 -0
 - data/stylesheets/lookitui/_button.scss +1 -0
 - data/stylesheets/lookitui/_form.scss +1 -0
 - data/stylesheets/lookitui/_func.scss +229 -0
 - data/stylesheets/lookitui/_reset.scss +161 -0
 - data/stylesheets/lookitui/_ui-form.scss +58 -0
 - data/stylesheets/lookitui/_ui-refresh.scss +13 -0
 - data/stylesheets/lookitui/_ui-slider.gionee.scss +9 -0
 - data/stylesheets/lookitui/_ui-slider.scss +84 -0
 - data/stylesheets/lookitui/_ui-toolbar.gionee.scss +13 -0
 - data/stylesheets/lookitui/_ui-toolbar.scss +62 -0
 - data/stylesheets/lookitui/_vars.scss +54 -0
 - data/stylesheets/lookitui/base/1.0/base.scss +39 -0
 - data/stylesheets/lookitui/base/1.0/phone.scss +68 -0
 - data/stylesheets/lookitui/base/1.0/reset.scss +162 -0
 - data/stylesheets/lookitui/button/1.0/button.scss +23 -0
 - data/stylesheets/lookitui/form/1.0/form.scss +44 -0
 - data/templates/project/_seeui.scss +7 -0
 - data/templates/project/manifest.rb +18 -0
 - metadata +77 -0
 
    
        checksums.yaml
    ADDED
    
    | 
         @@ -0,0 +1,15 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            ---
         
     | 
| 
      
 2 
     | 
    
         
            +
            !binary "U0hBMQ==":
         
     | 
| 
      
 3 
     | 
    
         
            +
              metadata.gz: !binary |-
         
     | 
| 
      
 4 
     | 
    
         
            +
                NzNmYjIxNGYyNTU1YzYxYjZiZjZmOWY2Mzg1ZDJjNzlhYjY3NDlmYQ==
         
     | 
| 
      
 5 
     | 
    
         
            +
              data.tar.gz: !binary |-
         
     | 
| 
      
 6 
     | 
    
         
            +
                ZTQyNGQ1NzM3NDFkM2E0YmEzYTcyMTY1ODdkZjIyZmM4N2UzZTM0YQ==
         
     | 
| 
      
 7 
     | 
    
         
            +
            !binary "U0hBNTEy":
         
     | 
| 
      
 8 
     | 
    
         
            +
              metadata.gz: !binary |-
         
     | 
| 
      
 9 
     | 
    
         
            +
                YTIzZGI2MzExYWZkNjNlZGIzZDIzM2FkY2JmMzVhMWEyYjE3YzhiNWZkNGZk
         
     | 
| 
      
 10 
     | 
    
         
            +
                ZjkyNDI1MDIxY2VlYjdjZjdmOWMzM2ZjYTAwMDExYjdhZmRkZmY5OTBlMmQ1
         
     | 
| 
      
 11 
     | 
    
         
            +
                ZjU1OTFkOWVjMmNiMmQzMjQ2MTRkYmYwZDdiNTNkOGZiNTJlMTI=
         
     | 
| 
      
 12 
     | 
    
         
            +
              data.tar.gz: !binary |-
         
     | 
| 
      
 13 
     | 
    
         
            +
                NDI4OTlmZGY5ZjJmZmZhYTBlOThkNWZmNDFlM2UwMjgwZDIwN2YxZmE5ZjNj
         
     | 
| 
      
 14 
     | 
    
         
            +
                ODk1Yzk0MWZkMGE3ZDU1ZTY1MzNhOGEzYzZkMTRiNTljNWJjOGNlNjZkNjQ4
         
     | 
| 
      
 15 
     | 
    
         
            +
                NzM4YjkyOTcwMjEyZWUwNDgwMzA0ZTI0OTY2NjdmMGI5M2NjNDM=
         
     | 
    
        data/README.mkdn
    ADDED
    
    | 
         
            File without changes
         
     | 
    
        data/lib/seeui.rb
    ADDED
    
    | 
         @@ -0,0 +1,28 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            # If you'd like to store your stylesheets and/or templates in a non-standard location within your extension, 
         
     | 
| 
      
 2 
     | 
    
         
            +
            # you must provide a library file and register the extension explicitly like so:
         
     | 
| 
      
 3 
     | 
    
         
            +
             
     | 
| 
      
 4 
     | 
    
         
            +
            #base_directory  = File.join(File.dirname(__FILE__), '..')
         
     | 
| 
      
 5 
     | 
    
         
            +
            #stylesheets_dir = File.join(base_directory, 'seeui', 'stylesheets')
         
     | 
| 
      
 6 
     | 
    
         
            +
            #templates_dir   = File.join(base_directory, 'seeui', 'templates')
         
     | 
| 
      
 7 
     | 
    
         
            +
            #Compass::Frameworks.register('seeui', :stylesheets_directory => stylesheets_dir, :templates_directory => templates_dir)
         
     | 
| 
      
 8 
     | 
    
         
            +
             
     | 
| 
      
 9 
     | 
    
         
            +
            #If you're following the standard naming convention, 
         
     | 
| 
      
 10 
     | 
    
         
            +
            #but the stylesheet and template directories are not at the top level, you can just do this instead:
         
     | 
| 
      
 11 
     | 
    
         
            +
             
     | 
| 
      
 12 
     | 
    
         
            +
            # path from the library file to where you're keeping your compass stuff.
         
     | 
| 
      
 13 
     | 
    
         
            +
            #base_directory  = File.join(File.dirname(__FILE__), '..', 'compass')
         
     | 
| 
      
 14 
     | 
    
         
            +
            #Compass::Frameworks.register('seeui', :path => base_directory)
         
     | 
| 
      
 15 
     | 
    
         
            +
             
     | 
| 
      
 16 
     | 
    
         
            +
            #require 'compass'
         
     | 
| 
      
 17 
     | 
    
         
            +
            #extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
         
     | 
| 
      
 18 
     | 
    
         
            +
            #Compass::Frameworks.register('seeui', :path => extension_path)
         
     | 
| 
      
 19 
     | 
    
         
            +
             
     | 
| 
      
 20 
     | 
    
         
            +
            require 'compass'
         
     | 
| 
      
 21 
     | 
    
         
            +
            Compass::Frameworks.register("seeui", :path => "#{File.dirname(__FILE__)}/..")
         
     | 
| 
      
 22 
     | 
    
         
            +
             
     | 
| 
      
 23 
     | 
    
         
            +
            module Seeui
         
     | 
| 
      
 24 
     | 
    
         
            +
             
     | 
| 
      
 25 
     | 
    
         
            +
              VERSION = "0.1"
         
     | 
| 
      
 26 
     | 
    
         
            +
              DATE = "2013-06-01"
         
     | 
| 
      
 27 
     | 
    
         
            +
             
     | 
| 
      
 28 
     | 
    
         
            +
            end
         
     | 
| 
         @@ -0,0 +1 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @import "button/1.0/button.scss";
         
     | 
| 
         @@ -0,0 +1 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @import "form/1.0/form.scss";
         
     | 
| 
         @@ -0,0 +1,229 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "UTF-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
             
     | 
| 
      
 3 
     | 
    
         
            +
            @mixin lg($dir, $col1, $col2){background-color:$col2; @include background-image(linear-gradient($dir, $col1, $col2));}
         
     | 
| 
      
 4 
     | 
    
         
            +
             
     | 
| 
      
 5 
     | 
    
         
            +
            /**
         
     | 
| 
      
 6 
     | 
    
         
            +
             * 自定义方向小箭头
         
     | 
| 
      
 7 
     | 
    
         
            +
             * 
         
     | 
| 
      
 8 
     | 
    
         
            +
             * @param $wh 	宽度和高度
         
     | 
| 
      
 9 
     | 
    
         
            +
             * @param $mrt 	margin-top位置
         
     | 
| 
      
 10 
     | 
    
         
            +
             * @param $posr postion right位置
         
     | 
| 
      
 11 
     | 
    
         
            +
             * @param $bw 	边框宽度
         
     | 
| 
      
 12 
     | 
    
         
            +
             * @param $bc 	边框颜色
         
     | 
| 
      
 13 
     | 
    
         
            +
             * @param $der 	箭头方向
         
     | 
| 
      
 14 
     | 
    
         
            +
             */
         
     | 
| 
      
 15 
     | 
    
         
            +
            @mixin arrow($wh:5px,$mrt:0,$posr:10px,$bw:2px,$bc:#7e7e7e,$der:left){
         
     | 
| 
      
 16 
     | 
    
         
            +
            	&::after{
         
     | 
| 
      
 17 
     | 
    
         
            +
            		content:''; display:block; position:absolute; top:50%; margin-top:-$wh/2;
         
     | 
| 
      
 18 
     | 
    
         
            +
            		width:$wh; height:$wh;
         
     | 
| 
      
 19 
     | 
    
         
            +
            		border:1px $bc solid; border-width:$bw 0 0 $bw;
         
     | 
| 
      
 20 
     | 
    
         
            +
             
     | 
| 
      
 21 
     | 
    
         
            +
            		@if ($der == top){
         
     | 
| 
      
 22 
     | 
    
         
            +
            			@include transform(rotate(45deg));
         
     | 
| 
      
 23 
     | 
    
         
            +
            		}
         
     | 
| 
      
 24 
     | 
    
         
            +
            		@else if($der == right){
         
     | 
| 
      
 25 
     | 
    
         
            +
            			right:$posr; margin-top:$mrt;
         
     | 
| 
      
 26 
     | 
    
         
            +
            			@include transform(rotate(45deg+90));
         
     | 
| 
      
 27 
     | 
    
         
            +
            		}
         
     | 
| 
      
 28 
     | 
    
         
            +
            		@else if($der == bottom){
         
     | 
| 
      
 29 
     | 
    
         
            +
            			right:$posr; margin-top:$mrt;
         
     | 
| 
      
 30 
     | 
    
         
            +
            			@include transform(rotate(45deg+180));
         
     | 
| 
      
 31 
     | 
    
         
            +
            		}
         
     | 
| 
      
 32 
     | 
    
         
            +
            		@else if($der == left){
         
     | 
| 
      
 33 
     | 
    
         
            +
            			left:50%; margin-left:-$wh/2;
         
     | 
| 
      
 34 
     | 
    
         
            +
            			@include transform(rotate(45deg+-90));
         
     | 
| 
      
 35 
     | 
    
         
            +
            		}
         
     | 
| 
      
 36 
     | 
    
         
            +
            	}
         
     | 
| 
      
 37 
     | 
    
         
            +
            };
         
     | 
| 
      
 38 
     | 
    
         
            +
             
     | 
| 
      
 39 
     | 
    
         
            +
            /**
         
     | 
| 
      
 40 
     | 
    
         
            +
             * @param $name 自定义字体的名称
         
     | 
| 
      
 41 
     | 
    
         
            +
             * @param $path 算定义字体的路径
         
     | 
| 
      
 42 
     | 
    
         
            +
             */
         
     | 
| 
      
 43 
     | 
    
         
            +
            @mixin fn-font-face($name:'iconfont',$path:'../fonts/iconfont'){
         
     | 
| 
      
 44 
     | 
    
         
            +
            	@font-face {
         
     | 
| 
      
 45 
     | 
    
         
            +
            		font-family: $name;
         
     | 
| 
      
 46 
     | 
    
         
            +
            	    src: url($path+'.eot'); /* IE9 */
         
     | 
| 
      
 47 
     | 
    
         
            +
            	    src: url($path+'.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         
     | 
| 
      
 48 
     | 
    
         
            +
            	    url($path+'.woff') format('woff'), /* chrome、firefox */
         
     | 
| 
      
 49 
     | 
    
         
            +
            	    url($path+'.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */
         
     | 
| 
      
 50 
     | 
    
         
            +
            	    url($path+'.svg#rei') format('svg'); /* iOS 4.1- */
         
     | 
| 
      
 51 
     | 
    
         
            +
            	}
         
     | 
| 
      
 52 
     | 
    
         
            +
            }
         
     | 
| 
      
 53 
     | 
    
         
            +
             
     | 
| 
      
 54 
     | 
    
         
            +
            //old mixin
         
     | 
| 
      
 55 
     | 
    
         
            +
             
     | 
| 
      
 56 
     | 
    
         
            +
            @mixin in-top-panel{
         
     | 
| 
      
 57 
     | 
    
         
            +
            /**
         
     | 
| 
      
 58 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 59 
     | 
    
         
            +
             * ++ 页面顶部带返回功能的panel基本样式 STYLE
         
     | 
| 
      
 60 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 61 
     | 
    
         
            +
             */
         
     | 
| 
      
 62 
     | 
    
         
            +
            	#header{
         
     | 
| 
      
 63 
     | 
    
         
            +
            		.m-nav{
         
     | 
| 
      
 64 
     | 
    
         
            +
            			height:44*$px; display:-webkit-box; -webkit-box-align:center; background:#dedede;
         
     | 
| 
      
 65 
     | 
    
         
            +
            			& section{
         
     | 
| 
      
 66 
     | 
    
         
            +
            				&:nth-child(1){
         
     | 
| 
      
 67 
     | 
    
         
            +
            					min-width:44*$px;
         
     | 
| 
      
 68 
     | 
    
         
            +
            					.back{width:44*$px; height:44*$px; text-indent:-9999*$px; overflow:hidden;@include arrow($wh:8px,$bw:3px,$der:left);}
         
     | 
| 
      
 69 
     | 
    
         
            +
            					.back:active{background:rgba(0,0,0,.5);}
         
     | 
| 
      
 70 
     | 
    
         
            +
            				}
         
     | 
| 
      
 71 
     | 
    
         
            +
            				&:nth-child(2){
         
     | 
| 
      
 72 
     | 
    
         
            +
            					-webkit-box-flex:1; text-align:center;
         
     | 
| 
      
 73 
     | 
    
         
            +
            					span{display:block; padding:0 10*$px; font-size:18*$font-x; font-weight:bold; color:#333; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
         
     | 
| 
      
 74 
     | 
    
         
            +
            				}
         
     | 
| 
      
 75 
     | 
    
         
            +
            				&:nth-child(3){min-width:44*$px;}
         
     | 
| 
      
 76 
     | 
    
         
            +
            			}
         
     | 
| 
      
 77 
     | 
    
         
            +
            		}
         
     | 
| 
      
 78 
     | 
    
         
            +
            	}
         
     | 
| 
      
 79 
     | 
    
         
            +
            }
         
     | 
| 
      
 80 
     | 
    
         
            +
             
     | 
| 
      
 81 
     | 
    
         
            +
            @mixin in-bottom-panel(){
         
     | 
| 
      
 82 
     | 
    
         
            +
            /**
         
     | 
| 
      
 83 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 84 
     | 
    
         
            +
             * ++ 页面底部版权信息的panel基本样式 STYLE
         
     | 
| 
      
 85 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 86 
     | 
    
         
            +
             */
         
     | 
| 
      
 87 
     | 
    
         
            +
            	#footer{
         
     | 
| 
      
 88 
     | 
    
         
            +
            		.button .btn-top{width:70%;}
         
     | 
| 
      
 89 
     | 
    
         
            +
            		.copyright{text-align:center; font-size:12*$font-x; line-height:150%;}
         
     | 
| 
      
 90 
     | 
    
         
            +
            	}
         
     | 
| 
      
 91 
     | 
    
         
            +
            }
         
     | 
| 
      
 92 
     | 
    
         
            +
             
     | 
| 
      
 93 
     | 
    
         
            +
            @mixin in-tab(){
         
     | 
| 
      
 94 
     | 
    
         
            +
            /**
         
     | 
| 
      
 95 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 96 
     | 
    
         
            +
             * ++ TAB切换效果基本样式 STYLE
         
     | 
| 
      
 97 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 98 
     | 
    
         
            +
             */
         
     | 
| 
      
 99 
     | 
    
         
            +
            	#in-tab{
         
     | 
| 
      
 100 
     | 
    
         
            +
            		height:44*$px; font-size:$big-font-size;
         
     | 
| 
      
 101 
     | 
    
         
            +
            		ul li{display:inline-block; float:left; width:25%; overflow:hidden;}
         
     | 
| 
      
 102 
     | 
    
         
            +
            		ul li .tab-inner{text-align:center; height:44*$px; line-height:44*$px;}
         
     | 
| 
      
 103 
     | 
    
         
            +
            		ul li.selected .tab-inner{border-bottom-color:#FF7E00;}
         
     | 
| 
      
 104 
     | 
    
         
            +
            	}
         
     | 
| 
      
 105 
     | 
    
         
            +
            }
         
     | 
| 
      
 106 
     | 
    
         
            +
             
     | 
| 
      
 107 
     | 
    
         
            +
            @mixin in-slider($pic-normal-width:auto,$pic-normal-height:auto,$handle:0){
         
     | 
| 
      
 108 
     | 
    
         
            +
            /**
         
     | 
| 
      
 109 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 110 
     | 
    
         
            +
             * ++ 图片效果基本样式 STYLE
         
     | 
| 
      
 111 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 112 
     | 
    
         
            +
             */
         
     | 
| 
      
 113 
     | 
    
         
            +
            	.in-slider{
         
     | 
| 
      
 114 
     | 
    
         
            +
            		position:relative; width:$pic-normal-width; height:$pic-normal-height; margin:0 auto; overflow:hidden;
         
     | 
| 
      
 115 
     | 
    
         
            +
            		.in-slider-cont{
         
     | 
| 
      
 116 
     | 
    
         
            +
            			height:100%; position:relative; overflow:hidden;
         
     | 
| 
      
 117 
     | 
    
         
            +
            			ul{display:-webkit-box; -webkit-box-align:center;}
         
     | 
| 
      
 118 
     | 
    
         
            +
            			ul li{
         
     | 
| 
      
 119 
     | 
    
         
            +
            				overflow:hidden; width:$pic-normal-width; height:$pic-normal-height;
         
     | 
| 
      
 120 
     | 
    
         
            +
            			}
         
     | 
| 
      
 121 
     | 
    
         
            +
            			img{width:100%; height:auto;}
         
     | 
| 
      
 122 
     | 
    
         
            +
            		}
         
     | 
| 
      
 123 
     | 
    
         
            +
             
     | 
| 
      
 124 
     | 
    
         
            +
            		.in-slider-status{
         
     | 
| 
      
 125 
     | 
    
         
            +
            			position:absolute; bottom:0; width:100%; height:3px; background:rgba(51,51,51,0.5); display:-webkit-box;
         
     | 
| 
      
 126 
     | 
    
         
            +
            			span{display:block; -webkit-box-flex:1; height:100%; overflow:hidden;}
         
     | 
| 
      
 127 
     | 
    
         
            +
            			span.on{background:#FF7E00;}
         
     | 
| 
      
 128 
     | 
    
         
            +
            		}
         
     | 
| 
      
 129 
     | 
    
         
            +
             
     | 
| 
      
 130 
     | 
    
         
            +
            		/*.in-slider-prev,.in-slider-next{}
         
     | 
| 
      
 131 
     | 
    
         
            +
            		.in-slider-prev{}
         
     | 
| 
      
 132 
     | 
    
         
            +
            		.in-slider-next{}*/
         
     | 
| 
      
 133 
     | 
    
         
            +
            	}
         
     | 
| 
      
 134 
     | 
    
         
            +
            }
         
     | 
| 
      
 135 
     | 
    
         
            +
             
     | 
| 
      
 136 
     | 
    
         
            +
            @mixin in-form(){
         
     | 
| 
      
 137 
     | 
    
         
            +
            /**
         
     | 
| 
      
 138 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 139 
     | 
    
         
            +
             * ++ Form表单基本样式 STYLE
         
     | 
| 
      
 140 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 141 
     | 
    
         
            +
             */
         
     | 
| 
      
 142 
     | 
    
         
            +
            	.in-form{
         
     | 
| 
      
 143 
     | 
    
         
            +
            		margin:10*$px auto 0; width:80%; text-align:center; color:$text-form-color;
         
     | 
| 
      
 144 
     | 
    
         
            +
            		input[type="text"],input[type="password"],input[type="email"],input[type="tel"],input[type="number"],input[type="search"],select{
         
     | 
| 
      
 145 
     | 
    
         
            +
            			width:100%; height:40*$px; padding:0 10*$px;
         
     | 
| 
      
 146 
     | 
    
         
            +
            			-webkit-appearance:none; border:none; background:white; margin:0;
         
     | 
| 
      
 147 
     | 
    
         
            +
            			box-sizing:border-box; @include lg(top,#F4F4F4,#FFF);
         
     | 
| 
      
 148 
     | 
    
         
            +
            		}
         
     | 
| 
      
 149 
     | 
    
         
            +
             
     | 
| 
      
 150 
     | 
    
         
            +
            		& .form-field{
         
     | 
| 
      
 151 
     | 
    
         
            +
            			margin-bottom:10*$px;
         
     | 
| 
      
 152 
     | 
    
         
            +
            		}
         
     | 
| 
      
 153 
     | 
    
         
            +
             
     | 
| 
      
 154 
     | 
    
         
            +
            		& .form-input, & .form-select{
         
     | 
| 
      
 155 
     | 
    
         
            +
            			display:-webkit-box; -webkit-box-align:center;
         
     | 
| 
      
 156 
     | 
    
         
            +
            			section:nth-child(1){
         
     | 
| 
      
 157 
     | 
    
         
            +
            				min-width:60*$px;  text-align:right;
         
     | 
| 
      
 158 
     | 
    
         
            +
            			}
         
     | 
| 
      
 159 
     | 
    
         
            +
            			section:nth-child(2){
         
     | 
| 
      
 160 
     | 
    
         
            +
            				-webkit-box-flex:1;
         
     | 
| 
      
 161 
     | 
    
         
            +
            			}
         
     | 
| 
      
 162 
     | 
    
         
            +
            			input:focus{
         
     | 
| 
      
 163 
     | 
    
         
            +
            			background:#FFF;
         
     | 
| 
      
 164 
     | 
    
         
            +
            			}
         
     | 
| 
      
 165 
     | 
    
         
            +
            		}
         
     | 
| 
      
 166 
     | 
    
         
            +
             
     | 
| 
      
 167 
     | 
    
         
            +
            		& .form-text{
         
     | 
| 
      
 168 
     | 
    
         
            +
            			input{
         
     | 
| 
      
 169 
     | 
    
         
            +
            				border:1px solid #e3e3e3; border-top:none; width:100%; padding:0 5*$px;
         
     | 
| 
      
 170 
     | 
    
         
            +
            				@include border-radius(2px);
         
     | 
| 
      
 171 
     | 
    
         
            +
            				@include box-shadow(0 -1px 0 #e3e3e3 inset);
         
     | 
| 
      
 172 
     | 
    
         
            +
            				@include box-shadow(0 1px 0 #adadad inset);
         
     | 
| 
      
 173 
     | 
    
         
            +
             
     | 
| 
      
 174 
     | 
    
         
            +
            			}
         
     | 
| 
      
 175 
     | 
    
         
            +
            		}
         
     | 
| 
      
 176 
     | 
    
         
            +
             
     | 
| 
      
 177 
     | 
    
         
            +
            		& .form-radio{
         
     | 
| 
      
 178 
     | 
    
         
            +
            			input[type="radio"],input[type="radio"] + label{
         
     | 
| 
      
 179 
     | 
    
         
            +
            				float:left; line-height:1.5;
         
     | 
| 
      
 180 
     | 
    
         
            +
            			}
         
     | 
| 
      
 181 
     | 
    
         
            +
             
     | 
| 
      
 182 
     | 
    
         
            +
            			& span{
         
     | 
| 
      
 183 
     | 
    
         
            +
            				margin-right:10*$px; display:inline-block;
         
     | 
| 
      
 184 
     | 
    
         
            +
            			}
         
     | 
| 
      
 185 
     | 
    
         
            +
            		}
         
     | 
| 
      
 186 
     | 
    
         
            +
             
     | 
| 
      
 187 
     | 
    
         
            +
            		& .form-select{
         
     | 
| 
      
 188 
     | 
    
         
            +
            			section:nth-child(2){
         
     | 
| 
      
 189 
     | 
    
         
            +
            				@include arrow($wh:5px,$mrt:-4px,$bw:2px,$der:bottom);
         
     | 
| 
      
 190 
     | 
    
         
            +
            			}
         
     | 
| 
      
 191 
     | 
    
         
            +
            			select{
         
     | 
| 
      
 192 
     | 
    
         
            +
            				border:1px solid #e3e3e3; border-top:none; width:100%; padding:0 5*$px;
         
     | 
| 
      
 193 
     | 
    
         
            +
            				@include border-radius(2px);
         
     | 
| 
      
 194 
     | 
    
         
            +
            				@include box-shadow(0 -1px 0 #e3e3e3 inset);
         
     | 
| 
      
 195 
     | 
    
         
            +
            				@include box-shadow(0 1px 0 #adadad inset);
         
     | 
| 
      
 196 
     | 
    
         
            +
            			}
         
     | 
| 
      
 197 
     | 
    
         
            +
            		}
         
     | 
| 
      
 198 
     | 
    
         
            +
             
     | 
| 
      
 199 
     | 
    
         
            +
            	}
         
     | 
| 
      
 200 
     | 
    
         
            +
            }
         
     | 
| 
      
 201 
     | 
    
         
            +
             
     | 
| 
      
 202 
     | 
    
         
            +
            @mixin com-button(){
         
     | 
| 
      
 203 
     | 
    
         
            +
            /**
         
     | 
| 
      
 204 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 205 
     | 
    
         
            +
             * ++ 按钮基本样式 STYLE
         
     | 
| 
      
 206 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 207 
     | 
    
         
            +
             */
         
     | 
| 
      
 208 
     | 
    
         
            +
            	.com-btn{
         
     | 
| 
      
 209 
     | 
    
         
            +
            		display:inline-block; padding:8*$px 20*$px; border:1px #D4D5D6 solid; cursor:pointer;
         
     | 
| 
      
 210 
     | 
    
         
            +
            		text-align:center; vertical-align:middle; color:#646464;
         
     | 
| 
      
 211 
     | 
    
         
            +
            		@include border-radius(2px);
         
     | 
| 
      
 212 
     | 
    
         
            +
            		@include box-sizing(border-box);
         
     | 
| 
      
 213 
     | 
    
         
            +
            		@include text-shadow(0 -1px 0 $text-shadow-color);
         
     | 
| 
      
 214 
     | 
    
         
            +
            		@include lg(top,$standard-linear-l,$standard-linear-r);
         
     | 
| 
      
 215 
     | 
    
         
            +
            		&:active{@include lg(top,$standard-linear-r,$standard-linear-l);}
         
     | 
| 
      
 216 
     | 
    
         
            +
            	}
         
     | 
| 
      
 217 
     | 
    
         
            +
             
     | 
| 
      
 218 
     | 
    
         
            +
             
     | 
| 
      
 219 
     | 
    
         
            +
            	.button{
         
     | 
| 
      
 220 
     | 
    
         
            +
            		text-align:center; margin:10*$px 0;
         
     | 
| 
      
 221 
     | 
    
         
            +
            		.btn-gray{
         
     | 
| 
      
 222 
     | 
    
         
            +
            			@extend .com-btn;
         
     | 
| 
      
 223 
     | 
    
         
            +
            		}
         
     | 
| 
      
 224 
     | 
    
         
            +
             
     | 
| 
      
 225 
     | 
    
         
            +
            		.btn-top{
         
     | 
| 
      
 226 
     | 
    
         
            +
            			@extend .com-btn;
         
     | 
| 
      
 227 
     | 
    
         
            +
            		}
         
     | 
| 
      
 228 
     | 
    
         
            +
            	}
         
     | 
| 
      
 229 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,161 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "UTF-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            @mixin GIONEE_WEBSITE_REST($MODEL){
         
     | 
| 
      
 3 
     | 
    
         
            +
            	@if ($MODEL == REST_ENV_PX){
         
     | 
| 
      
 4 
     | 
    
         
            +
            		//完全采用Pixel方式
         
     | 
| 
      
 5 
     | 
    
         
            +
            		@include GIONEE_REST_ENV_PX();
         
     | 
| 
      
 6 
     | 
    
         
            +
            	}
         
     | 
| 
      
 7 
     | 
    
         
            +
            	@else if ($MODEL == REST_ENV_REM){
         
     | 
| 
      
 8 
     | 
    
         
            +
            		//完全采用REM等比缩放方式
         
     | 
| 
      
 9 
     | 
    
         
            +
            		@include GIONEE_REST_ENV_REM();
         
     | 
| 
      
 10 
     | 
    
         
            +
            	}
         
     | 
| 
      
 11 
     | 
    
         
            +
            	@else if ($MODEL == REST_ENV_PC){
         
     | 
| 
      
 12 
     | 
    
         
            +
            		//兼容PC端多浏览器模式下的全新方式
         
     | 
| 
      
 13 
     | 
    
         
            +
            		@include GIONEE_REST_ENV_PC();
         
     | 
| 
      
 14 
     | 
    
         
            +
            	}
         
     | 
| 
      
 15 
     | 
    
         
            +
            }
         
     | 
| 
      
 16 
     | 
    
         
            +
             
     | 
| 
      
 17 
     | 
    
         
            +
            @mixin GIONEE_REST_ENV_PX(){
         
     | 
| 
      
 18 
     | 
    
         
            +
            	body,div,p,form,input,h1,h2,h3,h4,h5,ul,ol,li,dl,dt,dd,table,tbody,tr,td,textarea,img,iframe,figure{margin:0; padding:0; list-style:none; vertical-align:middle;}
         
     | 
| 
      
 19 
     | 
    
         
            +
            	body{font-size:14px/1.5; font-family:"\5FAE\8F6F\96C5\9ED1",Helvetica,Arial; color:#000; -webkit-user-select:none; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 20 
     | 
    
         
            +
            	*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 21 
     | 
    
         
            +
            	img{border:0; -webkit-touch-callout:none;} a,*[onclick]{-webkit-tap-highlight-color:rgba(0,0,0,0); text-decoration:none; color:#000;}
         
     | 
| 
      
 22 
     | 
    
         
            +
             
     | 
| 
      
 23 
     | 
    
         
            +
            	.clearfix::after{visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
         
     | 
| 
      
 24 
     | 
    
         
            +
             
     | 
| 
      
 25 
     | 
    
         
            +
            	.no-flick{
         
     | 
| 
      
 26 
     | 
    
         
            +
            		//解决css3动画引起页面图片及文字抖动问题
         
     | 
| 
      
 27 
     | 
    
         
            +
            		-moz-backface-visibility: hidden; /* Firefox */
         
     | 
| 
      
 28 
     | 
    
         
            +
            		-webkit-backface-visibility:hidden; /* Chrome and Safari */
         
     | 
| 
      
 29 
     | 
    
         
            +
            		-webkit-transform-style:preserve-3d;
         
     | 
| 
      
 30 
     | 
    
         
            +
            		backface-visibility: hidden;
         
     | 
| 
      
 31 
     | 
    
         
            +
            	}
         
     | 
| 
      
 32 
     | 
    
         
            +
            }
         
     | 
| 
      
 33 
     | 
    
         
            +
             
     | 
| 
      
 34 
     | 
    
         
            +
            @mixin GIONEE_REST_ENV_REM(){
         
     | 
| 
      
 35 
     | 
    
         
            +
            	/*
         
     | 
| 
      
 36 
     | 
    
         
            +
            	 * 1rem=20px for 320px(中低端分辨率).
         
     | 
| 
      
 37 
     | 
    
         
            +
            	 * 1rem=22.5px for 360px(高端分辨率).
         
     | 
| 
      
 38 
     | 
    
         
            +
            	 */
         
     | 
| 
      
 39 
     | 
    
         
            +
            	html{font-size:20px; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 40 
     | 
    
         
            +
            	@media all and (min-width:359px){.uc-hack{font-size:22.5px;}}
         
     | 
| 
      
 41 
     | 
    
         
            +
            	@media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5){html{font-size:22.5px;}}
         
     | 
| 
      
 42 
     | 
    
         
            +
            	/* @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 43 
     | 
    
         
            +
            	@media all and (max-width:320px) and (-webkit-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}} */
         
     | 
| 
      
 44 
     | 
    
         
            +
            	body{font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53",Tahoma,Helvetica,Arial,sans-serif;}
         
     | 
| 
      
 45 
     | 
    
         
            +
             
     | 
| 
      
 46 
     | 
    
         
            +
            	html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dt,dd,ol,ul,li,
         
     | 
| 
      
 47 
     | 
    
         
            +
            	a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,
         
     | 
| 
      
 48 
     | 
    
         
            +
            	s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,
         
     | 
| 
      
 49 
     | 
    
         
            +
            	fieldset,form,label,legend,able,caption,tbody,tfoot,thead,tr,th,td,
         
     | 
| 
      
 50 
     | 
    
         
            +
            	article,aside,canvas,details,embed,figure,figcaption,footer,header,
         
     | 
| 
      
 51 
     | 
    
         
            +
            	hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0; padding:0; -webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 52 
     | 
    
         
            +
             
     | 
| 
      
 53 
     | 
    
         
            +
            	fieldset,img{border:none;}
         
     | 
| 
      
 54 
     | 
    
         
            +
            	img{width:100%; max-width:16rem; height:auto;}
         
     | 
| 
      
 55 
     | 
    
         
            +
            	a{text-decoration:none;}
         
     | 
| 
      
 56 
     | 
    
         
            +
            	a, a:active{color:#333;}
         
     | 
| 
      
 57 
     | 
    
         
            +
             
     | 
| 
      
 58 
     | 
    
         
            +
            	address,caption,cite,code,dfn,em,th,var{font-style:normal; font-weight:normal;}
         
     | 
| 
      
 59 
     | 
    
         
            +
            	ul,ol,dl,li,dt,dd{list-style:none;}
         
     | 
| 
      
 60 
     | 
    
         
            +
            	h1,h2,h3,h4,h5,h6{font-size:1rem; font-weight:normal;}
         
     | 
| 
      
 61 
     | 
    
         
            +
            	q:before,q:after{content:"";}
         
     | 
| 
      
 62 
     | 
    
         
            +
            	abbr,acronym{border:none; font-variant:normal;}
         
     | 
| 
      
 63 
     | 
    
         
            +
             
     | 
| 
      
 64 
     | 
    
         
            +
            	/* to preserve line-height and selector appearance */
         
     | 
| 
      
 65 
     | 
    
         
            +
            	sup{vertical-align:text-top;}
         
     | 
| 
      
 66 
     | 
    
         
            +
            	sub{vertical-align:text-bottom;}
         
     | 
| 
      
 67 
     | 
    
         
            +
             
     | 
| 
      
 68 
     | 
    
         
            +
            	a:focus, input, textarea{outline:none; border:0;}
         
     | 
| 
      
 69 
     | 
    
         
            +
            	input,button,textarea,select{font-family:inherit; font-size:inherit; font-weight:inherit; outline:none;}
         
     | 
| 
      
 70 
     | 
    
         
            +
            	img,input,button,select{vertical-align:middle;}
         
     | 
| 
      
 71 
     | 
    
         
            +
            	textarea{resize:none;}
         
     | 
| 
      
 72 
     | 
    
         
            +
             
     | 
| 
      
 73 
     | 
    
         
            +
            	/* fixed-width elements */
         
     | 
| 
      
 74 
     | 
    
         
            +
            	pre,code,kbd,samp,tt{font-family:"CourierNew",Courier,monospace;}
         
     | 
| 
      
 75 
     | 
    
         
            +
             
     | 
| 
      
 76 
     | 
    
         
            +
            	/* reset HTML5 elements */
         
     | 
| 
      
 77 
     | 
    
         
            +
            	mark{background:#ff0;}
         
     | 
| 
      
 78 
     | 
    
         
            +
             
     | 
| 
      
 79 
     | 
    
         
            +
            	/* the dead elements */
         
     | 
| 
      
 80 
     | 
    
         
            +
            	s,u{text-decoration:none;}
         
     | 
| 
      
 81 
     | 
    
         
            +
            	b{font-weight:normal;}
         
     | 
| 
      
 82 
     | 
    
         
            +
            	i{font-style:normal;}
         
     | 
| 
      
 83 
     | 
    
         
            +
             
     | 
| 
      
 84 
     | 
    
         
            +
            	/***********************************************
         
     | 
| 
      
 85 
     | 
    
         
            +
            	 * Common Class
         
     | 
| 
      
 86 
     | 
    
         
            +
            	 ***********************************************/
         
     | 
| 
      
 87 
     | 
    
         
            +
            	.hidden{display:none;}
         
     | 
| 
      
 88 
     | 
    
         
            +
            	.invisible{visibility:hidden;}
         
     | 
| 
      
 89 
     | 
    
         
            +
             
     | 
| 
      
 90 
     | 
    
         
            +
            	.floatleft{float:left !important;}
         
     | 
| 
      
 91 
     | 
    
         
            +
            	.floatright{float:right !important;}
         
     | 
| 
      
 92 
     | 
    
         
            +
             
     | 
| 
      
 93 
     | 
    
         
            +
            	.clearfix:after{content:"\0020"; display:block; height:0; clear:both;}
         
     | 
| 
      
 94 
     | 
    
         
            +
            	.clear{clear:both;}
         
     | 
| 
      
 95 
     | 
    
         
            +
            	.oz{overflow:hidden;}
         
     | 
| 
      
 96 
     | 
    
         
            +
            }
         
     | 
| 
      
 97 
     | 
    
         
            +
             
     | 
| 
      
 98 
     | 
    
         
            +
            @mixin GIONEE_REST_ENV_PC(){
         
     | 
| 
      
 99 
     | 
    
         
            +
            	//暂时放置 未优化时本地REST
         
     | 
| 
      
 100 
     | 
    
         
            +
            	/*CSS Reset*/
         
     | 
| 
      
 101 
     | 
    
         
            +
            	*{margin:0; padding:0;}
         
     | 
| 
      
 102 
     | 
    
         
            +
            	//*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 103 
     | 
    
         
            +
            	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,textarea,select,optgroup,option,fieldset,legend,p,blockquote,th,td{
         
     | 
| 
      
 104 
     | 
    
         
            +
            		-webkit-tap-highlight-color:rgba(0,0,0,0);
         
     | 
| 
      
 105 
     | 
    
         
            +
            	    -webkit-user-select: none;
         
     | 
| 
      
 106 
     | 
    
         
            +
            	    -webkit-touch-callout: none;
         
     | 
| 
      
 107 
     | 
    
         
            +
            	}
         
     | 
| 
      
 108 
     | 
    
         
            +
            	input,button,textarea,select,optgroup,option {
         
     | 
| 
      
 109 
     | 
    
         
            +
            	    font-family: inherit;
         
     | 
| 
      
 110 
     | 
    
         
            +
            	    font-size: inherit;
         
     | 
| 
      
 111 
     | 
    
         
            +
            	    font-style: inherit;
         
     | 
| 
      
 112 
     | 
    
         
            +
            	    font-weight: inherit;
         
     | 
| 
      
 113 
     | 
    
         
            +
            	    color: inherit;
         
     | 
| 
      
 114 
     | 
    
         
            +
            	}
         
     | 
| 
      
 115 
     | 
    
         
            +
            	article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {
         
     | 
| 
      
 116 
     | 
    
         
            +
            		display:block;-webkit-tap-highlight-color:rgba(0,0,0,0);
         
     | 
| 
      
 117 
     | 
    
         
            +
            	}
         
     | 
| 
      
 118 
     | 
    
         
            +
             
     | 
| 
      
 119 
     | 
    
         
            +
            	table{border-collapse: collapse;border-spacing: 0;}
         
     | 
| 
      
 120 
     | 
    
         
            +
            	h1,h2,h3,h4,h5,h6{font-size: 100%;}
         
     | 
| 
      
 121 
     | 
    
         
            +
            	ul,ol,li{list-style: none;}
         
     | 
| 
      
 122 
     | 
    
         
            +
            	em,i{font-style:normal;}
         
     | 
| 
      
 123 
     | 
    
         
            +
            	img{border:none;}
         
     | 
| 
      
 124 
     | 
    
         
            +
            	input,img{vertical-align:middle;}
         
     | 
| 
      
 125 
     | 
    
         
            +
            	a{text-decoration:none;}
         
     | 
| 
      
 126 
     | 
    
         
            +
             
     | 
| 
      
 127 
     | 
    
         
            +
            	//html{font-size:100%;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
         
     | 
| 
      
 128 
     | 
    
         
            +
             
     | 
| 
      
 129 
     | 
    
         
            +
            	/*
         
     | 
| 
      
 130 
     | 
    
         
            +
            	 * 1rem=20px for 320px(中低端分辨率).
         
     | 
| 
      
 131 
     | 
    
         
            +
            	 * 1rem=22.5px for 360px(高端分辨率).
         
     | 
| 
      
 132 
     | 
    
         
            +
            	 */
         
     | 
| 
      
 133 
     | 
    
         
            +
            	// html{font-size:20px; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 134 
     | 
    
         
            +
            	// @media all and (min-width:359px){.uc-hack{font-size:22.5px;}}
         
     | 
| 
      
 135 
     | 
    
         
            +
            	// @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5){html{font-size:22.5px;}}
         
     | 
| 
      
 136 
     | 
    
         
            +
            	// @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 137 
     | 
    
         
            +
            	// @media all and (max-width:320px) and (-webkit-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 138 
     | 
    
         
            +
            	//body{font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53","微软雅黑E软雅黑6F\96C5\9ED1",Helvetica;}
         
     | 
| 
      
 139 
     | 
    
         
            +
            	body{
         
     | 
| 
      
 140 
     | 
    
         
            +
            		font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53","微软雅黑E软雅黑6F\96C5\9ED1",Helvetica;
         
     | 
| 
      
 141 
     | 
    
         
            +
            		-webkit-user-select:none;
         
     | 
| 
      
 142 
     | 
    
         
            +
            		-webkit-text-size-adjust:none;
         
     | 
| 
      
 143 
     | 
    
         
            +
            	}
         
     | 
| 
      
 144 
     | 
    
         
            +
             
     | 
| 
      
 145 
     | 
    
         
            +
            	@media all and (min-width:360px){.uc-hack{font-size:15px;}}
         
     | 
| 
      
 146 
     | 
    
         
            +
            	@media all and (min-width:360px) and (-webkit-device-pixel-ratio:2){html{font-size:15px;}}
         
     | 
| 
      
 147 
     | 
    
         
            +
             
     | 
| 
      
 148 
     | 
    
         
            +
            	.none{display:none;}
         
     | 
| 
      
 149 
     | 
    
         
            +
            	.no-spacing{margin:0; padding:0;}
         
     | 
| 
      
 150 
     | 
    
         
            +
            	.margin-center{margin:0 auto; text-align:center;}
         
     | 
| 
      
 151 
     | 
    
         
            +
             
     | 
| 
      
 152 
     | 
    
         
            +
            	.clearfix::after {visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
         
     | 
| 
      
 153 
     | 
    
         
            +
             
     | 
| 
      
 154 
     | 
    
         
            +
            	.no-flick{
         
     | 
| 
      
 155 
     | 
    
         
            +
            		//解决css3动画引起页面图片及文字抖动问题
         
     | 
| 
      
 156 
     | 
    
         
            +
            		-moz-backface-visibility: hidden; /* Firefox */
         
     | 
| 
      
 157 
     | 
    
         
            +
            		-webkit-backface-visibility:hidden; /* Chrome and Safari */
         
     | 
| 
      
 158 
     | 
    
         
            +
            		-webkit-transform-style:preserve-3d;
         
     | 
| 
      
 159 
     | 
    
         
            +
            		backface-visibility: hidden;
         
     | 
| 
      
 160 
     | 
    
         
            +
            	}
         
     | 
| 
      
 161 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,58 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            .ui-form{
         
     | 
| 
      
 2 
     | 
    
         
            +
            	margin:10*$px auto 0; width:80%; text-align:center; color:$text-form-color;
         
     | 
| 
      
 3 
     | 
    
         
            +
            	input[type="text"],input[type="password"],input[type="email"],input[type="tel"],input[type="number"],input[type="search"],select{
         
     | 
| 
      
 4 
     | 
    
         
            +
            		width:100%; height:40*$px; padding:0 10*$px;
         
     | 
| 
      
 5 
     | 
    
         
            +
            		-webkit-appearance:none; border:none; background:white; margin:0;
         
     | 
| 
      
 6 
     | 
    
         
            +
            		box-sizing:border-box; @include lg(top,#F4F4F4,#FFF);
         
     | 
| 
      
 7 
     | 
    
         
            +
            	}
         
     | 
| 
      
 8 
     | 
    
         
            +
             
     | 
| 
      
 9 
     | 
    
         
            +
            	& .form-field{
         
     | 
| 
      
 10 
     | 
    
         
            +
            		margin-bottom:10*$px;
         
     | 
| 
      
 11 
     | 
    
         
            +
            	}
         
     | 
| 
      
 12 
     | 
    
         
            +
             
     | 
| 
      
 13 
     | 
    
         
            +
            	& .ui-form-input, & .ui-form-select{
         
     | 
| 
      
 14 
     | 
    
         
            +
            		display:-webkit-box; -webkit-box-align:center;
         
     | 
| 
      
 15 
     | 
    
         
            +
            		section:nth-child(1){
         
     | 
| 
      
 16 
     | 
    
         
            +
            			min-width:60*$px;  text-align:right;
         
     | 
| 
      
 17 
     | 
    
         
            +
            		}
         
     | 
| 
      
 18 
     | 
    
         
            +
            		section:nth-child(2){
         
     | 
| 
      
 19 
     | 
    
         
            +
            			-webkit-box-flex:1;
         
     | 
| 
      
 20 
     | 
    
         
            +
            		}
         
     | 
| 
      
 21 
     | 
    
         
            +
            		input:focus{
         
     | 
| 
      
 22 
     | 
    
         
            +
            		background:#FFF;
         
     | 
| 
      
 23 
     | 
    
         
            +
            		}
         
     | 
| 
      
 24 
     | 
    
         
            +
            	}
         
     | 
| 
      
 25 
     | 
    
         
            +
             
     | 
| 
      
 26 
     | 
    
         
            +
            	& .form-text{
         
     | 
| 
      
 27 
     | 
    
         
            +
            		input{
         
     | 
| 
      
 28 
     | 
    
         
            +
            			border:1px solid #e3e3e3; border-top:none; width:100%; padding:0 5*$px;
         
     | 
| 
      
 29 
     | 
    
         
            +
            			@include border-radius(2px);
         
     | 
| 
      
 30 
     | 
    
         
            +
            			@include box-shadow(0 -1px 0 #e3e3e3 inset);
         
     | 
| 
      
 31 
     | 
    
         
            +
            			@include box-shadow(0 1px 0 #adadad inset);
         
     | 
| 
      
 32 
     | 
    
         
            +
             
     | 
| 
      
 33 
     | 
    
         
            +
            		}
         
     | 
| 
      
 34 
     | 
    
         
            +
            	}
         
     | 
| 
      
 35 
     | 
    
         
            +
             
     | 
| 
      
 36 
     | 
    
         
            +
            	& .ui-form-radio{
         
     | 
| 
      
 37 
     | 
    
         
            +
            		input[type="radio"],input[type="radio"] + label{
         
     | 
| 
      
 38 
     | 
    
         
            +
            			float:left; line-height:1.5;
         
     | 
| 
      
 39 
     | 
    
         
            +
            		}
         
     | 
| 
      
 40 
     | 
    
         
            +
             
     | 
| 
      
 41 
     | 
    
         
            +
            		& span{
         
     | 
| 
      
 42 
     | 
    
         
            +
            			margin-right:10*$px; display:inline-block;
         
     | 
| 
      
 43 
     | 
    
         
            +
            		}
         
     | 
| 
      
 44 
     | 
    
         
            +
            	}
         
     | 
| 
      
 45 
     | 
    
         
            +
             
     | 
| 
      
 46 
     | 
    
         
            +
            	& .ui-form-select{
         
     | 
| 
      
 47 
     | 
    
         
            +
            		section:nth-child(2){
         
     | 
| 
      
 48 
     | 
    
         
            +
            			@include arrow($wh:5px,$mrt:-4px,$bw:2px,$der:bottom);
         
     | 
| 
      
 49 
     | 
    
         
            +
            		}
         
     | 
| 
      
 50 
     | 
    
         
            +
            		select{
         
     | 
| 
      
 51 
     | 
    
         
            +
            			border:1px solid #e3e3e3; border-top:none; width:100%; padding:0 5*$px;
         
     | 
| 
      
 52 
     | 
    
         
            +
            			@include border-radius(2px);
         
     | 
| 
      
 53 
     | 
    
         
            +
            			@include box-shadow(0 -1px 0 #e3e3e3 inset);
         
     | 
| 
      
 54 
     | 
    
         
            +
            			@include box-shadow(0 1px 0 #adadad inset);
         
     | 
| 
      
 55 
     | 
    
         
            +
            		}
         
     | 
| 
      
 56 
     | 
    
         
            +
            	}
         
     | 
| 
      
 57 
     | 
    
         
            +
             
     | 
| 
      
 58 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,13 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "UTF-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            /**
         
     | 
| 
      
 3 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 4 
     | 
    
         
            +
             * ++ 加载更多系列效果基本样式 STYLE
         
     | 
| 
      
 5 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
             
     | 
| 
      
 8 
     | 
    
         
            +
            .ui-refresh{
         
     | 
| 
      
 9 
     | 
    
         
            +
            	.ui-refresh-up, .ui-refresh-down{
         
     | 
| 
      
 10 
     | 
    
         
            +
            		padding:15px; background:#DEDEDE; text-shadow:0 1px 1px #FFF; text-align:center;
         
     | 
| 
      
 11 
     | 
    
         
            +
            	}
         
     | 
| 
      
 12 
     | 
    
         
            +
            }
         
     | 
| 
      
 13 
     | 
    
         
            +
             
     | 
| 
         @@ -0,0 +1,9 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            .ui-slider{width:320*$px; height:auto;}
         
     | 
| 
      
 2 
     | 
    
         
            +
            .ui-slider-pic > *{width:320*$px; height:auto;}
         
     | 
| 
      
 3 
     | 
    
         
            +
             
     | 
| 
      
 4 
     | 
    
         
            +
            .ui-slider-handle{
         
     | 
| 
      
 5 
     | 
    
         
            +
            	position:absolute; left:0; bottom:0; width:100%; height:3*$px; overflow:hidden;
         
     | 
| 
      
 6 
     | 
    
         
            +
            	background:rgba(51,51,51,0.5); display:-webkit-box;
         
     | 
| 
      
 7 
     | 
    
         
            +
            	span{display:block; -webkit-box-flex:1; height:100%;}
         
     | 
| 
      
 8 
     | 
    
         
            +
            	span.on{background:#FF7E00;}
         
     | 
| 
      
 9 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,84 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "UTF-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            /**
         
     | 
| 
      
 3 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 4 
     | 
    
         
            +
             * ++ 幻灯片效果基本样式 STYLE
         
     | 
| 
      
 5 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
             
     | 
| 
      
 8 
     | 
    
         
            +
            .ui-slider{
         
     | 
| 
      
 9 
     | 
    
         
            +
            	position:relative;
         
     | 
| 
      
 10 
     | 
    
         
            +
            	margin:0 auto;
         
     | 
| 
      
 11 
     | 
    
         
            +
            	overflow:hidden;
         
     | 
| 
      
 12 
     | 
    
         
            +
            }
         
     | 
| 
      
 13 
     | 
    
         
            +
             
     | 
| 
      
 14 
     | 
    
         
            +
            .ui-slider-wrap{
         
     | 
| 
      
 15 
     | 
    
         
            +
            	position:relative;
         
     | 
| 
      
 16 
     | 
    
         
            +
            	height:100%;
         
     | 
| 
      
 17 
     | 
    
         
            +
            	overflow:hidden;
         
     | 
| 
      
 18 
     | 
    
         
            +
            }
         
     | 
| 
      
 19 
     | 
    
         
            +
             
     | 
| 
      
 20 
     | 
    
         
            +
            .ui-slider-pic{
         
     | 
| 
      
 21 
     | 
    
         
            +
            	display:-webkit-box;
         
     | 
| 
      
 22 
     | 
    
         
            +
            	-webkit-box-align:center;
         
     | 
| 
      
 23 
     | 
    
         
            +
            }
         
     | 
| 
      
 24 
     | 
    
         
            +
             
     | 
| 
      
 25 
     | 
    
         
            +
            .ui-slider-pic > *{
         
     | 
| 
      
 26 
     | 
    
         
            +
             
     | 
| 
      
 27 
     | 
    
         
            +
            }
         
     | 
| 
      
 28 
     | 
    
         
            +
             
     | 
| 
      
 29 
     | 
    
         
            +
            .ui-slider-handle{
         
     | 
| 
      
 30 
     | 
    
         
            +
            	position:absolute;
         
     | 
| 
      
 31 
     | 
    
         
            +
            }
         
     | 
| 
      
 32 
     | 
    
         
            +
             
     | 
| 
      
 33 
     | 
    
         
            +
            //轮播图片
         
     | 
| 
      
 34 
     | 
    
         
            +
            .ui-slider{
         
     | 
| 
      
 35 
     | 
    
         
            +
            	padding:10*$px 0;
         
     | 
| 
      
 36 
     | 
    
         
            +
            	.ui-slider-wrap{width:320*$px; @extend .com-media-width; margin:0 auto; position:relative; overflow:hidden;}
         
     | 
| 
      
 37 
     | 
    
         
            +
            	.ui-slider-content{width:100%; height:100%; position:relative; overflow:hidden;}
         
     | 
| 
      
 38 
     | 
    
         
            +
            	.ui-slider-pic{
         
     | 
| 
      
 39 
     | 
    
         
            +
            		display:-webkit-box; -webkit-box-align:center; -webkit-box-pack:center;
         
     | 
| 
      
 40 
     | 
    
         
            +
            		li{
         
     | 
| 
      
 41 
     | 
    
         
            +
            			width:320*$px; @extend .com-media-width; overflow:hidden; position:relative;
         
     | 
| 
      
 42 
     | 
    
         
            +
            			img{width:320*$px; @extend .com-media-width; height:auto;}
         
     | 
| 
      
 43 
     | 
    
         
            +
            		}
         
     | 
| 
      
 44 
     | 
    
         
            +
            	}
         
     | 
| 
      
 45 
     | 
    
         
            +
             
     | 
| 
      
 46 
     | 
    
         
            +
            	.ui-slider-handle{
         
     | 
| 
      
 47 
     | 
    
         
            +
            		position:absolute; left:0; bottom:0; width:100%; height:3*$px; overflow:hidden;
         
     | 
| 
      
 48 
     | 
    
         
            +
            		background:rgba(51,51,51,0.5); display:-webkit-box;
         
     | 
| 
      
 49 
     | 
    
         
            +
            		span{display:block; -webkit-box-flex:1; height:100%;}
         
     | 
| 
      
 50 
     | 
    
         
            +
            		span.on{background:#FF7E00;}
         
     | 
| 
      
 51 
     | 
    
         
            +
            	}
         
     | 
| 
      
 52 
     | 
    
         
            +
            }
         
     | 
| 
      
 53 
     | 
    
         
            +
             
     | 
| 
      
 54 
     | 
    
         
            +
            //media query conponent
         
     | 
| 
      
 55 
     | 
    
         
            +
            @media all and (min-width:359px){.com-media-width{width:360*$px;}}
         
     | 
| 
      
 56 
     | 
    
         
            +
             
     | 
| 
      
 57 
     | 
    
         
            +
            /* <div class="module">
         
     | 
| 
      
 58 
     | 
    
         
            +
            	<div class="ui-slider showpic" id="J_full_slider" data-ajaxUrl="../api/data.json">
         
     | 
| 
      
 59 
     | 
    
         
            +
            		<!--<div class="ui-slider-wrap">
         
     | 
| 
      
 60 
     | 
    
         
            +
            			<div class="ui-slider-content">
         
     | 
| 
      
 61 
     | 
    
         
            +
            				<ul class="ui-slider-pic">
         
     | 
| 
      
 62 
     | 
    
         
            +
            					<li>
         
     | 
| 
      
 63 
     | 
    
         
            +
            						<a href="###"><img src="<?php echo $appPic;?>/news-slide-01.jpg" ></a>
         
     | 
| 
      
 64 
     | 
    
         
            +
            						<a href="###"><span>习近平欢迎阿巴斯到访</span></a>
         
     | 
| 
      
 65 
     | 
    
         
            +
            					</li>
         
     | 
| 
      
 66 
     | 
    
         
            +
            					<li>
         
     | 
| 
      
 67 
     | 
    
         
            +
            						<a href="###"><img src="<?php echo $appPic;?>/news-slide-01.jpg" ></a>
         
     | 
| 
      
 68 
     | 
    
         
            +
            						<a href="###"><span>习近平欢迎阿巴斯到访</span></a>
         
     | 
| 
      
 69 
     | 
    
         
            +
            					</li>
         
     | 
| 
      
 70 
     | 
    
         
            +
            					<li>
         
     | 
| 
      
 71 
     | 
    
         
            +
            						<a href="###"><img src="<?php echo $appPic;?>/news-slide-01.jpg" ></a>
         
     | 
| 
      
 72 
     | 
    
         
            +
            						<a href="###"><span>习近平欢迎阿巴斯到访</span></a>
         
     | 
| 
      
 73 
     | 
    
         
            +
            					</li>
         
     | 
| 
      
 74 
     | 
    
         
            +
            				</ul>
         
     | 
| 
      
 75 
     | 
    
         
            +
            			</div>
         
     | 
| 
      
 76 
     | 
    
         
            +
            			<div class="ui-slider-handle">
         
     | 
| 
      
 77 
     | 
    
         
            +
            				<?php for($i = 0; $i < 3; $i++): ?>
         
     | 
| 
      
 78 
     | 
    
         
            +
            				<span class="<?php if($i == 0) echo 'on';?>"></span>
         
     | 
| 
      
 79 
     | 
    
         
            +
            				<?php endfor; ?>
         
     | 
| 
      
 80 
     | 
    
         
            +
            			</div>
         
     | 
| 
      
 81 
     | 
    
         
            +
            		</div>-->
         
     | 
| 
      
 82 
     | 
    
         
            +
            	</div>
         
     | 
| 
      
 83 
     | 
    
         
            +
            </div> */
         
     | 
| 
      
 84 
     | 
    
         
            +
             
     | 
| 
         @@ -0,0 +1,13 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /**
         
     | 
| 
      
 2 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 3 
     | 
    
         
            +
             * ++ toolbar基本控制样式 STYLE
         
     | 
| 
      
 4 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 5 
     | 
    
         
            +
             */
         
     | 
| 
      
 6 
     | 
    
         
            +
            .ui-toolbar-wrap{height:40*$px; background:#dedede;}
         
     | 
| 
      
 7 
     | 
    
         
            +
             
     | 
| 
      
 8 
     | 
    
         
            +
            .ui-toolbar-backbtn{background:#F1F1F1; border:1px solid #CCC; border-width:1px 1px 1px 0; margin:5*$px 0 0 20*$px; padding:0 8*$px 0 6*$px; height:30*$px; line-height:29*$px;}
         
     | 
| 
      
 9 
     | 
    
         
            +
            .ui-toolbar-backbtn::before, .ui-toolbar-backbtn::after{content:""; position:absolute; left:-8*$px; top:-1*$px;  width:0; height:0; display:block; border:solid; border-width:15*$px 8*$px 15*$px 0;}
         
     | 
| 
      
 10 
     | 
    
         
            +
            .ui-toolbar-backbtn::before{border-color:transparent #ccc transparent transparent;}
         
     | 
| 
      
 11 
     | 
    
         
            +
            .ui-toolbar-backbtn::after{border-color:transparent #F1F1F1 transparent transparent; left:-7*$px;}
         
     | 
| 
      
 12 
     | 
    
         
            +
             
     | 
| 
      
 13 
     | 
    
         
            +
            .ui-toolbar-title{line-height:40*$px; text-align:center;}
         
     | 
| 
         @@ -0,0 +1,62 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /**
         
     | 
| 
      
 2 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 3 
     | 
    
         
            +
             * ++ toolbar基本样式 STYLE
         
     | 
| 
      
 4 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 5 
     | 
    
         
            +
             */
         
     | 
| 
      
 6 
     | 
    
         
            +
            .ui-toolbar {
         
     | 
| 
      
 7 
     | 
    
         
            +
                width:100%;
         
     | 
| 
      
 8 
     | 
    
         
            +
                z-index: 999
         
     | 
| 
      
 9 
     | 
    
         
            +
            }
         
     | 
| 
      
 10 
     | 
    
         
            +
             
     | 
| 
      
 11 
     | 
    
         
            +
            .ui-toolbar-wrap {
         
     | 
| 
      
 12 
     | 
    
         
            +
                position: relative;
         
     | 
| 
      
 13 
     | 
    
         
            +
            }
         
     | 
| 
      
 14 
     | 
    
         
            +
             
     | 
| 
      
 15 
     | 
    
         
            +
            .ui-toolbar-placeholder {
         
     | 
| 
      
 16 
     | 
    
         
            +
                margin: 0;
         
     | 
| 
      
 17 
     | 
    
         
            +
                padding: 0;
         
     | 
| 
      
 18 
     | 
    
         
            +
                border: 0;
         
     | 
| 
      
 19 
     | 
    
         
            +
                overflow: visible;
         
     | 
| 
      
 20 
     | 
    
         
            +
                position: relative;
         
     | 
| 
      
 21 
     | 
    
         
            +
            }
         
     | 
| 
      
 22 
     | 
    
         
            +
             
     | 
| 
      
 23 
     | 
    
         
            +
            .ui-toolbar-title {
         
     | 
| 
      
 24 
     | 
    
         
            +
                height: 100%;
         
     | 
| 
      
 25 
     | 
    
         
            +
            }
         
     | 
| 
      
 26 
     | 
    
         
            +
             
     | 
| 
      
 27 
     | 
    
         
            +
            .ui-toolbar-backbtn {
         
     | 
| 
      
 28 
     | 
    
         
            +
                display: block;
         
     | 
| 
      
 29 
     | 
    
         
            +
                position: relative;
         
     | 
| 
      
 30 
     | 
    
         
            +
                float: left;
         
     | 
| 
      
 31 
     | 
    
         
            +
                cursor: pointer;
         
     | 
| 
      
 32 
     | 
    
         
            +
                -webkit-box-sizing:border-box;
         
     | 
| 
      
 33 
     | 
    
         
            +
                box-sizing:border-box;
         
     | 
| 
      
 34 
     | 
    
         
            +
                -webkit-user-select: none;
         
     | 
| 
      
 35 
     | 
    
         
            +
                user-select: none;
         
     | 
| 
      
 36 
     | 
    
         
            +
            }
         
     | 
| 
      
 37 
     | 
    
         
            +
             
     | 
| 
      
 38 
     | 
    
         
            +
            .ui-toolbar-left, .ui-toolbar-right {
         
     | 
| 
      
 39 
     | 
    
         
            +
                position: absolute;
         
     | 
| 
      
 40 
     | 
    
         
            +
                top:0;
         
     | 
| 
      
 41 
     | 
    
         
            +
                height: 100%;
         
     | 
| 
      
 42 
     | 
    
         
            +
            }
         
     | 
| 
      
 43 
     | 
    
         
            +
             
     | 
| 
      
 44 
     | 
    
         
            +
            .ui-toolbar-left {
         
     | 
| 
      
 45 
     | 
    
         
            +
                left: 0;
         
     | 
| 
      
 46 
     | 
    
         
            +
            }
         
     | 
| 
      
 47 
     | 
    
         
            +
            .ui-toolbar-right {
         
     | 
| 
      
 48 
     | 
    
         
            +
                top:0;
         
     | 
| 
      
 49 
     | 
    
         
            +
                right:0;
         
     | 
| 
      
 50 
     | 
    
         
            +
            }
         
     | 
| 
      
 51 
     | 
    
         
            +
            .ui-toolbar-left > * {
         
     | 
| 
      
 52 
     | 
    
         
            +
                display: inline-block;
         
     | 
| 
      
 53 
     | 
    
         
            +
                float: left;
         
     | 
| 
      
 54 
     | 
    
         
            +
                margin-right:5px;
         
     | 
| 
      
 55 
     | 
    
         
            +
                text-align: center;
         
     | 
| 
      
 56 
     | 
    
         
            +
            }
         
     | 
| 
      
 57 
     | 
    
         
            +
            .ui-toolbar-right > * {
         
     | 
| 
      
 58 
     | 
    
         
            +
                display: inline-block;
         
     | 
| 
      
 59 
     | 
    
         
            +
                float: right;
         
     | 
| 
      
 60 
     | 
    
         
            +
                margin-right:10px;
         
     | 
| 
      
 61 
     | 
    
         
            +
                text-align: center;
         
     | 
| 
      
 62 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,54 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "UTF-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            /*only support webkit browser*/
         
     | 
| 
      
 3 
     | 
    
         
            +
            $experimental-support-for-mozilla:      false;
         
     | 
| 
      
 4 
     | 
    
         
            +
            $experimental-support-for-webkit:       true;
         
     | 
| 
      
 5 
     | 
    
         
            +
            $support-for-original-webkit-gradients: true;
         
     | 
| 
      
 6 
     | 
    
         
            +
            $experimental-support-for-opera:        false;
         
     | 
| 
      
 7 
     | 
    
         
            +
            $experimental-support-for-microsoft:    false;
         
     | 
| 
      
 8 
     | 
    
         
            +
            $experimental-support-for-khtml:        false;
         
     | 
| 
      
 9 
     | 
    
         
            +
             
     | 
| 
      
 10 
     | 
    
         
            +
            /*public vars*/
         
     | 
| 
      
 11 
     | 
    
         
            +
            $font-size: 1rem/15;
         
     | 
| 
      
 12 
     | 
    
         
            +
            $font-x: 1px;
         
     | 
| 
      
 13 
     | 
    
         
            +
            $font-xx: 1.5px;
         
     | 
| 
      
 14 
     | 
    
         
            +
            $font-xxx: 2px;
         
     | 
| 
      
 15 
     | 
    
         
            +
            $websize:480;
         
     | 
| 
      
 16 
     | 
    
         
            +
            $rem: 1rem/20;
         
     | 
| 
      
 17 
     | 
    
         
            +
            $px:1px;
         
     | 
| 
      
 18 
     | 
    
         
            +
             
     | 
| 
      
 19 
     | 
    
         
            +
             
     | 
| 
      
 20 
     | 
    
         
            +
            $border-color-gray: #b1b1b1;
         
     | 
| 
      
 21 
     | 
    
         
            +
             
     | 
| 
      
 22 
     | 
    
         
            +
            /*color vars*/
         
     | 
| 
      
 23 
     | 
    
         
            +
            $standard-bg-color:#FFF;
         
     | 
| 
      
 24 
     | 
    
         
            +
            $standard-main-color:#F40;
         
     | 
| 
      
 25 
     | 
    
         
            +
            $standard-sub-color1:#F60;
         
     | 
| 
      
 26 
     | 
    
         
            +
            $standard-sub-color2:#F90;
         
     | 
| 
      
 27 
     | 
    
         
            +
            $standard-linear-l:#F8F8F8;
         
     | 
| 
      
 28 
     | 
    
         
            +
            $standard-linear-r:#E6E6E6;
         
     | 
| 
      
 29 
     | 
    
         
            +
             
     | 
| 
      
 30 
     | 
    
         
            +
            /*text vars*/
         
     | 
| 
      
 31 
     | 
    
         
            +
            $text-main-color:#3a3a3a;
         
     | 
| 
      
 32 
     | 
    
         
            +
            $text-shadow-color:#fff;
         
     | 
| 
      
 33 
     | 
    
         
            +
            $text-form-color:#646464;
         
     | 
| 
      
 34 
     | 
    
         
            +
            $text-highlight-color:#F40;
         
     | 
| 
      
 35 
     | 
    
         
            +
            $text-sub-color:#666;
         
     | 
| 
      
 36 
     | 
    
         
            +
            $text-em-color:#D40000;
         
     | 
| 
      
 37 
     | 
    
         
            +
            $text-link-color:#3a3a3a;
         
     | 
| 
      
 38 
     | 
    
         
            +
            $title-font-size:24px;
         
     | 
| 
      
 39 
     | 
    
         
            +
            $tab-font-size:18px;
         
     | 
| 
      
 40 
     | 
    
         
            +
            $big-font-size:16px;
         
     | 
| 
      
 41 
     | 
    
         
            +
            $normal-font-size:14px;
         
     | 
| 
      
 42 
     | 
    
         
            +
            $small-font-size:12px;
         
     | 
| 
      
 43 
     | 
    
         
            +
             
     | 
| 
      
 44 
     | 
    
         
            +
            /*space vars*/
         
     | 
| 
      
 45 
     | 
    
         
            +
            $page-padding-width:10px;
         
     | 
| 
      
 46 
     | 
    
         
            +
            $list-margin-width:30px;
         
     | 
| 
      
 47 
     | 
    
         
            +
            $first-list-margin-width:20px;
         
     | 
| 
      
 48 
     | 
    
         
            +
            $list-item-margin-width:10px;
         
     | 
| 
      
 49 
     | 
    
         
            +
            $group-list-margin-width:20px;
         
     | 
| 
      
 50 
     | 
    
         
            +
             
     | 
| 
      
 51 
     | 
    
         
            +
            /*screen min-width, min-height*/
         
     | 
| 
      
 52 
     | 
    
         
            +
            $screen-min-width:320px;
         
     | 
| 
      
 53 
     | 
    
         
            +
            $screen-max-width:360px;
         
     | 
| 
      
 54 
     | 
    
         
            +
            $screen-min-height:480px;
         
     | 
| 
         @@ -0,0 +1,39 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "utf-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            /*
         
     | 
| 
      
 3 
     | 
    
         
            +
             * 1rem=20px for 320px(中低端分辨率).
         
     | 
| 
      
 4 
     | 
    
         
            +
             * 1rem=22.5px for 360px(高端分辨率).
         
     | 
| 
      
 5 
     | 
    
         
            +
             */
         
     | 
| 
      
 6 
     | 
    
         
            +
            html{font-size:20px; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 7 
     | 
    
         
            +
            @media all and (min-width:359px){.uc-hack{font-size:22.5px;}}
         
     | 
| 
      
 8 
     | 
    
         
            +
            @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5){html{font-size:22.5px;}}
         
     | 
| 
      
 9 
     | 
    
         
            +
            body,div,p,form,input,h1,h2,h3,h4,h5,ul,ol,li,dl,dt,dd,table,tbody,tr,td,textarea,img,iframe,figure{margin:0; padding:0; list-style:none; vertical-align:middle;}
         
     | 
| 
      
 10 
     | 
    
         
            +
            body{font-size:14px/1.5; font-family:"\5FAE\8F6F\96C5\9ED1",Helvetica,Arial; color:#000; -webkit-user-select:none; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 11 
     | 
    
         
            +
            *{-webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 12 
     | 
    
         
            +
            img{border:0; -webkit-touch-callout:none;} a,*[onclick]{-webkit-tap-highlight-color:rgba(0,0,0,0); text-decoration:none; color:#000;}
         
     | 
| 
      
 13 
     | 
    
         
            +
             
     | 
| 
      
 14 
     | 
    
         
            +
            /* 来自yahoo, 让标题都自定义, 适应多个系统应用 */
         
     | 
| 
      
 15 
     | 
    
         
            +
            h1,h2,h3,h4,h5,h6 {
         
     | 
| 
      
 16 
     | 
    
         
            +
                font-size:100%;
         
     | 
| 
      
 17 
     | 
    
         
            +
                font-weight:500;
         
     | 
| 
      
 18 
     | 
    
         
            +
            }
         
     | 
| 
      
 19 
     | 
    
         
            +
             
     | 
| 
      
 20 
     | 
    
         
            +
            .clearfix::after{visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
         
     | 
| 
      
 21 
     | 
    
         
            +
             
     | 
| 
      
 22 
     | 
    
         
            +
            .no-flick{
         
     | 
| 
      
 23 
     | 
    
         
            +
            	//解决css3动画引起页面图片及文字抖动问题
         
     | 
| 
      
 24 
     | 
    
         
            +
            	-moz-backface-visibility: hidden; /* Firefox */
         
     | 
| 
      
 25 
     | 
    
         
            +
            	-webkit-backface-visibility:hidden; /* Chrome and Safari */
         
     | 
| 
      
 26 
     | 
    
         
            +
            	-webkit-transform-style:preserve-3d;
         
     | 
| 
      
 27 
     | 
    
         
            +
            	backface-visibility: hidden;
         
     | 
| 
      
 28 
     | 
    
         
            +
            }
         
     | 
| 
      
 29 
     | 
    
         
            +
             
     | 
| 
      
 30 
     | 
    
         
            +
            /* 设置内联, 减少浮动带来的bug */
         
     | 
| 
      
 31 
     | 
    
         
            +
            .fn-left,.fn-right{
         
     | 
| 
      
 32 
     | 
    
         
            +
            	display:inline;
         
     | 
| 
      
 33 
     | 
    
         
            +
            }
         
     | 
| 
      
 34 
     | 
    
         
            +
            .fn-left{
         
     | 
| 
      
 35 
     | 
    
         
            +
            	float:left;
         
     | 
| 
      
 36 
     | 
    
         
            +
            }
         
     | 
| 
      
 37 
     | 
    
         
            +
            .fn-right{
         
     | 
| 
      
 38 
     | 
    
         
            +
            	float:right;
         
     | 
| 
      
 39 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,68 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "utf-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            /**
         
     | 
| 
      
 3 
     | 
    
         
            +
             * @Author valleykid(valleykid@163.com)
         
     | 
| 
      
 4 
     | 
    
         
            +
             * @Date 2013-01-16
         
     | 
| 
      
 5 
     | 
    
         
            +
             * @Description core.css based on YUI & compass, for the kinds of mobiles
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
             
     | 
| 
      
 8 
     | 
    
         
            +
            /*
         
     | 
| 
      
 9 
     | 
    
         
            +
             * 1rem=20px for 320px(中低端分辨率).
         
     | 
| 
      
 10 
     | 
    
         
            +
             * 1rem=22.5px for 360px(高端分辨率).
         
     | 
| 
      
 11 
     | 
    
         
            +
             */
         
     | 
| 
      
 12 
     | 
    
         
            +
            html{font-size:20px; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 13 
     | 
    
         
            +
            @media all and (min-width:359px){.uc-hack{font-size:22.5px;}}
         
     | 
| 
      
 14 
     | 
    
         
            +
            @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5){html{font-size:22.5px;}}
         
     | 
| 
      
 15 
     | 
    
         
            +
            /* @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 16 
     | 
    
         
            +
            @media all and (max-width:320px) and (-webkit-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}} */
         
     | 
| 
      
 17 
     | 
    
         
            +
            body{font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53",Tahoma,Helvetica,Arial,sans-serif;}
         
     | 
| 
      
 18 
     | 
    
         
            +
             
     | 
| 
      
 19 
     | 
    
         
            +
            html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dt,dd,ol,ul,li,
         
     | 
| 
      
 20 
     | 
    
         
            +
            a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,
         
     | 
| 
      
 21 
     | 
    
         
            +
            s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,
         
     | 
| 
      
 22 
     | 
    
         
            +
            fieldset,form,label,legend,able,caption,tbody,tfoot,thead,tr,th,td,
         
     | 
| 
      
 23 
     | 
    
         
            +
            article,aside,canvas,details,embed,figure,figcaption,footer,header,
         
     | 
| 
      
 24 
     | 
    
         
            +
            hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0; padding:0; -webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 25 
     | 
    
         
            +
             
     | 
| 
      
 26 
     | 
    
         
            +
            fieldset,img{border:none;}
         
     | 
| 
      
 27 
     | 
    
         
            +
            img{width:100%; max-width:16rem; height:auto;}
         
     | 
| 
      
 28 
     | 
    
         
            +
            a{text-decoration:none;}
         
     | 
| 
      
 29 
     | 
    
         
            +
            a, a:active{color:#333;}
         
     | 
| 
      
 30 
     | 
    
         
            +
             
     | 
| 
      
 31 
     | 
    
         
            +
            address,caption,cite,code,dfn,em,th,var{font-style:normal; font-weight:normal;}
         
     | 
| 
      
 32 
     | 
    
         
            +
            ul,ol,dl,li,dt,dd{list-style:none;}
         
     | 
| 
      
 33 
     | 
    
         
            +
            h1,h2,h3,h4,h5,h6{font-size:1rem; font-weight:normal;}
         
     | 
| 
      
 34 
     | 
    
         
            +
            q:before,q:after{content:"";}
         
     | 
| 
      
 35 
     | 
    
         
            +
            abbr,acronym{border:none; font-variant:normal;}
         
     | 
| 
      
 36 
     | 
    
         
            +
             
     | 
| 
      
 37 
     | 
    
         
            +
            /* to preserve line-height and selector appearance */
         
     | 
| 
      
 38 
     | 
    
         
            +
            sup{vertical-align:text-top;}
         
     | 
| 
      
 39 
     | 
    
         
            +
            sub{vertical-align:text-bottom;}
         
     | 
| 
      
 40 
     | 
    
         
            +
             
     | 
| 
      
 41 
     | 
    
         
            +
            a:focus, input, textarea{outline:none; border:0;}
         
     | 
| 
      
 42 
     | 
    
         
            +
            input,button,textarea,select{font-family:inherit; font-size:inherit; font-weight:inherit; outline:none;}
         
     | 
| 
      
 43 
     | 
    
         
            +
            img,input,button,select{vertical-align:middle;}
         
     | 
| 
      
 44 
     | 
    
         
            +
            textarea{resize:none;}
         
     | 
| 
      
 45 
     | 
    
         
            +
             
     | 
| 
      
 46 
     | 
    
         
            +
            /* fixed-width elements */
         
     | 
| 
      
 47 
     | 
    
         
            +
            pre,code,kbd,samp,tt{font-family:"CourierNew",Courier,monospace;}
         
     | 
| 
      
 48 
     | 
    
         
            +
             
     | 
| 
      
 49 
     | 
    
         
            +
            /* reset HTML5 elements */
         
     | 
| 
      
 50 
     | 
    
         
            +
            mark{background:#ff0;}
         
     | 
| 
      
 51 
     | 
    
         
            +
             
     | 
| 
      
 52 
     | 
    
         
            +
            /* the dead elements */
         
     | 
| 
      
 53 
     | 
    
         
            +
            s,u{text-decoration:none;}
         
     | 
| 
      
 54 
     | 
    
         
            +
            b{font-weight:normal;}
         
     | 
| 
      
 55 
     | 
    
         
            +
            i{font-style:normal;}
         
     | 
| 
      
 56 
     | 
    
         
            +
             
     | 
| 
      
 57 
     | 
    
         
            +
            /***********************************************
         
     | 
| 
      
 58 
     | 
    
         
            +
             * Common Class
         
     | 
| 
      
 59 
     | 
    
         
            +
             ***********************************************/
         
     | 
| 
      
 60 
     | 
    
         
            +
            .hidden{display:none;}
         
     | 
| 
      
 61 
     | 
    
         
            +
            .invisible{visibility:hidden;}
         
     | 
| 
      
 62 
     | 
    
         
            +
             
     | 
| 
      
 63 
     | 
    
         
            +
            .floatleft{float:left !important;}
         
     | 
| 
      
 64 
     | 
    
         
            +
            .floatright{float:right !important;}
         
     | 
| 
      
 65 
     | 
    
         
            +
             
     | 
| 
      
 66 
     | 
    
         
            +
            .clearfix:after{content:"\0020"; display:block; height:0; clear:both;}
         
     | 
| 
      
 67 
     | 
    
         
            +
            .clear{clear:both;}
         
     | 
| 
      
 68 
     | 
    
         
            +
            .oz{overflow:hidden;}
         
     | 
| 
         @@ -0,0 +1,162 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "UTF-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            // https://github.com/ericam
         
     | 
| 
      
 3 
     | 
    
         
            +
            @mixin GIONEE_WEBSITE_REST($MODEL){
         
     | 
| 
      
 4 
     | 
    
         
            +
            	@if ($MODEL == REST_ENV_PX){
         
     | 
| 
      
 5 
     | 
    
         
            +
            		//完全采用Pixel方式
         
     | 
| 
      
 6 
     | 
    
         
            +
            		@include GIONEE_REST_ENV_PX();
         
     | 
| 
      
 7 
     | 
    
         
            +
            	}
         
     | 
| 
      
 8 
     | 
    
         
            +
            	@else if ($MODEL == REST_ENV_REM){
         
     | 
| 
      
 9 
     | 
    
         
            +
            		//完全采用REM等比缩放方式
         
     | 
| 
      
 10 
     | 
    
         
            +
            		@include GIONEE_REST_ENV_REM();
         
     | 
| 
      
 11 
     | 
    
         
            +
            	}
         
     | 
| 
      
 12 
     | 
    
         
            +
            	@else if ($MODEL == REST_ENV_PC){
         
     | 
| 
      
 13 
     | 
    
         
            +
            		//兼容PC端多浏览器模式下的全新方式
         
     | 
| 
      
 14 
     | 
    
         
            +
            		@include GIONEE_REST_ENV_PC();
         
     | 
| 
      
 15 
     | 
    
         
            +
            	}
         
     | 
| 
      
 16 
     | 
    
         
            +
            }
         
     | 
| 
      
 17 
     | 
    
         
            +
             
     | 
| 
      
 18 
     | 
    
         
            +
            @mixin GIONEE_REST_ENV_PX(){
         
     | 
| 
      
 19 
     | 
    
         
            +
            	body,div,p,form,input,h1,h2,h3,h4,h5,ul,ol,li,dl,dt,dd,table,tbody,tr,td,textarea,img,iframe,figure{margin:0; padding:0; list-style:none; vertical-align:middle;}
         
     | 
| 
      
 20 
     | 
    
         
            +
            	body{font-size:14px/1.5; font-family:"\5FAE\8F6F\96C5\9ED1",Helvetica,Arial; color:#000; -webkit-user-select:none; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 21 
     | 
    
         
            +
            	*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 22 
     | 
    
         
            +
            	img{border:0; -webkit-touch-callout:none;} a,*[onclick]{-webkit-tap-highlight-color:rgba(0,0,0,0); text-decoration:none; color:#000;}
         
     | 
| 
      
 23 
     | 
    
         
            +
             
     | 
| 
      
 24 
     | 
    
         
            +
            	.clearfix::after{visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
         
     | 
| 
      
 25 
     | 
    
         
            +
             
     | 
| 
      
 26 
     | 
    
         
            +
            	.no-flick{
         
     | 
| 
      
 27 
     | 
    
         
            +
            		//解决css3动画引起页面图片及文字抖动问题
         
     | 
| 
      
 28 
     | 
    
         
            +
            		-moz-backface-visibility: hidden; /* Firefox */
         
     | 
| 
      
 29 
     | 
    
         
            +
            		-webkit-backface-visibility:hidden; /* Chrome and Safari */
         
     | 
| 
      
 30 
     | 
    
         
            +
            		-webkit-transform-style:preserve-3d;
         
     | 
| 
      
 31 
     | 
    
         
            +
            		backface-visibility: hidden;
         
     | 
| 
      
 32 
     | 
    
         
            +
            	}
         
     | 
| 
      
 33 
     | 
    
         
            +
            }
         
     | 
| 
      
 34 
     | 
    
         
            +
             
     | 
| 
      
 35 
     | 
    
         
            +
            @mixin GIONEE_REST_ENV_REM(){
         
     | 
| 
      
 36 
     | 
    
         
            +
            	/*
         
     | 
| 
      
 37 
     | 
    
         
            +
            	 * 1rem=20px for 320px(中低端分辨率).
         
     | 
| 
      
 38 
     | 
    
         
            +
            	 * 1rem=22.5px for 360px(高端分辨率).
         
     | 
| 
      
 39 
     | 
    
         
            +
            	 */
         
     | 
| 
      
 40 
     | 
    
         
            +
            	html{font-size:20px; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 41 
     | 
    
         
            +
            	@media all and (min-width:359px){.uc-hack{font-size:22.5px;}}
         
     | 
| 
      
 42 
     | 
    
         
            +
            	@media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5){html{font-size:22.5px;}}
         
     | 
| 
      
 43 
     | 
    
         
            +
            	/* @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 44 
     | 
    
         
            +
            	@media all and (max-width:320px) and (-webkit-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}} */
         
     | 
| 
      
 45 
     | 
    
         
            +
            	body{font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53",Tahoma,Helvetica,Arial,sans-serif;}
         
     | 
| 
      
 46 
     | 
    
         
            +
             
     | 
| 
      
 47 
     | 
    
         
            +
            	html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dt,dd,ol,ul,li,
         
     | 
| 
      
 48 
     | 
    
         
            +
            	a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,
         
     | 
| 
      
 49 
     | 
    
         
            +
            	s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,
         
     | 
| 
      
 50 
     | 
    
         
            +
            	fieldset,form,label,legend,able,caption,tbody,tfoot,thead,tr,th,td,
         
     | 
| 
      
 51 
     | 
    
         
            +
            	article,aside,canvas,details,embed,figure,figcaption,footer,header,
         
     | 
| 
      
 52 
     | 
    
         
            +
            	hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0; padding:0; -webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 53 
     | 
    
         
            +
             
     | 
| 
      
 54 
     | 
    
         
            +
            	fieldset,img{border:none;}
         
     | 
| 
      
 55 
     | 
    
         
            +
            	img{width:100%; max-width:16rem; height:auto;}
         
     | 
| 
      
 56 
     | 
    
         
            +
            	a{text-decoration:none;}
         
     | 
| 
      
 57 
     | 
    
         
            +
            	a, a:active{color:#333;}
         
     | 
| 
      
 58 
     | 
    
         
            +
             
     | 
| 
      
 59 
     | 
    
         
            +
            	address,caption,cite,code,dfn,em,th,var{font-style:normal; font-weight:normal;}
         
     | 
| 
      
 60 
     | 
    
         
            +
            	ul,ol,dl,li,dt,dd{list-style:none;}
         
     | 
| 
      
 61 
     | 
    
         
            +
            	h1,h2,h3,h4,h5,h6{font-size:1rem; font-weight:normal;}
         
     | 
| 
      
 62 
     | 
    
         
            +
            	q:before,q:after{content:"";}
         
     | 
| 
      
 63 
     | 
    
         
            +
            	abbr,acronym{border:none; font-variant:normal;}
         
     | 
| 
      
 64 
     | 
    
         
            +
             
     | 
| 
      
 65 
     | 
    
         
            +
            	/* to preserve line-height and selector appearance */
         
     | 
| 
      
 66 
     | 
    
         
            +
            	sup{vertical-align:text-top;}
         
     | 
| 
      
 67 
     | 
    
         
            +
            	sub{vertical-align:text-bottom;}
         
     | 
| 
      
 68 
     | 
    
         
            +
             
     | 
| 
      
 69 
     | 
    
         
            +
            	a:focus, input, textarea{outline:none; border:0;}
         
     | 
| 
      
 70 
     | 
    
         
            +
            	input,button,textarea,select{font-family:inherit; font-size:inherit; font-weight:inherit; outline:none;}
         
     | 
| 
      
 71 
     | 
    
         
            +
            	img,input,button,select{vertical-align:middle;}
         
     | 
| 
      
 72 
     | 
    
         
            +
            	textarea{resize:none;}
         
     | 
| 
      
 73 
     | 
    
         
            +
             
     | 
| 
      
 74 
     | 
    
         
            +
            	/* fixed-width elements */
         
     | 
| 
      
 75 
     | 
    
         
            +
            	pre,code,kbd,samp,tt{font-family:"CourierNew",Courier,monospace;}
         
     | 
| 
      
 76 
     | 
    
         
            +
             
     | 
| 
      
 77 
     | 
    
         
            +
            	/* reset HTML5 elements */
         
     | 
| 
      
 78 
     | 
    
         
            +
            	mark{background:#ff0;}
         
     | 
| 
      
 79 
     | 
    
         
            +
             
     | 
| 
      
 80 
     | 
    
         
            +
            	/* the dead elements */
         
     | 
| 
      
 81 
     | 
    
         
            +
            	s,u{text-decoration:none;}
         
     | 
| 
      
 82 
     | 
    
         
            +
            	b{font-weight:normal;}
         
     | 
| 
      
 83 
     | 
    
         
            +
            	i{font-style:normal;}
         
     | 
| 
      
 84 
     | 
    
         
            +
             
     | 
| 
      
 85 
     | 
    
         
            +
            	/***********************************************
         
     | 
| 
      
 86 
     | 
    
         
            +
            	 * Common Class
         
     | 
| 
      
 87 
     | 
    
         
            +
            	 ***********************************************/
         
     | 
| 
      
 88 
     | 
    
         
            +
            	.hidden{display:none;}
         
     | 
| 
      
 89 
     | 
    
         
            +
            	.invisible{visibility:hidden;}
         
     | 
| 
      
 90 
     | 
    
         
            +
             
     | 
| 
      
 91 
     | 
    
         
            +
            	.floatleft{float:left !important;}
         
     | 
| 
      
 92 
     | 
    
         
            +
            	.floatright{float:right !important;}
         
     | 
| 
      
 93 
     | 
    
         
            +
             
     | 
| 
      
 94 
     | 
    
         
            +
            	.clearfix:after{content:"\0020"; display:block; height:0; clear:both;}
         
     | 
| 
      
 95 
     | 
    
         
            +
            	.clear{clear:both;}
         
     | 
| 
      
 96 
     | 
    
         
            +
            	.oz{overflow:hidden;}
         
     | 
| 
      
 97 
     | 
    
         
            +
            }
         
     | 
| 
      
 98 
     | 
    
         
            +
             
     | 
| 
      
 99 
     | 
    
         
            +
            @mixin GIONEE_REST_ENV_PC(){
         
     | 
| 
      
 100 
     | 
    
         
            +
            	//暂时放置 未优化时本地REST
         
     | 
| 
      
 101 
     | 
    
         
            +
            	/*CSS Reset*/
         
     | 
| 
      
 102 
     | 
    
         
            +
            	*{margin:0; padding:0;}
         
     | 
| 
      
 103 
     | 
    
         
            +
            	//*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
         
     | 
| 
      
 104 
     | 
    
         
            +
            	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,textarea,select,optgroup,option,fieldset,legend,p,blockquote,th,td{
         
     | 
| 
      
 105 
     | 
    
         
            +
            		-webkit-tap-highlight-color:rgba(0,0,0,0);
         
     | 
| 
      
 106 
     | 
    
         
            +
            	    -webkit-user-select: none;
         
     | 
| 
      
 107 
     | 
    
         
            +
            	    -webkit-touch-callout: none;
         
     | 
| 
      
 108 
     | 
    
         
            +
            	}
         
     | 
| 
      
 109 
     | 
    
         
            +
            	input,button,textarea,select,optgroup,option {
         
     | 
| 
      
 110 
     | 
    
         
            +
            	    font-family: inherit;
         
     | 
| 
      
 111 
     | 
    
         
            +
            	    font-size: inherit;
         
     | 
| 
      
 112 
     | 
    
         
            +
            	    font-style: inherit;
         
     | 
| 
      
 113 
     | 
    
         
            +
            	    font-weight: inherit;
         
     | 
| 
      
 114 
     | 
    
         
            +
            	    color: inherit;
         
     | 
| 
      
 115 
     | 
    
         
            +
            	}
         
     | 
| 
      
 116 
     | 
    
         
            +
            	article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {
         
     | 
| 
      
 117 
     | 
    
         
            +
            		display:block;-webkit-tap-highlight-color:rgba(0,0,0,0);
         
     | 
| 
      
 118 
     | 
    
         
            +
            	}
         
     | 
| 
      
 119 
     | 
    
         
            +
             
     | 
| 
      
 120 
     | 
    
         
            +
            	table{border-collapse: collapse;border-spacing: 0;}
         
     | 
| 
      
 121 
     | 
    
         
            +
            	h1,h2,h3,h4,h5,h6{font-size: 100%;}
         
     | 
| 
      
 122 
     | 
    
         
            +
            	ul,ol,li{list-style: none;}
         
     | 
| 
      
 123 
     | 
    
         
            +
            	em,i{font-style:normal;}
         
     | 
| 
      
 124 
     | 
    
         
            +
            	img{border:none;}
         
     | 
| 
      
 125 
     | 
    
         
            +
            	input,img{vertical-align:middle;}
         
     | 
| 
      
 126 
     | 
    
         
            +
            	a{text-decoration:none;}
         
     | 
| 
      
 127 
     | 
    
         
            +
             
     | 
| 
      
 128 
     | 
    
         
            +
            	//html{font-size:100%;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
         
     | 
| 
      
 129 
     | 
    
         
            +
             
     | 
| 
      
 130 
     | 
    
         
            +
            	/*
         
     | 
| 
      
 131 
     | 
    
         
            +
            	 * 1rem=20px for 320px(中低端分辨率).
         
     | 
| 
      
 132 
     | 
    
         
            +
            	 * 1rem=22.5px for 360px(高端分辨率).
         
     | 
| 
      
 133 
     | 
    
         
            +
            	 */
         
     | 
| 
      
 134 
     | 
    
         
            +
            	// html{font-size:20px; -webkit-text-size-adjust:none;}
         
     | 
| 
      
 135 
     | 
    
         
            +
            	// @media all and (min-width:359px){.uc-hack{font-size:22.5px;}}
         
     | 
| 
      
 136 
     | 
    
         
            +
            	// @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5){html{font-size:22.5px;}}
         
     | 
| 
      
 137 
     | 
    
         
            +
            	// @media all and (min-width:359px) and (-webkit-min-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 138 
     | 
    
         
            +
            	// @media all and (max-width:320px) and (-webkit-device-pixel-ratio:1.5) and (orientation:landscape){html{font-size:14px;}}
         
     | 
| 
      
 139 
     | 
    
         
            +
            	//body{font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53","微软雅黑E软雅黑6F\96C5\9ED1",Helvetica;}
         
     | 
| 
      
 140 
     | 
    
         
            +
            	body{
         
     | 
| 
      
 141 
     | 
    
         
            +
            		font:1rem/1 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53","微软雅黑E软雅黑6F\96C5\9ED1",Helvetica;
         
     | 
| 
      
 142 
     | 
    
         
            +
            		-webkit-user-select:none;
         
     | 
| 
      
 143 
     | 
    
         
            +
            		-webkit-text-size-adjust:none;
         
     | 
| 
      
 144 
     | 
    
         
            +
            	}
         
     | 
| 
      
 145 
     | 
    
         
            +
             
     | 
| 
      
 146 
     | 
    
         
            +
            	@media all and (min-width:360px){.uc-hack{font-size:15px;}}
         
     | 
| 
      
 147 
     | 
    
         
            +
            	@media all and (min-width:360px) and (-webkit-device-pixel-ratio:2){html{font-size:15px;}}
         
     | 
| 
      
 148 
     | 
    
         
            +
             
     | 
| 
      
 149 
     | 
    
         
            +
            	.none{display:none;}
         
     | 
| 
      
 150 
     | 
    
         
            +
            	.no-spacing{margin:0; padding:0;}
         
     | 
| 
      
 151 
     | 
    
         
            +
            	.margin-center{margin:0 auto; text-align:center;}
         
     | 
| 
      
 152 
     | 
    
         
            +
             
     | 
| 
      
 153 
     | 
    
         
            +
            	.clearfix::after {visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
         
     | 
| 
      
 154 
     | 
    
         
            +
             
     | 
| 
      
 155 
     | 
    
         
            +
            	.no-flick{
         
     | 
| 
      
 156 
     | 
    
         
            +
            		//解决css3动画引起页面图片及文字抖动问题
         
     | 
| 
      
 157 
     | 
    
         
            +
            		-moz-backface-visibility: hidden; /* Firefox */
         
     | 
| 
      
 158 
     | 
    
         
            +
            		-webkit-backface-visibility:hidden; /* Chrome and Safari */
         
     | 
| 
      
 159 
     | 
    
         
            +
            		-webkit-transform-style:preserve-3d;
         
     | 
| 
      
 160 
     | 
    
         
            +
            		backface-visibility: hidden;
         
     | 
| 
      
 161 
     | 
    
         
            +
            	}
         
     | 
| 
      
 162 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,23 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "utf-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            /**
         
     | 
| 
      
 3 
     | 
    
         
            +
             * --------------------------------------------------------------------------
         
     | 
| 
      
 4 
     | 
    
         
            +
             * ++ 按钮基本样式 STYLE
         
     | 
| 
      
 5 
     | 
    
         
            +
             * 
         
     | 
| 
      
 6 
     | 
    
         
            +
             * -------------------------------------------------------------------------
         
     | 
| 
      
 7 
     | 
    
         
            +
             */
         
     | 
| 
      
 8 
     | 
    
         
            +
             
     | 
| 
      
 9 
     | 
    
         
            +
            .ui-button{
         
     | 
| 
      
 10 
     | 
    
         
            +
            	display:inline-block; border:1px solid #D2D2D2; padding:3*$px 4*$px;
         
     | 
| 
      
 11 
     | 
    
         
            +
            	color:#333; font-size:14*$font-x;
         
     | 
| 
      
 12 
     | 
    
         
            +
            	@include border-radius(2*$px);
         
     | 
| 
      
 13 
     | 
    
         
            +
            }
         
     | 
| 
      
 14 
     | 
    
         
            +
             
     | 
| 
      
 15 
     | 
    
         
            +
            .ui-button-mwhite{
         
     | 
| 
      
 16 
     | 
    
         
            +
            	display:inline-block; padding:8*$px 20*$px; border:1px #D4D5D6 solid; cursor:pointer;
         
     | 
| 
      
 17 
     | 
    
         
            +
            	text-align:center; vertical-align:middle; color:#646464;
         
     | 
| 
      
 18 
     | 
    
         
            +
            	@include border-radius(2px);
         
     | 
| 
      
 19 
     | 
    
         
            +
            	@include box-sizing(border-box);
         
     | 
| 
      
 20 
     | 
    
         
            +
            	@include text-shadow(0 -1px 0 $text-shadow-color);
         
     | 
| 
      
 21 
     | 
    
         
            +
            	@include lg(top,$standard-linear-l,$standard-linear-r);
         
     | 
| 
      
 22 
     | 
    
         
            +
            	&:active{@include lg(top,$standard-linear-r,$standard-linear-l);}
         
     | 
| 
      
 23 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,44 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            @charset "utf-8";
         
     | 
| 
      
 2 
     | 
    
         
            +
            .com-ui-form-input{
         
     | 
| 
      
 3 
     | 
    
         
            +
            	border:1px solid #e3e3e3; border-top:none; width:100%; padding:0 5*$px;
         
     | 
| 
      
 4 
     | 
    
         
            +
            	@include border-radius(2px);
         
     | 
| 
      
 5 
     | 
    
         
            +
            	@include box-shadow(0 -1px 0 #e3e3e3 inset);
         
     | 
| 
      
 6 
     | 
    
         
            +
            	@include box-shadow(0 1px 0 #adadad inset);
         
     | 
| 
      
 7 
     | 
    
         
            +
            }
         
     | 
| 
      
 8 
     | 
    
         
            +
             
     | 
| 
      
 9 
     | 
    
         
            +
            .ui-form{
         
     | 
| 
      
 10 
     | 
    
         
            +
            	margin:10*$px auto 0; max-width:80%; text-align:center; color:$text-form-color;
         
     | 
| 
      
 11 
     | 
    
         
            +
            	.ui-form-item{display:-webkit-box; -webkit-box-align:center; margin-bottom:10px;}
         
     | 
| 
      
 12 
     | 
    
         
            +
            	.ui-form-item > *{display:block;}
         
     | 
| 
      
 13 
     | 
    
         
            +
            	.ui-form-item .ui-label{min-width:60*$px;  text-align:right; vertical-align:middle;}
         
     | 
| 
      
 14 
     | 
    
         
            +
            	.ui-form-item .ui-input{
         
     | 
| 
      
 15 
     | 
    
         
            +
            		-webkit-box-flex:1; 
         
     | 
| 
      
 16 
     | 
    
         
            +
            		@extend .com-ui-form-input;
         
     | 
| 
      
 17 
     | 
    
         
            +
            	}
         
     | 
| 
      
 18 
     | 
    
         
            +
            	.ui-form-item .ui-select{
         
     | 
| 
      
 19 
     | 
    
         
            +
            		-webkit-box-flex:1; width:100%; position:relative; @include arrow($wh:5px,$mrt:-4px,$bw:2px,$der:bottom);
         
     | 
| 
      
 20 
     | 
    
         
            +
            		select{
         
     | 
| 
      
 21 
     | 
    
         
            +
            			@extend .com-ui-form-input;
         
     | 
| 
      
 22 
     | 
    
         
            +
            		}
         
     | 
| 
      
 23 
     | 
    
         
            +
            	}
         
     | 
| 
      
 24 
     | 
    
         
            +
            	.ui-form-item .ui-textarea{
         
     | 
| 
      
 25 
     | 
    
         
            +
            		-webkit-box-flex:1; height:auto; padding:10px 5px; resize:none; //禁用ff、chrome、safari下textarea缩放功能
         
     | 
| 
      
 26 
     | 
    
         
            +
            		@extend .com-ui-form-input;
         
     | 
| 
      
 27 
     | 
    
         
            +
            	}
         
     | 
| 
      
 28 
     | 
    
         
            +
            	//验证码的样式设置
         
     | 
| 
      
 29 
     | 
    
         
            +
            	.ui-form-item-check{
         
     | 
| 
      
 30 
     | 
    
         
            +
            		a{color:#08c; font-size:12px;}
         
     | 
| 
      
 31 
     | 
    
         
            +
            		img{margin:0 10px;}
         
     | 
| 
      
 32 
     | 
    
         
            +
            	}
         
     | 
| 
      
 33 
     | 
    
         
            +
            	//禁用文本框
         
     | 
| 
      
 34 
     | 
    
         
            +
            	.ui-input-disable{
         
     | 
| 
      
 35 
     | 
    
         
            +
            		border:1px solid #ccc;
         
     | 
| 
      
 36 
     | 
    
         
            +
            		background:#f2f2f2;
         
     | 
| 
      
 37 
     | 
    
         
            +
            	}
         
     | 
| 
      
 38 
     | 
    
         
            +
             
     | 
| 
      
 39 
     | 
    
         
            +
            	input,select,textarea{
         
     | 
| 
      
 40 
     | 
    
         
            +
            		min-height:40*$px; padding:0 10*$px;
         
     | 
| 
      
 41 
     | 
    
         
            +
            		-webkit-appearance:none;
         
     | 
| 
      
 42 
     | 
    
         
            +
            		box-sizing:border-box; @include lg(top,#F4F4F4,#FFF);
         
     | 
| 
      
 43 
     | 
    
         
            +
            	}
         
     | 
| 
      
 44 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,18 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            # Make sure you list all the project template files here in the manifest.
         
     | 
| 
      
 2 
     | 
    
         
            +
            stylesheet '_seeui.scss', :media => 'screen, projection'
         
     | 
| 
      
 3 
     | 
    
         
            +
            #html 'lightbox.html'
         
     | 
| 
      
 4 
     | 
    
         
            +
            #javascript 'lightbox.js'
         
     | 
| 
      
 5 
     | 
    
         
            +
             
     | 
| 
      
 6 
     | 
    
         
            +
            #description "css-only lightboxes with optional javascript bootstrapping."
         
     | 
| 
      
 7 
     | 
    
         
            +
             
     | 
| 
      
 8 
     | 
    
         
            +
            #help %Q{
         
     | 
| 
      
 9 
     | 
    
         
            +
            #Installs some html, a stylesheet partial, and javascript bootstrapping that 
         
     | 
| 
      
 10 
     | 
    
         
            +
            #you can use directly or refer to as an example.
         
     | 
| 
      
 11 
     | 
    
         
            +
            #}
         
     | 
| 
      
 12 
     | 
    
         
            +
             
     | 
| 
      
 13 
     | 
    
         
            +
            #welcome_message %Q{
         
     | 
| 
      
 14 
     | 
    
         
            +
            #Please refer to the lightbox.html file to see how the markup should be 
         
     | 
| 
      
 15 
     | 
    
         
            +
            #structured, the lightbox stylesheet partial to see how to use the library and 
         
     | 
| 
      
 16 
     | 
    
         
            +
            #apply it to your markup, and the lightbox.js script to see how 
         
     | 
| 
      
 17 
     | 
    
         
            +
            #bootstrapping works.
         
     | 
| 
      
 18 
     | 
    
         
            +
            #}
         
     | 
    
        metadata
    ADDED
    
    | 
         @@ -0,0 +1,77 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            --- !ruby/object:Gem::Specification
         
     | 
| 
      
 2 
     | 
    
         
            +
            name: lookitui
         
     | 
| 
      
 3 
     | 
    
         
            +
            version: !ruby/object:Gem::Version
         
     | 
| 
      
 4 
     | 
    
         
            +
              version: 0.1.1.beta
         
     | 
| 
      
 5 
     | 
    
         
            +
            platform: ruby
         
     | 
| 
      
 6 
     | 
    
         
            +
            authors:
         
     | 
| 
      
 7 
     | 
    
         
            +
            - Hankewins
         
     | 
| 
      
 8 
     | 
    
         
            +
            autorequire: 
         
     | 
| 
      
 9 
     | 
    
         
            +
            bindir: bin
         
     | 
| 
      
 10 
     | 
    
         
            +
            cert_chain: []
         
     | 
| 
      
 11 
     | 
    
         
            +
            date: 2013-04-13 00:00:00.000000000 Z
         
     | 
| 
      
 12 
     | 
    
         
            +
            dependencies:
         
     | 
| 
      
 13 
     | 
    
         
            +
            - !ruby/object:Gem::Dependency
         
     | 
| 
      
 14 
     | 
    
         
            +
              name: compass
         
     | 
| 
      
 15 
     | 
    
         
            +
              requirement: !ruby/object:Gem::Requirement
         
     | 
| 
      
 16 
     | 
    
         
            +
                requirements:
         
     | 
| 
      
 17 
     | 
    
         
            +
                - - ! '>='
         
     | 
| 
      
 18 
     | 
    
         
            +
                  - !ruby/object:Gem::Version
         
     | 
| 
      
 19 
     | 
    
         
            +
                    version: '0.11'
         
     | 
| 
      
 20 
     | 
    
         
            +
              type: :runtime
         
     | 
| 
      
 21 
     | 
    
         
            +
              prerelease: false
         
     | 
| 
      
 22 
     | 
    
         
            +
              version_requirements: !ruby/object:Gem::Requirement
         
     | 
| 
      
 23 
     | 
    
         
            +
                requirements:
         
     | 
| 
      
 24 
     | 
    
         
            +
                - - ! '>='
         
     | 
| 
      
 25 
     | 
    
         
            +
                  - !ruby/object:Gem::Version
         
     | 
| 
      
 26 
     | 
    
         
            +
                    version: '0.11'
         
     | 
| 
      
 27 
     | 
    
         
            +
            description: a mobile library lookit UI implementation for compass
         
     | 
| 
      
 28 
     | 
    
         
            +
            email: hankewins@gmail.com
         
     | 
| 
      
 29 
     | 
    
         
            +
            executables: []
         
     | 
| 
      
 30 
     | 
    
         
            +
            extensions: []
         
     | 
| 
      
 31 
     | 
    
         
            +
            extra_rdoc_files: []
         
     | 
| 
      
 32 
     | 
    
         
            +
            files:
         
     | 
| 
      
 33 
     | 
    
         
            +
            - README.mkdn
         
     | 
| 
      
 34 
     | 
    
         
            +
            - lib/seeui.rb
         
     | 
| 
      
 35 
     | 
    
         
            +
            - stylesheets/lookitui/base/1.0/base.scss
         
     | 
| 
      
 36 
     | 
    
         
            +
            - stylesheets/lookitui/base/1.0/phone.scss
         
     | 
| 
      
 37 
     | 
    
         
            +
            - stylesheets/lookitui/base/1.0/reset.scss
         
     | 
| 
      
 38 
     | 
    
         
            +
            - stylesheets/lookitui/button/1.0/button.scss
         
     | 
| 
      
 39 
     | 
    
         
            +
            - stylesheets/lookitui/form/1.0/form.scss
         
     | 
| 
      
 40 
     | 
    
         
            +
            - stylesheets/lookitui/_button.scss
         
     | 
| 
      
 41 
     | 
    
         
            +
            - stylesheets/lookitui/_form.scss
         
     | 
| 
      
 42 
     | 
    
         
            +
            - stylesheets/lookitui/_func.scss
         
     | 
| 
      
 43 
     | 
    
         
            +
            - stylesheets/lookitui/_reset.scss
         
     | 
| 
      
 44 
     | 
    
         
            +
            - stylesheets/lookitui/_ui-form.scss
         
     | 
| 
      
 45 
     | 
    
         
            +
            - stylesheets/lookitui/_ui-refresh.scss
         
     | 
| 
      
 46 
     | 
    
         
            +
            - stylesheets/lookitui/_ui-slider.gionee.scss
         
     | 
| 
      
 47 
     | 
    
         
            +
            - stylesheets/lookitui/_ui-slider.scss
         
     | 
| 
      
 48 
     | 
    
         
            +
            - stylesheets/lookitui/_ui-toolbar.gionee.scss
         
     | 
| 
      
 49 
     | 
    
         
            +
            - stylesheets/lookitui/_ui-toolbar.scss
         
     | 
| 
      
 50 
     | 
    
         
            +
            - stylesheets/lookitui/_vars.scss
         
     | 
| 
      
 51 
     | 
    
         
            +
            - stylesheets/_lookitui.scss
         
     | 
| 
      
 52 
     | 
    
         
            +
            - templates/project/manifest.rb
         
     | 
| 
      
 53 
     | 
    
         
            +
            - templates/project/_seeui.scss
         
     | 
| 
      
 54 
     | 
    
         
            +
            homepage: http://www.hankewins.com/
         
     | 
| 
      
 55 
     | 
    
         
            +
            licenses: []
         
     | 
| 
      
 56 
     | 
    
         
            +
            metadata: {}
         
     | 
| 
      
 57 
     | 
    
         
            +
            post_install_message: 
         
     | 
| 
      
 58 
     | 
    
         
            +
            rdoc_options: []
         
     | 
| 
      
 59 
     | 
    
         
            +
            require_paths:
         
     | 
| 
      
 60 
     | 
    
         
            +
            - lib
         
     | 
| 
      
 61 
     | 
    
         
            +
            required_ruby_version: !ruby/object:Gem::Requirement
         
     | 
| 
      
 62 
     | 
    
         
            +
              requirements:
         
     | 
| 
      
 63 
     | 
    
         
            +
              - - ! '>='
         
     | 
| 
      
 64 
     | 
    
         
            +
                - !ruby/object:Gem::Version
         
     | 
| 
      
 65 
     | 
    
         
            +
                  version: '0'
         
     | 
| 
      
 66 
     | 
    
         
            +
            required_rubygems_version: !ruby/object:Gem::Requirement
         
     | 
| 
      
 67 
     | 
    
         
            +
              requirements:
         
     | 
| 
      
 68 
     | 
    
         
            +
              - - ! '>'
         
     | 
| 
      
 69 
     | 
    
         
            +
                - !ruby/object:Gem::Version
         
     | 
| 
      
 70 
     | 
    
         
            +
                  version: 1.3.1
         
     | 
| 
      
 71 
     | 
    
         
            +
            requirements: []
         
     | 
| 
      
 72 
     | 
    
         
            +
            rubyforge_project: 
         
     | 
| 
      
 73 
     | 
    
         
            +
            rubygems_version: 2.0.3
         
     | 
| 
      
 74 
     | 
    
         
            +
            signing_key: 
         
     | 
| 
      
 75 
     | 
    
         
            +
            specification_version: 4
         
     | 
| 
      
 76 
     | 
    
         
            +
            summary: a mobile library lookit UI implementation for compass
         
     | 
| 
      
 77 
     | 
    
         
            +
            test_files: []
         
     |