metro-ui-rails-cn 0.1.5

data/vendor/toolkit/metro-ui-css/routines.less

@@ -0,0 +1,137 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * Routines.less
+ */
+
+.place-left {float: left !important; margin-right: 10px;}
+.place-right {float: right !important; margin-left: 10px;}
+
+.scroll-y, .scroll-vertical {
+    overflow-y: scroll;
+}
+.scroll-x, .scroll-horizontal {
+    overflow-x: scroll;
+}
+
+.pos-rel {position: relative;}
+.pos-abs {position: absolute;}
+.pos-fix {position: fixed;}
+.text-left {text-align: left;}
+.text-right {text-align: right;}
+.text-center {text-align: center;}
+.text-justify {text-align: justify;}
+
+.top-left {
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+.top-right {
+    position: absolute;
+    top: 0;
+    right: 0;
+}
+.bottom-right {
+    position: absolute;
+    bottom: 0;
+    right: 0;
+}
+.bottom-left {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+}
+
+.no-overflow {overflow: hidden;}
+.no-display {display: none;}
+.as-block {display: block; float: none !important;}
+.as-inline-block {display: inline-block;}
+
+.nlm {margin-left: 0 !important;}
+.nrm {margin-right: 0 !important;}
+
+.clearfix {
+    *zoom: 1;
+    &:before,
+    &:after {
+        display: table;
+        content: "";
+    }
+    &:after {
+        clear: both;
+    }
+}
+
+.padding5 {padding: 5px;}
+.padding10 {padding: 10px;}
+.padding15 {padding: 15px;}
+.padding20 {padding: 20px;}
+.padding30 {padding: 30px;}
+.padding40 {padding: 40px;}
+.padding80 {padding: 80px;}
+
+.selected {
+    border: 4px @blue solid;
+
+    &:after {
+        width: 0;
+        height: 0;
+        border-top: 40px solid @blue;
+        border-left: 40px solid transparent;
+        position: absolute;
+        display: block;
+        right: 0;
+        content:".";
+        top: 0;
+        z-index: 1000;
+    }
+
+    &:before {
+        position: absolute;
+        content: "\2714";
+        color: #fff;
+        right: 5px;
+        font-family: Tahoma;
+        z-index: 2000;
+    }
+}
+
+// Transformations
+.rotate(@degrees) {
+    -webkit-transform: rotate(@degrees);
+    -moz-transform: rotate(@degrees);
+    -ms-transform: rotate(@degrees);
+    -o-transform: rotate(@degrees);
+    transform: rotate(@degrees);
+}
+.scale(@ratio) {
+    -webkit-transform: scale(@ratio);
+    -moz-transform: scale(@ratio);
+    -ms-transform: scale(@ratio);
+    -o-transform: scale(@ratio);
+    transform: scale(@ratio);
+}
+.translate(@x: 0, @y: 0) {
+    -webkit-transform: translate(@x, @y);
+    -moz-transform: translate(@x, @y);
+    -ms-transform: translate(@x, @y);
+    -o-transform: translate(@x, @y);
+    transform: translate(@x, @y);
+}
+.skew(@x: 0, @y: 0) {
+    -webkit-transform: skew(@x, @y);
+    -moz-transform: skew(@x, @y);
+    -ms-transform: skew(@x, @y);
+    -o-transform: skew(@x, @y);
+    transform: skew(@x, @y);
+}
+.translate3d(@x: 0, @y: 0, @z: 0) {
+    -webkit-transform: translate(@x, @y, @z);
+    -moz-transform: translate(@x, @y, @z);
+    -ms-transform: translate(@x, @y, @z);
+    -o-transform: translate(@x, @y, @z);
+    transform: translate(@x, @y, @z);
+}

data/vendor/toolkit/metro-ui-css/sidebar.less

@@ -0,0 +1,139 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * Sidebar.less
+ */
+
+@icons_black: image-url("metro-ui-css/icons.png");
+@icons_white: image-url("metro-ui-css/icons-white.png");
+
+.page-sidebar {
+    display: block;
+    width: 213px;
+    float: left;
+    min-height: 100% !important;
+    height: auto;
+    background-color: #EBEBEB;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    margin-top: 10px;
+    margin-left: 7px;
+
+    a {
+        #font > .navigation;
+        #state > .navigation;
+        display: block;
+        width: 100%;
+        padding: 5px 20px 5px 10px;
+        white-space: nowrap;
+        font-size: 14px;
+        cursor: pointer;
+
+        &:hover {
+            .bg-color-blue;
+            .fg-color-white;
+        }
+    }
+
+    li {
+        display: list-item;
+        line-height: 20px;
+        position: relative;
+    }
+
+    & > ul > li > a {
+        font-size: 1.1em;
+    }
+
+    & > ul > li a.lead, & > ul > li.lead a, & > ul > li.lead {
+        font-weight: bold;
+    }
+
+    & > ul > li.sticker {
+
+        &:before {
+            content: ".";
+            position: absolute;
+            width: 7px;
+            height: 28px;
+            left: -7px;
+            text-indent: -9999px;
+            border-top-left-radius: 10px;
+            border-bottom-left-radius: 10px;
+            background-color: #ebebeb;
+        }
+
+        &.sticker-color-blue {&:before{background-color: @blue;}}
+        &.sticker-color-blueLight {&:before{background-color: @blueLight;}}
+        &.sticker-color-blueDark {&:before{background-color: @blueDark;}}
+        &.sticker-color-green {&:before{background-color: @green !important;}}
+        &.sticker-color-greenLight {&:before{background-color: @greenLight !important;}}
+        &.sticker-color-greenDark {&:before{background-color: @greenDark !important;}}
+        &.sticker-color-red {&:before{background-color: @red !important;}}
+        &.sticker-color-yellow {&:before{background-color: @yellow !important;}}
+        &.sticker-color-orange {&:before{background-color: @orange !important;}}
+        &.sticker-color-orangeDark {&:before{background-color: @orangeDark !important;}}
+        &.sticker-color-pink {&:before{background-color: @pink !important;}}
+        &.sticker-color-pinkDark {&:before{background-color: @pinkDark !important;}}
+        &.sticker-color-purple {&:before{background-color: @purple !important;}}
+        &.sticker-color-darken {&:before{background-color: @darken !important;}}
+        &.sticker-color-white {&:before{background-color: @white !important;}}
+        &.sticker-color-grayDark {&:before{background-color: @grayDark !important;}}
+    }
+
+    .divider {
+        height: 1px;
+        margin: 9px 1px;
+        overflow: hidden;
+        background-color: #e5e5e5;
+    }
+
+    & ul {
+        .unstyled;
+        background-color: #EBEBEB;
+    }
+
+    ul.sub-menu {
+        padding-top: 5px;
+        padding-bottom: 5px;
+
+        a {
+            padding: 5px 20px 5px 25px;
+        }
+
+        &.light {
+            background-color: #f9f9f9 !important;
+        }
+    }
+
+    .sidebar-dropdown-menu {
+        display: none;
+
+        &.open {
+            display: block;
+        }
+    }
+
+    & > ul > li.dropdown {
+        position: relative;
+
+        &:after {
+            content: "";
+            display: block;
+            position: absolute;
+            top: 6px;
+            left: 100%;
+            margin-left: -20px;
+            width: 16px;
+            height: 16px;
+            background: @icons_black no-repeat;
+            background-position: 0 -1586px;
+            z-index: 200;
+        }
+        &.active:after {
+            background-position: 0 -676px;
+        }
+    }
+}

data/vendor/toolkit/metro-ui-css/slider.less

@@ -0,0 +1,52 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * Slider.less
+ *
+ */
+
+@slider-color: #c6c6c6;
+@slider-color-disabled: #dbdbdb;
+@slider-color-rest-state: #00828b;
+@slider-color-hover-state: #219297;
+@slider-color-active-state: #25bbc4;
+@slider-color-disabled-state: #bababa;
+@slider-marker-color: #000;
+@slider-marker-color-disabled: #a0a0a0;
+
+.slider {
+    height: 12px;
+    width: 100%;
+    position: relative;
+    background-color: @slider-color;
+    margin-bottom: 10px;
+
+    .marker {
+        height: 12px;
+        width: 12px;
+        cursor: pointer;
+        position: absolute;
+        top: 0;
+        left: 0;
+        background-color: @slider-marker-color;
+    }
+    .complete {
+        height: 100%;
+        width: auto;
+        background-color: @slider-color-rest-state;
+    }
+
+    &:hover {
+        .complete {
+            background-color: @slider-color-hover-state;
+        }
+    }
+
+    &:active, &:active + .marker:active {
+        .complete {
+            background-color: @slider-color-active-state;
+        }
+    }
+}

data/vendor/toolkit/metro-ui-css/tables.less

@@ -0,0 +1,158 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * Tables.less
+ *
+ */
+
+table {
+    width: 100%;
+    border-collapse: separate;
+    margin: 0 0 20px;
+
+    thead {
+        tr {
+            th, td {
+                display: table-cell;
+                vertical-align: bottom;
+                padding-bottom: @subunit;
+                padding-top: @subunit * 2;
+                padding-left: @subunit;
+                border-bottom: 1px #ddd solid;
+                border-right: 1px #ddd solid;
+                border-left: 1px transparent solid;
+                border-top: 1px transparent solid;
+                #font > .navigation;
+                .text-rest2-state;
+                text-align: left;
+
+                &.right {
+                    text-align: right;
+                    padding-right: @subunit * 2;
+                }
+
+                &.last {
+                    border-right: 1px transparent solid;
+                }
+
+                &:last-child {
+                    border-right: 1px transparent solid;
+                }
+            }
+        }
+    }
+
+    tbody {
+        tr {
+            border: 1px #fff solid;
+
+            td {
+                #font > .normal;
+                padding: 3px 10px;
+                border-right: 1px #ddd solid;
+                border-bottom: 1px #ddd solid;
+                box-sizing: border-box;
+
+                &.right {
+                    text-align: right;
+                }
+                &.center {
+                    text-align: center;
+                }
+                &.last {
+                    border-right: 1px transparent solid;
+                }
+                &:last-child {
+                    border-right: 1px transparent solid;
+                }
+            }
+
+            &.success {
+                .bg-color-green();
+            }
+            &.error {
+                .bg-color-red();
+            }
+            &.warning {
+                .bg-color-orange();
+            }
+            &.info {
+                .bg-color-blue();
+            }
+
+            &.selected-row {
+                background-color: rgba(28, 183, 236, 0.10) !important;
+                td:first-child {
+                    border-left: 1px #1c98cc solid;
+                }
+                td:last-child {
+                    border-right: 1px #1c98cc solid;
+                }
+                td {
+                    border-top: 1px #1c98cc solid;
+                    border-bottom: 1px #1c98cc solid;
+                }
+            }
+        }
+    }
+
+    tfoot {
+    }
+
+    &.striped {
+        tbody {
+            tr:nth-child(odd) {
+                background-color: #f9f9f9;
+            }
+        }
+    }
+
+    &.hovered {
+        border-collapse: separate !important;
+        thead {
+            tr {
+                th,td {
+                    &:hover {
+                        border: 1px #1c98cc solid;
+                        background: rgba(28, 183, 236, 0.10);
+                    }
+                }
+            }
+        }
+
+        tbody {
+            tr {
+                &:hover {
+                    background-color: rgba(28, 183, 236, 0.10);
+                    td:first-child {
+                        border-left: 1px #1c98cc solid;
+                    }
+                    td:last-child {
+                        border-right: 1px #1c98cc solid;
+                    }
+                    td {
+                        border-top: 1px #1c98cc solid;
+                        border-bottom: 1px #1c98cc solid;
+                    }
+                }
+            }
+        }
+    }
+
+    &.bordered {
+        border-collapse: separate !important;
+        border: 1px #ccc solid !important;
+
+        tbody {
+            tr:last-child {
+                td {
+                    border-bottom: 0;
+                }
+            }
+        }
+    }
+
+}
+