mui_app_rails 0.0.1 → 0.0.2

data/app/assets/stylesheets/mui_app_rails/segmented-controls.scss

@@ -1,150 +0,0 @@
-//
-// Segmented controllers
-// --------------------------------------------------
-
-.#{$namespace}segmented-control {
-    position: relative;
-    display: table;
-    table-layout: fixed;
-    width: 100%;
-    overflow: hidden;
-    font-size: 15px;
-    font-weight: $font-weight-light;
-    background-color: transparent;
-    border: 1px solid $primary-color;
-    border-radius: 3px;
-    -webkit-touch-callout: none;//(iOS平台)分段选择禁止长按弹出菜单；
-
-    &.#{$namespace}scroll-wrapper{
-        height: 38px;
-        .#{$namespace}scroll{
-            height: 40px;
-            width: auto;
-            white-space: nowrap;
-        }
-        .#{$namespace}control-item{
-            display: inline-block;
-            width: auto;
-            padding: 0 20px;
-            border: 0;
-        }
-    }
-    // Section within controller
-    .#{$namespace}control-item {
-        display: table-cell;
-        width: 1%;
-//      padding-top: 6px;
-//      padding-bottom: 7px;
-        overflow: hidden;
-        line-height: 38px;
-        text-align: center;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        border-left: 1px solid $primary-color;
-        color: $primary-color;
-        border-color: $primary-color;
-        @include transition(background-color .1s linear);
-        // Remove border-left and shadow from first section
-        &:first-child {
-            border-left-width: 0;
-        }
-//      &:active {
-//          background-color: lighten($primary-color, 35%);
-//      }
-        // Selected state of segmented controller
-        &.#{$namespace}active {
-            color: #fff;
-            background-color: $primary-color;
-        }
-    }
-    &.#{$namespace}segmented-control-inverted{
-        width:100%;
-        border:0;
-        border-radius:0;
-        .#{$namespace}control-item {
-            border:0;
-            color: inherit;
-            &.#{$namespace}active {
-                color: $primary-color;
-                background: none;
-                border-bottom:2px solid $primary-color;
-            }
-        }
-        ~ .#{$namespace}slider-progress-bar{
-            background-color:$primary-color;
-        }
-    }
-}
-
-// Other segmented controller types
-// --------------------------------------------------
-
-// Positive
-.#{$namespace}segmented-control-positive {
-    border: 1px solid $positive-color;
-
-    .#{$namespace}control-item {
-        color: $positive-color;
-        border-color: inherit;
-
-//      &:active {
-//          background-color: lighten($positive-color, 35%);
-//      }
-        &.#{$namespace}active {
-            color: #fff;
-            background-color: $positive-color;
-        }
-    }
-    &.#{$namespace}segmented-control-inverted{
-        .#{$namespace}control-item {
-            &.#{$namespace}active {
-                color: $positive-color;
-                background: none;
-                border-bottom:2px solid $positive-color;
-            }
-        }
-        ~ .#{$namespace}slider-progress-bar{
-            background-color:$positive-color;
-        }
-    }
-}
-
-// Negative
-.#{$namespace}segmented-control-negative {
-    border: 1px solid $negative-color;
-
-    .#{$namespace}control-item {
-        color: $negative-color;
-        border-color: inherit;
-
-//      &:active {
-//          background-color: lighten($negative-color, 35%);
-//      }
-        &.#{$namespace}active {
-            color: #fff;
-            background-color: $negative-color;
-        }
-    }
-    &.#{$namespace}segmented-control-inverted{
-        .#{$namespace}control-item {
-            &.#{$namespace}active {
-                color: $negative-color;
-                background: none;
-                border-bottom:2px solid $negative-color;
-            }
-        }
-        ~ .#{$namespace}slider-progress-bar{
-            background-color:$negative-color;
-        }
-    }
-}
-
-// This is used to by the js to show and hide content tide to the segmented control.
-.#{$namespace}control-content {
-    position: relative;
-    display: none;
-
-    &.#{$namespace}active {
-        display: block;
-    }
-}

