Updated scan-to-input example
parent
6c3772eda3
commit
bc2d8c5f5e
@ -1,99 +0,0 @@
|
|||||||
/*
|
|
||||||
|
|
||||||
Original highlight.js style (c) Ivan Sagalaev <maniac@softwaremaniacs.org>
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
.hljs {
|
|
||||||
display: block;
|
|
||||||
overflow-x: auto;
|
|
||||||
padding: 0.5em;
|
|
||||||
background: #F0F0F0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Base color: saturation 0; */
|
|
||||||
|
|
||||||
.hljs,
|
|
||||||
.hljs-subst {
|
|
||||||
color: #444;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-comment {
|
|
||||||
color: #888888;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-keyword,
|
|
||||||
.hljs-attribute,
|
|
||||||
.hljs-selector-tag,
|
|
||||||
.hljs-meta-keyword,
|
|
||||||
.hljs-doctag,
|
|
||||||
.hljs-name {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* User color: hue: 0 */
|
|
||||||
|
|
||||||
.hljs-type,
|
|
||||||
.hljs-string,
|
|
||||||
.hljs-number,
|
|
||||||
.hljs-selector-id,
|
|
||||||
.hljs-selector-class,
|
|
||||||
.hljs-quote,
|
|
||||||
.hljs-template-tag,
|
|
||||||
.hljs-deletion {
|
|
||||||
color: #880000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-title,
|
|
||||||
.hljs-section {
|
|
||||||
color: #880000;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-regexp,
|
|
||||||
.hljs-symbol,
|
|
||||||
.hljs-variable,
|
|
||||||
.hljs-template-variable,
|
|
||||||
.hljs-link,
|
|
||||||
.hljs-selector-attr,
|
|
||||||
.hljs-selector-pseudo {
|
|
||||||
color: #BC6060;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Language color: hue: 90; */
|
|
||||||
|
|
||||||
.hljs-literal {
|
|
||||||
color: #78A960;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-built_in,
|
|
||||||
.hljs-bullet,
|
|
||||||
.hljs-code,
|
|
||||||
.hljs-addition {
|
|
||||||
color: #397300;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Meta color: hue: 200 */
|
|
||||||
|
|
||||||
.hljs-meta {
|
|
||||||
color: #1f7199;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-meta-string {
|
|
||||||
color: #4d99bf;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Misc effects */
|
|
||||||
|
|
||||||
.hljs-emphasis {
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-strong {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
@ -0,0 +1,139 @@
|
|||||||
|
/* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript+jsx */
|
||||||
|
/**
|
||||||
|
* prism.js default theme for JavaScript, CSS and HTML
|
||||||
|
* Based on dabblet (http://dabblet.com)
|
||||||
|
* @author Lea Verou
|
||||||
|
*/
|
||||||
|
|
||||||
|
code[class*="language-"],
|
||||||
|
pre[class*="language-"] {
|
||||||
|
color: black;
|
||||||
|
background: none;
|
||||||
|
text-shadow: 0 1px white;
|
||||||
|
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||||
|
text-align: left;
|
||||||
|
white-space: pre;
|
||||||
|
word-spacing: normal;
|
||||||
|
word-break: normal;
|
||||||
|
word-wrap: normal;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
-moz-tab-size: 4;
|
||||||
|
-o-tab-size: 4;
|
||||||
|
tab-size: 4;
|
||||||
|
|
||||||
|
-webkit-hyphens: none;
|
||||||
|
-moz-hyphens: none;
|
||||||
|
-ms-hyphens: none;
|
||||||
|
hyphens: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
||||||
|
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
||||||
|
text-shadow: none;
|
||||||
|
background: #b3d4fc;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
||||||
|
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
||||||
|
text-shadow: none;
|
||||||
|
background: #b3d4fc;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
code[class*="language-"],
|
||||||
|
pre[class*="language-"] {
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Code blocks */
|
||||||
|
pre[class*="language-"] {
|
||||||
|
padding: 1em;
|
||||||
|
margin: .5em 0;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
:not(pre) > code[class*="language-"],
|
||||||
|
pre[class*="language-"] {
|
||||||
|
background: #f5f2f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Inline code */
|
||||||
|
:not(pre) > code[class*="language-"] {
|
||||||
|
padding: .1em;
|
||||||
|
border-radius: .3em;
|
||||||
|
white-space: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.comment,
|
||||||
|
.token.prolog,
|
||||||
|
.token.doctype,
|
||||||
|
.token.cdata {
|
||||||
|
color: slategray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.punctuation {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.namespace {
|
||||||
|
opacity: .7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.property,
|
||||||
|
.token.tag,
|
||||||
|
.token.boolean,
|
||||||
|
.token.number,
|
||||||
|
.token.constant,
|
||||||
|
.token.symbol,
|
||||||
|
.token.deleted {
|
||||||
|
color: #905;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.selector,
|
||||||
|
.token.attr-name,
|
||||||
|
.token.string,
|
||||||
|
.token.char,
|
||||||
|
.token.builtin,
|
||||||
|
.token.inserted {
|
||||||
|
color: #690;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.operator,
|
||||||
|
.token.entity,
|
||||||
|
.token.url,
|
||||||
|
.language-css .token.string,
|
||||||
|
.style .token.string {
|
||||||
|
color: #a67f59;
|
||||||
|
background: hsla(0, 0%, 100%, .5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.atrule,
|
||||||
|
.token.attr-value,
|
||||||
|
.token.keyword {
|
||||||
|
color: #07a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.function {
|
||||||
|
color: #DD4A68;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.regex,
|
||||||
|
.token.important,
|
||||||
|
.token.variable {
|
||||||
|
color: #e90;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.important,
|
||||||
|
.token.bold {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.token.italic {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.entity {
|
||||||
|
cursor: help;
|
||||||
|
}
|
||||||
|
|
@ -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;
|
|
||||||
}
|
|
@ -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{
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,3 +0,0 @@
|
|||||||
@import "phone/core";
|
|
||||||
@import "phone/viewport";
|
|
||||||
@import "phone/overlay";
|
|
@ -1,4 +0,0 @@
|
|||||||
@include tablet {
|
|
||||||
/* tablet styles */
|
|
||||||
|
|
||||||
}
|
|
@ -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
|
|
@ -1,7 +0,0 @@
|
|||||||
$background_color: #FFF;
|
|
||||||
$overlayBackground: #FFF;
|
|
||||||
$videoWidth: 640px;
|
|
||||||
$videoHeight: 480px;
|
|
||||||
|
|
||||||
$text-font: Ubuntu, sans-serif;
|
|
||||||
$header-font: 'Cabin Condensed', sans-serif;
|
|
@ -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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -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 */
|
|
@ -1 +0,0 @@
|
|||||||
@import url('http://fonts.googleapis.com/css?family=Ubuntu:400,700|Cabin+Condensed:400,600');
|
|
@ -1,15 +0,0 @@
|
|||||||
@include phone {
|
|
||||||
#container{
|
|
||||||
width: 300px;
|
|
||||||
margin: 10px auto;
|
|
||||||
@include box-shadow(none);
|
|
||||||
|
|
||||||
form.voucher-form{
|
|
||||||
input{
|
|
||||||
&.voucher-code{
|
|
||||||
width: 180px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -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";
|
|
@ -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;
|
|
||||||
}
|
|
||||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue