84 lines
3.5 KiB
Plaintext
84 lines
3.5 KiB
Plaintext
!!! 5
|
|
html
|
|
head
|
|
meta(charset='UTF-8')
|
|
title Paint
|
|
script(src='javascripts/modernizr.js')
|
|
script(type='text/javascript')
|
|
Modernizr.load({
|
|
test: Modernizr.canvas,
|
|
nope: 'javascripts/excanvas.js'
|
|
});
|
|
link(href='stylesheets/normalize.css', rel='stylesheet')
|
|
link(href='stylesheets/bootstrap.min.css', rel='stylesheet')
|
|
link(href='stylesheets/styles.css', rel='stylesheet')
|
|
body
|
|
div.container.well
|
|
div.navbar
|
|
div.navbar-inner
|
|
a.brand(href='#') Simple Paint App
|
|
ul.nav
|
|
li
|
|
a#newCanvasBtn(href='#newPaintModal', data-toggle='modal')
|
|
i.icon-file
|
|
| New
|
|
li
|
|
a#saveCanvasBtn(href='#')
|
|
i.icon-download
|
|
| Save
|
|
li
|
|
a#clearCanvasBtn(href='#')
|
|
i.icon-remove
|
|
| Clear
|
|
form.navbar-form.pull-left
|
|
#colorPalette.btn-group.btn-small
|
|
a.btn.btn-small.btn-inverse.active(name='000000', href='#')
|
|
a.btn.btn-small.btn-danger(name='E0534E', href='#')
|
|
a.btn.btn-small.btn-warning(name='FAA630', href='#')
|
|
a.btn.btn-small.btn-success(name='5CB55C', href='#')
|
|
a.btn.btn-small.btn-info(name='48AECC', href='#')
|
|
a.btn.btn-small.btn-primary(name='0B8BCC', href='#')
|
|
canvas#myCanvas(width='1024', height='768')
|
|
#newPaintModal.modal(tabindex='-1', role='dialog', aria-labelledby='myModalLabel', aria-hidden='true')
|
|
div.modal-header
|
|
h3 Simple Paint App
|
|
div.modal-body
|
|
p Select from one of the following canvases to use:
|
|
div.row-fluid
|
|
ul.thumbnails
|
|
li#blankCanvas.span4.canvasIcon
|
|
.thumbnail
|
|
img(src='img/blank-thumbnail.gif', alt='Blank Canvas')
|
|
.caption
|
|
h4 Blank
|
|
p A blank canvas with a width size of 1024 and height size of 768.
|
|
li#spidermanCanvas.span4.canvasIcon
|
|
.thumbnail
|
|
img(width='300', height='200', src='img/spiderman-thumbnail.gif', alt='Spiderman Thumbnail')
|
|
.caption
|
|
h4 Spiderman
|
|
p A canvas with a Spiderman image on it, brilliant for colouring in.
|
|
li#batmanCanvas.span4.canvasIcon
|
|
.thumbnail
|
|
img(width='300', height='200', src='img/batman-thumbnail.gif', alt='Batman Thumbnail')
|
|
.caption
|
|
h4 Batman
|
|
p A canvas with a Batman image on it, brilliant for colouring in.
|
|
div.modal-footer
|
|
p
|
|
| Compatible with modern browsers:
|
|
image.compatibleBrowsersIcon(src='img/chrome.gif', title='Google Chrome 4.0+')
|
|
image.compatibleBrowsersIcon(src='img/firefox.gif', title='Mozilla Firefox 2.0+')
|
|
image.compatibleBrowsersIcon(src='img/ie.gif', title='Internet Explorer 9.0+')
|
|
image.compatibleBrowsersIcon(src='img/opera.gif', title='Opera 9.0+')
|
|
image.compatibleBrowsersIcon(src='img/safari.gif', title='Safari 3.1+')
|
|
footer
|
|
p.centered-header
|
|
| Created by
|
|
a(href='https://www.twitter.com/iamshanedoyle') iamshanedoyle
|
|
| for fun!
|
|
script(src='javascripts/jquery-1.8.2.min.js')
|
|
script(src='javascripts/bootstrap.js')
|
|
script(src='javascripts/paint.js')
|
|
script(src='javascripts/index.js')
|