data/app/assets/stylesheets/mui_app_rails/slider-cell.scss

@@ -1,20 +0,0 @@
-.#{$namespace}slider-cell{
-    position:relative;
-    >.#{$namespace}slider-handle{
-        z-index:z("default");
-    }
-    >.#{$namespace}slider-left,>.#{$namespace}slider-right{
-        z-index:0;
-        position:absolute;
-        top:0;
-        bottom:0;
-    }
-    >.#{$namespace}slider-left{
-        left:0;
-    }
-    >.#{$namespace}slider-right{
-        right:z("default")-1;
-    }
-}
-
-    

data/app/assets/stylesheets/mui_app_rails/sliders.scss

@@ -1,133 +0,0 @@
-//
-// Slider styles (to be used with galleries.js)
-// --------------------------------------------------
-
-// Outer wrapper for slider
-.#{$namespace}slider {
-    //-webkit-backface-visibility: hidden;
-    overflow: hidden;
-    width: 100%;
-    position:relative;
-    .#{$namespace}segmented-control.#{$namespace}segmented-control-inverted{
-        .#{$namespace}control-item {
-            &.#{$namespace}active {
-                border-bottom:0;
-            }
-        }
-        ~ .#{$namespace}slider-group{
-            .#{$namespace}slider-item{
-                //@include hairline(double, #c8c7cc, 0); // double grey border.
-                border-top: 1px solid #c8c7cc;
-                border-bottom: 1px solid #c8c7cc;    
-            }
-        }
-     }
-    // Inner wrapper for slider (width of all sliders together)
-    .#{$namespace}slider-group {
-        //加上后好像内嵌轮播时，第一张图片显示有问题
-//      -webkit-backface-visibility: hidden;
-        position: relative;
-        font-size: 0; // Remove spaces from inline-block children
-        white-space: nowrap;
-        @include transition(all 0s linear);
-
-        // Individual slider
-        .#{$namespace}slider-item {
-//          -webkit-backface-visibility: hidden;
-            position: relative;
-            display: inline-block;
-            width: 100%;
-            height: 100%;
-            font-size: 14px;
-            vertical-align: top; // Ensure that li always aligns to top
-            >a:not(.#{$namespace}control-item){
-                position: relative;
-                line-height: 0;
-                display: block;
-            }
-            img{
-                width: 100%; 
-            }
-            .#{$namespace}table-view:before,.#{$namespace}table-view:after{
-                    height:0;
-             }
-//           .#{$namespace}table-view-cell:last-child:after{
-//               height: 0;
-//           }
-        }
-        &.#{$namespace}slider-loop{
-            @include transform(translate(-100%, 0px));
-        }
-//      &.#{$namespace}slider-loop .#{$namespace}slider-item{
-//          &:first-child{
-//              margin-left: -100%;
-//          }
-//          &:last-child{
-//              margin-right: -100%;
-//          }
-//      }
-    }
-}
-.#{$namespace}slider-title{
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    height: 30px;
-    line-height: 30px;
-    width: 100%;
-    text-align: left;
-    text-indent: 12px;
-    background-color: #000;
-    opacity: 0.8;
-    margin: 0;   
-}
-.#{$namespace}slider-indicator{
-    position: absolute;
-    bottom: 8px;
-    width: 100%;
-    text-align:center;
-    background:none;
-    &.#{$namespace}segmented-control{
-        position:relative;
-        bottom:auto;
-//      .#{$namespace}control-item{
-//          line-height: 40px;    
-//      }
-    }
-    .#{$namespace}indicator{
-        display: inline-block;
-        cursor: pointer;
-        background: #aaa;
-        width: 6px;
-        height: 6px;
-        margin: 1px 6px;
-        border-radius: 50%;
-        @include box-shadow(0 0 1px 1px rgba(130,130,130,.7));
-    }
-    .#{$namespace}active.#{$namespace}indicator{
-        background: #fff;
-    }
-    .#{$namespace}icon{
-        width: 40px;
-        height: 30px;
-        margin: 3px;
-        font-size: 20px;
-        line-height: 30px;
-        text-align: center;
-        border: 1px solid #dddddd;
-    }
-    .#{$namespace}number{
-        display: inline-block;
-        line-height: 32px;
-        width: 58px;
-        span{
-            color: #ff5053;
-        }
-    }
-}
-.#{$namespace}slider-progress-bar{
-    -webkit-backface-visibility: hidden;
-    @include transform(translateZ(0));
-    height:2px;
-    z-index:z("default");
-}

