Initial page
Christoph Oberhofer
11 years ago
parent
cef5423e40
commit
78bb632ede
@ -0,0 +1 @@
|
||||
_site
|
||||
@ -0,0 +1,117 @@
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
RedCloth (4.2.9-x86-mingw32)
|
||||
activesupport (4.1.7)
|
||||
i18n (~> 0.6, >= 0.6.9)
|
||||
json (~> 1.7, >= 1.7.7)
|
||||
minitest (~> 5.1)
|
||||
thread_safe (~> 0.1)
|
||||
tzinfo (~> 1.1)
|
||||
blankslate (2.1.2.4)
|
||||
celluloid (0.16.0)
|
||||
timers (~> 4.0.0)
|
||||
classifier-reborn (2.0.1)
|
||||
fast-stemmer (~> 1.0)
|
||||
coffee-script (2.3.0)
|
||||
coffee-script-source
|
||||
execjs
|
||||
coffee-script-source (1.8.0)
|
||||
colorator (0.1)
|
||||
execjs (2.2.2)
|
||||
fast-stemmer (1.0.2)
|
||||
ffi (1.9.6-x86-mingw32)
|
||||
gemoji (2.1.0)
|
||||
github-pages (28)
|
||||
RedCloth (= 4.2.9)
|
||||
jekyll (= 2.4.0)
|
||||
jekyll-coffeescript (= 1.0.0)
|
||||
jekyll-mentions (= 0.1.3)
|
||||
jekyll-redirect-from (= 0.6.2)
|
||||
jekyll-sass-converter (= 1.2.0)
|
||||
jekyll-sitemap (= 0.6.0)
|
||||
jemoji (= 0.3.0)
|
||||
kramdown (= 1.3.1)
|
||||
liquid (= 2.6.1)
|
||||
maruku (= 0.7.0)
|
||||
pygments.rb (= 0.6.0)
|
||||
rdiscount (= 2.1.7)
|
||||
redcarpet (= 3.1.2)
|
||||
hitimes (1.2.2)
|
||||
html-pipeline (1.9.0)
|
||||
activesupport (>= 2)
|
||||
nokogiri (~> 1.4)
|
||||
i18n (0.6.11)
|
||||
jekyll (2.4.0)
|
||||
classifier-reborn (~> 2.0)
|
||||
colorator (~> 0.1)
|
||||
jekyll-coffeescript (~> 1.0)
|
||||
jekyll-gist (~> 1.0)
|
||||
jekyll-paginate (~> 1.0)
|
||||
jekyll-sass-converter (~> 1.0)
|
||||
jekyll-watch (~> 1.1)
|
||||
kramdown (~> 1.3)
|
||||
liquid (~> 2.6.1)
|
||||
mercenary (~> 0.3.3)
|
||||
pygments.rb (~> 0.6.0)
|
||||
redcarpet (~> 3.1)
|
||||
safe_yaml (~> 1.0)
|
||||
toml (~> 0.1.0)
|
||||
jekyll-coffeescript (1.0.0)
|
||||
coffee-script (~> 2.2)
|
||||
jekyll-gist (1.1.0)
|
||||
jekyll-mentions (0.1.3)
|
||||
html-pipeline (~> 1.9.0)
|
||||
jekyll (~> 2.0)
|
||||
jekyll-paginate (1.1.0)
|
||||
jekyll-redirect-from (0.6.2)
|
||||
jekyll (~> 2.0)
|
||||
jekyll-sass-converter (1.2.0)
|
||||
sass (~> 3.2)
|
||||
jekyll-sitemap (0.6.0)
|
||||
jekyll-watch (1.1.1)
|
||||
listen (~> 2.7)
|
||||
jemoji (0.3.0)
|
||||
gemoji (~> 2.0)
|
||||
html-pipeline (~> 1.9)
|
||||
jekyll (~> 2.0)
|
||||
json (1.8.1)
|
||||
kramdown (1.3.1)
|
||||
liquid (2.6.1)
|
||||
listen (2.7.11)
|
||||
celluloid (>= 0.15.2)
|
||||
rb-fsevent (>= 0.9.3)
|
||||
rb-inotify (>= 0.9)
|
||||
maruku (0.7.0)
|
||||
mercenary (0.3.4)
|
||||
mini_portile (0.6.0)
|
||||
minitest (5.4.2)
|
||||
nokogiri (1.6.3.1-x86-mingw32)
|
||||
mini_portile (= 0.6.0)
|
||||
parslet (1.5.0)
|
||||
blankslate (~> 2.0)
|
||||
posix-spawn (0.3.9)
|
||||
pygments.rb (0.6.0)
|
||||
posix-spawn (~> 0.3.6)
|
||||
yajl-ruby (~> 1.1.0)
|
||||
rb-fsevent (0.9.4)
|
||||
rb-inotify (0.9.5)
|
||||
ffi (>= 0.5.0)
|
||||
rdiscount (2.1.7)
|
||||
redcarpet (3.1.2)
|
||||
safe_yaml (1.0.4)
|
||||
sass (3.4.7)
|
||||
thread_safe (0.3.4)
|
||||
timers (4.0.1)
|
||||
hitimes
|
||||
toml (0.1.2)
|
||||
parslet (~> 1.5.0)
|
||||
tzinfo (1.2.2)
|
||||
thread_safe (~> 0.1)
|
||||
yajl-ruby (1.1.0-x86-mingw32)
|
||||
|
||||
PLATFORMS
|
||||
x86-mingw32
|
||||
|
||||
DEPENDENCIES
|
||||
github-pages
|
||||
@ -0,0 +1,3 @@
|
||||
# QuaggaJS
|
||||
|
||||
An advanced barcode-scanner written in JavaScript
|
||||
@ -0,0 +1,2 @@
|
||||
name: QuaggaJS
|
||||
markdown: redcarpet
|
||||
@ -0,0 +1,43 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||
<title>QuaggaJS, an advanced barcode-reader written in JavaScript</title>
|
||||
|
||||
<link rel="stylesheet" href="/stylesheets/styles.css">
|
||||
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<header>
|
||||
<h1><img src="{{ site.url }}/assets/code128.png" alt="QuaggaJS" /></h1>
|
||||
<p>An advanced barcode-reader written in JavaScript</p>
|
||||
|
||||
<p class="view"><a href="https://github.com/serratus/quaggaJS">View the Project on GitHub <small>serratus/quaggaJS</small></a></p>
|
||||
<ul>
|
||||
<li><a href="https://github.com/serratus/quaggaJS/zipball/master">Download <strong>ZIP File</strong></a></li>
|
||||
<li><a href="https://github.com/serratus/quaggaJS/tarball/master">Download <strong>TAR Ball</strong></a></li>
|
||||
<li><a href="https://github.com/serratus/quaggaJS">Fork On <strong>GitHub</strong></a></li>
|
||||
</ul>
|
||||
</header>
|
||||
<section>
|
||||
<ul class="pages">
|
||||
{% for subpage in site.pages %}
|
||||
<li><a href="{{ subpage.url }}">{{ subpage.title }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{{ content }}
|
||||
</section>
|
||||
<footer>
|
||||
<p>This project is maintained by <a href="http://github.com/serratus">Christoph Oberhofer</a></p>
|
||||
<p><small>Hosted on GitHub Pages — Theme by <a href="https://github.com/orderedlist">orderedlist</a></small></p>
|
||||
</footer>
|
||||
</div>
|
||||
<script src="/javascripts/scale.fix.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 544 B |
@ -0,0 +1,6 @@
|
||||
---
|
||||
layout: default
|
||||
title: Examples
|
||||
---
|
||||
|
||||
# Examples
|
||||
@ -1 +0,0 @@
|
||||
"My Github Page"
|
||||
@ -0,0 +1,71 @@
|
||||
---
|
||||
layout: default
|
||||
title: Home
|
||||
---
|
||||
|
||||
quaggaJS
|
||||
========
|
||||
|
||||
QuaggaJS is a barcode-scanner entirely written in JavaScript supporting real-time localization and decoding of various types of barcodes such as EAN and CODE128. The library is also configured to use `getUserMedia` to get direct access to the user's camera stream. Although the code contains some heavy image-processing parts even recent smartphones are capable of locating and decoding barcodes in real-time.
|
||||
|
||||
![teaser][teaser_left]![teaser][teaser_right]
|
||||
|
||||
|
||||
## Yet another barcode library?
|
||||
|
||||
This is not yet another port of the great [zxing][zxing_github] library, but more of an extension to it. This implementation features a barcode locator which is capable of finding a barcode-like pattern in an image resulting in an estimated bounding box including rotation. Simply speaking, this reader is invariant in scale and rotation, whereas other libraries require the barcode to be aligned with the viewport.
|
||||
|
||||
|
||||
## Requirements
|
||||
|
||||
In order to take full advantage of quaggaJS, the browser needs to support the `getUserMedia` API which is already implemented by the recent versions of Firefox, Chrome and Opera. The API is also available on their mobile counterparts installed on Android. Safari and IE do not allow the access to the camera yet, neither on desktop, nor on mobile. You can check [caniuse][caniuse_getusermedia] for updates.
|
||||
|
||||
In cases where real-time decoding is not needed, or the platform does not support `getUserMedia` QuaggaJS is also capable of decoding image-files.
|
||||
|
||||
## Installation
|
||||
|
||||
Just clone the repository and include `quagga.min.js` in your project. The code uses [requirejs][requirejs] for dependency management.
|
||||
|
||||
## Usage
|
||||
|
||||
The library exposes the following API
|
||||
|
||||
### quagga.init(config, callback)
|
||||
|
||||
This method initializes the library for a given configuration and a function which is called when the loading-process has finished. The initialization process also requests for camera access if real-time detection is configured.
|
||||
|
||||
### quagga.start()
|
||||
|
||||
When the library is initialized, the `start()` method starts the video-stream and begins locating and decoding the images.
|
||||
|
||||
### quagga.stop()
|
||||
|
||||
If the decoder is currently running, after calling `stop()` the decoder does not process any more images.
|
||||
|
||||
### onDetected(callback)
|
||||
|
||||
Registeres a callback function which is triggered whenever a barcode-pattern has been located and decoded successfully. The callback function is called with the decoded data as the first parameter.
|
||||
|
||||
### decodeSingle(config, callback)
|
||||
|
||||
In contrast to the calls described above, this method does not rely on `getUserMedia` and operates on a single image instead. The provided callback is the same as in `onDetected` and contains the decoded data as first parameter.
|
||||
|
||||
## Examples
|
||||
|
||||
The following example takes an image `src` as input and prints the result on the console. The decoder is configured to detect _Code128_ barcodes and enables the locating-mechanism for more robust results.
|
||||
|
||||
```javascript
|
||||
quagga.decodeSingle({
|
||||
readers: [quagga.Reader.Code128Reader],
|
||||
locate: true, // try to locate the barcode in the image
|
||||
src: src //'data:image/jpg;base64,' + data
|
||||
}, function(result){
|
||||
console.log(result);
|
||||
});
|
||||
```
|
||||
|
||||
[zxing_github]: https://github.com/zxing/zxing
|
||||
[teaser_left]: https://github.com/serratus/quaggaJS/blob/master/doc/img/mobile-located.png
|
||||
[teaser_right]: https://github.com/serratus/quaggaJS/blob/master/doc/img/mobile-detected.png
|
||||
[caniuse_getusermedia]: http://caniuse.com/#feat=stream
|
||||
[requirejs]: http://requirejs.org/
|
||||
@ -0,0 +1,17 @@
|
||||
var metas = document.getElementsByTagName('meta');
|
||||
var i;
|
||||
if (navigator.userAgent.match(/iPhone/i)) {
|
||||
for (i=0; i<metas.length; i++) {
|
||||
if (metas[i].name == "viewport") {
|
||||
metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";
|
||||
}
|
||||
}
|
||||
document.addEventListener("gesturestart", gestureStart, false);
|
||||
}
|
||||
function gestureStart() {
|
||||
for (i=0; i<metas.length; i++) {
|
||||
if (metas[i].name == "viewport") {
|
||||
metas[i].content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6";
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,69 @@
|
||||
.highlight { background: #ffffff; }
|
||||
.highlight .c { color: #999988; font-style: italic } /* Comment */
|
||||
.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
|
||||
.highlight .k { font-weight: bold } /* Keyword */
|
||||
.highlight .o { font-weight: bold } /* Operator */
|
||||
.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
|
||||
.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
|
||||
.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
|
||||
.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
|
||||
.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
|
||||
.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
|
||||
.highlight .ge { font-style: italic } /* Generic.Emph */
|
||||
.highlight .gr { color: #aa0000 } /* Generic.Error */
|
||||
.highlight .gh { color: #999999 } /* Generic.Heading */
|
||||
.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
|
||||
.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
|
||||
.highlight .go { color: #888888 } /* Generic.Output */
|
||||
.highlight .gp { color: #555555 } /* Generic.Prompt */
|
||||
.highlight .gs { font-weight: bold } /* Generic.Strong */
|
||||
.highlight .gu { color: #800080; font-weight: bold; } /* Generic.Subheading */
|
||||
.highlight .gt { color: #aa0000 } /* Generic.Traceback */
|
||||
.highlight .kc { font-weight: bold } /* Keyword.Constant */
|
||||
.highlight .kd { font-weight: bold } /* Keyword.Declaration */
|
||||
.highlight .kn { font-weight: bold } /* Keyword.Namespace */
|
||||
.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
|
||||
.highlight .kr { font-weight: bold } /* Keyword.Reserved */
|
||||
.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
|
||||
.highlight .m { color: #009999 } /* Literal.Number */
|
||||
.highlight .s { color: #d14 } /* Literal.String */
|
||||
.highlight .na { color: #008080 } /* Name.Attribute */
|
||||
.highlight .nb { color: #0086B3 } /* Name.Builtin */
|
||||
.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
|
||||
.highlight .no { color: #008080 } /* Name.Constant */
|
||||
.highlight .ni { color: #800080 } /* Name.Entity */
|
||||
.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
|
||||
.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
|
||||
.highlight .nn { color: #555555 } /* Name.Namespace */
|
||||
.highlight .nt { color: #000080 } /* Name.Tag */
|
||||
.highlight .nv { color: #008080 } /* Name.Variable */
|
||||
.highlight .ow { font-weight: bold } /* Operator.Word */
|
||||
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
|
||||
.highlight .mf { color: #009999 } /* Literal.Number.Float */
|
||||
.highlight .mh { color: #009999 } /* Literal.Number.Hex */
|
||||
.highlight .mi { color: #009999 } /* Literal.Number.Integer */
|
||||
.highlight .mo { color: #009999 } /* Literal.Number.Oct */
|
||||
.highlight .sb { color: #d14 } /* Literal.String.Backtick */
|
||||
.highlight .sc { color: #d14 } /* Literal.String.Char */
|
||||
.highlight .sd { color: #d14 } /* Literal.String.Doc */
|
||||
.highlight .s2 { color: #d14 } /* Literal.String.Double */
|
||||
.highlight .se { color: #d14 } /* Literal.String.Escape */
|
||||
.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
|
||||
.highlight .si { color: #d14 } /* Literal.String.Interpol */
|
||||
.highlight .sx { color: #d14 } /* Literal.String.Other */
|
||||
.highlight .sr { color: #009926 } /* Literal.String.Regex */
|
||||
.highlight .s1 { color: #d14 } /* Literal.String.Single */
|
||||
.highlight .ss { color: #990073 } /* Literal.String.Symbol */
|
||||
.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
|
||||
.highlight .vc { color: #008080 } /* Name.Variable.Class */
|
||||
.highlight .vg { color: #008080 } /* Name.Variable.Global */
|
||||
.highlight .vi { color: #008080 } /* Name.Variable.Instance */
|
||||
.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
|
||||
|
||||
.type-csharp .highlight .k { color: #0000FF }
|
||||
.type-csharp .highlight .kt { color: #0000FF }
|
||||
.type-csharp .highlight .nf { color: #000000; font-weight: normal }
|
||||
.type-csharp .highlight .nc { color: #2B91AF }
|
||||
.type-csharp .highlight .nn { color: #000000 }
|
||||
.type-csharp .highlight .s { color: #A31515 }
|
||||
.type-csharp .highlight .sc { color: #A31515 }
|
||||
@ -0,0 +1,287 @@
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700);
|
||||
|
||||
body {
|
||||
padding:50px;
|
||||
font:14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color:#777;
|
||||
font-weight:300;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color:#222;
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
p, ul, ol, table, pre, dl {
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
line-height:1.1;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size:28px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color:#393939;
|
||||
}
|
||||
|
||||
h3, h4, h5, h6 {
|
||||
color:#494949;
|
||||
}
|
||||
|
||||
a {
|
||||
color:#39c;
|
||||
font-weight:400;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color:#069;
|
||||
}
|
||||
|
||||
a small {
|
||||
font-size:11px;
|
||||
color:#777;
|
||||
margin-top:-0.6em;
|
||||
display:block;
|
||||
}
|
||||
|
||||
a:hover small {
|
||||
color:#777;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width:860px;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left:1px solid #e5e5e5;
|
||||
margin:0;
|
||||
padding:0 0 0 20px;
|
||||
font-style:italic;
|
||||
}
|
||||
|
||||
code, pre {
|
||||
font-family:Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal, monospace;
|
||||
color:#333;
|
||||
font-size:12px;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding:8px 15px;
|
||||
background: #f8f8f8;
|
||||
border-radius:5px;
|
||||
border:1px solid #e5e5e5;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
table {
|
||||
width:100%;
|
||||
border-collapse:collapse;
|
||||
}
|
||||
|
||||
th, td {
|
||||
text-align:left;
|
||||
padding:5px 10px;
|
||||
border-bottom:1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
dt {
|
||||
color:#444;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
th {
|
||||
color:#444;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width:100%;
|
||||
}
|
||||
|
||||
header {
|
||||
width:270px;
|
||||
float:left;
|
||||
position:fixed;
|
||||
}
|
||||
|
||||
header ul {
|
||||
list-style:none;
|
||||
height:40px;
|
||||
|
||||
padding:0;
|
||||
|
||||
background: #eee;
|
||||
background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd));
|
||||
background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
|
||||
border-radius:5px;
|
||||
border:1px solid #d2d2d2;
|
||||
box-shadow:inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
|
||||
width:270px;
|
||||
}
|
||||
|
||||
header li {
|
||||
width:89px;
|
||||
float:left;
|
||||
border-right:1px solid #d2d2d2;
|
||||
height:40px;
|
||||
}
|
||||
|
||||
header li:first-child a {
|
||||
border-radius:5px 0 0 5px;
|
||||
}
|
||||
|
||||
header li:last-child a {
|
||||
border-radius:0 5px 5px 0;
|
||||
}
|
||||
|
||||
header ul a {
|
||||
line-height:1;
|
||||
font-size:11px;
|
||||
color:#999;
|
||||
display:block;
|
||||
text-align:center;
|
||||
padding-top:6px;
|
||||
height:34px;
|
||||
}
|
||||
|
||||
header ul a:hover {
|
||||
color:#999;
|
||||
background: -moz-linear-gradient(top, #fff 0%, #ddd 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#ddd));
|
||||
background: -webkit-linear-gradient(top, #fff 0%,#ddd 100%);
|
||||
background: -o-linear-gradient(top, #fff 0%,#ddd 100%);
|
||||
background: -ms-linear-gradient(top, #fff 0%,#ddd 100%);
|
||||
background: linear-gradient(top, #fff 0%,#ddd 100%);
|
||||
}
|
||||
|
||||
header ul a:active {
|
||||
-webkit-box-shadow: inset 0px 2px 2px 0px #ddd;
|
||||
-moz-box-shadow: inset 0px 2px 2px 0px #ddd;
|
||||
box-shadow: inset 0px 2px 2px 0px #ddd;
|
||||
}
|
||||
|
||||
strong {
|
||||
color:#222;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
header ul li + li {
|
||||
width:88px;
|
||||
border-left:1px solid #fff;
|
||||
}
|
||||
|
||||
header ul li + li + li {
|
||||
border-right:none;
|
||||
width:89px;
|
||||
}
|
||||
|
||||
header ul a strong {
|
||||
font-size:14px;
|
||||
display:block;
|
||||
color:#222;
|
||||
}
|
||||
|
||||
section {
|
||||
width:500px;
|
||||
float:right;
|
||||
padding-bottom:50px;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size:11px;
|
||||
}
|
||||
|
||||
hr {
|
||||
border:0;
|
||||
background:#e5e5e5;
|
||||
height:1px;
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
footer {
|
||||
width:270px;
|
||||
float:left;
|
||||
position:fixed;
|
||||
bottom:50px;
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 960px) {
|
||||
|
||||
div.wrapper {
|
||||
width:auto;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
header, section, footer {
|
||||
float:none;
|
||||
position:static;
|
||||
width:auto;
|
||||
}
|
||||
|
||||
header {
|
||||
padding-right:320px;
|
||||
}
|
||||
|
||||
section {
|
||||
border:1px solid #e5e5e5;
|
||||
border-width:1px 0;
|
||||
padding:20px 0;
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
header a small {
|
||||
display:inline;
|
||||
}
|
||||
|
||||
header ul {
|
||||
position:absolute;
|
||||
right:50px;
|
||||
top:52px;
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 720px) {
|
||||
body {
|
||||
word-wrap:break-word;
|
||||
}
|
||||
|
||||
header {
|
||||
padding:0;
|
||||
}
|
||||
|
||||
header ul, header p.view {
|
||||
position:static;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
word-wrap:normal;
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 480px) {
|
||||
body {
|
||||
padding:15px;
|
||||
}
|
||||
|
||||
header ul {
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
body {
|
||||
padding:0.4in;
|
||||
font-size:12pt;
|
||||
color:#444;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue