macbury-metro-ui-rails 0.15.9

data/vendor/toolkit/metro-ui/images.less

@@ -0,0 +1,121 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * images.less
+ *
+ */
+
+@back-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAP5SURBVGhD7ZdBSBRRGIB319VW8OBhAwMhgwIPQgpGHYoMDeoYeAkSDBKSEIw8BCUd7FahgZDQxZtBFw9BRkIGezA0FAo0EBIyCCrwILjq6vb9M/8uM7szu+7qaAvzweP9/3tv3vz//978703Ax8fHx2cvBLW2sbW11R4MBp+o6sjOzs7zioqKIVUPjZDWNjC+iqouV2FMNfWh4+hAKRFMJpNhtkxvKBS6iC6RF2oo9aboyrKWw2CNLfypvLx8KLi9vT2IE73aUWqMB4n+b/ZzVBtKCgKfCCYSiaTqJcmBO0DUVlnxacoK+/gn395x2uoo52iL6LBdc5AOvMHIZ+FwOIahCW1LQ18EW67Q9wC12WzNj+cOYNgKVQcZY8psyc/GxsYtVmYQZ1JZ0RWvHYiVlZVdw5A/qhtgYAPtjWwhSR6zODfPmDWz10THvEbMmc69dGAJA5pShskWweABym2XyE5hS3ckEllUPbC+vn6SLTfDeNdT35OTGGMTnC8SecP4zc3NZvQ52vtcjBdacHiOsX2qByorK5eoOkzNGU9WACNHMKZbZCJei/FfckUxE57p4aI4rGoAGz9QtZiaHU8cwPhjGPxL5Fwvd4OViuN0U2o7cdhKdnprdGbgxRaSNJkyvpOqIOMFno+w91+oGkCexCnbR57C1QEmGWIpLxDNE9bCRJfoG9FhWdAXU1Ei2apiwfDseYpxsDFngjJpdGTg9j8wjLF32YcSzWVrkXxOXzeTv9LhNmj/pqLM06hiwfCs3JIbVBVdzpMsHB0g8u9UdIUJHcfggPEi6jBV2oBi4DBLP49Nf1W04egAL5e/rpy4jcEx42ZLnWCM7QArFOvzOHNERRtuW+iR5G5Vs2Bp26jumZodSZsqyjzTKhYFH2/6eeu8VtwciOLxDIb+IJN8txZpo/89xfFA4rmzKso88yoWDNFf4fn0CiCfU9HGvp8DvHiNyB3lhXHkKPMvIBfzw3STeUZFiMfj9cgLRmsGjiuwFzC2ilWS/C+yRLBL5AIZTxkvkPnuqJiFJyexfHwYcAoHVkXnVB2g7aHRmZ950vRldT51oZNVlKyWxb6vgMDLohj9UlW5WvTjwFWKYy4X6JPD6iljz6SMpy1C9MfcjBe8vE5L5ujnMHysqhhUzfa6gZGnkSXLSSL4yrjP1BOMnZVxAv1hgjCG2G62OOOpAwLRGyUzdVFn/Ua6gfE1anzee5QnW8gKxnRizAKBMj7sXDA2wvlzXzIX6q4ugZ6vgBUMlL09wZb5yKrI9xCnVNNei95K3cZK5f0PtnKgDnhBCK8d79mlQoglS9/fS5DFEGmtByHGSuw6S/wnzJIcrqvs4+Pj41MMgcA/8Fr5zKgSl7AAAAAASUVORK5CYII%3D);
+@overlay-speed: .3s;
+
+.image-collection {
+    .pos-rel;
+    .unstyled;
+    .clearfix;
+
+    & > div, & > li {
+        width: 220px;
+        height: 121px;
+        overflow: hidden;
+        margin-right: 20px;
+        margin-bottom: 20px;
+        position: relative;
+        box-shadow: inset 0px 0px 1px #FFFFCC;
+        float: left;
+        background: #ccc @back-image 50% no-repeat;
+        display: table-cell;
+        vertical-align: middle !important;
+        text-align: center;
+
+        & > img {
+            width: 100%;
+            height : auto;
+            min-height: 100%;
+            max-width: 100%;
+        }
+
+        & > .overlay {
+            position: absolute;
+            width: 100%;
+            height: 55px;
+            overflow: hidden;
+            background-color: #1e1e1e;
+            color: #fff;
+            font-size: 8pt;
+            text-align: left;
+            line-height: 12px;
+            padding: 5px 10px;
+            opacity: .8;
+            bottom: -55px;
+        }
+
+        &:hover {
+            .overlay {
+                -webkit-transform: translate(0, -55px);
+                -ms-transform: translate(0, -55px);
+                -o-transform: translate(0, -55px);
+                -moz-transform: translate(0, -55px);
+                transform: translate(0, -55px);
+
+                -webkit-transition: all @overlay-speed ease;
+                -moz-transition: all @overlay-speed ease;
+                -o-transition: all @overlay-speed ease;
+                -ms-transition: all @overlay-speed ease;
+                transition: all @overlay-speed easet;
+            }
+        }
+    }
+
+    &.p16x9 {
+        & > div {
+            width: 220px;
+            height: 121px;
+        }
+    }
+    &.p4x3 {
+        & > div {
+            width: 220px;
+            height: 165px;
+        }
+    }
+}
+
+.image-container {
+    position: relative;
+    padding: 5px 5px 50px;
+    background-color: #1e1e1e;
+    .span3;
+    margin-right: 20px;
+    margin-bottom: 20px;
+
+    img {
+        width: 100%;
+        height: auto;
+    }
+
+    & > .overlay {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        height: 50px;
+        font-size: 8pt;
+        color: #fff;
+        line-height: 14px;
+        //text-align: center;
+        padding: 0 5px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    &.light {
+        background-color: #ccc;
+
+        & > .overlay {
+            color: #1e1e1e;
+        }
+    }
+
+}

data/vendor/toolkit/metro-ui/jqgrid.less

@@ -0,0 +1,12 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * jqGrid.less
+ *
+ */
+
+.ui-jqgrid {
+
+}

data/vendor/toolkit/metro-ui/layout.less

@@ -0,0 +1,287 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * Layout.less
+ */
+
+
+*, *:after, *:before {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+
+.column-gap (@gap) {
+    -moz-column-gap: @gap;
+    -webkit-column-gap: @gap;
+    column-gap: @gap;
+}
+
+.columns (@columns) {
+    -moz-columns: @columns;
+    -webkit-columns: @columns;
+    columns: @columns;
+
+    .column-gap(20px);
+}
+
+.one-column {
+    .columns(1);
+}
+.two-columns {
+    .columns(2);
+}
+.three-columns {
+    .columns(3);
+}
+.four-columns {
+    .columns(4);
+}
+.five-columns {
+    .columns(5);
+}
+
+.page {
+    position: relative;
+    height: 100%;
+    min-height: 100%;
+    width: 100%;
+    .clearfix();
+
+    .page-header {
+        width: 100%;
+        position: relative;
+        display: block;
+
+        .page-header-content {
+            height: @subunit * 20;
+            min-height: @unit * 5;
+            width: 100%;
+            position: relative;
+            display: block;
+
+            h1,h2,h3,h4,h5 {
+                position: absolute;
+                margin: 0;
+                padding: 0;
+                left: @unit;
+                bottom: 0;
+            }
+            h1 small {
+                font-size: 12pt;
+                margin-left: @subunit * 1;
+            }
+
+            h1.sub-menu {
+                cursor: pointer;
+                &:after {
+                    position: absolute;
+                    content: "\3009";
+                    display: inline-block;
+                    font-size: 10pt;
+                    bottom: -5px;
+                    right: -15px;
+                    .rotate(90deg);
+                }
+            }
+
+            & > .page-back {
+                position: absolute;
+                top: 34px;
+                left: 30px;
+            }
+
+            .user-login {
+                float: right;
+                margin: 55px 44px 0 0;
+                cursor: pointer;
+
+                .avatar {
+                    float: right;
+                    border: 1px #ccc solid;
+                    width: 40px;
+                    height: 40px;
+                    img {
+                        width: 100%;
+                        height: 100%;
+                    }
+                }
+                .name {
+                    float: left;
+                    margin: 0px 10px;
+                    text-align: right;
+
+                    .first-name {
+                        font-family: "Open Sans", sans-serif, sans;
+                        font-size: 18pt;
+                        display: block;
+                        margin: 0;
+                    }
+                    .last-name {
+                        font-family: "Open Sans", sans-serif, sans;
+                        font-size: 10pt;
+                        display: block;
+                        margin: 0;
+                    }
+                }
+            }
+        }
+
+    }
+
+    .page-region {
+        display: block;
+
+        .page-region-content {
+            padding-top: @subunit * 2;
+            padding-left: 0;
+            padding-right: 0;
+            padding-bottom: @unit;
+            display: block;
+            height: 100%;
+            position: relative;
+        }
+    }
+
+    &.secondary {
+        .page-header {
+            .page-header-content {
+                h1,h2,h3,h4,h5 {
+                    position: absolute;
+                    margin: 0;
+                    padding: 0;
+                    left: @unit * 6;
+                    bottom: 0;
+                }
+            }
+        }
+
+        .page-region {
+            .page-region-content {
+                padding-left: @unit * 6;
+            }
+        }
+    }
+
+    &.snapped {
+        width: 33.33%;
+        height: 100%;
+        float: left;
+        border-right: 1px #ccc solid;
+    }
+    &.fill{
+        width: 66.66%;
+        height: 100%;
+        float: right;
+        border-left: 1px #ccc solid;
+    }
+
+
+    &.snapped {
+        .page {
+            .page-header {
+                .page-header-content {
+                    h1,h2,h3,h4,h5 {
+                        margin-left: @unit;
+                    }
+                }
+            }
+
+            .page-region {
+                .page-region-content {
+                    padding-left: @unit;
+                }
+            }
+        }
+    }
+}
+
+.page.fixed-header {
+    .page-header {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+    }
+
+    .page-region {
+        padding-top: 140px;
+    }
+}
+
+.page.with-sidebar {
+    .page-region {
+        margin-left: 220px;
+        width: auto;
+        //border: 1px #ccc dotted;
+
+        .page-region-content {
+            padding-left: 20px;
+        }
+
+        .clearfix;
+    }
+}
+
+.app-bar {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    min-height: 100px;
+
+    .bg-color-darken();
+}
+
+.charms {
+    position: fixed;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    height: 100%;
+    min-width: 200px;
+    width: auto;
+
+    &.place-left {
+        left: 0;
+        right: auto;
+    }
+
+    &.search {}
+    &.sharing{}
+    &.appsets{}
+    &.apphelp{}
+}
+
+.message-dialog {
+    position: fixed;
+    left: 0;
+    right: 0;
+    height: auto;
+    min-height: 100px;
+    top: 30%;
+    padding: 10px 10px 0;
+}
+.flyouts{}
+
+.error-bar, .warning-bar, .info-bar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    padding: 10px 20px;
+    color: #fff;
+    min-height: 100px;
+}
+.error-bar {
+    .bg-color-red();
+}
+.warning-bar {
+    .bg-color-yellow();
+}
+.info-bar {
+    .bg-color-blue();
+}
+

data/vendor/toolkit/metro-ui/listview.less

@@ -0,0 +1,143 @@
+/*
+ * Metro UI CSS
+ * Copyright 2012 Sergey Pimenov
+ * Licensed under the MIT Lilcense
+ *
+ * ListView.less
+ * Version 1.0
+ */
+.listview {
+    .unstyled;
+
+    li {
+        margin-bottom: 10px;
+        border: 4px transparent solid;
+        padding: 10px;
+        width: 300px;
+        position: relative;
+        display: block;
+        cursor: pointer;
+
+        .icon {
+            width: 48px;
+            height: 48px;
+            float: left;
+
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+
+        .data {
+            margin-left: 55px;
+            h4 {
+                margin: 0;
+                padding: 0 0 2px 0;
+            }
+            p {
+                margin: 0;
+                font-size: 9pt;
+            }
+
+            .static-rating.small, .progress-bar {
+                margin-bottom: 3px;
+            }
+        }
+
+        &:hover {
+            outline: 3px #ccc solid;
+        }
+        &:active {
+            outline: 3px #3e3e3e solid;
+        }
+
+        .clearfix;
+    }
+
+    &.image {
+
+        li {
+            width: 380px;
+
+            .icon {
+                width: 100px;
+                height: 100px;
+                border: 1px #ccc solid;
+            }
+
+            .data {
+                margin-left: 110px;
+
+                h4 {
+                    margin-bottom: 4px;
+                }
+
+                p {
+                    line-height: 16px;
+                    font-size: 10pt;
+                    margin-bottom: 5px;
+                }
+
+                .static-rating.small, .progress-bar {
+                    margin-bottom: 10px;
+                }
+            }
+        }
+    }
+
+    &.iconic {
+        li {
+            .icon {
+                width: 32px;
+                height: 32px;
+                border: 1px #ccc solid;
+            }
+            .data {
+                margin-left: 40px;
+            }
+        }
+    }
+
+    &.fluid {
+        li {
+            float: left;
+            margin-right: 10px;
+        }
+    }
+
+
+    & > li.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: 1001;
+        }
+
+        &:before {
+            position: absolute;
+            content: "\e08a";
+            color: #fff;
+            right: 4px;
+            top: 0;
+            font-family: iconFont;
+            z-index: 1002;
+            display: block;
+        }
+    }
+
+    &.image > li.selected {
+        //padding-bottom: 20px;
+    }
+
+    .clearfix;
+}