data/app/assets/stylesheets/mui_app_rails/switches.scss

@@ -1,115 +0,0 @@
-//
-// switch styles (to be used with switchs.js)
-// --------------------------------------------------
-
-.#{$namespace}switch {
-    position: relative;
-    display: block;
-    width: 74px;
-    height: 30px;
-    background-color: #fff;
-    background-clip: padding-box;
-    border: 2px solid #ddd;
-    border-radius: 20px;
-    -webkit-transition-timing-function: ease-in-out;
-    transition-timing-function: ease-in-out;
-    -webkit-transition-duration: 0.2s;
-    transition-duration: 0.2s;
-    -webkit-transition-property: background-color, border;
-    transition-property: background-color, border;
-    &.#{$namespace}disabled {
-        opacity: .3;
-    }
-    // Sliding handle
-    .#{$namespace}switch-handle {
-        position: absolute;
-        top: -1px;
-        left: -1px;
-        z-index: z("default");
-        width: 28px;
-        height: 28px;
-        background-color: #fff;
-        background-clip: padding-box;
-//      border: 1px solid #ddd;
-        -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.4);
-        box-shadow: 0 2px 5px rgba(0,0,0,.4);
-        border-radius: 16px;
-        -webkit-transition-property: -webkit-transform, width,left;
-        transition-property: transform, width,left;
-        -webkit-transition: 0.2s ease-in-out;
-        transition: 0.2s ease-in-out;
-    }
-    &:before {
-        position: absolute;
-        top: 3px;
-        right: 11px;
-        font-size: 13px;
-        color: #999;
-        text-transform: uppercase;
-        content: "Off";
-    }
-    &.#{$namespace}dragging {
-        background-color: $chrome-color;
-        border-color: $chrome-color;
-        .#{$namespace}switch-handle {
-           width: 38px;
-        }
-        &.#{$namespace}active{
-            .#{$namespace}switch-handle {
-               width: 38px;
-               left:-11px;
-            }    
-        }
-    }
-    // Active state for switchborder: 2px solid $positive-color;
-    &.#{$namespace}active {
-        background-color: $positive-color;
-        border-color: $positive-color;
-//        @include box-shadow(inset 0 0 0 13px $positive-color);
-        .#{$namespace}switch-handle {
-//          border-color: $positive-color;
-            @include transform(translate3d(43px,0,0));
-        }
-        &:before {
-            right: auto;
-            left: 15px;
-            color: #fff;
-            content: "On";
-        }
-    }
-    // Hide the checkbox
-    input[type="checkbox"] {
-        display: none;
-    }
-}
-
-.#{$namespace}switch-mini{
-    width: 47px;
-    &:before {
-        display: none;
-    }
-    // Active state for switch
-    &.#{$namespace}active {
-        .#{$namespace}switch-handle {
-            @include transform(translate3d(16px,0,0));
-        }
-    }
-}
-
-//增加蓝色开关
-.#{$namespace}switch-blue {
-    // Sliding handle
-    .#{$namespace}switch-handle {
-//      border: 1px solid rgba(0, 0, 0, .2);
-//      @include box-shadow(0 3px 3px rgba(0,0,0,.08));
-    }
-    // Active state for switch
-    &.#{$namespace}active {
-        background-color: $primary-color;
-        border: 2px solid $primary-color;
-//        @include box-shadow(inset 0 0 0 13px $primary-color);
-//      .#{$namespace}switch-handle {
-//          border-color: $primary-color;
-//      }
-    }
-}