From ddc385641a0527fa830e437eab19c75c6a47dbf8 Mon Sep 17 00:00:00 2001 From: Christoph Oberhofer Date: Mon, 5 Jun 2017 00:03:45 +0200 Subject: [PATCH] examples: CSS cleanup --- example/css/styles.css | 202 ++++++++++++++---------------- example/sass/_icons.scss | 10 -- example/sass/_overlay.scss | 48 ------- example/sass/_phone.scss | 3 - example/sass/_tablet.scss | 4 - example/sass/_utility.scss | 17 --- example/sass/_variables.scss | 7 -- example/sass/_viewport.scss | 89 ------------- example/sass/colors.scss | 55 -------- example/sass/fonts.scss | 1 - example/sass/phone/_core.scss | 15 --- example/sass/phone/_overlay.scss | 28 ----- example/sass/phone/_viewport.scss | 42 ------- example/sass/scanner.scss | 14 --- example/sass/styles.scss | 56 --------- 15 files changed, 96 insertions(+), 495 deletions(-) delete mode 100644 example/sass/_icons.scss delete mode 100644 example/sass/_overlay.scss delete mode 100644 example/sass/_phone.scss delete mode 100644 example/sass/_tablet.scss delete mode 100644 example/sass/_utility.scss delete mode 100644 example/sass/_variables.scss delete mode 100644 example/sass/_viewport.scss delete mode 100644 example/sass/colors.scss delete mode 100644 example/sass/fonts.scss delete mode 100644 example/sass/phone/_core.scss delete mode 100644 example/sass/phone/_overlay.scss delete mode 100644 example/sass/phone/_viewport.scss delete mode 100644 example/sass/scanner.scss delete mode 100644 example/sass/styles.scss diff --git a/example/css/styles.css b/example/css/styles.css index 8b5e047..adf1cf7 100644 --- a/example/css/styles.css +++ b/example/css/styles.css @@ -1,79 +1,109 @@ @charset "UTF-8"; -/* usual styles */ -/* LESS - http://lesscss.org style sheet */ -/* Palette color codes */ -/* Palette URL: http://paletton.com/#uid=31g0q0kHZAviRSkrHLOGomVNzac */ -/* Feel free to copy&paste color codes to your application */ -/* MIXINS */ -/* As hex codes */ -/* Main Primary color */ -/* Main Secondary color (1) */ -/* Main Secondary color (2) */ -/* As RGBa codes */ -/* Main Primary color */ -/* Main Secondary color (1) */ -/* Main Secondary color (2) */ -/* Generated by Paletton.com ├é┬® 2002-2014 */ -/* http://paletton.com */ @import url("https://fonts.googleapis.com/css?family=Ubuntu:400,700|Cabin+Condensed:400,600"); -/* line 1, ../sass/_viewport.scss */ + +body { + background-color: #FFF; + margin: 0px; + font-family: Ubuntu, sans-serif; + color: #1e1e1e; + font-weight: normal; + padding-top: 0; +} + +h1, h2, h3, h4 { + font-family: "Cabin Condensed", sans-serif; +} + +header { + background: #FFC600; + padding: 1em; +} + +header .headline { + max-width: 640px; + margin: 0 auto; +} + +header .headline h1 { + color: #FFDD69; + font-size: 3em; + margin-bottom: 0; +} + +header .headline h2 { + margin-top: 0.2em; +} + +footer { + background: #0A4DB7; + color: #6C9CE8; + padding: 1em 2em 2em; +} + +#container { + width: 640px; + margin: 20px auto; + padding: 10px; +} + #interactive.viewport { width: 640px; height: 480px; } -/* line 6, ../sass/_viewport.scss */ + #interactive.viewport canvas, video { float: left; width: 640px; height: 480px; } -/* line 10, ../sass/_viewport.scss */ + #interactive.viewport canvas.drawingBuffer, video.drawingBuffer { margin-left: -640px; } -/* line 16, ../sass/_viewport.scss */ .controls fieldset { border: none; + margin: 0; + padding: 0; } -/* line 19, ../sass/_viewport.scss */ + .controls .input-group { float: left; } -/* line 21, ../sass/_viewport.scss */ + .controls .input-group input, .controls .input-group button { display: block; } -/* line 25, ../sass/_viewport.scss */ + .controls .reader-config-group { float: right; } -/* line 28, ../sass/_viewport.scss */ + .controls .reader-config-group label { display: block; } -/* line 30, ../sass/_viewport.scss */ + .controls .reader-config-group label span { - width: 11rem; + width: 9rem; display: inline-block; text-align: right; } -/* line 37, ../sass/_viewport.scss */ + .controls:after { content: ''; display: block; clear: both; } -/* line 44, ../sass/_viewport.scss */ + #result_strip { margin: 10px 0; border-top: 1px solid #EEE; border-bottom: 1px solid #EEE; padding: 10px 0; } -/* line 50, ../sass/_viewport.scss */ + #result_strip > ul { padding: 0; margin: 0; @@ -83,41 +113,41 @@ overflow-y: hidden; white-space: nowrap; } -/* line 59, ../sass/_viewport.scss */ + #result_strip > ul > li { display: inline-block; vertical-align: middle; width: 160px; } -/* line 63, ../sass/_viewport.scss */ + #result_strip > ul > li .thumbnail { padding: 5px; margin: 4px; border: 1px dashed #CCC; } -/* line 68, ../sass/_viewport.scss */ + #result_strip > ul > li .thumbnail img { max-width: 140px; } -/* line 71, ../sass/_viewport.scss */ + #result_strip > ul > li .thumbnail .caption { white-space: normal; } -/* line 73, ../sass/_viewport.scss */ + #result_strip > ul > li .thumbnail .caption h4 { text-align: center; word-wrap: break-word; height: 40px; margin: 0px; } -/* line 83, ../sass/_viewport.scss */ + #result_strip > ul:after { content: ""; display: table; clear: both; } -/* line 7, ../sass/_overlay.scss */ + .scanner-overlay { display: none; width: 640px; @@ -133,21 +163,21 @@ -webkit-box-shadow: #333333 0px 4px 10px; box-shadow: #333333 0px 4px 10px; } -/* line 20, ../sass/_overlay.scss */ + .scanner-overlay > .header { position: relative; margin-bottom: 14px; } -/* line 23, ../sass/_overlay.scss */ + .scanner-overlay > .header h4, .scanner-overlay > .header .close { line-height: 16px; } -/* line 26, ../sass/_overlay.scss */ + .scanner-overlay > .header h4 { margin: 0px; padding: 0px; } -/* line 30, ../sass/_overlay.scss */ + .scanner-overlay > .header .close { position: absolute; right: 0px; @@ -160,7 +190,7 @@ cursor: pointer; } -/* line 1, ../sass/_icons.scss */ + i.icon-24-scan { width: 24px; height: 24px; @@ -172,11 +202,8 @@ i.icon-24-scan { vertical-align: text-top; } -@media (min-width: 604px) and (max-width: 1024px) { - /* tablet styles */ -} @media (max-width: 603px) { - /* line 2, ../sass/phone/_core.scss */ + #container { width: 300px; margin: 10px auto; @@ -184,46 +211,58 @@ i.icon-24-scan { -webkit-box-shadow: none; box-shadow: none; } - /* line 9, ../sass/phone/_core.scss */ + #container form.voucher-form input.voucher-code { width: 180px; } } @media (max-width: 603px) { - /* line 5, ../sass/phone/_viewport.scss */ + + .reader-config-group { + width: 100%; + } + + .reader-config-group label > span { + width: 50%; + } + + .reader-config-group label > select, .reader-config-group label > input { + max-width: calc(50% - 2px); + } + #interactive.viewport { width: 300px; height: 300px; overflow: hidden; } - /* line 11, ../sass/phone/_viewport.scss */ + #interactive.viewport canvas, video { margin-top: -50px; width: 300px; height: 400px; } - /* line 15, ../sass/phone/_viewport.scss */ + #interactive.viewport canvas.drawingBuffer, video.drawingBuffer { margin-left: -300px; } - /* line 20, ../sass/phone/_viewport.scss */ + #result_strip { margin-top: 5px; padding-top: 5px; } - /* line 24, ../sass/phone/_viewport.scss */ + #result_strip ul.thumbnails > li { width: 150px; } - /* line 27, ../sass/phone/_viewport.scss */ + #result_strip ul.thumbnails > li .thumbnail .imgWrapper { width: 130px; height: 130px; overflow: hidden; } - /* line 31, ../sass/phone/_viewport.scss */ + #result_strip ul.thumbnails > li .thumbnail .imgWrapper img { margin-top: -25px; width: 130px; @@ -231,7 +270,7 @@ i.icon-24-scan { } } @media (max-width: 603px) { - /* line 8, ../sass/phone/_overlay.scss */ + .overlay.scanner { width: 640px; height: 510px; @@ -243,66 +282,17 @@ i.icon-24-scan { -webkit-box-shadow: none; box-shadow: none; } - /* line 17, ../sass/phone/_overlay.scss */ + .overlay.scanner > .header { margin-bottom: 14px; } - /* line 19, ../sass/phone/_overlay.scss */ + .overlay.scanner > .header h4, .overlay.scanner > .header .close { line-height: 16px; } - /* line 22, ../sass/phone/_overlay.scss */ + .overlay.scanner > .header .close { height: 16px; width: 16px; } } -/* line 15, ../sass/styles.scss */ -body { - background-color: #FFF; - margin: 0px; - font-family: Ubuntu, sans-serif; - color: #1e1e1e; - font-weight: normal; - padding-top: 0; -} - -/* line 24, ../sass/styles.scss */ -h1, h2, h3, h4 { - font-family: "Cabin Condensed", sans-serif; -} - -/* line 28, ../sass/styles.scss */ -header { - background: #FFC600; - padding: 1em; -} -/* line 31, ../sass/styles.scss */ -header .headline { - width: 640px; - margin: 0 auto; -} -/* line 34, ../sass/styles.scss */ -header .headline h1 { - color: #FFDD69; - font-size: 3em; - margin-bottom: 0; -} -/* line 39, ../sass/styles.scss */ -header .headline h2 { - margin-top: 0.2em; -} - -/* line 45, ../sass/styles.scss */ -footer { - background: #0A4DB7; - color: #6C9CE8; - padding: 1em 2em 2em; -} - -/* line 51, ../sass/styles.scss */ -#container { - width: 640px; - margin: 20px auto; - padding: 10px; -} diff --git a/example/sass/_icons.scss b/example/sass/_icons.scss deleted file mode 100644 index 8e47dd5..0000000 --- a/example/sass/_icons.scss +++ /dev/null @@ -1,10 +0,0 @@ -i.icon-24-scan{ - width: 24px; - height: 24px; - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzFFMjMzNTBFNjcwMTFFMkIzMERGOUMzMzEzM0E1QUMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzFFMjMzNTFFNjcwMTFFMkIzMERGOUMzMzEzM0E1QUMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDMUUyMzM0RUU2NzAxMUUyQjMwREY5QzMzMTMzQTVBQyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDMUUyMzM0RkU2NzAxMUUyQjMwREY5QzMzMTMzQTVBQyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtQr90wAAAUuSURBVHjanFVLbFRVGP7ua97T9DGPthbamAYYBNSMVbBpjCliWWGIEBMWsnDJxkh8RDeEDW5MDGticMmGBWnSlRSCwgLFNkqmmrRIqzjTznTazkxn5s7c6/efzm0G0Jhwkj/nP+d/nv91tIWFBTQaDQWapkGW67p4ltUub5qmAi0UCqF/a/U2m81tpmddotwwDGSz2dzi4uKSaOucnJycGhsbe1XXdQiIIcdxEAgEtgXq9brySHCht79UXi/8QheawN27d385fPjwuEl6XyKR6LdtW7t06RLK5TKOHj2K/fv3Q87Dw8OYn5/HiRMnMDs7i5mZGQwODiqlPp8PuVwO6XRaOXb16lXl1OnTp5FMJvtosF8M+MWLarWqGJaWlpBKpRRcu3YN4+PjmJ6exsTEhDJw5coVjI6OKgPhcBiZTAbxeBx+vx+XL19Gd3c3Tp48Ka9zqDYgBlTQxYNgMIhIJKLCILkQb+TZsgvdsiyFi+feWRR7oRNZyanQtvW2V4DEUUBiK2eJpeDirSyhCe7F2QPh8fiEp72i9PbsC5G52DbiKZA771yr1dTuGfJ4PQNPFoAyQNR1aNEmsS5eyB3PgjeooMZd2AWvNmzYci/Gea7TeFOcI93jV/K67noGmi4vdRI9gPSDeMLSdKUBZZczlWm1rTtHjLZ24d+WER2tc8N1m+Y+ID74wx0zGYvhg9UNrJdtHJyZRdQfwPsrq9g99xsGlgsYmr6BNzO/IVwsYfjBQ6XYz6JI/72MV366B5/lw0elOkJWGUM3bmKtWjXSLuLaBWhnPnnp0FfoiFi4+TMfVAb2poBkDLjO845uYLEAjL4ALGWBP5YAOsP4AJYBFDaB1HOSVWD2PuV95H2RdV93Lv74/cf6p6Zxq/h6OofeOPJBC39JtONdwOAAViOs4p4OFGTf0Uc8iiyrr9YdQrUnDLsngrVOC0jQib44HlF2RafRZBz1Qy+vfhgK3NJZBlrm+LEm9qWwzFgLU7Ozg0JxZP06jQSRpQ7EerAWDSt6PuhHPmChEAog56fCLvJT5hHTm3OZkz3DyLx7XNWTGEA1GkV14gjWgwbW0ESVjYRwCOuai03L5E7OUBAV4kXSS4auoGIaKOma4m8EA5R1sMEGLh95C+XuLph0WJWpxepYYLtfT0RRgY1KgNODY6BoaChRuEhDCIZQYseuki5KN6hcQHiq7OZNv4/Zq2O6P4Lfkwn46vZjjaYZrIpvWbpzjLErrc4xUGE4avRedpYJalRcIl5hQius/SrPm9xrNOQYJhao6BvNUeWqtY8KaWuNjHOFAr7mM9f4NA4UbKysoUJ8PV9UzVOx6wxDDWUOxnK1pmCD07fOMAvtIsM3l89Dl3HRGhVma9AZMqjOnz2LQqWCxs6dqr3T7x1DTzKJaG8SekcHhg4cgI/56uKdlKnBV/WndqN3YAB/7tyBd3oT6GBIOzs7kc/nDfFdDFT5bS73cp06dQoaPa/Rw/rtO/resTHxxE2m9rCrbSR27UJCcMf1BpiA5rAAGgdfc868fUR1sMwj0cm9Iu9IctweisViB3hhKTHDcHc5jv/LspbyaZrR1OD82/fIlOkuB9LnEWRmDX2TsddUPg3D5gvuc0je0rZaD5EW6G3yjS+A3eeBEWq3XW/Abw1HhUspXADufQb86oW7tZytkYCN//3hHwBvDALPi8EnSOYK8DAOfCc2h4aGcO7cuafkzampqf9UripH12/DtOZbx8ciVGzYy5OO40o25ascGRl5Ssc/AgwAjW3JwqIUjSYAAAAASUVORK5CYII="); - display: inline-block; - background-repeat: no-repeat; - line-height: 24px; - margin-top: 1px; - vertical-align: text-top; -} diff --git a/example/sass/_overlay.scss b/example/sass/_overlay.scss deleted file mode 100644 index 1de596b..0000000 --- a/example/sass/_overlay.scss +++ /dev/null @@ -1,48 +0,0 @@ -$overlayWidth: $videoWidth; -$overlayHeadline: 16px; -$overlayHeadlineMargin: 14px; -$overlayPadding: 20px; -$overlayHeight: $videoHeight + $overlayHeadlineMargin + $overlayHeadline; - -.scanner-overlay { - display: none; - width: $overlayWidth; - height: $overlayHeight; - position: absolute; - padding: $overlayPadding; - top: 50%; - margin-top: -($overlayHeight)/2 - $overlayPadding; - left: 50%; - margin-left: -($overlayWidth + 2*$overlayPadding)/2; - background-color: $overlayBackground; - @include box-shadow(#333333 0px 4px 10px); - - & > .header{ - position: relative; - margin-bottom: $overlayHeadlineMargin; - h4, .close{ - line-height: $overlayHeadline; - } - h4{ - margin: 0px; - padding: 0px; - } - .close{ - position: absolute; - right: 0px; - top: 0px; - height: $overlayHeadline; - width: $overlayHeadline; - text-align: center; - font-weight: bold; - font-size: 14px; - cursor: pointer; - } - } - - & > .body{ - - - - } -} diff --git a/example/sass/_phone.scss b/example/sass/_phone.scss deleted file mode 100644 index e634c4d..0000000 --- a/example/sass/_phone.scss +++ /dev/null @@ -1,3 +0,0 @@ -@import "phone/core"; -@import "phone/viewport"; -@import "phone/overlay"; \ No newline at end of file diff --git a/example/sass/_tablet.scss b/example/sass/_tablet.scss deleted file mode 100644 index fe679f1..0000000 --- a/example/sass/_tablet.scss +++ /dev/null @@ -1,4 +0,0 @@ -@include tablet { - /* tablet styles */ - -} \ No newline at end of file diff --git a/example/sass/_utility.scss b/example/sass/_utility.scss deleted file mode 100644 index bc0d56d..0000000 --- a/example/sass/_utility.scss +++ /dev/null @@ -1,17 +0,0 @@ -$tablet_upper: 1024px; -$phone_upper: 603px; - -@mixin phone { - @media (max-width: $phone_upper) { - @content; - } - -} // @mixin phone - -@mixin tablet { - - @media (min-width: $phone_upper+1) and (max-width: $tablet_upper) { - @content; - } - -} // @mixin tablet \ No newline at end of file diff --git a/example/sass/_variables.scss b/example/sass/_variables.scss deleted file mode 100644 index 785728a..0000000 --- a/example/sass/_variables.scss +++ /dev/null @@ -1,7 +0,0 @@ -$background_color: #FFF; -$overlayBackground: #FFF; -$videoWidth: 640px; -$videoHeight: 480px; - -$text-font: Ubuntu, sans-serif; -$header-font: 'Cabin Condensed', sans-serif; \ No newline at end of file diff --git a/example/sass/_viewport.scss b/example/sass/_viewport.scss deleted file mode 100644 index f0d085b..0000000 --- a/example/sass/_viewport.scss +++ /dev/null @@ -1,89 +0,0 @@ -#interactive.viewport{ - width: $videoWidth; - height: $videoHeight; -} - -#interactive.viewport canvas, video{ - float: left; - width: $videoWidth; - height: $videoHeight; - &.drawingBuffer{ - margin-left: -$videoWidth; - } -} - -.controls { - fieldset { - border: none; - } - .input-group { - float: left; - input, button { - display: block; - } - } - .reader-config-group { - float: right; - - label { - display: block; - span { - width: 11rem; - display: inline-block; - text-align: right; - } - } - } - &:after { - content:''; - display: block; - clear: both; - } -} - -#result_strip{ - margin: 10px 0; - border-top: 1px solid #EEE; - border-bottom: 1px solid #EEE; - padding: 10px 0; - - & > ul { - padding: 0; - margin: 0; - list-style-type: none; - width: auto; - overflow-x: auto; - overflow-y: hidden; - white-space: nowrap; - - & > li{ - display: inline-block; - vertical-align: middle; - width: $videoWidth/4; - .thumbnail{ - padding: 5px; - margin: 4px; - border: 1px dashed #CCC; - - img{ - max-width: $videoWidth/4 - 20px; - } - .caption{ - white-space: normal; - h4{ - text-align: center; - word-wrap: break-word; - height: 40px; - margin: 0px; - } - } - } - } - - &:after{ - content: ""; - display: table; - clear: both; - } - } -} diff --git a/example/sass/colors.scss b/example/sass/colors.scss deleted file mode 100644 index 1af8ab8..0000000 --- a/example/sass/colors.scss +++ /dev/null @@ -1,55 +0,0 @@ -/* LESS - http://lesscss.org style sheet */ -/* Palette color codes */ -/* Palette URL: http://paletton.com/#uid=31g0q0kHZAviRSkrHLOGomVNzac */ - -/* Feel free to copy&paste color codes to your application */ - - -/* MIXINS */ - -/* As hex codes */ - -$color-primary-0: #FFC600; /* Main Primary color */ -$color-primary-1: #FFDD69; -$color-primary-2: #FFCE22; -$color-primary-3: #B78E00; -$color-primary-4: #513F00; - -$color-secondary-1-0: #0A4DB7; /* Main Secondary color (1) */ -$color-secondary-1-1: #6C9CE8; -$color-secondary-1-2: #2E6FD6; -$color-secondary-1-3: #073379; -$color-secondary-1-4: #021636; - -$color-secondary-2-0: #5809BB; /* Main Secondary color (2) */ -$color-secondary-2-1: #A36BE9; -$color-secondary-2-2: #782DD8; -$color-secondary-2-3: #3A077C; -$color-secondary-2-4: #190237; - - - -/* As RGBa codes */ - -$rgba-primary-0: rgba(255,198, 0,1); /* Main Primary color */ -$rgba-primary-1: rgba(255,221,105,1); -$rgba-primary-2: rgba(255,206, 34,1); -$rgba-primary-3: rgba(183,142, 0,1); -$rgba-primary-4: rgba( 81, 63, 0,1); - -$rgba-secondary-1-0: rgba( 10, 77,183,1); /* Main Secondary color (1) */ -$rgba-secondary-1-1: rgba(108,156,232,1); -$rgba-secondary-1-2: rgba( 46,111,214,1); -$rgba-secondary-1-3: rgba( 7, 51,121,1); -$rgba-secondary-1-4: rgba( 2, 22, 54,1); - -$rgba-secondary-2-0: rgba( 88, 9,187,1); /* Main Secondary color (2) */ -$rgba-secondary-2-1: rgba(163,107,233,1); -$rgba-secondary-2-2: rgba(120, 45,216,1); -$rgba-secondary-2-3: rgba( 58, 7,124,1); -$rgba-secondary-2-4: rgba( 25, 2, 55,1); - - - -/* Generated by Paletton.com © 2002-2014 */ -/* http://paletton.com */ \ No newline at end of file diff --git a/example/sass/fonts.scss b/example/sass/fonts.scss deleted file mode 100644 index 2863604..0000000 --- a/example/sass/fonts.scss +++ /dev/null @@ -1 +0,0 @@ -@import url('http://fonts.googleapis.com/css?family=Ubuntu:400,700|Cabin+Condensed:400,600'); \ No newline at end of file diff --git a/example/sass/phone/_core.scss b/example/sass/phone/_core.scss deleted file mode 100644 index ce92a02..0000000 --- a/example/sass/phone/_core.scss +++ /dev/null @@ -1,15 +0,0 @@ -@include phone { - #container{ - width: 300px; - margin: 10px auto; - @include box-shadow(none); - - form.voucher-form{ - input{ - &.voucher-code{ - width: 180px; - } - } - } - } -} diff --git a/example/sass/phone/_overlay.scss b/example/sass/phone/_overlay.scss deleted file mode 100644 index 1251062..0000000 --- a/example/sass/phone/_overlay.scss +++ /dev/null @@ -1,28 +0,0 @@ -@include phone { - $overlayWidth: $videoWidth; - $overlayHeadline: 16px; - $overlayHeadlineMargin: 14px; - $overlayPadding: 20px; - $overlayHeight: $videoHeight + $overlayHeadlineMargin + $overlayHeadline; - - .overlay.scanner { - width: $overlayWidth; - height: $overlayHeight; - padding: $overlayPadding; - margin-top: -($overlayHeight)/2 - $overlayPadding; - margin-left: -($overlayWidth + 2*$overlayPadding)/2; - background-color: $overlayBackground; - @include box-shadow(none); - - & > .header{ - margin-bottom: $overlayHeadlineMargin; - h4, .close{ - line-height: $overlayHeadline; - } - .close{ - height: $overlayHeadline; - width: $overlayHeadline; - } - } - } -} \ No newline at end of file diff --git a/example/sass/phone/_viewport.scss b/example/sass/phone/_viewport.scss deleted file mode 100644 index 5c861b5..0000000 --- a/example/sass/phone/_viewport.scss +++ /dev/null @@ -1,42 +0,0 @@ -@include phone { - $videoWidth: 300px; - $videoHeight: 400px; - - #interactive.viewport{ - width: $videoWidth; - height: $videoWidth; - overflow: hidden; - } - - #interactive.viewport canvas, video{ - margin-top: ($videoWidth - $videoHeight)/2; - width: $videoWidth; - height: $videoHeight; - &.drawingBuffer{ - margin-left: -$videoWidth; - } - } - - #result_strip{ - margin-top: 5px; - padding-top: 5px; - ul.thumbnails{ - & > li{ - width: $videoWidth/2; - .thumbnail{ - .imgWrapper{ - width: $videoWidth/2 - 20px; - height: $videoWidth/2 - 20px; - overflow: hidden; - img{ - margin-top: (($videoWidth/2 - 20px) - ($videoHeight/2 - 20px))/2; - width: $videoWidth/2 - 20px; - height: $videoHeight/2 - 20px; - } - } - - } - } - } - } -} \ No newline at end of file diff --git a/example/sass/scanner.scss b/example/sass/scanner.scss deleted file mode 100644 index 223f093..0000000 --- a/example/sass/scanner.scss +++ /dev/null @@ -1,14 +0,0 @@ - -@import "compass/css3"; -@import "variables"; -@import "utility"; - -/* usual styles */ - -@import "fonts"; -@import "viewport"; -@import "overlay"; -@import "icons"; - -@import "tablet"; -@import "phone"; diff --git a/example/sass/styles.scss b/example/sass/styles.scss deleted file mode 100644 index 5638d91..0000000 --- a/example/sass/styles.scss +++ /dev/null @@ -1,56 +0,0 @@ -@import "compass/css3"; -@import "variables"; -@import "utility"; - -/* usual styles */ -@import "colors"; -@import "fonts"; -@import "viewport"; -@import "overlay"; -@import "icons"; - -@import "tablet"; -@import "phone"; - -body{ - background-color: #FFF; - margin: 0px; - font-family: $text-font; - color: #1e1e1e; - font-weight: normal; - padding-top: 0; -} - -h1,h2,h3,h4 { - font-family: $header-font; -} - -header { - background: $color-primary-0; - padding: 1em; - .headline { - width: 640px; - margin: 0 auto; - h1 { - color: $color-primary-1; - font-size: 3em; - margin-bottom: 0; - } - h2 { - margin-top: 0.2em; - } - } -} - -footer { - background: $color-secondary-1-0; - color: $color-secondary-1-1; - padding: 1em 2em 2em; -} - -#container{ - width: 640px; - margin: 20px auto; - padding: 10px; -} -