build css
This commit is contained in:
Bala Clark
parent
0b29b1d1db
commit
d642df8e46
5 changed files with 11139 additions and 29 deletions
393
dist/comicbook.css
vendored
Normal file
393
dist/comicbook.css
vendored
Normal file
|
|
@ -0,0 +1,393 @@
|
|||
@font-face {
|
||||
font-family: 'toolbar';
|
||||
src:url('fonts/toolbar.eot');
|
||||
src:url('fonts/toolbar.eot?#iefix') format('embedded-opentype'),
|
||||
url('fonts/toolbar.woff') format('woff'),
|
||||
url('fonts/toolbar.ttf') format('truetype'),
|
||||
url('fonts/toolbar.svg#toolbar') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* Use the following CSS code if you want to use data attributes for inserting your icons */
|
||||
[data-icon]:before {
|
||||
font-family: 'toolbar';
|
||||
content: attr(data-icon);
|
||||
speak: none;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* Use the following CSS code if you want to have a class per icon */
|
||||
/*
|
||||
Instead of a list of all class selectors,
|
||||
you can use the generic selector below, but it's slower:
|
||||
[class*="icon-"] {
|
||||
*/
|
||||
.icon-file, .icon-image, .icon-zoom-out, .icon-zoom-in, .icon-expand, .icon-expand-2, .icon-folder-open, .icon-folder, .icon-cog, .icon-menu, .icon-wrench, .icon-settings, .icon-loop, .icon-pin, .icon-first, .icon-last, .icon-arrow-left, .icon-arrow-right, .icon-arrow-left-2, .icon-arrow-right-2, .icon-arrow-left-3, .icon-arrow-right-3, .icon-previous, .icon-next, .icon-droplet, .icon-adjust, .icon-sun, .icon-remove-sign, .icon-remove, .icon-copy {
|
||||
font-family: 'toolbar';
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
.icon-file:before {
|
||||
content: "\e000";
|
||||
}
|
||||
.icon-image:before {
|
||||
content: "\e001";
|
||||
}
|
||||
.icon-zoom-out:before {
|
||||
content: "\e002";
|
||||
}
|
||||
.icon-zoom-in:before {
|
||||
content: "\e003";
|
||||
}
|
||||
.icon-expand:before {
|
||||
content: "\e004";
|
||||
}
|
||||
.icon-expand-2:before {
|
||||
content: "\e005";
|
||||
}
|
||||
.icon-folder-open:before {
|
||||
content: "\e006";
|
||||
}
|
||||
.icon-folder:before {
|
||||
content: "\e007";
|
||||
}
|
||||
.icon-cog:before {
|
||||
content: "\e008";
|
||||
}
|
||||
.icon-menu:before {
|
||||
content: "\e009";
|
||||
}
|
||||
.icon-wrench:before {
|
||||
content: "\e00a";
|
||||
}
|
||||
.icon-settings:before {
|
||||
content: "\e00b";
|
||||
}
|
||||
.icon-loop:before {
|
||||
content: "\e00c";
|
||||
}
|
||||
.icon-pin:before {
|
||||
content: "\e00d";
|
||||
}
|
||||
.icon-first:before {
|
||||
content: "\e00e";
|
||||
}
|
||||
.icon-last:before {
|
||||
content: "\e00f";
|
||||
}
|
||||
.icon-arrow-left:before {
|
||||
content: "\e011";
|
||||
}
|
||||
.icon-arrow-right:before {
|
||||
content: "\e010";
|
||||
}
|
||||
.icon-arrow-left-2:before {
|
||||
content: "\e012";
|
||||
}
|
||||
.icon-arrow-right-2:before {
|
||||
content: "\e013";
|
||||
}
|
||||
.icon-arrow-left-3:before {
|
||||
content: "\e014";
|
||||
}
|
||||
.icon-arrow-right-3:before {
|
||||
content: "\e015";
|
||||
}
|
||||
.icon-previous:before {
|
||||
content: "\e016";
|
||||
}
|
||||
.icon-next:before {
|
||||
content: "\e017";
|
||||
}
|
||||
.icon-droplet:before {
|
||||
content: "\e01a";
|
||||
}
|
||||
.icon-adjust:before {
|
||||
content: "\f042";
|
||||
}
|
||||
.icon-sun:before {
|
||||
content: "\e018";
|
||||
}
|
||||
.icon-remove-sign:before {
|
||||
content: "\f057";
|
||||
}
|
||||
.icon-remove:before {
|
||||
content: "\f00d";
|
||||
}
|
||||
.icon-copy:before {
|
||||
content: "\e037";
|
||||
}
|
||||
/* v1.0 | 20080212 */
|
||||
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
font-size: 100%;
|
||||
vertical-align: baseline;
|
||||
background: transparent;
|
||||
}
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
|
||||
/* remember to define focus styles! */
|
||||
:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* remember to highlight inserts somehow! */
|
||||
ins {
|
||||
text-decoration: none;
|
||||
}
|
||||
del {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
/* tables still need 'cellspacing="0"' in the markup */
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.cb-control {
|
||||
font-family: helvetica, arial, sans-serif;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cb-control {
|
||||
color: #fff;
|
||||
background-color: #111;
|
||||
padding: 10px;
|
||||
position: fixed !important;
|
||||
box-shadow: 0 0 4px #000;
|
||||
}
|
||||
|
||||
.navigate {
|
||||
top: 0;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
width: 128px;
|
||||
opacity: 0;
|
||||
background: center no-repeat;
|
||||
box-shadow: none;
|
||||
padding: 0 3em;
|
||||
}
|
||||
|
||||
.navigate > span {
|
||||
color: #000;
|
||||
font-size: 10em;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 1em;
|
||||
top: 35%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
body:not(.mobile) .navigate:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.navigate-left {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.navigate-right {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
#cb-loading-overlay {
|
||||
z-index: 100;
|
||||
opacity: 0.8;
|
||||
background: #000 url("img/loading.gif") no-repeat center;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#cb-status {
|
||||
z-index: 101;
|
||||
font-size: 12px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
margin: 8px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
#cb-progress-bar {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
#cb-progress-bar,
|
||||
#cb-progress-bar .progressbar-value {
|
||||
height: 3px;
|
||||
}
|
||||
|
||||
#cb-progress-bar .progressbar-value {
|
||||
width: 0;
|
||||
background: #86C441;
|
||||
border-color: #3E7600;
|
||||
}
|
||||
|
||||
* {
|
||||
-webkit-user-select: none;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
button, input, label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pull-left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
color: white;
|
||||
background-color: black;
|
||||
background-image: linear-gradient(to bottom, rgb(80, 80, 80), rgb(17, 17, 17));
|
||||
overflow: visible;
|
||||
padding: 0.75em;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
margin-bottom: 0;
|
||||
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.mobile .toolbar {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.toolbar:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.toolbar li {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.toolbar .separator {
|
||||
border: solid 1px;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.toolbar button {
|
||||
color: white;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.toolbar li > button {
|
||||
font-size: 1.5em;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
.mobile .toolbar li > button {
|
||||
padding: 0 9px;
|
||||
}
|
||||
|
||||
.toolbar li > button:hover {
|
||||
color: #8CC746;
|
||||
}
|
||||
|
||||
.toolbar button[data-action=close]:hover {
|
||||
color: #FF6464;
|
||||
}
|
||||
|
||||
.toolbar .dropdown {
|
||||
font-size: 1em;
|
||||
position: absolute;
|
||||
width: 212px;
|
||||
background-color: white;
|
||||
color: #111;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
|
||||
top: 2em;
|
||||
padding: 4px 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
body:not(.mobile) .toolbar li:hover > .dropdown {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* dropdown arrow code taken from Twitter Bootstrap 2.3.1 */
|
||||
.toolbar .dropdown:after {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: 15px;
|
||||
display: inline-block;
|
||||
border-right: 6px solid transparent;
|
||||
border-bottom: 6px solid #ffffff;
|
||||
border-left: 6px solid transparent;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.toolbar .close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dropdown .control-group {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.dropdown .sliders {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.dropdown .control-group span {
|
||||
float: left;
|
||||
margin: 0 2px;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.dropdown .control-group input[type=range] {
|
||||
width: 171px;
|
||||
float: right;
|
||||
margin: 0;
|
||||
}
|
||||
10740
dist/comicbook.js
vendored
10740
dist/comicbook.js
vendored
File diff suppressed because it is too large
Load diff
18
dist/comicbook.js.map
vendored
18
dist/comicbook.js.map
vendored
File diff suppressed because one or more lines are too long
1
dist/comicbook.min.css
vendored
Normal file
1
dist/comicbook.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
16
package.json
16
package.json
|
|
@ -10,10 +10,11 @@
|
|||
"homepage": "http://reader.justforcomics.com",
|
||||
"author": "Bala Clark <balaclark@gmail.com>",
|
||||
"scripts": {
|
||||
"build": "npm run build",
|
||||
"buildjs": "rm -f dist/*.js && browserify --transform babelify --transform browserify-handlebars app/index.js --debug | exorcist dist/comicbook.js.map > dist/comicbook.js",
|
||||
"build": "npm run buildjs ; npm run buildcss",
|
||||
"buildcss": "rm -f dist/*.css && cat assets/fonts/icomoon-toolbar/style.css app/css/reset.css app/css/styles.css app/css/toolbar.css > dist/comicbook.css && cssmin dist/comicbook.css > dist/comicbook.min.css",
|
||||
"buildjs": "rm -f dist/*.js && browserify --transform babelify --transform strictify --transform browserify-handlebars app/index.js --debug | exorcist dist/comicbook.js.map > dist/comicbook.js",
|
||||
"pretest": "standard",
|
||||
"test": "mochify -R spec --transform babelify --transform browserify-handlebars test/**/*.test.js",
|
||||
"test": "mochify -R spec --transform babelify --transform strictify --transform browserify-handlebars test/**/*.test.js",
|
||||
"test-watch": "mochify --watch -R min --transform babelify --transform browserify-handlebars test/**/*.test.js"
|
||||
},
|
||||
"repository": {
|
||||
|
|
@ -28,12 +29,12 @@
|
|||
],
|
||||
"standard": {
|
||||
"global": [
|
||||
"describe",
|
||||
"it",
|
||||
"after",
|
||||
"afterEach",
|
||||
"before",
|
||||
"beforeEach",
|
||||
"after",
|
||||
"afterEach"
|
||||
"describe",
|
||||
"it"
|
||||
],
|
||||
"ignore": [
|
||||
"assets",
|
||||
|
|
@ -54,6 +55,7 @@
|
|||
"mochify": "^2.10.0",
|
||||
"phantomjs": "^1.9.17",
|
||||
"standard": "^4.5.3",
|
||||
"strictify": "^0.2.0",
|
||||
"uglify-js": "^2.4.23"
|
||||
},
|
||||
"dependencies": {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue