├── README.md ├── demo.png ├── package.json └── server ├── common ├── canvastools.js ├── imageRect.js └── prescreenshot.js ├── config.js ├── electron.js ├── logger.js ├── page ├── index.html └── shortcutCapture.html ├── shortcut-window.js └── static ├── bootstrap.min.css ├── css └── canvastools.css └── font ├── fontello.eot ├── fontello.svg ├── fontello.ttf ├── fontello.woff └── fontello.woff2 /README.md: -------------------------------------------------------------------------------- 1 | # screenshot-electron 2 | 基于electron的截图开发，仿PC端qq截图。 3 | 4 | 5 | 1.下载项目到本地,在目录中安装需要的依赖包：npm install 6 | 7 | 2.使用 npm run dev 运行 8 | 9 | 功能描述后面添加： 10 | 11 | ![Alt text](/demo.png) -------------------------------------------------------------------------------- /demo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/harveyyeung/screenshot-electron/ae8b0275385e8182173e30e886f36a28caa08b91/demo.png -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "screenshot", 3 | "version": "0.0.1", 4 | "main": "server/electron.js", 5 | "dependencies": { 6 | "lodash": "^4.17.4", 7 | "electron": "^1.8.1", 8 | "electron-is-dev": "^0.3.0", 9 | "electron-log": "^2.2.11", 10 | "electron-store": "^1.3.0" 11 | }, 12 | "scripts": { 13 | "dev": "electron ./server/electron" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /server/common/canvastools.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * CanvasTools v1.0.0 3 | * (github)https://github.com/S-mohan/canvasTools 4 | * (url) https://smohan.net/lab/canvastools 5 | * (c) smohan 6 | * license MIT 7 | */ 8 | (function webpackUniversalModuleDefinition(root, factory) { 9 | if(typeof exports === 'object' && typeof module === 'object') 10 | module.exports = factory(); 11 | else if(typeof define === 'function' && define.amd) 12 | define("CanvasTools", [], factory); 13 | else if(typeof exports === 'object') 14 | exports["CanvasTools"] = factory(); 15 | else 16 | root["CanvasTools"] = factory(); 17 | })(this, function() { 18 | return /******/ (function(modules) { // webpackBootstrap 19 | /******/ // The module cache 20 | /******/ var installedModules = {}; 21 | /******/ 22 | /******/ // The require function 23 | /******/ function __webpack_require__(moduleId) { 24 | /******/ 25 | /******/ // Check if module is in cache 26 | /******/ if(installedModules[moduleId]) { 27 | /******/ return installedModules[moduleId].exports; 28 | /******/ } 29 | /******/ // Create a new module (and put it into the cache) 30 | /******/ var module = installedModules[moduleId] = { 31 | /******/ i: moduleId, 32 | /******/ l: false, 33 | /******/ exports: {} 34 | /******/ }; 35 | /******/ 36 | /******/ // Execute the module function 37 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 38 | /******/ 39 | /******/ // Flag the module as loaded 40 | /******/ module.l = true; 41 | /******/ 42 | /******/ // Return the exports of the module 43 | /******/ return module.exports; 44 | /******/ } 45 | /******/ 46 | /******/ 47 | /******/ // expose the modules object (__webpack_modules__) 48 | /******/ __webpack_require__.m = modules; 49 | /******/ 50 | /******/ // expose the module cache 51 | /******/ __webpack_require__.c = installedModules; 52 | /******/ 53 | /******/ // identity function for calling harmony imports with the correct context 54 | /******/ __webpack_require__.i = function(value) { return value; }; 55 | /******/ 56 | /******/ // define getter function for harmony exports 57 | /******/ __webpack_require__.d = function(exports, name, getter) { 58 | /******/ if(!__webpack_require__.o(exports, name)) { 59 | /******/ Object.defineProperty(exports, name, { 60 | /******/ configurable: false, 61 | /******/ enumerable: true, 62 | /******/ get: getter 63 | /******/ }); 64 | /******/ } 65 | /******/ }; 66 | /******/ 67 | /******/ // getDefaultExport function for compatibility with non-harmony modules 68 | /******/ __webpack_require__.n = function(module) { 69 | /******/ var getter = module && module.__esModule ? 70 | /******/ function getDefault() { return module['default']; } : 71 | /******/ function getModuleExports() { return module; }; 72 | /******/ __webpack_require__.d(getter, 'a', getter); 73 | /******/ return getter; 74 | /******/ }; 75 | /******/ 76 | /******/ // Object.prototype.hasOwnProperty.call 77 | /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; 78 | /******/ 79 | /******/ // __webpack_public_path__ 80 | /******/ __webpack_require__.p = ""; 81 | /******/ 82 | /******/ // Load entry module and return exports 83 | /******/ return __webpack_require__(__webpack_require__.s = 4); 84 | /******/ }) 85 | /************************************************************************/ 86 | /******/ ([ 87 | /* 0 */ 88 | /***/ (function(module, exports) { 89 | 90 | // removed by extract-text-webpack-plugin 91 | 92 | /***/ }), 93 | /* 1 */ 94 | /***/ (function(module, exports, __webpack_require__) { 95 | 96 | "use strict"; 97 | 98 | 99 | //Element.closet Polyfill 100 | //https://developer.mozilla.org/en-US/docs/Web/API/Element/closest 101 | if (window.Element && !Element.prototype.closest) { 102 | Element.prototype.closest = function (s) { 103 | var matches = (this.document || this.ownerDocument).querySelectorAll(s), 104 | i, 105 | el = this; 106 | do { 107 | i = matches.length; 108 | while (--i >= 0 && matches.item(i) !== el) {}; 109 | } while (i < 0 && (el = el.parentElement)); 110 | return el; 111 | }; 112 | } 113 | 114 | /***/ }), 115 | /* 2 */ 116 | /***/ (function(module, exports, __webpack_require__) { 117 | 118 | "use strict"; 119 | 120 | 121 | Object.defineProperty(exports, "__esModule", { 122 | value: true 123 | }); 124 | var ButtonsMap = { 125 | rect: { 126 | panel: 'stroke', 127 | name: '矩形工具' 128 | }, 129 | ellipse: { 130 | panel: 'stroke', 131 | name: '椭圆工具' 132 | }, 133 | brush: { 134 | panel: 'stroke', 135 | name: '画笔工具' 136 | }, 137 | arrow: { 138 | panel: 'stroke', 139 | name: '箭头工具' 140 | }, 141 | mosaic: { 142 | panel: 'mosaic', 143 | name: '马赛克工具' 144 | }, 145 | font: { 146 | panel: 'font', 147 | name: '文字工具' 148 | }, 149 | rubber: { 150 | name: '橡皮擦' 151 | }, 152 | undo: { 153 | name: '撤销操作' 154 | }, 155 | save: { 156 | name: '保存' 157 | }, 158 | ok: { 159 | name: '确定' 160 | }, 161 | 162 | cancel: { 163 | name: '取消' 164 | } 165 | 166 | //可用颜色 167 | };var ColorList = ['#000000', '#808080', '#800000', '#f7883a', '#308430', '#385ad3', '#800080', '#009999', '#ffffff', '#c0c0c0', '#fb3838', '#ffff00', '#99cc00', '#3894e4', '#f31bf3', '#16dcdc']; 168 | 169 | //可选择字号，Chrome不支持小于12号的字体 170 | var FontSize = [12, 14, 16, 18, 20, 22]; 171 | 172 | //画笔大小 173 | var StrokeWidth = [2, 4, 6]; 174 | 175 | /** 176 | * 获取buttons模版 177 | * @param {Array} buttons [可用按钮] 178 | * @return {String} 179 | */ 180 | var getButtons = function getButtons() { 181 | var buttons = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; 182 | 183 | var html = []; 184 | var useButton = function useButton(btn) { 185 | return buttons && !!~buttons.indexOf(btn); 186 | }; 187 | for (var key in ButtonsMap) { 188 | if (useButton(key)) { 189 | var btn = ButtonsMap[key]; 190 | html.push('
\n\t\t\t\n\t\t\t
'); 191 | } 192 | } 193 | return html.join(''); 194 | }; 195 | 196 | /** 197 | * 获取颜色面板 198 | * @param {String} color [当前选中色] 199 | * @return {String} 200 | */ 201 | var getColorPanel = function getColorPanel() { 202 | var color = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '#fb3838'; 203 | 204 | var html = ''; 205 | html += '
'; 206 | html += ''; 207 | html += '
'; 208 | 209 | var items1 = [], 210 | items2 = []; 211 | for (var i = 0; i < 16; i++) { 212 | var item = '
  • '; 213 | if (i < 8) { 214 | items1.push(item); 215 | } else { 216 | items2.push(item); 217 | } 218 | } 219 | 220 | html += '
      ' + items1.join('') + '
    '; 221 | html += '
      ' + items2.join('') + '
    '; 222 | 223 | html += '
    '; 224 | html += '
    '; 225 | 226 | return html; 227 | }; 228 | 229 | /** 230 | * 获取画笔大小面板 231 | * @param {Number} stroke [当前画笔大小] 232 | * @return {String} 233 | */ 234 | var getStrokePanel = function getStrokePanel() { 235 | var stroke = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 2; 236 | 237 | var html = '
    '; 238 | for (var i = 0, len = StrokeWidth.length; i < len; i++) { 239 | var size = StrokeWidth[i]; 240 | var classes = ['stroke', 'js-stroke-width']; 241 | size === stroke && classes.push('active'); 242 | html += ''; 243 | } 244 | html += '
    '; 245 | return html; 246 | }; 247 | 248 | /** 249 | * 获取字号选择器 250 | * @param {Number} fontSize [默认字号] 251 | * @return {String} 252 | */ 253 | var getFontPanel = function getFontPanel() { 254 | var fontSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 12; 255 | 256 | var html = ''; 263 | return html; 264 | }; 265 | 266 | /** 267 | * 获取模糊度模版 268 | * @param {Number} ambiguite [默认模糊度 0 - 1] 269 | * @return {String} 270 | */ 271 | var getAmbiguity = function getAmbiguity() { 272 | var ambiguite = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : .5; 273 | return ''; 274 | }; 275 | 276 | exports.default = { 277 | getButtons: getButtons, 278 | getColorPanel: getColorPanel, 279 | getStrokePanel: getStrokePanel, 280 | getFontPanel: getFontPanel, 281 | getAmbiguity: getAmbiguity 282 | }; 283 | module.exports = exports['default']; 284 | 285 | /***/ }), 286 | /* 3 */ 287 | /***/ (function(module, exports, __webpack_require__) { 288 | 289 | "use strict"; 290 | 291 | 292 | Object.defineProperty(exports, "__esModule", { 293 | value: true 294 | }); 295 | 296 | var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; 297 | 298 | var ArrayProto = Array.prototype; 299 | 300 | var SelectorRegs = { 301 | id: /^#([\w-]+)$/, 302 | className: /^\.([\w-]+)$/, 303 | tagName: /^[\w-]+$/ 304 | }; 305 | 306 | var isObject = function isObject(obj) { 307 | return obj !== null && (typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) === 'object'; 308 | }; 309 | 310 | var isPlainObject = function isPlainObject(obj) { 311 | return Object.prototype.toString.call(obj) === '[object Object]'; 312 | }; 313 | 314 | /** 315 | * 获取元素对象集合 316 | * @param {String} selector [选择器] 317 | * @param {HTMLElement} context [上下文对象] 318 | * @return {Array} [元素节点集合] 319 | */ 320 | var $ = function $() { 321 | var selector = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '*'; 322 | var context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document; 323 | 324 | if (typeof selector === "string") { 325 | selector = selector.trim(); 326 | var dom = []; 327 | if (SelectorRegs.id.test(selector)) { 328 | dom = document.getElementById(RegExp.$1); 329 | dom = dom ? [dom] : []; 330 | } else if (SelectorRegs.className.test(selector)) { 331 | dom = context.getElementsByClassName(RegExp.$1); 332 | } else if (SelectorRegs.tagName.test(selector)) { 333 | dom = context.getElementsByTagName(selector); 334 | } else { 335 | dom = context.querySelectorAll(selector); 336 | } 337 | return ArrayProto.slice.call(dom); 338 | } 339 | return []; 340 | }; 341 | 342 | /** 343 | * 对象遍历 344 | * @param {Object | Array} object [对象源] 345 | * @param {Function} callback [回调] 346 | * @return 347 | */ 348 | var each = function each(object, callback) { 349 | if ((typeof object === 'undefined' ? 'undefined' : _typeof(object)) === "object" && typeof callback === "function") { 350 | if (Array.isArray(object)) { 351 | for (var i = 0, len = object.length; i < len; i++) { 352 | if (callback.call(object[i], i, object[i]) === false) { 353 | break; 354 | } 355 | } 356 | } else if ('length' in object && typeof object.length === "number") { 357 | //这地方不太严谨，谨慎使用 358 | for (var k in object) { 359 | if (callback.call(object[k], k, object[k]) === false) { 360 | break; 361 | } 362 | } 363 | } 364 | } 365 | }; 366 | 367 | /** 368 | * 事件绑定，支持代理 369 | * @param {HTMLElement} element [DOM元素] 370 | * @param {String} eventType [事件类型] 371 | * @param {String} selector [选择器] 372 | * @param {Function} callback [回调] 373 | * @return 374 | */ 375 | var bind = function bind(element, eventType, selector, callback) { 376 | var sel = void 0, 377 | handler = void 0; 378 | if (typeof selector === "function") { 379 | handler = selector; 380 | } else if (typeof selector === "string" && typeof callback === "function") { 381 | sel = selector; 382 | } else { 383 | return; 384 | } 385 | if (sel) { 386 | //事件代理 387 | handler = function handler(e) { 388 | var nodes = $(sel, element); 389 | var matched = false; 390 | for (var i = 0, len = nodes.length; i < len; i++) { 391 | var node = nodes[i]; 392 | if (node === e.target || node.contains(e.target)) { 393 | matched = node; 394 | break; 395 | } 396 | } 397 | if (matched) { 398 | callback.apply(matched, ArrayProto.slice.call(arguments)); 399 | } 400 | }; 401 | } 402 | 403 | element.addEventListener(eventType, handler, false); 404 | }; 405 | 406 | /** 407 | * 事件解绑 408 | * @param {HTMLElement} element [DOM元素] 409 | * @param {String} eventType [事件类型] 410 | * @param {Function} callback [回调] 411 | * @return 412 | */ 413 | var unbind = function unbind(element, eventType, callback) { 414 | return element.removeEventListener(eventType, callback, false 415 | 416 | /** 417 | * 获取指定元素样式 418 | * @param {HTMLElement} element 419 | * @return {Object} 420 | */ 421 | ); 422 | };var getComputedStyles = function getComputedStyles(element) { 423 | return element.ownerDocument.defaultView.getComputedStyle(element, null 424 | 425 | /** 426 | * 对象深度拷贝 427 | * @param {Object} out 428 | * @return {Object} 429 | */ 430 | ); 431 | };var extend = function extend() { 432 | var out = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; 433 | 434 | for (var i = 1, len = arguments.length; i < len; i++) { 435 | var obj = arguments[i]; 436 | if (!obj || !Object.keys(obj).length) continue; 437 | for (var key in obj) { 438 | if (obj.hasOwnProperty(key)) { 439 | if (isPlainObject(obj[key])) out[key] = extend(out[key], obj[key]);else out[key] = obj[key]; 440 | } 441 | } 442 | } 443 | return out; 444 | }; 445 | 446 | var $on = function $on(elements, eventType, selector, callback) { 447 | if (!Array.isArray(elements)) { 448 | elements = [elements]; 449 | } 450 | each(elements, function (index, element) { 451 | return bind(element, eventType, selector, callback); 452 | }); 453 | }; 454 | 455 | var $off = function $off(elements, eventType, callback) { 456 | if (!Array.isArray(elements)) { 457 | elements = [elements]; 458 | } 459 | each(elements, function (index, element) { 460 | return unbind(element, eventType, callback); 461 | }); 462 | }; 463 | 464 | var classList = function classList(elements) { 465 | var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'add'; 466 | var classes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : ''; 467 | 468 | if (!Array.isArray(elements)) { 469 | elements = [elements]; 470 | } 471 | each(elements, function (index, element) { 472 | return element.classList[type](classes); 473 | }); 474 | }; 475 | 476 | exports.default = { 477 | $: $, 478 | each: each, 479 | bind: bind, 480 | extend: extend, 481 | unbind: unbind, 482 | getComputedStyles: getComputedStyles, 483 | classList: classList, 484 | $on: $on, 485 | $off: $off 486 | }; 487 | module.exports = exports['default']; 488 | 489 | /***/ }), 490 | /* 4 */ 491 | /***/ (function(module, exports, __webpack_require__) { 492 | 493 | "use strict"; 494 | 495 | 496 | Object.defineProperty(exports, "__esModule", { 497 | value: true 498 | }); 499 | 500 | var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); 501 | 502 | __webpack_require__(0); 503 | 504 | __webpack_require__(1); 505 | 506 | var _utils = __webpack_require__(3); 507 | 508 | var _utils2 = _interopRequireDefault(_utils); 509 | 510 | var _template = __webpack_require__(2); 511 | 512 | var _template2 = _interopRequireDefault(_template); 513 | 514 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 515 | 516 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 517 | 518 | //stroke类型操作 519 | var STROKE_TYPES = ['rect', 'ellipse', 'brush', 'arrow', 'mosaic', 'font', 'rubber','drag']; 520 | 521 | //默认颜色 522 | var STROKE_DEFAULT_COLOR = '#fb3838'; 523 | 524 | //默认画笔大小 525 | var STROKE_DEFAULT_WIDTH = 2; 526 | 527 | //辅助输入框padding值 528 | var TEXT_HELPER_PADDING = 2; 529 | 530 | //辅助输入框层级 531 | var TEXT_HELPER_ZINDEX = 1990; 532 | 533 | //辅助输入框ID 534 | var TEXT_HELPER_ID = 'canvas-tools_text_helper'; 535 | 536 | //输入框默认字体大小 537 | //以设置的字体大小为准，改值仅做辅助值 538 | var TEXT_HELPER_FONT_SIZE = 12; 539 | 540 | //字体 541 | var TEXT_FONT_FAMILY = '"Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Hiragino Sans GB W3","WenQuanYi Micro Hei",sans-serif'; 542 | 543 | //马赛克模糊度 544 | var AMBIGUITY_LEVEL = .7; 545 | 546 | /** 547 | * 创建画笔+颜色容器 548 | * @param {Number} stroke [默认画笔] 549 | * @param {String} color [默认颜色] 550 | * @return {HTMLElement} 551 | */ 552 | var buildStrokePanel = function buildStrokePanel() { 553 | var stroke = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : STROKE_DEFAULT_COLOR; 554 | var color = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : STROKE_DEFAULT_COLOR; 555 | 556 | var el = document.createElement('div'); 557 | el.className = 'canvas-tools__panel js-panel__stroke'; 558 | el.style.cssText += 'white-space: nowrap!important;'; 559 | el.innerHTML = _template2.default.getStrokePanel(stroke) + _template2.default.getColorPanel(color); 560 | return el; 561 | }; 562 | 563 | /** 564 | * 创建字号+颜色容器 565 | * @param {Number} fontSize [默认字号] 566 | * @param {String} color [默认颜色] 567 | * @return {HTMLElement} 568 | */ 569 | var buildFontPanel = function buildFontPanel() { 570 | var fontSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : TEXT_HELPER_FONT_SIZE; 571 | var color = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : STROKE_DEFAULT_COLOR; 572 | 573 | var el = document.createElement('div'); 574 | el.className = 'canvas-tools__panel js-panel__font'; 575 | el.style.cssText += 'white-space: nowrap!important;'; 576 | el.innerHTML = _template2.default.getFontPanel(fontSize) + _template2.default.getColorPanel(color); 577 | return el; 578 | }; 579 | 580 | /** 581 | * 创建画笔 + 模糊度容器 582 | * @param {Number} stroke [默认画笔] 583 | * @param {Number} ambiguity [默认模糊度] 584 | * @return {HTMLElement} 585 | */ 586 | var buildAmbiguityPanel = function buildAmbiguityPanel() { 587 | var stroke = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : STROKE_DEFAULT_COLOR; 588 | var ambiguity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : AMBIGUITY_LEVEL; 589 | 590 | var el = document.createElement('div'); 591 | el.className = 'canvas-tools__panel js-panel__mosaic'; 592 | el.style.cssText += 'white-space: nowrap!important;'; 593 | el.innerHTML = _template2.default.getStrokePanel(stroke) + _template2.default.getAmbiguity(ambiguity); 594 | return el; 595 | }; 596 | 597 | /** 598 | * 创建辅助文本输入框 599 | * @return {HTMLElement} 600 | */ 601 | var getTextHelper = function getTextHelper() { 602 | var $textHelper = document.getElementById(TEXT_HELPER_ID); 603 | if (!$textHelper) { 604 | $textHelper = document.createElement('div'); 605 | $textHelper.setAttribute('contenteditable', 'plaintext-only'); 606 | $textHelper.setAttribute('spellcheck', 'false'); 607 | $textHelper.setAttribute('id', TEXT_HELPER_ID); 608 | $textHelper.className = TEXT_HELPER_ID; 609 | document.body.appendChild($textHelper); 610 | } 611 | $textHelper.innerHTML = ''; 612 | $textHelper.style.cssText = 'display: block'; 613 | return $textHelper; 614 | }; 615 | 616 | /** 617 | * 初始化辅助文本输入框样式 618 | * @param {MouseEvent} event [鼠标事件] 619 | * @param {Object} state [instance state] 620 | * @param {Object} rect [instance rect] 621 | * @return {HTMLElement} 622 | */ 623 | var insertTextHelper = function insertTextHelper(event, state, rect) { 624 | var $textHelper = getTextHelper(), 625 | threshold = state.fontSize || TEXT_HELPER_FONT_SIZE, 626 | padding = 2 * TEXT_HELPER_PADDING + 2, 627 | pos = getPos(event, rect); 628 | 629 | var x = event.pageX, 630 | y = event.pageY, 631 | maxW = Math.floor(rect.width - pos.x) - padding, 632 | maxH = Math.floor(rect.height - pos.y) - padding; 633 | 634 | if (maxW <= threshold) { 635 | x -= threshold + padding - maxW; 636 | maxW = threshold; 637 | } 638 | 639 | if (maxH <= threshold) { 640 | y -= threshold + padding - maxH; 641 | maxH = threshold; 642 | } 643 | 644 | if (maxW >= rect.width) { 645 | maxW = rect.width - pos.x; 646 | } 647 | 648 | if (maxH >= rect.height) { 649 | maxH = rect.height - pos.y; 650 | } 651 | 652 | var styleMap = { 653 | 'font-size': threshold + 'px', 654 | 'line-height': threshold + 'px', 655 | 'min-width': threshold + 'px', 656 | 'min-height': threshold + 'px', 657 | 'max-width': maxW + 'px', 658 | 'max-height': maxH + 'px', 659 | 'z-index': TEXT_HELPER_ZINDEX, 660 | 'font-family': TEXT_FONT_FAMILY, 661 | display: 'block', 662 | position: 'absolute', 663 | top: y + 'px', 664 | left: x + 'px', 665 | color: state.strokeColor, 666 | padding: TEXT_HELPER_PADDING + 'px', 667 | overflow: 'hidden' 668 | }; 669 | 670 | var style = ''; 671 | 672 | for (var key in styleMap) { 673 | style += key + ':' + styleMap[key] + ';'; 674 | } 675 | 676 | $textHelper.style.cssText = style; 677 | $textHelper.focus(); 678 | return $textHelper; 679 | }; 680 | 681 | /** 682 | * 移除辅助文本输入框 683 | * @return 684 | */ 685 | var removeTextHelper = function removeTextHelper() { 686 | var $textHelper = document.getElementById(TEXT_HELPER_ID); 687 | if (!$textHelper) { 688 | return; 689 | } 690 | $textHelper.innerHTML = ''; 691 | $textHelper.style.cssText = 'display: none'; 692 | }; 693 | 694 | /** 695 | * 获取鼠标在Canvas上的位置 696 | * @param {Element Event} event [鼠标事件] 697 | * @param {Object} rect [Canvas rect] 698 | * @return {Object} 699 | */ 700 | var getPos = function getPos(event, rect) { 701 | var x = event.pageX - rect.left; 702 | var y = event.pageY - rect.top; 703 | if (x <= 0) x = 0; 704 | if (x >= rect.width) x = rect.width; 705 | if (y <= 0) y = 0; 706 | if (y >= rect.height) y = rect.height; 707 | 708 | return { 709 | x: x, 710 | y: y 711 | }; 712 | }; 713 | 714 | /** 715 | * 默认配置 716 | * @type {Object} 717 | */ 718 | var defaults = { 719 | //工具条父级对象容器 720 | container: document.body, 721 | //显示按钮 722 | buttons: ['rect', 'ellipse', 'brush', 'font', 'mosaic', 'undo','drag','ok', 'cancel','save'] 723 | 724 | //创建一个下载链接 725 | };var $saveLink = document.createElementNS('http://www.w3.org/1999/xhtml', 'a' 726 | 727 | //是否支持原生下载 728 | );var canUseSaveLink = 'download' in $saveLink; 729 | 730 | //下载文件 731 | var __downloadFile = function __downloadFile() { 732 | var t = new Date(); 733 | var formatFn = (num) => { 734 | if(num.toString().length === 2 || num.toString().length === 4) { 735 | return num.toString(); 736 | } 737 | return `0${num}`; 738 | } 739 | var timeStr = [t.getFullYear(), t.getMonth() + 1, t.getDate(), t.getHours() ,t.getMinutes(), t.getSeconds()].map(formatFn).join('') 740 | var fileName = `${timeStr}.png`; 741 | var canvas = this.canvas; 742 | 743 | if (canUseSaveLink) { 744 | var fileUrl = canvas.toDataURL('png'); 745 | fileUrl = fileUrl.replace('image/png', 'image/octet-stream'); 746 | setTimeout(function () { 747 | $saveLink.href = fileUrl; 748 | $saveLink.download = fileName; 749 | //触发click事件 750 | $saveLink.dispatchEvent(new MouseEvent('click')); 751 | }); 752 | } 753 | 754 | //for ie 10+ 755 | else if (typeof navigator !== "undefined" && typeof canvas.msToBlob === 'function' && navigator.msSaveBlob) { 756 | navigator.msSaveBlob(canvas.msToBlob(), fileName); 757 | 758 | } 759 | 760 | // other 761 | else { 762 | console.log('您的浏览器不支持该操作'); 763 | } 764 | }; 765 | 766 | 767 | var _sendFile=function _sendFile(){ 768 | var canvas = this.canvas; 769 | sendFileToMac(canvas); 770 | 771 | } 772 | var _cancelSendFile=function _cancelSendFile(){ 773 | cancelShortCut(); 774 | } 775 | 776 | //相关事件绑定 777 | function __bindEvents() { 778 | var self = this; 779 | var canvas = this.canvas, 780 | context = this.context, 781 | $el = this.$el, 782 | state = this.state, 783 | config = this.config, 784 | rect = this.rect, 785 | _handles = this._handles, 786 | history = this.history, 787 | historyDraws = this.historyDraws; 788 | 789 | 790 | var $btns = _utils2.default.$('.js-btn', $el), 791 | $fontPanel = _utils2.default.$('.js-panel__font', $el)[0], 792 | $strokePanel = _utils2.default.$('.js-panel__stroke', $el)[0], 793 | $mosaicPanel = _utils2.default.$('.js-panel__mosaic', $el)[0], 794 | $colorSelected = _utils2.default.$('.js-color-selected', $el), 795 | $colors = _utils2.default.$('.js-color', $el), 796 | $strokeWidth = _utils2.default.$('.js-stroke-width', $el), 797 | $fontSize = _utils2.default.$('.js-font-size', $el), 798 | $mosaicAmbiguity = _utils2.default.$('.js-mosaic-ambiguity', $el 799 | 800 | //按钮事件 801 | );_handles.btnEmit = function (event) { 802 | var _this = this; 803 | 804 | event.stopPropagation(); 805 | if (state.drawType === 'font') { 806 | __drawFont.call(self, event); 807 | } 808 | var panel = this.getAttribute('data-panel'); 809 | var value = this.getAttribute('data-value'); 810 | _utils2.default.each($btns, function (index, $btn) { 811 | if ($btn !== _this) { 812 | _utils2.default.classList($btn, 'remove', 'active'); 813 | } 814 | }); 815 | if (!!~STROKE_TYPES.indexOf(value)) { 816 | state.drawType = value; 817 | } 818 | if (panel) { 819 | _utils2.default.classList(this, 'toggle', 'active'); 820 | var isActive = /active/.test(this.className); 821 | var visible = isActive ? 'block' : 'none'; 822 | if (panel === 'stroke') { 823 | $fontPanel.style.display = 'none'; 824 | $mosaicPanel.style.display = 'none'; 825 | $strokePanel.style.display = visible; 826 | } else if (panel === 'font') { 827 | $fontPanel.style.display = visible; 828 | $strokePanel.style.display = 'none'; 829 | $mosaicPanel.style.display = 'none'; 830 | } else if (panel === 'mosaic') { 831 | $mosaicPanel.style.display = visible; 832 | $fontPanel.style.display = 'none'; 833 | $strokePanel.style.display = 'none'; 834 | } 835 | } else { 836 | //$fontPanel.style.display = 'none' 837 | //$strokePanel.style.display = 'none' 838 | } 839 | 840 | if(value==='ok'){ 841 | _sendFile.call(self); 842 | return; 843 | 844 | } 845 | if(value==='cancel'){ 846 | _cancelSendFile.call(self); 847 | return; 848 | 849 | } 850 | if (value === 'save') { 851 | __downloadFile.call(self); 852 | return; 853 | } 854 | 855 | //history[0]是画布的初始状态 856 | //因此只有多于1个历史记录时才可以恢复上一步 857 | if (value === 'undo' && history.length > 1) { 858 | history.pop(); 859 | historyDraws.pop(); 860 | context.putImageData(history[history.length - 1], 0, 0, 0, 0, rect.width, rect.height); 861 | }else if(value === 'undo' && history.length == 1){ 862 | refreshShortCut(); 863 | 864 | } 865 | 866 | __toggleCanvasCursor.call(self); 867 | }; 868 | 869 | _handles.toggleColor = function (event) { 870 | var color = this.getAttribute('data-value'); 871 | state.strokeColor = color; 872 | _utils2.default.each($colorSelected, function (index, item) { 873 | return item.style.background = color; 874 | }); 875 | }; 876 | 877 | _handles.toggleStrokeWidth = function (event) { 878 | state.strokeWidth = Number(this.getAttribute('data-value')); 879 | _utils2.default.each($strokeWidth, function (index, item) { 880 | var value = Number(item.getAttribute('data-value')); 881 | var method = value === state.strokeWidth ? 'add' : 'remove'; 882 | _utils2.default.classList(item, method, 'active'); 883 | }); 884 | }; 885 | 886 | _handles.toggleFontSize = function (event) { 887 | state.fontSize = Number(this.value); 888 | }; 889 | 890 | //鼠标在画布上的初始位置 891 | var _startPos = void 0; 892 | 893 | _handles.onMouseDown = function (event) { 894 | if (!!~STROKE_TYPES.indexOf(state.drawType) === false || state.drawType === 'font'|| state.drawType === 'drag') { 895 | return; 896 | } 897 | _startPos = getPos(event, rect 898 | 899 | //保存当前快照 900 | );state.lastImageData = context.getImageData(0, 0, rect.width, rect.height 901 | 902 | //初始化context状态 903 | );context.lineCap = 'round'; 904 | context.lineJoin = 'round'; 905 | context.shadowBlur = 0; 906 | context.strokeStyle = state.strokeColor; 907 | context.lineWidth = state.strokeWidth; 908 | self.tempDrawObj.strokeStyle = state.strokeColor; 909 | self.tempDrawObj.lineWidth = state.strokeWidth; 910 | self.tempDrawObj.type=state.drawType; 911 | self.tempDrawObj.points=[]; 912 | switch (state.drawType) { 913 | case 'rect': 914 | __drawRect.call(self, event, _startPos); 915 | break; 916 | case 'ellipse': 917 | __drawEllipse.call(self, event, _startPos); 918 | break; 919 | case 'mosaic': 920 | __drawMoasic.call(self, event); 921 | break; 922 | case 'brush': 923 | default: 924 | __drawBrush.call(self, event, _startPos); 925 | break; 926 | } 927 | 928 | _utils2.default.$on(document, 'mousemove', _handles.onMouseMove); 929 | _utils2.default.$on(document, 'mouseup', _handles.onMouseUp); 930 | }; 931 | 932 | _handles.onMouseMove = function (event) { 933 | if (!!~STROKE_TYPES.indexOf(state.drawType) === false || state.drawType === 'font') { 934 | return; 935 | } 936 | switch (state.drawType) { 937 | case 'rect': 938 | __drawRect.call(self, event, _startPos); 939 | break; 940 | case 'ellipse': 941 | __drawEllipse.call(self, event, _startPos); 942 | break; 943 | case 'mosaic': 944 | __drawMoasic.call(self, event); 945 | break; 946 | case 'brush': 947 | default: 948 | __drawBrush.call(self, event, null); 949 | break; 950 | } 951 | }; 952 | 953 | _handles.onMouseUp = function (event) { 954 | _utils2.default.$off(document, 'mousemove', _handles.onMouseMove); 955 | _utils2.default.$off(document, 'mouseup', _handles.onMouseUp); 956 | if (!!~STROKE_TYPES.indexOf(state.drawType) && state.drawType !== 'font') { 957 | __pushHistory.call(self); 958 | __pushHistoryDraws.call(self); 959 | 960 | } 961 | }; 962 | 963 | _handles.insertTextHelper = function (event) { 964 | event.stopPropagation(); 965 | if (state.drawType !== 'font') { 966 | return; 967 | } 968 | if (state.isEntry) { 969 | __drawFont.call(self, event); 970 | return; 971 | } 972 | insertTextHelper(event, state, rect); 973 | state.isEntry = true; 974 | }; 975 | 976 | _handles.removeTextHelper = function (event) { 977 | if (state.drawType !== 'font') { 978 | removeTextHelper(); 979 | } else if (!event.target.closest('#canvas-tools-input')) { 980 | __drawFont.call(self, event); 981 | } 982 | }; 983 | 984 | _handles.resize = function (event) { 985 | var _rect = canvas.getBoundingClientRect(); 986 | rect.width = canvas.width; 987 | rect.height = canvas.height; 988 | rect.offsetWidth = canvas.offsetWidth; 989 | rect.offsetHeight = canvas.offsetHeight; 990 | rect.top = _rect.top; 991 | rect.left = _rect.left; 992 | state.drawType === 'font' && state.isEntry && __drawFont.call(self, event); 993 | }; 994 | 995 | _handles.toggleAmbiguity = function (event) { 996 | state.ambiguity = this.value; 997 | console.log(state); 998 | }; 999 | 1000 | //按钮事件 1001 | _utils2.default.$on($btns, 'click', _handles.btnEmit 1002 | 1003 | //切换颜色 1004 | );_utils2.default.$on($colors, 'click', _handles.toggleColor 1005 | 1006 | //切换画笔大小 1007 | );_utils2.default.$on($strokeWidth, 'click', _handles.toggleStrokeWidth 1008 | 1009 | //切换字体大小 1010 | );_utils2.default.$on($fontSize, 'change', _handles.toggleFontSize); 1011 | 1012 | _utils2.default.$on($mosaicAmbiguity, 'change', _handles.toggleAmbiguity 1013 | 1014 | //矩形，椭圆，画笔等绘制 1015 | );_utils2.default.$on(canvas, 'mousedown', _handles.onMouseDown 1016 | 1017 | //插入文本辅助框 1018 | );_utils2.default.$on(canvas, 'click', _handles.insertTextHelper 1019 | 1020 | //移除文本辅助框 1021 | );_utils2.default.$on(document, 'click', _handles.removeTextHelper 1022 | 1023 | //window resize 1024 | );window.addEventListener('resize', _handles.resize); 1025 | } 1026 | 1027 | /** 1028 | * 绘制矩形 1029 | * @param {MouseEvent} event [鼠标事件] 1030 | * @param {Object} start [起始位置] 1031 | * @return 1032 | */ 1033 | function __drawRect(event, start) { 1034 | var context = this.context, 1035 | rect = this.rect, 1036 | state = this.state; 1037 | 1038 | var pos = getPos(event, rect); 1039 | __watchDrawBound.call(this,start.x, start.y) 1040 | var width = pos.x - start.x; 1041 | var height = pos.y - start.y; 1042 | this.tempDrawObj.points=[{ 1043 | x:start.x, y:start.y, width:width, height:height 1044 | }]; 1045 | context.clearRect(0, 0, rect.width, rect.height); 1046 | context.putImageData(state.lastImageData, 0, 0, 0, 0, rect.width, rect.height); 1047 | context.save(); 1048 | context.beginPath(); 1049 | context.strokeRect(start.x, start.y, width, height); 1050 | context.restore(); 1051 | context.closePath(); 1052 | __watchDrawBound.call(this,start.x+width, start.y+height); 1053 | } 1054 | /** 1055 | * 拖拽重绘绘制矩形自由绘制 1056 | */ 1057 | function __drawRectByHistory(historyObj) { 1058 | 1059 | var context = this.context, 1060 | rect = this.rect, 1061 | state = this.state; 1062 | var obj=historyObj.points[0]; 1063 | context.strokeStyle = historyObj.strokeStyle; 1064 | context.lineWidth = historyObj.lineWidth; 1065 | context.clearRect(0, 0, rect.width, rect.height); 1066 | context.putImageData(state.lastImageData, 0, 0, 0, 0, rect.width, rect.height); 1067 | context.save(); 1068 | context.beginPath(); 1069 | console.log("obj.x:"+obj.x+" obj.y："+obj.y+" this.hmovex："+this.hmovex+" this.hmovey："+this.hmovey) 1070 | context.strokeRect(obj.x-this.hmovex, obj.y-this.hmovey, obj.width, obj.height); 1071 | context.restore(); 1072 | context.closePath(); 1073 | historyObj.points=[{ 1074 | x:obj.x-this.hmovex, y: obj.y-this.hmovey, width:obj.width, height:obj.height 1075 | }]; 1076 | } 1077 | 1078 | /** 1079 | * 绘制椭圆 1080 | * @param {MouseEvent} event [鼠标事件] 1081 | * @param {Object} start [起始位置] 1082 | * @return 1083 | */ 1084 | function __drawEllipse(event, start) { 1085 | var context = this.context, 1086 | rect = this.rect, 1087 | state = this.state; 1088 | 1089 | var pos = getPos(event, rect); 1090 | var scaleX = 1 * ((pos.x - start.x) / 2); 1091 | var scaleY = 1 * ((pos.y - start.y) / 2); 1092 | var x = start.x / scaleX + 1; 1093 | var y = start.y / scaleY + 1; 1094 | this.tempDrawObj.points=[{ 1095 | startx:start.x, starty:start.y, posx:pos.x, posy:pos.y 1096 | }]; 1097 | context.clearRect(0, 0, rect.width, rect.height); 1098 | context.putImageData(state.lastImageData, 0, 0, 0, 0, rect.width, rect.height); 1099 | context.save(); 1100 | context.beginPath(); 1101 | context.scale(scaleX, scaleY); 1102 | context.arc(x, y, 1, 0, 2 * Math.PI); 1103 | context.restore(); 1104 | context.closePath(); 1105 | context.stroke(); 1106 | } 1107 | 1108 | /** 1109 | * 拖拽重绘绘制椭圆自由绘制 1110 | */ 1111 | function __drawEllipseByHistory(historyObj) { 1112 | 1113 | var context = this.context, 1114 | rect = this.rect, 1115 | state = this.state; 1116 | var obj=historyObj.points[0]; 1117 | context.strokeStyle = historyObj.strokeStyle; 1118 | context.lineWidth = historyObj.lineWidth; 1119 | 1120 | var scaleX = 1 * ((obj.posx - obj.startx) / 2); 1121 | var scaleY = 1 * ((obj.posy - obj.starty) / 2); 1122 | var x = (obj.startx-this.hmovex) / scaleX + 1; 1123 | var y = (obj.starty-this.hmovey) / scaleY + 1; 1124 | 1125 | context.clearRect(0, 0, rect.width, rect.height); 1126 | context.putImageData(state.lastImageData, 0, 0, 0, 0, rect.width, rect.height); 1127 | context.save(); 1128 | context.beginPath(); 1129 | context.scale(scaleX, scaleY); 1130 | context.arc(x, y, 1, 0, 2 * Math.PI); 1131 | context.restore(); 1132 | context.closePath(); 1133 | context.stroke(); 1134 | historyObj.points=[{ 1135 | startx:(obj.startx-this.hmovex) , starty: (obj.starty-this.hmovey), posx:(obj.posx-this.hmovex), posy:(obj.posy-this.hmovey) 1136 | }]; 1137 | } 1138 | 1139 | 1140 | 1141 | /** 1142 | * 画笔工具自由绘制 1143 | * @param {MouseEvent} event [鼠标事件] 1144 | * @param {Object | null} start [起始位置] 1145 | * @return 1146 | */ 1147 | function __drawBrush(event) { 1148 | var start = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; 1149 | var context = this.context, 1150 | rect = this.rect; 1151 | 1152 | if (start) { 1153 | context.beginPath(); 1154 | context.moveTo(start.x, start.y); 1155 | __watchDrawBound.call(this,start.x, start.y); 1156 | this.tempDrawObj.points.push({ 1157 | x:start.x, y:start.y 1158 | }); 1159 | } else { 1160 | var pos = getPos(event, rect); 1161 | __watchDrawBound.call(this,pos.x, pos.y); 1162 | this.tempDrawObj.points.push({ 1163 | x:pos.x, y:pos.y 1164 | }); 1165 | context.lineTo(pos.x, pos.y); 1166 | context.stroke(); 1167 | } 1168 | } 1169 | /** 1170 | * 拖拽重绘画笔工具自由绘制 1171 | */ 1172 | function __drawBrushByHistory(historyObj) { 1173 | 1174 | var context = this.context, 1175 | rect = this.rect; 1176 | context.strokeStyle = historyObj.strokeStyle; 1177 | context.lineWidth = historyObj.lineWidth; 1178 | let newPoints=[]; 1179 | let start= historyObj.points[0]; 1180 | context.beginPath(); 1181 | context.moveTo(start.x-this.hmovex, start.y-this.hmovey); 1182 | newPoints.push({ 1183 | x:start.x-this.hmovex, y:start.y-this.hmovey 1184 | }) 1185 | for(var i=1;i this.rect.width - x) { 1234 | context.fillText(content.substring(lastSubStrIndex, i), x, y); 1235 | y += threshold; 1236 | lineWidth = 0; 1237 | lastSubStrIndex = i; 1238 | } 1239 | if (i == length - 1) { 1240 | context.fillText(content.substring(lastSubStrIndex, i + 1), x, y); 1241 | } 1242 | } 1243 | 1244 | context.restore(); 1245 | context.closePath(); 1246 | this.historyDraws.push({type:"font",points:[{x:x,y:y}],fillStyle:this.state.strokeColor,font:this.state.fontSize + 'px ' + TEXT_FONT_FAMILY,content:content}); 1247 | this.state.isEntry = false; 1248 | removeTextHelper(); 1249 | __pushHistory.call(this); 1250 | } 1251 | /** 1252 | * 重新绘制文字 1253 | * @param {MouseEvent} event [鼠标事件] 1254 | * @return {[type]} 1255 | */ 1256 | function __drawFontByHistory(historyObj) { 1257 | 1258 | var content =historyObj.content.trim(); 1259 | var length = historyObj.content.length; 1260 | 1261 | var lineWidth = 0, lastSubStrIndex = 0, 1262 | threshold = historyObj.fontSize || TEXT_HELPER_FONT_SIZE, 1263 | context = this.context; 1264 | var x = historyObj.points[0].x-this.hmovex, 1265 | y = historyObj.points[0].y-this.hmovey; 1266 | 1267 | context.beginPath(); 1268 | context.save(); 1269 | context.fillStyle =historyObj.fillStyle; 1270 | context.font =historyObj.font; 1271 | context.fillText(content, x, y); 1272 | // for (var i = 0; i < length; i++) { 1273 | // var char = content[i]; 1274 | 1275 | // //让文字自动换行 1276 | // lineWidth += context.measureText(char).width; 1277 | // if (lineWidth > this.rect.width - x) { 1278 | // context.fillText(content.substring(lastSubStrIndex, i), x, y); 1279 | // y += threshold; 1280 | // lineWidth = 0; 1281 | // lastSubStrIndex = i; 1282 | // } 1283 | // if (i == length - 1) { 1284 | // context.fillText(content.substring(lastSubStrIndex, i + 1), x, y); 1285 | // } 1286 | // } 1287 | 1288 | context.restore(); 1289 | context.closePath(); 1290 | historyObj.points=[{x:x,y:y}] 1291 | } 1292 | /** 1293 | * 绘制马赛克 1294 | * @param {MouseEvent} event [鼠标事件] 1295 | * @return {[type]} 1296 | */ 1297 | function __drawMoasic(event) { 1298 | var context = this.context, 1299 | state = this.state, 1300 | rect = this.rect; 1301 | 1302 | var pos = getPos(event, rect); 1303 | __watchDrawBound.call(this,pos.x, pos.y) 1304 | var size = state.strokeWidth * 3; 1305 | 1306 | //获取当前位置1PX的颜色值 1307 | var data = context.getImageData(pos.x, pos.y, size, size).data; 1308 | 1309 | var r = 0, 1310 | g = 0, 1311 | b = 0; 1312 | 1313 | for (var row = 0; row < size; row++) { 1314 | for (var col = 0; col < size; col++) { 1315 | r += data[(size * row + col) * 4]; 1316 | g += data[(size * row + col) * 4 + 1]; 1317 | b += data[(size * row + col) * 4 + 2]; 1318 | } 1319 | } 1320 | 1321 | r = Math.round(r / (size * size)); 1322 | g = Math.round(g / (size * size)); 1323 | b = Math.round(b / (size * size)); 1324 | var color = 'rgba(' + r + ', ' + g + ', ' + b + ', ' + state.ambiguity + ')'; 1325 | this.tempDrawObj.points.push({ 1326 | x:pos.x, y:pos.y,size:size,color:color 1327 | }); 1328 | context.beginPath(); 1329 | context.save(); 1330 | context.fillStyle = color; 1331 | context.fillRect(pos.x, pos.y, size, size); 1332 | context.restore(); 1333 | 1334 | __watchDrawBound.call(this,pos.x+size, pos.y+size); 1335 | } 1336 | 1337 | 1338 | 1339 | /** 1340 | * 拖拽重绘绘制马赛克 1341 | */ 1342 | function __drawMoasicByHistory(historyObj) { 1343 | var context = this.context, 1344 | state = this.state, 1345 | rect = this.rect; 1346 | let newPoints=[]; 1347 | historyObj.points.forEach(element => { 1348 | context.beginPath(); 1349 | context.save(); 1350 | context.fillStyle = element.color; 1351 | context.fillRect(element.x-this.hmovex,element.y-this.hmovey, element.size, element.size); 1352 | context.restore(); 1353 | newPoints.push({ 1354 | x:element.x-this.hmovex, y:element.y-this.hmovey,size:element.size,color: element.color 1355 | }) 1356 | } 1357 | ); 1358 | historyObj.points=newPoints; 1359 | 1360 | } 1361 | 1362 | 1363 | /** 1364 | * 切换鼠标指针 1365 | * @return 1366 | */ 1367 | function __toggleCanvasCursor() { 1368 | var canvas = this.canvas; 1369 | var cursor = void 0; 1370 | switch (this.state.drawType) { 1371 | case 'brush': 1372 | cursor = 'brush'; 1373 | break; 1374 | case 'font': 1375 | cursor = 'font'; 1376 | break; 1377 | case 'mosaic': 1378 | cursor = 'mosaic'; 1379 | break; 1380 | case 'rect': 1381 | case 'ellipse': 1382 | cursor = 'crosshair'; 1383 | break; 1384 | case 'drag': 1385 | cursor = 'drag'; 1386 | break; 1387 | default: 1388 | cursor = 'default'; 1389 | } 1390 | if (cursor) { 1391 | canvas.className = canvas.className.replace(/canvas-cursor__(\w+)/, '').trim() + (' canvas-cursor__' + cursor); 1392 | } 1393 | } 1394 | 1395 | /** 1396 | * 保存到历史记录 1397 | * @return 1398 | */ 1399 | function __pushHistory() { 1400 | this.history.push(this.context.getImageData(0, 0, this.rect.width, this.rect.height)); 1401 | } 1402 | /*{ 1403 | type:"", 1404 | points:[] 1405 | 1406 | }*/ 1407 | 1408 | /** 1409 | * 保存到历史记录 1410 | * @return 1411 | */ 1412 | function __pushHistoryDraws(){ 1413 | this.historyDraws.push({type:this.tempDrawObj.type,points:this.tempDrawObj.points,strokeStyle:this.tempDrawObj.strokeStyle,lineWidth:this.tempDrawObj.lineWidth}); 1414 | this.tempDrawObj==Object.create(null); 1415 | } 1416 | 1417 | function __refreshDrawHistory(){ 1418 | // var self = this; 1419 | 1420 | this.historyDraws.forEach(element => { 1421 | 1422 | switch (element.type) { 1423 | case 'rect': 1424 | __drawRectByHistory.call(this,element); 1425 | this.state.lastImageData = this.context.getImageData(0, 0, this.rect.width,this.rect.height); 1426 | __pushHistory.call(this); 1427 | break; 1428 | case 'ellipse': 1429 | __drawEllipseByHistory.call(this,element); 1430 | this.state.lastImageData = this.context.getImageData(0, 0, this.rect.width,this.rect.height); 1431 | __pushHistory.call(this); 1432 | break; 1433 | case 'mosaic': 1434 | __drawMoasicByHistory.call(this,element); 1435 | this.state.lastImageData = this.context.getImageData(0, 0, this.rect.width,this.rect.height); 1436 | __pushHistory.call(this); 1437 | break; 1438 | case 'font': 1439 | __drawFontByHistory.call(this,element); 1440 | this.state.lastImageData = this.context.getImageData(0, 0, this.rect.width,this.rect.height); 1441 | __pushHistory.call(this); 1442 | break; 1443 | case 'brush': 1444 | default: 1445 | __drawBrushByHistory.call(this,element); 1446 | this.state.lastImageData = this.context.getImageData(0, 0, this.rect.width,this.rect.height); 1447 | __pushHistory.call(this); 1448 | break; 1449 | } 1450 | 1451 | }); 1452 | } 1453 | 1454 | function __watchDrawBound(xa,ya){ 1455 | let x =this.rect.top+ya; 1456 | let y =this.rect.left+xa; 1457 | if(this.bound){ 1458 | 1459 | this.bound.minX>x&&(this.bound.minX=x) 1460 | 1461 | this.bound.maxXy&&(this.bound.minY=y) 1464 | 1465 | this.bound.maxY{ 9 | this.injectJs(); 10 | this.isClean=true; 11 | }); 12 | 13 | } 14 | 15 | injectJs(){ 16 | this.initImage(); 17 | // this.setZoomLevel(); 18 | this.shortcutCapture(); 19 | this.cancel(); 20 | 21 | this.iconTopCursor = document.querySelectorAll('.icon_vertical_top')[0]; 22 | this.iconLeftCursor = document.querySelectorAll('.icon_horizontal_left')[0]; 23 | this.iconRightCursor = document.querySelectorAll('.icon_horizontal_right')[0]; 24 | this.iconBottomCursor = document.querySelectorAll('.icon_vertical_bottom')[0]; 25 | 26 | this.iconLeftTopCursor = document.querySelectorAll('.left_top')[0]; 27 | this.iconRightTopCursor = document.querySelectorAll('.right_top')[0]; 28 | this.iconLeftBottomCursor = document.querySelectorAll('.left_bottom')[0]; 29 | this.iconRightBottomCursor = document.querySelectorAll('.right_bottom')[0]; 30 | // this.cancelDraw(); 31 | 32 | 33 | } 34 | 35 | setZoomLevel(){ 36 | webFrame.setZoomFactor(100); 37 | webFrame.setZoomLevel(0); 38 | webFrame.setLayoutZoomLevelLimits(1,1); 39 | } 40 | 41 | initImage(){ 42 | 43 | let imageobj=new Image(); 44 | this.$imagecanvas = document.querySelector('#imagecanvas') 45 | this.imagectx = this.$imagecanvas.getContext('2d'); 46 | 47 | 48 | let $this=this; 49 | imageobj.onload=function(){ 50 | let wWidth=screen.width;; 51 | let wHeight=screen.height; 52 | $this.$imagecanvas.height=wHeight; 53 | $this.$imagecanvas.width=wWidth; 54 | $this.imagectx = $this.$imagecanvas.getContext('2d'); 55 | $this.imagectx.drawImage(this,0,0,wWidth,wHeight); 56 | $this.onDrawImage(); 57 | } 58 | imageobj.src=localStorage['imgdata']; 59 | /*用图片方式展示截图数据*/ 60 | // this.canvas = document.querySelector('#imagecanvas') 61 | // this.width = screen.width; 62 | // this.height = screen.height; 63 | // this.canvas.width = this.width; 64 | // this.canvas.height = this.height; 65 | 66 | // this.$imagecanvas=new Image(); 67 | // this.$imagecanvas.src=localStorage['imgdata']; 68 | // document.getElementsByTagName('body')[0].appendChild(this.$imagecanvas); 69 | // this.onDrawImage(); 70 | } 71 | shortcutCapture(){ 72 | this.$canvas = document.querySelector('#canvas') 73 | this.ctx = this.$canvas.getContext('2d') 74 | this.$canvas.width = 0 75 | this.$canvas.height = 0 76 | 77 | this.$captureToolbar = document.querySelector('#tools1') 78 | } 79 | 80 | onDrawImage () { 81 | const start = { 82 | x: 0, 83 | y: 0 84 | } 85 | const end = { 86 | x: 0, 87 | y: 0 88 | } 89 | 90 | const drag ={ 91 | x: 0, 92 | y :0 93 | } 94 | //放大缩小时的开始坐标 95 | const zoomStart ={ 96 | x: 0, 97 | y :0 98 | } 99 | let isDraw = false,isZoom=false,isDrag=false,zoomFlag=undefined; 100 | document.addEventListener('mousedown', e => { 101 | 102 | if (e.target.dataset.zoom) { 103 | zoomStart.x=start.x; 104 | zoomStart.y=start.y; 105 | console.log(e.target.dataset.zoom); 106 | isZoom = isDraw = true; 107 | zoomFlag = e.target.dataset.zoom; 108 | this.hideTool(); 109 | } 110 | // 拖拽处理 111 | else if (e.target.dataset.drag&&this.$cTools1.state.drawType==='drag') { 112 | console.log(e.target.dataset.drag); 113 | isDrag = isDraw = true; 114 | 115 | drag.x = e.clientX//*window.devicePixelRatio//e.clientX 116 | drag.y = e.clientY//*window.devicePixelRatio//e.clientY 117 | this.hideTool(); 118 | } 119 | // 鼠标左键 120 | else if (e.button === 0&&this.isClean) { 121 | isDraw = true 122 | this.isClean=false 123 | start.x = end.x = e.clientX//*window.devicePixelRatio//e.clientX 124 | start.y = end.y = e.clientY//*window.devicePixelRatio//e.clientY 125 | this.hideTool(); 126 | } 127 | }) 128 | document.addEventListener('mousemove', e => { 129 | if (!isDraw) { 130 | return 131 | } 132 | if (isZoom) { 133 | 134 | switch(zoomFlag){ 135 | case "zoomtop": 136 | start.y=e.clientY; 137 | start.y= start.y<0?0:(start.y>window.innerHeight ?window.innerHeight-4 :start.y); 138 | break; 139 | case "zoomright": 140 | end.x=e.clientX; 141 | end.x= end.x<0?0:(end.x> window.innerWidth ? window.innerWidth-4 :end.x); 142 | break; 143 | case "zoomleft": 144 | start.x=e.clientX; 145 | start.x= start.x<0?0:(start.x> window.innerWidth ? window.innerWidth-4 :start.x); 146 | break; 147 | case "zoombottom": 148 | end.y=e.clientY; 149 | end.y= end.y<0?0:(end.y>window.innerHeight ?window.innerHeight-4 :end.y); 150 | break; 151 | case "zoomlefttop": 152 | start.x=e.clientX; 153 | start.x= start.x<0?0:(start.x> window.innerWidth ? window.innerWidth-4 :start.x); 154 | start.y=e.clientY; 155 | start.y= start.y<0?0:(start.y>window.innerHeight ?window.innerHeight-4 :start.y); 156 | break; 157 | case "zoomrighttop": 158 | end.x=e.clientX; 159 | end.x= end.x<0?0:(end.x> window.innerWidth ? window.innerWidth-4 :end.x); 160 | start.y=e.clientY; 161 | start.y= start.y<0?0:(start.y>window.innerHeight ?window.innerHeight-4 :start.y); 162 | break; 163 | case "zoomleftbottom": 164 | start.x=e.clientX; 165 | start.x= start.x<0?0:(start.x> window.innerWidth ? window.innerWidth-4 :start.x); 166 | end.y=e.clientY; 167 | end.y= end.y<0?0:(end.y>window.innerHeight ?window.innerHeight-4 :end.y); 168 | break; 169 | case "zoomrightbottom": 170 | end.x=e.clientX; 171 | end.x= end.x<0?0:(end.x> window.innerWidth ? window.innerWidth-4 :end.x); 172 | end.y=e.clientY; 173 | end.y= end.y<0?0:(end.y>window.innerHeight ?window.innerHeight-4 :end.y); 174 | break; 175 | } 176 | //实时显示修改 177 | this.drawImage(start, end,false,zoomStart) 178 | zoomStart.x=start.x; 179 | zoomStart.y=start.y; 180 | } 181 | else if(isDrag){ 182 | console.log("isDrag") 183 | if(start.y<0||start.x<0||end.y>window.innerHeight||end.x> window.innerWidth){ 184 | if(start.y<=0){ 185 | end.y -= start.y 186 | start.y=0 187 | } 188 | if(start.x<=0){ 189 | end.x -= start.x 190 | start.x=0 191 | } 192 | if(end.y>=window.innerHeight){ 193 | start.y -= (end.y-window.innerHeight) 194 | end.y=window.innerHeight 195 | } 196 | if(end.x>= window.innerWidth){ 197 | start.x -= (end.x-window.innerWidth) 198 | end.x= window.innerWidth 199 | } 200 | return 201 | }; 202 | 203 | 204 | start.y += (e.clientY - drag.y) 205 | start.x += (e.clientX - drag.x) 206 | end.y += (e.clientY - drag.y) 207 | end.x += (e.clientX - drag.x) 208 | drag.y = e.clientY 209 | drag.x = e.clientX 210 | this.drawImage(start, end,false) 211 | } 212 | else{ 213 | console.log("else") 214 | end.x = e.clientX//*window.devicePixelRatio 215 | end.x= end.x<0?0:(end.x> window.innerWidth ? window.innerWidth-4 :end.x); 216 | end.y = e.clientY//*window.devicePixelRatio 217 | end.y= end.y<0?0:(end.y>window.innerHeight ?window.innerHeight-4 :end.y); 218 | this.drawImage(start, end,false) 219 | } 220 | 221 | }) 222 | document.addEventListener('mouseup', e => { 223 | if (!isDraw) { 224 | return 225 | } 226 | isDraw = false 227 | if (isZoom) { 228 | isZoom=false; 229 | this.drawImage(start, end, true,zoomStart) 230 | zoomStart.x=0; 231 | zoomStart.y=0; 232 | }else if(isDrag){ 233 | isDrag=false; 234 | this.drawImage(start, end, true) 235 | } 236 | else{ 237 | end.x = e.clientX//*window.devicePixelRatio 238 | end.y = e.clientY//*window.devicePixelRatio 239 | this.drawImage(start, end, true) 240 | } 241 | 242 | 243 | }) 244 | } 245 | 246 | drawImage (start, end, isShowToobar,zoomStart) { 247 | const width = Math.abs(end.x - start.x) 248 | const height = Math.abs(end.y - start.y) 249 | let style = {} 250 | if (end.y > start.y) { 251 | style.top = start.y + 'px' 252 | } else { 253 | style.bottom = window.innerHeight - start.y + 'px' 254 | } 255 | if (end.x > start.x) { 256 | style.left = start.x + 'px' 257 | } else { 258 | style.right = window.innerWidth - start.x + 'px' 259 | } 260 | ['left', 'right', 'top', 'bottom'].forEach(key => { 261 | this.$canvas.style[key] = '' 262 | this.$captureToolbar.style[key] = '' 263 | }) 264 | 265 | Object.keys(style).forEach(key => { 266 | if(style[key]) 267 | this.$canvas.style[key] = style[key] 268 | }) 269 | 270 | const windowWidth = window.innerWidth 271 | const windowHeight = window.innerHeight 272 | 273 | // 清空绘图区域 274 | this.ctx.clearRect(0, 0, windowWidth, windowHeight); 275 | const x = start.x < end.x ? start.x : end.x; 276 | const y = start.y < end.y ? start.y : end.y; 277 | if (width <= 2 || height <= 2) { 278 | this.$canvas.width = 0 279 | this.$canvas.height = 0 280 | this.$canvas.style.visibility = 'hidden' 281 | this.$captureToolbar.style.visibility = 'hidden' 282 | 283 | if (isShowToobar) { 284 | this.isClean=true 285 | } 286 | return 287 | } else { 288 | this.$canvas.width = width 289 | this.$canvas.height = height 290 | this.$canvas.style.visibility = 'visible' 291 | } 292 | 293 | this.ctx.drawImage(this.$imagecanvas, x, y, width, height, 0, 0, width, height) 294 | this.showCursor( x, y, width, height) 295 | if(isShowToobar){ 296 | if(!this.$cTools1){ 297 | this.$cTools1 = new CanvasTools(this.$canvas, {container : document.getElementById('tools1')}) 298 | }else{ 299 | zoomStart&&console.log("start.x:"+x+" start.y："+y+" zoomStart.x："+zoomStart.x+" zoomStart.y："+zoomStart.y) 300 | zoomStart?this.$cTools1.refreshSize(this.$canvas,x- zoomStart.x,y- zoomStart.y):this.$cTools1.refreshSize(this.$canvas,0,0,true); 301 | } 302 | const toolbarWidth = this.$captureToolbar.offsetWidth 303 | const toolbarHeight = this.$captureToolbar.offsetHeight 304 | let left = x + width - toolbarWidth 305 | let top = y + height + 7 306 | if (left < 0) { 307 | left = 0 308 | } 309 | if (left + toolbarWidth > windowWidth) { 310 | left = windowWidth - toolbarWidth 311 | } 312 | this.$captureToolbar.style.left = left + 'px' 313 | if (top + toolbarHeight > windowHeight) { 314 | top = y - toolbarHeight 315 | } 316 | if (top < 0) { 317 | top = 0 318 | } 319 | this.$captureToolbar.style.top = top + 'px' 320 | this.$captureToolbar.style.visibility = 'visible' 321 | }else{ 322 | zoomStart&&this.$cTools1.refreshSize(this.$canvas,x- zoomStart.x,y- zoomStart.y) 323 | } 324 | } 325 | 326 | 327 | // 显示缩放框 328 | showCursor(x, y, width, height) { 329 | 330 | this.iconTopCursor.style.top = y-2+ 'px'; 331 | this.iconTopCursor.style.left = x +width/2 + 'px'; 332 | 333 | this.iconRightCursor.style.top = y +height/2 + 'px'; 334 | this.iconRightCursor.style.left = x+width + 'px'; 335 | 336 | this.iconLeftCursor.style.top = y +height/2 + 'px'; 337 | this.iconLeftCursor.style.left = x-2 + 'px'; 338 | 339 | this.iconBottomCursor.style.left = x +width/2 + 'px'; 340 | this.iconBottomCursor.style.top = y+height + 'px'; 341 | 342 | this.iconTopCursor.style.display = 'block'; 343 | this.iconRightCursor.style.display = 'block'; 344 | this.iconLeftCursor.style.display = 'block'; 345 | this.iconBottomCursor.style.display = 'block'; 346 | 347 | 348 | this.iconLeftTopCursor.style.top = y-2+ 'px'; 349 | this.iconLeftTopCursor.style.left = x-2 +'px'; 350 | this.iconRightTopCursor.style.top = y-2+ 'px'; 351 | this.iconRightTopCursor.style.left = x+width-2 + 'px'; 352 | this.iconLeftBottomCursor.style.left = x-2 +'px'; 353 | this.iconLeftBottomCursor.style.top = y+height-2 + 'px'; 354 | this.iconRightBottomCursor.style.top = y+height-2 + 'px'; 355 | this.iconRightBottomCursor.style.left = x+width-2 + 'px'; 356 | this.iconLeftTopCursor.style.display = 'block'; 357 | this.iconRightTopCursor.style.display = 'block'; 358 | this.iconLeftBottomCursor.style.display = 'block'; 359 | this.iconRightBottomCursor.style.display = 'block'; 360 | 361 | 362 | 363 | 364 | } 365 | 366 | // 隐藏工具栏 367 | hideTool() { 368 | // if(this.$cTools1){ 369 | // this.$cTools1.destory(); 370 | // } 371 | 372 | this.$captureToolbar.style.visibility = 'hidden' 373 | // this.iconTopCursor.style.display = 'none'; 374 | // this.iconRightCursor.style.display = 'none'; 375 | // this.iconLeftCursor.style.display = 'none'; 376 | // this.iconBottomCursor.style.display = 'none'; 377 | } 378 | cancel () { 379 | window.addEventListener('keydown', e => { 380 | if (e.keyCode === 27) { 381 | this.isClean=true; 382 | this.drawImage({ x: 0, y: 0 }, { x: 0, y: 0 }) 383 | ipcRenderer.send('cancel-shortcut-capture'); 384 | } 385 | }) 386 | } 387 | 388 | cancelDraw () { 389 | this.isClean=true; 390 | const $cancel = document.querySelector('#cancel') 391 | $cancel.addEventListener('mousedown', e => { 392 | e.stopPropagation() 393 | }) 394 | $cancel.addEventListener('click', e => { 395 | e.stopPropagation() 396 | this.drawImage({ x: 0, y: 0 }, { x: 0, y: 0 }) 397 | }) 398 | } 399 | 400 | refreshDraw(){ 401 | this.isClean=true; 402 | this.drawImage({ x: 0, y: 0 }, { x: 0, y: 0 }) 403 | this.iconTopCursor.style.display = 'none'; 404 | this.iconRightCursor.style.display = 'none'; 405 | this.iconLeftCursor.style.display = 'none'; 406 | this.iconBottomCursor.style.display = 'none'; 407 | this.iconLeftTopCursor.style.display = 'none'; 408 | this.iconRightTopCursor.style.display = 'none'; 409 | this.iconLeftBottomCursor.style.display = 'none'; 410 | this.iconRightBottomCursor.style.display = 'none'; 411 | 412 | } 413 | 414 | } 415 | var imageRectObj=new Injector(); 416 | global.sendFileToMac=function(canvas){ 417 | const dataURL = canvas.toDataURL('image/jpeg') 418 | ipcRenderer.send('send-shortcut-capture', dataURL) 419 | } 420 | global.cancelShortCut=function(canvas){ 421 | ipcRenderer.send('cancel-shortcut-capture'); 422 | 423 | } 424 | global.refreshShortCut=function(){ 425 | imageRectObj.refreshDraw(); 426 | } 427 | global.downloadShortCut = function(){ 428 | ipcRenderer.send('cancel-shortcut-capture'); 429 | } 430 | 431 | 432 | 433 | 434 | -------------------------------------------------------------------------------- /server/common/prescreenshot.js: -------------------------------------------------------------------------------- 1 | 2 | const {ipcRenderer,desktopCapturer}= require('electron'); 3 | window.ipcMacMethod={}; 4 | 5 | 6 | 7 | 8 | //初始化截屏监听事件 9 | const initShortcutCapture= () =>{ 10 | 11 | ipcRenderer.on("shortcut-capture",(e)=>{ 12 | getScreenShotSource(); 13 | }) 14 | ipcRenderer.on("selectSessionChat",()=>{ 15 | selectSessionChat(); 16 | }); 17 | 18 | //截取屏幕数据 19 | ipcMacMethod.onScreenCapture=function(){ 20 | getScreenShotSource(); 21 | } 22 | 23 | } 24 | 25 | 26 | const dataURLtoBlob= (dataURL) =>{ 27 | var arr=dataURL.split(","),mime=arr[0].match(/:(.*?);/)[1], 28 | bstr=atob(arr[1]),n=bstr.length,u8arr=new Uint8Array(n); 29 | while(n--){ 30 | u8arr[n]=bstr.charCodeAt(n); 31 | } 32 | return new Blob([u8arr],{type:mime}); 33 | // return new Buffer(dataURL,'base64'); 34 | } 35 | 36 | const getScreenShotSource= (binder_id) =>{ 37 | let options = { types: ['screen'], thumbnailSize: { width: screen.width, height: screen.height } } 38 | desktopCapturer.getSources(options, function (error, sources) { 39 | if (error) return console.log(error) 40 | let source=sources[0]; 41 | localStorage['imgdata']=source.thumbnail.toDataURL();//.toPNG();//. 42 | ipcRenderer.send('shortcut-captureed',sources[0],binder_id) 43 | 44 | }) 45 | } 46 | 47 | 48 | 49 | initShortcutCapture(); 50 | 51 | -------------------------------------------------------------------------------- /server/config.js: -------------------------------------------------------------------------------- 1 | const Store = require('electron-store'); 2 | const isDev = require('electron-is-dev'); 3 | const path = require('path'); 4 | 5 | const os = require('os'); 6 | 7 | const platform = os.platform(); 8 | 9 | const rootDir = path.join(__dirname,'page'); 10 | const indexHtml = path.join(rootDir, 'index.html'); 11 | const shortcutCaptureHtml = path.join(rootDir, 'shortcutCapture.html'); 12 | const store = new Store(); 13 | const debug = store.get('debug'); 14 | 15 | module.exports = { 16 | indexUrl: `file://${indexHtml}`, 17 | shotcutUrl: `file://${shortcutCaptureHtml}`, 18 | isDev: isDev || !!debug 19 | }; -------------------------------------------------------------------------------- /server/electron.js: -------------------------------------------------------------------------------- 1 | const { app, BrowserWindow, Tray, ipcMain, globalShortcut } = require('electron'); 2 | const path = require('path'); 3 | const logger = require('./logger'); 4 | const { isDev, indexUrl } = require('./config'); 5 | 6 | const fs = require('fs'); 7 | 8 | let mainWindow, 9 | shortcutCapture, 10 | typeHotkeyMap = {}; 11 | let willQuitApp = false; 12 | 13 | function appStart() { 14 | const shouldQuit = app.makeSingleInstance(() => { 15 | // Someone tried to run a second instance, we should focus our window. 16 | if (mainWindow) { 17 | if (mainWindow.isMinimized()) { 18 | mainWindow.restore(); 19 | } 20 | mainWindow.focus(); 21 | } 22 | }); 23 | 24 | if (shouldQuit) { 25 | app.quit(); 26 | } 27 | 28 | } 29 | 30 | function createWindow() { 31 | const ShortcutCapture = require('./shortcut-window'); 32 | // Create the browser window. 33 | mainWindow = new BrowserWindow({ 34 | width: 716, 35 | height: 400, 36 | webPreferences: { 37 | webSecurity: false, 38 | nodeIntegration: false, 39 | preload: path.join(__dirname, './common/prescreenshot.js') 40 | } 41 | }); 42 | global.__mainWindow__ = mainWindow; 43 | mainWindow.loadURL(indexUrl); 44 | 45 | if (isDev) { 46 | mainWindow.webContents.openDevTools(); 47 | } 48 | 49 | mainWindow.on('close', (e) => { 50 | if (willQuitApp) { 51 | mainWindow = null; 52 | } else if (process.platform === 'darwin' || process.platform === 'win32') { 53 | e.preventDefault(); 54 | mainWindow.hide(); 55 | } 56 | }); 57 | 58 | // Emitted when the window is closed. 59 | mainWindow.on('closed', () => { 60 | logger.info('Main window is closed.'); 61 | }); 62 | 63 | 64 | mainWindow.setFullScreen(false); 65 | mainWindow.webContents.on('did-finish-load', () => { 66 | shortcutCapture = new ShortcutCapture(); 67 | 68 | }); 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | } 80 | 81 | // This method will be called when Electron has finished 82 | // initialization and is ready to create browser windows. 83 | // Some APIs can only be used after this event occurs. 84 | app.on('ready', createWindow); 85 | 86 | // Quit when all windows are closed. 87 | app.on('window-all-closed', () => { 88 | if (process.platform !== 'darwin') { 89 | app.quit(); 90 | } 91 | }); 92 | 93 | app.on('activate', () => { 94 | mainWindow.show(); 95 | }); 96 | 97 | app.on('certificate-error', (event, webContents, requestUrl, error, certificate, callback) => { 98 | event.preventDefault(); 99 | callback(true); 100 | }); 101 | 102 | app.on('before-quit', () => { 103 | willQuitApp = true; 104 | }); 105 | 106 | app.on('quit', () => { 107 | logger.info('App is quiting...'); 108 | }); 109 | 110 | process.on('uncaughtException', (err) => { 111 | logger.error(err); 112 | process.exit(500); 113 | }); 114 | 115 | 116 | const hotkeyTypeActionMap = { 117 | hideMainWindow: () => { 118 | logger.info('Trigger ctrl+w'); 119 | mainWindow.hide(); 120 | }, 121 | screenCapture:()=>{ 122 | logger.info('Trigger screen capture'); 123 | mainWindow.webContents.send('shortcut-capture') 124 | } 125 | }; 126 | 127 | const configHotkey = (type, hotkeyString) => { 128 | typeHotkeyMap[type] && globalShortcut.unregister(typeHotkeyMap[type]); 129 | if (hotkeyTypeActionMap[type]) { 130 | typeHotkeyMap[type] = hotkeyString; 131 | globalShortcut.register(hotkeyString, () => { 132 | hotkeyTypeActionMap[type](); 133 | }); 134 | } 135 | }; 136 | const unregisterAllHotkey = () => { 137 | for (const type in typeHotkeyMap) { 138 | globalShortcut.unregister(typeHotkeyMap[type]); 139 | } 140 | }; 141 | 142 | const unregisterHotkeyByType = (type) => { 143 | if( typeHotkeyMap[type]) { 144 | globalShortcut.unregister(typeHotkeyMap[type]); 145 | } 146 | }; 147 | 148 | // 注册全局快捷键截图 149 | ipcMain.on('anp::UPDATE_SREENSHOT_HOT_KEY', (e, hotkey) => { 150 | console.log('UPDATE_SREENSHOT_HOT_KEY', e, hotkey); 151 | configHotkey("screenCapture",hotkey) 152 | }); 153 | ipcMain.on('anp::REMOVE_SREENSHOT_HOT_KEY', (e) => { 154 | console.log('REMOVE_SREENSHOT_HOT_KEY'); 155 | unregisterHotkeyByType("screenCapture"); 156 | }); 157 | 158 | 159 | appStart(); 160 | -------------------------------------------------------------------------------- /server/logger.js: -------------------------------------------------------------------------------- 1 | const logger = require('electron-log'); 2 | 3 | logger.transports.console.level = 'info'; 4 | logger.transports.file.level = 'info'; 5 | logger.transports.file.maxSize = 2 * 1024 * 1024; // 2M 6 | 7 | module.exports = logger; 8 | -------------------------------------------------------------------------------- /server/page/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | screenshot 9 | 16 | 17 | 18 | 19 |
    20 | 21 |
    22 | 23 | 29 | 30 | -------------------------------------------------------------------------------- /server/page/shortcutCapture.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 截图 7 | 8 | 9 | 10 | 132 | 133 | 134 | 135 | 136 |
    137 | 138 |
    139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | -------------------------------------------------------------------------------- /server/shortcut-window.js: -------------------------------------------------------------------------------- 1 | const { 2 | globalShortcut, 3 | ipcMain, 4 | BrowserWindow, 5 | desktopCapturer, 6 | screen 7 | } = require('electron'); 8 | const path = require('path'); 9 | const {shotcutUrl,server,isDev} = require('./config') 10 | 11 | 12 | const logger = require('./logger'); 13 | // 保证函数只执行一次 14 | let isRuned = false 15 | const $windows = [] 16 | let isClose = false 17 | module.exports = class shortcutCapture{ 18 | constructor(){ 19 | if(isRuned){return} 20 | isRuned=true; 21 | //------- 注册全局快捷键,用于目前测试，如后续需要此功能，请开发人员写到合适的位置，测试之后请删除此处快捷代码 22 | // globalShortcut.register('ctrl+alt+x', function () { 23 | // logger.info('shortcut-capture.globalShortcut'); 24 | // //此处目前写死了一个binderid，如后期加非单独会话截图，请不要传递binderid 25 | // //__mainWindow__.webContents.send('shortcut-capture') 26 | // __mainWindow__.webContents.send('shortcut-capture','BlPhmZ5dDdN95gyGsERFjU8') 27 | // 28 | // }); 29 | // binder内截图发送 30 | ipcMain.on('anp::SHORTCUT_CAPTURE_BY_BINDERID', (e, binderId) => { 31 | console.log('shortcut-capture-by-binderid', e, binderId); 32 | __mainWindow__.webContents.send('shortcut-capture', binderId); 33 | }); 34 | //------- 35 | // 抓取截图之后显示窗口 36 | ipcMain.on('shortcut-captureed', (e,source,obj) => { 37 | this.$sendObj=obj; 38 | logger.info( "this.$sendObj"+this.$sendObj); 39 | this.closeWindow(); 40 | this.createWindow(source,__mainWindow__); 41 | }) 42 | 43 | ipcMain.on('cancel-shortcut-capture', (e) => { 44 | this.closeWindow(); 45 | setTimeout(() => { 46 | __mainWindow__.show(); 47 | }, 0); 48 | 49 | }); 50 | 51 | ipcMain.on('send-shortcut-capture', (e, dataURL) => { 52 | this.closeWindow(); 53 | __mainWindow__.show(); 54 | __mainWindow__.webContents.send('upload-shortcut-file',this.$sendObj,dataURL); 55 | }) 56 | } 57 | 58 | createWindow (source,__mainWindow__) { 59 | if($windows.length)return; 60 | const $win = new BrowserWindow({ 61 | fullscreen: true, 62 | width: 900, 63 | height: 800, 64 | alwaysOnTop: true, 65 | skipTaskbar: false, 66 | autoHideMenuBar: true, 67 | show:false, 68 | webPreferences: { 69 | webSecurity: false, 70 | nodeIntegration: true, 71 | plugins:true, 72 | preload: path.join(__dirname, './common/imageRect.js') 73 | } 74 | }) 75 | 76 | // this.setFullScreen($win, display) 77 | // 只能通过cancel-shortcut-capture的方式关闭窗口 78 | $win.on('close', e => { 79 | this.closeWindow(); 80 | setTimeout(()=>{ 81 | __mainWindow__.show(); 82 | },0); 83 | }) 84 | 85 | if (isDev) { 86 | $win.webContents.openDevTools(); 87 | } 88 | 89 | // 页面初始化完成之后再显示窗口 90 | // 并检测是否有版本更新 91 | $win.once('ready-to-show', () => { 92 | __mainWindow__.hide(); 93 | $win.show() 94 | $win.focus() 95 | // 重新调整窗口位置和大小 96 | // this.setFullScreen($win, display) 97 | }) 98 | $win.webContents.on('dom-ready', () => { 99 | //$win.webContents.executeJavaScript(`window.source = ${JSON.stringify(source)}`) 100 | $win.webContents.send('dom-ready') 101 | $win.focus() 102 | }) 103 | logger.info(`${shotcutUrl}`); 104 | $win.loadURL(`${shotcutUrl}`) 105 | $windows.push($win) 106 | } 107 | 108 | 109 | closeWindow () { 110 | isClose = true 111 | while ($windows.length) { 112 | const $winItem = $windows.pop() 113 | $winItem.close() 114 | } 115 | isClose = false 116 | } 117 | 118 | 119 | } 120 | 121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /server/static/bootstrap.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.3.0 (http://getbootstrap.com) 3 | * Copyright 2011-2014 Twitter, Inc. 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 5 | *//*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0;font-size:2em}mark{color:#000;background:#ff0}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{height:0;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;font:inherit;color:inherit}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input[type=checkbox],input[type=radio]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid silver}legend{padding:0;border:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */@media print{*,:before,:after{color:#000!important;text-shadow:none!important;background:transparent!important;-webkit-box-shadow:none!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}select{background:#fff!important}.navbar{display:none}.btn>.caret,.dropup>.btn>.caret{border-top-color:#000!important}.label{border:1px solid #000}.table{border-collapse:collapse!important}.table td,.table th{background-color:#fff!important}.table-bordered th,.table-bordered td{border:1px solid #ddd!important}}@font-face{font-family:'Glyphicons Halflings';src:url(../fonts/glyphicons-halflings-regular.eot);src:url(../fonts/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'),url(../fonts/glyphicons-halflings-regular.woff) format('woff'),url(../fonts/glyphicons-halflings-regular.ttf) format('truetype'),url(../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg')}.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.glyphicon-asterisk:before{content:"\2a"}.glyphicon-plus:before{content:"\2b"}.glyphicon-euro:before,.glyphicon-eur:before{content:"\20ac"}.glyphicon-minus:before{content:"\2212"}.glyphicon-cloud:before{content:"\2601"}.glyphicon-envelope:before{content:"\2709"}.glyphicon-pencil:before{content:"\270f"}.glyphicon-glass:before{content:"\e001"}.glyphicon-music:before{content:"\e002"}.glyphicon-search:before{content:"\e003"}.glyphicon-heart:before{content:"\e005"}.glyphicon-star:before{content:"\e006"}.glyphicon-star-empty:before{content:"\e007"}.glyphicon-user:before{content:"\e008"}.glyphicon-film:before{content:"\e009"}.glyphicon-th-large:before{content:"\e010"}.glyphicon-th:before{content:"\e011"}.glyphicon-th-list:before{content:"\e012"}.glyphicon-ok:before{content:"\e013"}.glyphicon-remove:before{content:"\e014"}.glyphicon-zoom-in:before{content:"\e015"}.glyphicon-zoom-out:before{content:"\e016"}.glyphicon-off:before{content:"\e017"}.glyphicon-signal:before{content:"\e018"}.glyphicon-cog:before{content:"\e019"}.glyphicon-trash:before{content:"\e020"}.glyphicon-home:before{content:"\e021"}.glyphicon-file:before{content:"\e022"}.glyphicon-time:before{content:"\e023"}.glyphicon-road:before{content:"\e024"}.glyphicon-download-alt:before{content:"\e025"}.glyphicon-download:before{content:"\e026"}.glyphicon-upload:before{content:"\e027"}.glyphicon-inbox:before{content:"\e028"}.glyphicon-play-circle:before{content:"\e029"}.glyphicon-repeat:before{content:"\e030"}.glyphicon-refresh:before{content:"\e031"}.glyphicon-list-alt:before{content:"\e032"}.glyphicon-lock:before{content:"\e033"}.glyphicon-flag:before{content:"\e034"}.glyphicon-headphones:before{content:"\e035"}.glyphicon-volume-off:before{content:"\e036"}.glyphicon-volume-down:before{content:"\e037"}.glyphicon-volume-up:before{content:"\e038"}.glyphicon-qrcode:before{content:"\e039"}.glyphicon-barcode:before{content:"\e040"}.glyphicon-tag:before{content:"\e041"}.glyphicon-tags:before{content:"\e042"}.glyphicon-book:before{content:"\e043"}.glyphicon-bookmark:before{content:"\e044"}.glyphicon-print:before{content:"\e045"}.glyphicon-camera:before{content:"\e046"}.glyphicon-font:before{content:"\e047"}.glyphicon-bold:before{content:"\e048"}.glyphicon-italic:before{content:"\e049"}.glyphicon-text-height:before{content:"\e050"}.glyphicon-text-width:before{content:"\e051"}.glyphicon-align-left:before{content:"\e052"}.glyphicon-align-center:before{content:"\e053"}.glyphicon-align-right:before{content:"\e054"}.glyphicon-align-justify:before{content:"\e055"}.glyphicon-list:before{content:"\e056"}.glyphicon-indent-left:before{content:"\e057"}.glyphicon-indent-right:before{content:"\e058"}.glyphicon-facetime-video:before{content:"\e059"}.glyphicon-picture:before{content:"\e060"}.glyphicon-map-marker:before{content:"\e062"}.glyphicon-adjust:before{content:"\e063"}.glyphicon-tint:before{content:"\e064"}.glyphicon-edit:before{content:"\e065"}.glyphicon-share:before{content:"\e066"}.glyphicon-check:before{content:"\e067"}.glyphicon-move:before{content:"\e068"}.glyphicon-step-backward:before{content:"\e069"}.glyphicon-fast-backward:before{content:"\e070"}.glyphicon-backward:before{content:"\e071"}.glyphicon-play:before{content:"\e072"}.glyphicon-pause:before{content:"\e073"}.glyphicon-stop:before{content:"\e074"}.glyphicon-forward:before{content:"\e075"}.glyphicon-fast-forward:before{content:"\e076"}.glyphicon-step-forward:before{content:"\e077"}.glyphicon-eject:before{content:"\e078"}.glyphicon-chevron-left:before{content:"\e079"}.glyphicon-chevron-right:before{content:"\e080"}.glyphicon-plus-sign:before{content:"\e081"}.glyphicon-minus-sign:before{content:"\e082"}.glyphicon-remove-sign:before{content:"\e083"}.glyphicon-ok-sign:before{content:"\e084"}.glyphicon-question-sign:before{content:"\e085"}.glyphicon-info-sign:before{content:"\e086"}.glyphicon-screenshot:before{content:"\e087"}.glyphicon-remove-circle:before{content:"\e088"}.glyphicon-ok-circle:before{content:"\e089"}.glyphicon-ban-circle:before{content:"\e090"}.glyphicon-arrow-left:before{content:"\e091"}.glyphicon-arrow-right:before{content:"\e092"}.glyphicon-arrow-up:before{content:"\e093"}.glyphicon-arrow-down:before{content:"\e094"}.glyphicon-share-alt:before{content:"\e095"}.glyphicon-resize-full:before{content:"\e096"}.glyphicon-resize-small:before{content:"\e097"}.glyphicon-exclamation-sign:before{content:"\e101"}.glyphicon-gift:before{content:"\e102"}.glyphicon-leaf:before{content:"\e103"}.glyphicon-fire:before{content:"\e104"}.glyphicon-eye-open:before{content:"\e105"}.glyphicon-eye-close:before{content:"\e106"}.glyphicon-warning-sign:before{content:"\e107"}.glyphicon-plane:before{content:"\e108"}.glyphicon-calendar:before{content:"\e109"}.glyphicon-random:before{content:"\e110"}.glyphicon-comment:before{content:"\e111"}.glyphicon-magnet:before{content:"\e112"}.glyphicon-chevron-up:before{content:"\e113"}.glyphicon-chevron-down:before{content:"\e114"}.glyphicon-retweet:before{content:"\e115"}.glyphicon-shopping-cart:before{content:"\e116"}.glyphicon-folder-close:before{content:"\e117"}.glyphicon-folder-open:before{content:"\e118"}.glyphicon-resize-vertical:before{content:"\e119"}.glyphicon-resize-horizontal:before{content:"\e120"}.glyphicon-hdd:before{content:"\e121"}.glyphicon-bullhorn:before{content:"\e122"}.glyphicon-bell:before{content:"\e123"}.glyphicon-certificate:before{content:"\e124"}.glyphicon-thumbs-up:before{content:"\e125"}.glyphicon-thumbs-down:before{content:"\e126"}.glyphicon-hand-right:before{content:"\e127"}.glyphicon-hand-left:before{content:"\e128"}.glyphicon-hand-up:before{content:"\e129"}.glyphicon-hand-down:before{content:"\e130"}.glyphicon-circle-arrow-right:before{content:"\e131"}.glyphicon-circle-arrow-left:before{content:"\e132"}.glyphicon-circle-arrow-up:before{content:"\e133"}.glyphicon-circle-arrow-down:before{content:"\e134"}.glyphicon-globe:before{content:"\e135"}.glyphicon-wrench:before{content:"\e136"}.glyphicon-tasks:before{content:"\e137"}.glyphicon-filter:before{content:"\e138"}.glyphicon-briefcase:before{content:"\e139"}.glyphicon-fullscreen:before{content:"\e140"}.glyphicon-dashboard:before{content:"\e141"}.glyphicon-paperclip:before{content:"\e142"}.glyphicon-heart-empty:before{content:"\e143"}.glyphicon-link:before{content:"\e144"}.glyphicon-phone:before{content:"\e145"}.glyphicon-pushpin:before{content:"\e146"}.glyphicon-usd:before{content:"\e148"}.glyphicon-gbp:before{content:"\e149"}.glyphicon-sort:before{content:"\e150"}.glyphicon-sort-by-alphabet:before{content:"\e151"}.glyphicon-sort-by-alphabet-alt:before{content:"\e152"}.glyphicon-sort-by-order:before{content:"\e153"}.glyphicon-sort-by-order-alt:before{content:"\e154"}.glyphicon-sort-by-attributes:before{content:"\e155"}.glyphicon-sort-by-attributes-alt:before{content:"\e156"}.glyphicon-unchecked:before{content:"\e157"}.glyphicon-expand:before{content:"\e158"}.glyphicon-collapse-down:before{content:"\e159"}.glyphicon-collapse-up:before{content:"\e160"}.glyphicon-log-in:before{content:"\e161"}.glyphicon-flash:before{content:"\e162"}.glyphicon-log-out:before{content:"\e163"}.glyphicon-new-window:before{content:"\e164"}.glyphicon-record:before{content:"\e165"}.glyphicon-save:before{content:"\e166"}.glyphicon-open:before{content:"\e167"}.glyphicon-saved:before{content:"\e168"}.glyphicon-import:before{content:"\e169"}.glyphicon-export:before{content:"\e170"}.glyphicon-send:before{content:"\e171"}.glyphicon-floppy-disk:before{content:"\e172"}.glyphicon-floppy-saved:before{content:"\e173"}.glyphicon-floppy-remove:before{content:"\e174"}.glyphicon-floppy-save:before{content:"\e175"}.glyphicon-floppy-open:before{content:"\e176"}.glyphicon-credit-card:before{content:"\e177"}.glyphicon-transfer:before{content:"\e178"}.glyphicon-cutlery:before{content:"\e179"}.glyphicon-header:before{content:"\e180"}.glyphicon-compressed:before{content:"\e181"}.glyphicon-earphone:before{content:"\e182"}.glyphicon-phone-alt:before{content:"\e183"}.glyphicon-tower:before{content:"\e184"}.glyphicon-stats:before{content:"\e185"}.glyphicon-sd-video:before{content:"\e186"}.glyphicon-hd-video:before{content:"\e187"}.glyphicon-subtitles:before{content:"\e188"}.glyphicon-sound-stereo:before{content:"\e189"}.glyphicon-sound-dolby:before{content:"\e190"}.glyphicon-sound-5-1:before{content:"\e191"}.glyphicon-sound-6-1:before{content:"\e192"}.glyphicon-sound-7-1:before{content:"\e193"}.glyphicon-copyright-mark:before{content:"\e194"}.glyphicon-registration-mark:before{content:"\e195"}.glyphicon-cloud-download:before{content:"\e197"}.glyphicon-cloud-upload:before{content:"\e198"}.glyphicon-tree-conifer:before{content:"\e199"}.glyphicon-tree-deciduous:before{content:"\e200"}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff}input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#428bca;text-decoration:none}a:hover,a:focus{color:#2a6496;text-decoration:underline}a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}figure{margin:0}img{vertical-align:middle}.img-responsive,.thumbnail>img,.thumbnail a>img,.carousel-inner>.item>img,.carousel-inner>.item>a>img{display:block;max-width:100%;height:auto}.img-rounded{border-radius:6px}.img-thumbnail{display:inline-block;max-width:100%;height:auto;padding:4px;line-height:1.42857143;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.img-circle{border-radius:50%}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:inherit;font-weight:500;line-height:1.1;color:inherit}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small,.h1 small,.h2 small,.h3 small,.h4 small,.h5 small,.h6 small,h1 .small,h2 .small,h3 .small,h4 .small,h5 .small,h6 .small,.h1 .small,.h2 .small,.h3 .small,.h4 .small,.h5 .small,.h6 .small{font-weight:400;line-height:1;color:#777}h1,.h1,h2,.h2,h3,.h3{margin-top:20px;margin-bottom:10px}h1 small,.h1 small,h2 small,.h2 small,h3 small,.h3 small,h1 .small,.h1 .small,h2 .small,.h2 .small,h3 .small,.h3 .small{font-size:65%}h4,.h4,h5,.h5,h6,.h6{margin-top:10px;margin-bottom:10px}h4 small,.h4 small,h5 small,.h5 small,h6 small,.h6 small,h4 .small,.h4 .small,h5 .small,.h5 .small,h6 .small,.h6 .small{font-size:75%}h1,.h1{font-size:36px}h2,.h2{font-size:30px}h3,.h3{font-size:24px}h4,.h4{font-size:18px}h5,.h5{font-size:14px}h6,.h6{font-size:12px}p{margin:0 0 10px}.lead{margin-bottom:20px;font-size:16px;font-weight:300;line-height:1.4}@media (min-width:768px){.lead{font-size:21px}}small,.small{font-size:85%}mark,.mark{padding:.2em;background-color:#fcf8e3}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-nowrap{white-space:nowrap}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-muted{color:#777}.text-primary{color:#428bca}a.text-primary:hover{color:#3071a9}.text-success{color:#3c763d}a.text-success:hover{color:#2b542c}.text-info{color:#31708f}a.text-info:hover{color:#245269}.text-warning{color:#8a6d3b}a.text-warning:hover{color:#66512c}.text-danger{color:#a94442}a.text-danger:hover{color:#843534}.bg-primary{color:#fff;background-color:#428bca}a.bg-primary:hover{background-color:#3071a9}.bg-success{background-color:#dff0d8}a.bg-success:hover{background-color:#c1e2b3}.bg-info{background-color:#d9edf7}a.bg-info:hover{background-color:#afd9ee}.bg-warning{background-color:#fcf8e3}a.bg-warning:hover{background-color:#f7ecb5}.bg-danger{background-color:#f2dede}a.bg-danger:hover{background-color:#e4b9b9}.page-header{padding-bottom:9px;margin:40px 0 20px;border-bottom:1px solid #eee}ul,ol{margin-top:0;margin-bottom:10px}ul ul,ol ul,ul ol,ol ol{margin-bottom:0}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;margin-left:-5px;list-style:none}.list-inline>li{display:inline-block;padding-right:5px;padding-left:5px}dl{margin-top:0;margin-bottom:20px}dt,dd{line-height:1.42857143}dt{font-weight:700}dd{margin-left:0}@media (min-width:768px){.dl-horizontal dt{float:left;width:160px;overflow:hidden;clear:left;text-align:right;text-overflow:ellipsis;white-space:nowrap}.dl-horizontal dd{margin-left:180px}}abbr[title],abbr[data-original-title]{cursor:help;border-bottom:1px dotted #777}.initialism{font-size:90%;text-transform:uppercase}blockquote{padding:10px 20px;margin:0 0 20px;font-size:17.5px;border-left:5px solid #eee}blockquote p:last-child,blockquote ul:last-child,blockquote ol:last-child{margin-bottom:0}blockquote footer,blockquote small,blockquote .small{display:block;font-size:80%;line-height:1.42857143;color:#777}blockquote footer:before,blockquote small:before,blockquote .small:before{content:'\2014 \00A0'}.blockquote-reverse,blockquote.pull-right{padding-right:15px;padding-left:0;text-align:right;border-right:5px solid #eee;border-left:0}.blockquote-reverse footer:before,blockquote.pull-right footer:before,.blockquote-reverse small:before,blockquote.pull-right small:before,.blockquote-reverse .small:before,blockquote.pull-right .small:before{content:''}.blockquote-reverse footer:after,blockquote.pull-right footer:after,.blockquote-reverse small:after,blockquote.pull-right small:after,.blockquote-reverse .small:after,blockquote.pull-right .small:after{content:'\00A0 \2014'}address{margin-bottom:20px;font-style:normal;line-height:1.42857143}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,"Courier New",monospace}code{padding:2px 4px;font-size:90%;color:#c7254e;background-color:#f9f2f4;border-radius:4px}kbd{padding:2px 4px;font-size:90%;color:#fff;background-color:#333;border-radius:3px;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,.25);box-shadow:inset 0 -1px 0 rgba(0,0,0,.25)}kbd kbd{padding:0;font-size:100%;font-weight:700;-webkit-box-shadow:none;box-shadow:none}pre{display:block;padding:9.5px;margin:0 0 10px;font-size:13px;line-height:1.42857143;color:#333;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}.pre-scrollable{max-height:340px;overflow-y:scroll}.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.container-fluid{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}.row{margin-right:-15px;margin-left:-15px}.col-xs-1,.col-sm-1,.col-md-1,.col-lg-1,.col-xs-2,.col-sm-2,.col-md-2,.col-lg-2,.col-xs-3,.col-sm-3,.col-md-3,.col-lg-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-xs-5,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-xs-7,.col-sm-7,.col-md-7,.col-lg-7,.col-xs-8,.col-sm-8,.col-md-8,.col-lg-8,.col-xs-9,.col-sm-9,.col-md-9,.col-lg-9,.col-xs-10,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-11,.col-sm-11,.col-md-11,.col-lg-11,.col-xs-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px}.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12{float:left}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-pull-12{right:100%}.col-xs-pull-11{right:91.66666667%}.col-xs-pull-10{right:83.33333333%}.col-xs-pull-9{right:75%}.col-xs-pull-8{right:66.66666667%}.col-xs-pull-7{right:58.33333333%}.col-xs-pull-6{right:50%}.col-xs-pull-5{right:41.66666667%}.col-xs-pull-4{right:33.33333333%}.col-xs-pull-3{right:25%}.col-xs-pull-2{right:16.66666667%}.col-xs-pull-1{right:8.33333333%}.col-xs-pull-0{right:auto}.col-xs-push-12{left:100%}.col-xs-push-11{left:91.66666667%}.col-xs-push-10{left:83.33333333%}.col-xs-push-9{left:75%}.col-xs-push-8{left:66.66666667%}.col-xs-push-7{left:58.33333333%}.col-xs-push-6{left:50%}.col-xs-push-5{left:41.66666667%}.col-xs-push-4{left:33.33333333%}.col-xs-push-3{left:25%}.col-xs-push-2{left:16.66666667%}.col-xs-push-1{left:8.33333333%}.col-xs-push-0{left:auto}.col-xs-offset-12{margin-left:100%}.col-xs-offset-11{margin-left:91.66666667%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-0{margin-left:0}@media (min-width:768px){.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{float:left}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-pull-12{right:100%}.col-sm-pull-11{right:91.66666667%}.col-sm-pull-10{right:83.33333333%}.col-sm-pull-9{right:75%}.col-sm-pull-8{right:66.66666667%}.col-sm-pull-7{right:58.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-5{right:41.66666667%}.col-sm-pull-4{right:33.33333333%}.col-sm-pull-3{right:25%}.col-sm-pull-2{right:16.66666667%}.col-sm-pull-1{right:8.33333333%}.col-sm-pull-0{right:auto}.col-sm-push-12{left:100%}.col-sm-push-11{left:91.66666667%}.col-sm-push-10{left:83.33333333%}.col-sm-push-9{left:75%}.col-sm-push-8{left:66.66666667%}.col-sm-push-7{left:58.33333333%}.col-sm-push-6{left:50%}.col-sm-push-5{left:41.66666667%}.col-sm-push-4{left:33.33333333%}.col-sm-push-3{left:25%}.col-sm-push-2{left:16.66666667%}.col-sm-push-1{left:8.33333333%}.col-sm-push-0{left:auto}.col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}}@media (min-width:992px){.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12{float:left}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-pull-12{right:100%}.col-md-pull-11{right:91.66666667%}.col-md-pull-10{right:83.33333333%}.col-md-pull-9{right:75%}.col-md-pull-8{right:66.66666667%}.col-md-pull-7{right:58.33333333%}.col-md-pull-6{right:50%}.col-md-pull-5{right:41.66666667%}.col-md-pull-4{right:33.33333333%}.col-md-pull-3{right:25%}.col-md-pull-2{right:16.66666667%}.col-md-pull-1{right:8.33333333%}.col-md-pull-0{right:auto}.col-md-push-12{left:100%}.col-md-push-11{left:91.66666667%}.col-md-push-10{left:83.33333333%}.col-md-push-9{left:75%}.col-md-push-8{left:66.66666667%}.col-md-push-7{left:58.33333333%}.col-md-push-6{left:50%}.col-md-push-5{left:41.66666667%}.col-md-push-4{left:33.33333333%}.col-md-push-3{left:25%}.col-md-push-2{left:16.66666667%}.col-md-push-1{left:8.33333333%}.col-md-push-0{left:auto}.col-md-offset-12{margin-left:100%}.col-md-offset-11{margin-left:91.66666667%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-9{margin-left:75%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-6{margin-left:50%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-3{margin-left:25%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-0{margin-left:0}}@media (min-width:1200px){.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12{float:left}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-pull-12{right:100%}.col-lg-pull-11{right:91.66666667%}.col-lg-pull-10{right:83.33333333%}.col-lg-pull-9{right:75%}.col-lg-pull-8{right:66.66666667%}.col-lg-pull-7{right:58.33333333%}.col-lg-pull-6{right:50%}.col-lg-pull-5{right:41.66666667%}.col-lg-pull-4{right:33.33333333%}.col-lg-pull-3{right:25%}.col-lg-pull-2{right:16.66666667%}.col-lg-pull-1{right:8.33333333%}.col-lg-pull-0{right:auto}.col-lg-push-12{left:100%}.col-lg-push-11{left:91.66666667%}.col-lg-push-10{left:83.33333333%}.col-lg-push-9{left:75%}.col-lg-push-8{left:66.66666667%}.col-lg-push-7{left:58.33333333%}.col-lg-push-6{left:50%}.col-lg-push-5{left:41.66666667%}.col-lg-push-4{left:33.33333333%}.col-lg-push-3{left:25%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-push-0{left:auto}.col-lg-offset-12{margin-left:100%}.col-lg-offset-11{margin-left:91.66666667%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-0{margin-left:0}}table{background-color:transparent}caption{padding-top:8px;padding-bottom:8px;color:#777;text-align:left}th{text-align:left}.table{width:100%;max-width:100%;margin-bottom:20px}.table>thead>tr>th,.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>td,.table>tbody>tr>td,.table>tfoot>tr>td{padding:8px;line-height:1.42857143;vertical-align:top;border-top:1px solid #ddd}.table>thead>tr>th{vertical-align:bottom;border-bottom:2px solid #ddd}.table>caption+thead>tr:first-child>th,.table>colgroup+thead>tr:first-child>th,.table>thead:first-child>tr:first-child>th,.table>caption+thead>tr:first-child>td,.table>colgroup+thead>tr:first-child>td,.table>thead:first-child>tr:first-child>td{border-top:0}.table>tbody+tbody{border-top:2px solid #ddd}.table .table{background-color:#fff}.table-condensed>thead>tr>th,.table-condensed>tbody>tr>th,.table-condensed>tfoot>tr>th,.table-condensed>thead>tr>td,.table-condensed>tbody>tr>td,.table-condensed>tfoot>tr>td{padding:5px}.table-bordered{border:1px solid #ddd}.table-bordered>thead>tr>th,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>tbody>tr>td,.table-bordered>tfoot>tr>td{border:1px solid #ddd}.table-bordered>thead>tr>th,.table-bordered>thead>tr>td{border-bottom-width:2px}.table-striped>tbody>tr:nth-child(odd){background-color:#f9f9f9}.table-hover>tbody>tr:hover{background-color:#f5f5f5}table col[class*=col-]{position:static;display:table-column;float:none}table td[class*=col-],table th[class*=col-]{position:static;display:table-cell;float:none}.table>thead>tr>td.active,.table>tbody>tr>td.active,.table>tfoot>tr>td.active,.table>thead>tr>th.active,.table>tbody>tr>th.active,.table>tfoot>tr>th.active,.table>thead>tr.active>td,.table>tbody>tr.active>td,.table>tfoot>tr.active>td,.table>thead>tr.active>th,.table>tbody>tr.active>th,.table>tfoot>tr.active>th{background-color:#f5f5f5}.table-hover>tbody>tr>td.active:hover,.table-hover>tbody>tr>th.active:hover,.table-hover>tbody>tr.active:hover>td,.table-hover>tbody>tr:hover>.active,.table-hover>tbody>tr.active:hover>th{background-color:#e8e8e8}.table>thead>tr>td.success,.table>tbody>tr>td.success,.table>tfoot>tr>td.success,.table>thead>tr>th.success,.table>tbody>tr>th.success,.table>tfoot>tr>th.success,.table>thead>tr.success>td,.table>tbody>tr.success>td,.table>tfoot>tr.success>td,.table>thead>tr.success>th,.table>tbody>tr.success>th,.table>tfoot>tr.success>th{background-color:#dff0d8}.table-hover>tbody>tr>td.success:hover,.table-hover>tbody>tr>th.success:hover,.table-hover>tbody>tr.success:hover>td,.table-hover>tbody>tr:hover>.success,.table-hover>tbody>tr.success:hover>th{background-color:#d0e9c6}.table>thead>tr>td.info,.table>tbody>tr>td.info,.table>tfoot>tr>td.info,.table>thead>tr>th.info,.table>tbody>tr>th.info,.table>tfoot>tr>th.info,.table>thead>tr.info>td,.table>tbody>tr.info>td,.table>tfoot>tr.info>td,.table>thead>tr.info>th,.table>tbody>tr.info>th,.table>tfoot>tr.info>th{background-color:#d9edf7}.table-hover>tbody>tr>td.info:hover,.table-hover>tbody>tr>th.info:hover,.table-hover>tbody>tr.info:hover>td,.table-hover>tbody>tr:hover>.info,.table-hover>tbody>tr.info:hover>th{background-color:#c4e3f3}.table>thead>tr>td.warning,.table>tbody>tr>td.warning,.table>tfoot>tr>td.warning,.table>thead>tr>th.warning,.table>tbody>tr>th.warning,.table>tfoot>tr>th.warning,.table>thead>tr.warning>td,.table>tbody>tr.warning>td,.table>tfoot>tr.warning>td,.table>thead>tr.warning>th,.table>tbody>tr.warning>th,.table>tfoot>tr.warning>th{background-color:#fcf8e3}.table-hover>tbody>tr>td.warning:hover,.table-hover>tbody>tr>th.warning:hover,.table-hover>tbody>tr.warning:hover>td,.table-hover>tbody>tr:hover>.warning,.table-hover>tbody>tr.warning:hover>th{background-color:#faf2cc}.table>thead>tr>td.danger,.table>tbody>tr>td.danger,.table>tfoot>tr>td.danger,.table>thead>tr>th.danger,.table>tbody>tr>th.danger,.table>tfoot>tr>th.danger,.table>thead>tr.danger>td,.table>tbody>tr.danger>td,.table>tfoot>tr.danger>td,.table>thead>tr.danger>th,.table>tbody>tr.danger>th,.table>tfoot>tr.danger>th{background-color:#f2dede}.table-hover>tbody>tr>td.danger:hover,.table-hover>tbody>tr>th.danger:hover,.table-hover>tbody>tr.danger:hover>td,.table-hover>tbody>tr:hover>.danger,.table-hover>tbody>tr.danger:hover>th{background-color:#ebcccc}.table-responsive{min-height:.01%;overflow-x:auto}@media screen and (max-width:767px){.table-responsive{width:100%;margin-bottom:15px;overflow-y:hidden;-ms-overflow-style:-ms-autohiding-scrollbar;border:1px solid #ddd}.table-responsive>.table{margin-bottom:0}.table-responsive>.table>thead>tr>th,.table-responsive>.table>tbody>tr>th,.table-responsive>.table>tfoot>tr>th,.table-responsive>.table>thead>tr>td,.table-responsive>.table>tbody>tr>td,.table-responsive>.table>tfoot>tr>td{white-space:nowrap}.table-responsive>.table-bordered{border:0}.table-responsive>.table-bordered>thead>tr>th:first-child,.table-responsive>.table-bordered>tbody>tr>th:first-child,.table-responsive>.table-bordered>tfoot>tr>th:first-child,.table-responsive>.table-bordered>thead>tr>td:first-child,.table-responsive>.table-bordered>tbody>tr>td:first-child,.table-responsive>.table-bordered>tfoot>tr>td:first-child{border-left:0}.table-responsive>.table-bordered>thead>tr>th:last-child,.table-responsive>.table-bordered>tbody>tr>th:last-child,.table-responsive>.table-bordered>tfoot>tr>th:last-child,.table-responsive>.table-bordered>thead>tr>td:last-child,.table-responsive>.table-bordered>tbody>tr>td:last-child,.table-responsive>.table-bordered>tfoot>tr>td:last-child{border-right:0}.table-responsive>.table-bordered>tbody>tr:last-child>th,.table-responsive>.table-bordered>tfoot>tr:last-child>th,.table-responsive>.table-bordered>tbody>tr:last-child>td,.table-responsive>.table-bordered>tfoot>tr:last-child>td{border-bottom:0}}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:inherit;color:#333;border:0;border-bottom:1px solid #e5e5e5}label{display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700}input[type=search]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}input[type=radio],input[type=checkbox]{margin:4px 0 0;margin-top:1px \9;line-height:normal}input[type=file]{display:block}input[type=range]{display:block;width:100%}select[multiple],select[size]{height:auto}input[type=file]:focus,input[type=radio]:focus,input[type=checkbox]:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}output{display:block;padding-top:7px;font-size:14px;line-height:1.42857143;color:#555}.form-control{display:block;width:100%;height:34px;padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}.form-control:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}.form-control::-moz-placeholder{color:#999;opacity:1}.form-control:-ms-input-placeholder{color:#999}.form-control::-webkit-input-placeholder{color:#999}.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control{cursor:not-allowed;background-color:#eee;opacity:1}textarea.form-control{height:auto}input[type=search]{-webkit-appearance:none}input[type=date],input[type=time],input[type=datetime-local],input[type=month]{line-height:34px;line-height:1.42857143 \0}input[type=date].input-sm,input[type=time].input-sm,input[type=datetime-local].input-sm,input[type=month].input-sm{line-height:30px;line-height:1.5 \0}input[type=date].input-lg,input[type=time].input-lg,input[type=datetime-local].input-lg,input[type=month].input-lg{line-height:46px;line-height:1.33 \0}_:-ms-fullscreen,:root input[type=date],_:-ms-fullscreen,:root input[type=time],_:-ms-fullscreen,:root input[type=datetime-local],_:-ms-fullscreen,:root input[type=month]{line-height:1.42857143}_:-ms-fullscreen.input-sm,:root input[type=date].input-sm,_:-ms-fullscreen.input-sm,:root input[type=time].input-sm,_:-ms-fullscreen.input-sm,:root input[type=datetime-local].input-sm,_:-ms-fullscreen.input-sm,:root input[type=month].input-sm{line-height:1.5}_:-ms-fullscreen.input-lg,:root input[type=date].input-lg,_:-ms-fullscreen.input-lg,:root input[type=time].input-lg,_:-ms-fullscreen.input-lg,:root input[type=datetime-local].input-lg,_:-ms-fullscreen.input-lg,:root input[type=month].input-lg{line-height:1.33}.form-group{margin-bottom:15px}.radio,.checkbox{position:relative;display:block;margin-top:10px;margin-bottom:10px}.radio label,.checkbox label{min-height:20px;padding-left:20px;margin-bottom:0;font-weight:400;cursor:pointer}.radio input[type=radio],.radio-inline input[type=radio],.checkbox input[type=checkbox],.checkbox-inline input[type=checkbox]{position:absolute;margin-top:4px \9;margin-left:-20px}.radio+.radio,.checkbox+.checkbox{margin-top:-5px}.radio-inline,.checkbox-inline{display:inline-block;padding-left:20px;margin-bottom:0;font-weight:400;vertical-align:middle;cursor:pointer}.radio-inline+.radio-inline,.checkbox-inline+.checkbox-inline{margin-top:0;margin-left:10px}input[type=radio][disabled],input[type=checkbox][disabled],input[type=radio].disabled,input[type=checkbox].disabled,fieldset[disabled] input[type=radio],fieldset[disabled] input[type=checkbox]{cursor:not-allowed}.radio-inline.disabled,.checkbox-inline.disabled,fieldset[disabled] .radio-inline,fieldset[disabled] .checkbox-inline{cursor:not-allowed}.radio.disabled label,.checkbox.disabled label,fieldset[disabled] .radio label,fieldset[disabled] .checkbox label{cursor:not-allowed}.form-control-static{padding-top:7px;padding-bottom:7px;margin-bottom:0}.form-control-static.input-lg,.form-control-static.input-sm{padding-right:0;padding-left:0}.input-sm,.form-group-sm .form-control{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.input-sm,select.form-group-sm .form-control{height:30px;line-height:30px}textarea.input-sm,textarea.form-group-sm .form-control,select[multiple].input-sm,select[multiple].form-group-sm .form-control{height:auto}.input-lg,.form-group-lg .form-control{height:46px;padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}select.input-lg,select.form-group-lg .form-control{height:46px;line-height:46px}textarea.input-lg,textarea.form-group-lg .form-control,select[multiple].input-lg,select[multiple].form-group-lg .form-control{height:auto}.has-feedback{position:relative}.has-feedback .form-control{padding-right:42.5px}.form-control-feedback{position:absolute;top:0;right:0;z-index:2;display:block;width:34px;height:34px;line-height:34px;text-align:center;pointer-events:none}.input-lg+.form-control-feedback{width:46px;height:46px;line-height:46px}.input-sm+.form-control-feedback{width:30px;height:30px;line-height:30px}.has-success .help-block,.has-success .control-label,.has-success .radio,.has-success .checkbox,.has-success .radio-inline,.has-success .checkbox-inline,.has-success.radio label,.has-success.checkbox label,.has-success.radio-inline label,.has-success.checkbox-inline label{color:#3c763d}.has-success .form-control{border-color:#3c763d;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.has-success .form-control:focus{border-color:#2b542c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #67b168;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #67b168}.has-success .input-group-addon{color:#3c763d;background-color:#dff0d8;border-color:#3c763d}.has-success .form-control-feedback{color:#3c763d}.has-warning .help-block,.has-warning .control-label,.has-warning .radio,.has-warning .checkbox,.has-warning .radio-inline,.has-warning .checkbox-inline,.has-warning.radio label,.has-warning.checkbox label,.has-warning.radio-inline label,.has-warning.checkbox-inline label{color:#8a6d3b}.has-warning .form-control{border-color:#8a6d3b;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.has-warning .form-control:focus{border-color:#66512c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b}.has-warning .input-group-addon{color:#8a6d3b;background-color:#fcf8e3;border-color:#8a6d3b}.has-warning .form-control-feedback{color:#8a6d3b}.has-error .help-block,.has-error .control-label,.has-error .radio,.has-error .checkbox,.has-error .radio-inline,.has-error .checkbox-inline,.has-error.radio label,.has-error.checkbox label,.has-error.radio-inline label,.has-error.checkbox-inline label{color:#a94442}.has-error .form-control{border-color:#a94442;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.has-error .form-control:focus{border-color:#843534;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483}.has-error .input-group-addon{color:#a94442;background-color:#f2dede;border-color:#a94442}.has-error .form-control-feedback{color:#a94442}.has-feedback label~.form-control-feedback{top:25px}.has-feedback label.sr-only~.form-control-feedback{top:0}.help-block{display:block;margin-top:5px;margin-bottom:10px;color:#737373}@media (min-width:768px){.form-inline .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.form-inline .form-control{display:inline-block;width:auto;vertical-align:middle}.form-inline .form-control-static{display:inline-block}.form-inline .input-group{display:inline-table;vertical-align:middle}.form-inline .input-group .input-group-addon,.form-inline .input-group .input-group-btn,.form-inline .input-group .form-control{width:auto}.form-inline .input-group>.form-control{width:100%}.form-inline .control-label{margin-bottom:0;vertical-align:middle}.form-inline .radio,.form-inline .checkbox{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.form-inline .radio label,.form-inline .checkbox label{padding-left:0}.form-inline .radio input[type=radio],.form-inline .checkbox input[type=checkbox]{position:relative;margin-left:0}.form-inline .has-feedback .form-control-feedback{top:0}}.form-horizontal .radio,.form-horizontal .checkbox,.form-horizontal .radio-inline,.form-horizontal .checkbox-inline{padding-top:7px;margin-top:0;margin-bottom:0}.form-horizontal .radio,.form-horizontal .checkbox{min-height:27px}.form-horizontal .form-group{margin-right:-15px;margin-left:-15px}@media (min-width:768px){.form-horizontal .control-label{padding-top:7px;margin-bottom:0;text-align:right}}.form-horizontal .has-feedback .form-control-feedback{right:15px}@media (min-width:768px){.form-horizontal .form-group-lg .control-label{padding-top:14.3px}}@media (min-width:768px){.form-horizontal .form-group-sm .control-label{padding-top:6px}}.btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-image:none;border:1px solid transparent;border-radius:4px}.btn:focus,.btn:active:focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn.active.focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.btn:hover,.btn:focus,.btn.focus{color:#333;text-decoration:none}.btn:active,.btn.active{background-image:none;outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn.disabled,.btn[disabled],fieldset[disabled] .btn{pointer-events:none;cursor:not-allowed;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none;opacity:.65}.btn-default{color:#333;background-color:#fff;border-color:#ccc}.btn-default:hover,.btn-default:focus,.btn-default.focus,.btn-default:active,.btn-default.active,.open>.dropdown-toggle.btn-default{color:#333;background-color:#e6e6e6;border-color:#adadad}.btn-default:active,.btn-default.active,.open>.dropdown-toggle.btn-default{background-image:none}.btn-default.disabled,.btn-default[disabled],fieldset[disabled] .btn-default,.btn-default.disabled:hover,.btn-default[disabled]:hover,fieldset[disabled] .btn-default:hover,.btn-default.disabled:focus,.btn-default[disabled]:focus,fieldset[disabled] .btn-default:focus,.btn-default.disabled.focus,.btn-default[disabled].focus,fieldset[disabled] .btn-default.focus,.btn-default.disabled:active,.btn-default[disabled]:active,fieldset[disabled] .btn-default:active,.btn-default.disabled.active,.btn-default[disabled].active,fieldset[disabled] .btn-default.active{background-color:#fff;border-color:#ccc}.btn-default .badge{color:#fff;background-color:#333}.btn-primary{color:#fff;background-color:#428bca;border-color:#357ebd}.btn-primary:hover,.btn-primary:focus,.btn-primary.focus,.btn-primary:active,.btn-primary.active,.open>.dropdown-toggle.btn-primary{color:#fff;background-color:#3071a9;border-color:#285e8e}.btn-primary:active,.btn-primary.active,.open>.dropdown-toggle.btn-primary{background-image:none}.btn-primary.disabled,.btn-primary[disabled],fieldset[disabled] .btn-primary,.btn-primary.disabled:hover,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary:hover,.btn-primary.disabled:focus,.btn-primary[disabled]:focus,fieldset[disabled] .btn-primary:focus,.btn-primary.disabled.focus,.btn-primary[disabled].focus,fieldset[disabled] .btn-primary.focus,.btn-primary.disabled:active,.btn-primary[disabled]:active,fieldset[disabled] .btn-primary:active,.btn-primary.disabled.active,.btn-primary[disabled].active,fieldset[disabled] .btn-primary.active{background-color:#428bca;border-color:#357ebd}.btn-primary .badge{color:#428bca;background-color:#fff}.btn-success{color:#fff;background-color:#5cb85c;border-color:#4cae4c}.btn-success:hover,.btn-success:focus,.btn-success.focus,.btn-success:active,.btn-success.active,.open>.dropdown-toggle.btn-success{color:#fff;background-color:#449d44;border-color:#398439}.btn-success:active,.btn-success.active,.open>.dropdown-toggle.btn-success{background-image:none}.btn-success.disabled,.btn-success[disabled],fieldset[disabled] .btn-success,.btn-success.disabled:hover,.btn-success[disabled]:hover,fieldset[disabled] .btn-success:hover,.btn-success.disabled:focus,.btn-success[disabled]:focus,fieldset[disabled] .btn-success:focus,.btn-success.disabled.focus,.btn-success[disabled].focus,fieldset[disabled] .btn-success.focus,.btn-success.disabled:active,.btn-success[disabled]:active,fieldset[disabled] .btn-success:active,.btn-success.disabled.active,.btn-success[disabled].active,fieldset[disabled] .btn-success.active{background-color:#5cb85c;border-color:#4cae4c}.btn-success .badge{color:#5cb85c;background-color:#fff}.btn-info{color:#fff;background-color:#5bc0de;border-color:#46b8da}.btn-info:hover,.btn-info:focus,.btn-info.focus,.btn-info:active,.btn-info.active,.open>.dropdown-toggle.btn-info{color:#fff;background-color:#31b0d5;border-color:#269abc}.btn-info:active,.btn-info.active,.open>.dropdown-toggle.btn-info{background-image:none}.btn-info.disabled,.btn-info[disabled],fieldset[disabled] .btn-info,.btn-info.disabled:hover,.btn-info[disabled]:hover,fieldset[disabled] .btn-info:hover,.btn-info.disabled:focus,.btn-info[disabled]:focus,fieldset[disabled] .btn-info:focus,.btn-info.disabled.focus,.btn-info[disabled].focus,fieldset[disabled] .btn-info.focus,.btn-info.disabled:active,.btn-info[disabled]:active,fieldset[disabled] .btn-info:active,.btn-info.disabled.active,.btn-info[disabled].active,fieldset[disabled] .btn-info.active{background-color:#5bc0de;border-color:#46b8da}.btn-info .badge{color:#5bc0de;background-color:#fff}.btn-warning{color:#fff;background-color:#f0ad4e;border-color:#eea236}.btn-warning:hover,.btn-warning:focus,.btn-warning.focus,.btn-warning:active,.btn-warning.active,.open>.dropdown-toggle.btn-warning{color:#fff;background-color:#ec971f;border-color:#d58512}.btn-warning:active,.btn-warning.active,.open>.dropdown-toggle.btn-warning{background-image:none}.btn-warning.disabled,.btn-warning[disabled],fieldset[disabled] .btn-warning,.btn-warning.disabled:hover,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning:hover,.btn-warning.disabled:focus,.btn-warning[disabled]:focus,fieldset[disabled] .btn-warning:focus,.btn-warning.disabled.focus,.btn-warning[disabled].focus,fieldset[disabled] .btn-warning.focus,.btn-warning.disabled:active,.btn-warning[disabled]:active,fieldset[disabled] .btn-warning:active,.btn-warning.disabled.active,.btn-warning[disabled].active,fieldset[disabled] .btn-warning.active{background-color:#f0ad4e;border-color:#eea236}.btn-warning .badge{color:#f0ad4e;background-color:#fff}.btn-danger{color:#fff;background-color:#d9534f;border-color:#d43f3a}.btn-danger:hover,.btn-danger:focus,.btn-danger.focus,.btn-danger:active,.btn-danger.active,.open>.dropdown-toggle.btn-danger{color:#fff;background-color:#c9302c;border-color:#ac2925}.btn-danger:active,.btn-danger.active,.open>.dropdown-toggle.btn-danger{background-image:none}.btn-danger.disabled,.btn-danger[disabled],fieldset[disabled] .btn-danger,.btn-danger.disabled:hover,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger:hover,.btn-danger.disabled:focus,.btn-danger[disabled]:focus,fieldset[disabled] .btn-danger:focus,.btn-danger.disabled.focus,.btn-danger[disabled].focus,fieldset[disabled] .btn-danger.focus,.btn-danger.disabled:active,.btn-danger[disabled]:active,fieldset[disabled] .btn-danger:active,.btn-danger.disabled.active,.btn-danger[disabled].active,fieldset[disabled] .btn-danger.active{background-color:#d9534f;border-color:#d43f3a}.btn-danger .badge{color:#d9534f;background-color:#fff}.btn-link{font-weight:400;color:#428bca;border-radius:0}.btn-link,.btn-link:active,.btn-link.active,.btn-link[disabled],fieldset[disabled] .btn-link{background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.btn-link,.btn-link:hover,.btn-link:focus,.btn-link:active{border-color:transparent}.btn-link:hover,.btn-link:focus{color:#2a6496;text-decoration:underline;background-color:transparent}.btn-link[disabled]:hover,fieldset[disabled] .btn-link:hover,.btn-link[disabled]:focus,fieldset[disabled] .btn-link:focus{color:#777;text-decoration:none}.btn-lg,.btn-group-lg>.btn{padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}.btn-sm,.btn-group-sm>.btn{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}.btn-xs,.btn-group-xs>.btn{padding:1px 5px;font-size:12px;line-height:1.5;border-radius:3px}.btn-block{display:block;width:100%}.btn-block+.btn-block{margin-top:5px}input[type=submit].btn-block,input[type=reset].btn-block,input[type=button].btn-block{width:100%}.fade{opacity:0;-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear}.fade.in{opacity:1}.collapse{display:none;visibility:hidden}.collapse.in{display:block;visibility:visible}tr.collapse.in{display:table-row}tbody.collapse.in{display:table-row-group}.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease;-webkit-transition-duration:.35s;-o-transition-duration:.35s;transition-duration:.35s;-webkit-transition-property:height,visibility;-o-transition-property:height,visibility;transition-property:height,visibility}.caret{display:inline-block;width:0;height:0;margin-left:2px;vertical-align:middle;border-top:4px solid;border-right:4px solid transparent;border-left:4px solid transparent}.dropdown{position:relative}.dropdown-toggle:focus{outline:0}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:160px;padding:5px 0;margin:2px 0 0;font-size:14px;text-align:left;list-style:none;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #ccc;border:1px solid rgba(0,0,0,.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0,0,0,.175);box-shadow:0 6px 12px rgba(0,0,0,.175)}.dropdown-menu.pull-right{right:0;left:auto}.dropdown-menu .divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.dropdown-menu>li>a{display:block;padding:3px 20px;clear:both;font-weight:400;line-height:1.42857143;color:#333;white-space:nowrap}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus{color:#262626;text-decoration:none;background-color:#f5f5f5}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus{color:#fff;text-decoration:none;background-color:#428bca;outline:0}.dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{color:#777}.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{text-decoration:none;cursor:not-allowed;background-color:transparent;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.open>.dropdown-menu{display:block}.open>a{outline:0}.dropdown-menu-right{right:0;left:auto}.dropdown-menu-left{right:auto;left:0}.dropdown-header{display:block;padding:3px 20px;font-size:12px;line-height:1.42857143;color:#777;white-space:nowrap}.dropdown-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:990}.pull-right>.dropdown-menu{right:0;left:auto}.dropup .caret,.navbar-fixed-bottom .dropdown .caret{content:"";border-top:0;border-bottom:4px solid}.dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:100%;margin-bottom:1px}@media (min-width:768px){.navbar-right .dropdown-menu{right:0;left:auto}.navbar-right .dropdown-menu-left{right:auto;left:0}}.btn-group,.btn-group-vertical{position:relative;display:inline-block;vertical-align:middle}.btn-group>.btn,.btn-group-vertical>.btn{position:relative;float:left}.btn-group>.btn:hover,.btn-group-vertical>.btn:hover,.btn-group>.btn:focus,.btn-group-vertical>.btn:focus,.btn-group>.btn:active,.btn-group-vertical>.btn:active,.btn-group>.btn.active,.btn-group-vertical>.btn.active{z-index:2}.btn-group>.btn:focus,.btn-group-vertical>.btn:focus{outline:0}.btn-group .btn+.btn,.btn-group .btn+.btn-group,.btn-group .btn-group+.btn,.btn-group .btn-group+.btn-group{margin-left:-1px}.btn-toolbar{margin-left:-5px}.btn-toolbar .btn-group,.btn-toolbar .input-group{float:left}.btn-toolbar>.btn,.btn-toolbar>.btn-group,.btn-toolbar>.input-group{margin-left:5px}.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle){border-radius:0}.btn-group>.btn:first-child{margin-left:0}.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn:last-child:not(:first-child),.btn-group>.dropdown-toggle:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.btn-group>.btn-group{float:left}.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group>.btn-group:first-child>.btn:last-child,.btn-group>.btn-group:first-child>.dropdown-toggle{border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn-group:last-child>.btn:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.btn-group .dropdown-toggle:active,.btn-group.open .dropdown-toggle{outline:0}.btn-group>.btn+.dropdown-toggle{padding-right:8px;padding-left:8px}.btn-group>.btn-lg+.dropdown-toggle{padding-right:12px;padding-left:12px}.btn-group.open .dropdown-toggle{-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn-group.open .dropdown-toggle.btn-link{-webkit-box-shadow:none;box-shadow:none}.btn .caret{margin-left:0}.btn-lg .caret{border-width:5px 5px 0;border-bottom-width:0}.dropup .btn-lg .caret{border-width:0 5px 5px}.btn-group-vertical>.btn,.btn-group-vertical>.btn-group,.btn-group-vertical>.btn-group>.btn{display:block;float:none;width:100%;max-width:100%}.btn-group-vertical>.btn-group>.btn{float:none}.btn-group-vertical>.btn+.btn,.btn-group-vertical>.btn+.btn-group,.btn-group-vertical>.btn-group+.btn,.btn-group-vertical>.btn-group+.btn-group{margin-top:-1px;margin-left:0}.btn-group-vertical>.btn:not(:first-child):not(:last-child){border-radius:0}.btn-group-vertical>.btn:first-child:not(:last-child){border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn:last-child:not(:first-child){border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px}.btn-group-vertical>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group-vertical>.btn-group:first-child:not(:last-child)>.btn:last-child,.btn-group-vertical>.btn-group:first-child:not(:last-child)>.dropdown-toggle{border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn-group:last-child:not(:first-child)>.btn:first-child{border-top-left-radius:0;border-top-right-radius:0}.btn-group-justified{display:table;width:100%;table-layout:fixed;border-collapse:separate}.btn-group-justified>.btn,.btn-group-justified>.btn-group{display:table-cell;float:none;width:1%}.btn-group-justified>.btn-group .btn{width:100%}.btn-group-justified>.btn-group .dropdown-menu{left:auto}[data-toggle=buttons]>.btn input[type=radio],[data-toggle=buttons]>.btn-group>.btn input[type=radio],[data-toggle=buttons]>.btn input[type=checkbox],[data-toggle=buttons]>.btn-group>.btn input[type=checkbox]{position:absolute;clip:rect(0,0,0,0);pointer-events:none}.input-group{position:relative;display:table;border-collapse:separate}.input-group[class*=col-]{float:none;padding-right:0;padding-left:0}.input-group .form-control{position:relative;z-index:2;float:left;width:100%;margin-bottom:0}.input-group-lg>.form-control,.input-group-lg>.input-group-addon,.input-group-lg>.input-group-btn>.btn{height:46px;padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}select.input-group-lg>.form-control,select.input-group-lg>.input-group-addon,select.input-group-lg>.input-group-btn>.btn{height:46px;line-height:46px}textarea.input-group-lg>.form-control,textarea.input-group-lg>.input-group-addon,textarea.input-group-lg>.input-group-btn>.btn,select[multiple].input-group-lg>.form-control,select[multiple].input-group-lg>.input-group-addon,select[multiple].input-group-lg>.input-group-btn>.btn{height:auto}.input-group-sm>.form-control,.input-group-sm>.input-group-addon,.input-group-sm>.input-group-btn>.btn{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.input-group-sm>.form-control,select.input-group-sm>.input-group-addon,select.input-group-sm>.input-group-btn>.btn{height:30px;line-height:30px}textarea.input-group-sm>.form-control,textarea.input-group-sm>.input-group-addon,textarea.input-group-sm>.input-group-btn>.btn,select[multiple].input-group-sm>.form-control,select[multiple].input-group-sm>.input-group-addon,select[multiple].input-group-sm>.input-group-btn>.btn{height:auto}.input-group-addon,.input-group-btn,.input-group .form-control{display:table-cell}.input-group-addon:not(:first-child):not(:last-child),.input-group-btn:not(:first-child):not(:last-child),.input-group .form-control:not(:first-child):not(:last-child){border-radius:0}.input-group-addon,.input-group-btn{width:1%;white-space:nowrap;vertical-align:middle}.input-group-addon{padding:6px 12px;font-size:14px;font-weight:400;line-height:1;color:#555;text-align:center;background-color:#eee;border:1px solid #ccc;border-radius:4px}.input-group-addon.input-sm{padding:5px 10px;font-size:12px;border-radius:3px}.input-group-addon.input-lg{padding:10px 16px;font-size:18px;border-radius:6px}.input-group-addon input[type=radio],.input-group-addon input[type=checkbox]{margin-top:0}.input-group .form-control:first-child,.input-group-addon:first-child,.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group>.btn,.input-group-btn:first-child>.dropdown-toggle,.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle),.input-group-btn:last-child>.btn-group:not(:last-child)>.btn{border-top-right-radius:0;border-bottom-right-radius:0}.input-group-addon:first-child{border-right:0}.input-group .form-control:last-child,.input-group-addon:last-child,.input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group>.btn,.input-group-btn:last-child>.dropdown-toggle,.input-group-btn:first-child>.btn:not(:first-child),.input-group-btn:first-child>.btn-group:not(:first-child)>.btn{border-top-left-radius:0;border-bottom-left-radius:0}.input-group-addon:last-child{border-left:0}.input-group-btn{position:relative;font-size:0;white-space:nowrap}.input-group-btn>.btn{position:relative}.input-group-btn>.btn+.btn{margin-left:-1px}.input-group-btn>.btn:hover,.input-group-btn>.btn:focus,.input-group-btn>.btn:active{z-index:2}.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group{margin-right:-1px}.input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group{margin-left:-1px}.nav{padding-left:0;margin-bottom:0;list-style:none}.nav>li{position:relative;display:block}.nav>li>a{position:relative;display:block;padding:10px 15px}.nav>li>a:hover,.nav>li>a:focus{text-decoration:none;background-color:#eee}.nav>li.disabled>a{color:#777}.nav>li.disabled>a:hover,.nav>li.disabled>a:focus{color:#777;text-decoration:none;cursor:not-allowed;background-color:transparent}.nav .open>a,.nav .open>a:hover,.nav .open>a:focus{background-color:#eee;border-color:#428bca}.nav .nav-divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.nav>li>a>img{max-width:none}.nav-tabs{border-bottom:1px solid #ddd}.nav-tabs>li{float:left;margin-bottom:-1px}.nav-tabs>li>a{margin-right:2px;line-height:1.42857143;border:1px solid transparent;border-radius:4px 4px 0 0}.nav-tabs>li>a:hover{border-color:#eee #eee #ddd}.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus{color:#555;cursor:default;background-color:#fff;border:1px solid #ddd;border-bottom-color:transparent}.nav-tabs.nav-justified{width:100%;border-bottom:0}.nav-tabs.nav-justified>li{float:none}.nav-tabs.nav-justified>li>a{margin-bottom:5px;text-align:center}.nav-tabs.nav-justified>.dropdown .dropdown-menu{top:auto;left:auto}@media (min-width:768px){.nav-tabs.nav-justified>li{display:table-cell;width:1%}.nav-tabs.nav-justified>li>a{margin-bottom:0}}.nav-tabs.nav-justified>li>a{margin-right:0;border-radius:4px}.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:hover,.nav-tabs.nav-justified>.active>a:focus{border:1px solid #ddd}@media (min-width:768px){.nav-tabs.nav-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:hover,.nav-tabs.nav-justified>.active>a:focus{border-bottom-color:#fff}}.nav-pills>li{float:left}.nav-pills>li>a{border-radius:4px}.nav-pills>li+li{margin-left:2px}.nav-pills>li.active>a,.nav-pills>li.active>a:hover,.nav-pills>li.active>a:focus{color:#fff;background-color:#428bca}.nav-stacked>li{float:none}.nav-stacked>li+li{margin-top:2px;margin-left:0}.nav-justified{width:100%}.nav-justified>li{float:none}.nav-justified>li>a{margin-bottom:5px;text-align:center}.nav-justified>.dropdown .dropdown-menu{top:auto;left:auto}@media (min-width:768px){.nav-justified>li{display:table-cell;width:1%}.nav-justified>li>a{margin-bottom:0}}.nav-tabs-justified{border-bottom:0}.nav-tabs-justified>li>a{margin-right:0;border-radius:4px}.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:hover,.nav-tabs-justified>.active>a:focus{border:1px solid #ddd}@media (min-width:768px){.nav-tabs-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:hover,.nav-tabs-justified>.active>a:focus{border-bottom-color:#fff}}.tab-content>.tab-pane{display:none;visibility:hidden}.tab-content>.active{display:block;visibility:visible}.nav-tabs .dropdown-menu{margin-top:-1px;border-top-left-radius:0;border-top-right-radius:0}.navbar{position:relative;min-height:50px;margin-bottom:20px;border:1px solid transparent}@media (min-width:768px){.navbar{border-radius:4px}}@media (min-width:768px){.navbar-header{float:left}}.navbar-collapse{padding-right:15px;padding-left:15px;overflow-x:visible;-webkit-overflow-scrolling:touch;border-top:1px solid transparent;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}.navbar-collapse.in{overflow-y:auto}@media (min-width:768px){.navbar-collapse{width:auto;border-top:0;-webkit-box-shadow:none;box-shadow:none}.navbar-collapse.collapse{display:block!important;height:auto!important;padding-bottom:0;overflow:visible!important;visibility:visible!important}.navbar-collapse.in{overflow-y:visible}.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse,.navbar-fixed-bottom .navbar-collapse{padding-right:0;padding-left:0}}.navbar-fixed-top .navbar-collapse,.navbar-fixed-bottom .navbar-collapse{max-height:340px}@media (max-device-width:480px) and (orientation:landscape){.navbar-fixed-top .navbar-collapse,.navbar-fixed-bottom .navbar-collapse{max-height:200px}}.container>.navbar-header,.container-fluid>.navbar-header,.container>.navbar-collapse,.container-fluid>.navbar-collapse{margin-right:-15px;margin-left:-15px}@media (min-width:768px){.container>.navbar-header,.container-fluid>.navbar-header,.container>.navbar-collapse,.container-fluid>.navbar-collapse{margin-right:0;margin-left:0}}.navbar-static-top{z-index:1000;border-width:0 0 1px}@media (min-width:768px){.navbar-static-top{border-radius:0}}.navbar-fixed-top,.navbar-fixed-bottom{position:fixed;right:0;left:0;z-index:1030}@media (min-width:768px){.navbar-fixed-top,.navbar-fixed-bottom{border-radius:0}}.navbar-fixed-top{top:0;border-width:0 0 1px}.navbar-fixed-bottom{bottom:0;margin-bottom:0;border-width:1px 0 0}.navbar-brand{float:left;height:50px;padding:15px 15px;font-size:18px;line-height:20px}.navbar-brand:hover,.navbar-brand:focus{text-decoration:none}.navbar-brand>img{display:block}@media (min-width:768px){.navbar>.container .navbar-brand,.navbar>.container-fluid .navbar-brand{margin-left:-15px}}.navbar-toggle{position:relative;float:right;padding:9px 10px;margin-top:8px;margin-right:15px;margin-bottom:8px;background-color:transparent;background-image:none;border:1px solid transparent;border-radius:4px}.navbar-toggle:focus{outline:0}.navbar-toggle .icon-bar{display:block;width:22px;height:2px;border-radius:1px}.navbar-toggle .icon-bar+.icon-bar{margin-top:4px}@media (min-width:768px){.navbar-toggle{display:none}}.navbar-nav{margin:7.5px -15px}.navbar-nav>li>a{padding-top:10px;padding-bottom:10px;line-height:20px}@media (max-width:767px){.navbar-nav .open .dropdown-menu{position:static;float:none;width:auto;margin-top:0;background-color:transparent;border:0;-webkit-box-shadow:none;box-shadow:none}.navbar-nav .open .dropdown-menu>li>a,.navbar-nav .open .dropdown-menu .dropdown-header{padding:5px 15px 5px 25px}.navbar-nav .open .dropdown-menu>li>a{line-height:20px}.navbar-nav .open .dropdown-menu>li>a:hover,.navbar-nav .open .dropdown-menu>li>a:focus{background-image:none}}@media (min-width:768px){.navbar-nav{float:left;margin:0}.navbar-nav>li{float:left}.navbar-nav>li>a{padding-top:15px;padding-bottom:15px}}.navbar-form{padding:10px 15px;margin-top:8px;margin-right:-15px;margin-bottom:8px;margin-left:-15px;border-top:1px solid transparent;border-bottom:1px solid transparent;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(255,255,255,.1)}@media (min-width:768px){.navbar-form .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.navbar-form .form-control{display:inline-block;width:auto;vertical-align:middle}.navbar-form .form-control-static{display:inline-block}.navbar-form .input-group{display:inline-table;vertical-align:middle}.navbar-form .input-group .input-group-addon,.navbar-form .input-group .input-group-btn,.navbar-form .input-group .form-control{width:auto}.navbar-form .input-group>.form-control{width:100%}.navbar-form .control-label{margin-bottom:0;vertical-align:middle}.navbar-form .radio,.navbar-form .checkbox{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.navbar-form .radio label,.navbar-form .checkbox label{padding-left:0}.navbar-form .radio input[type=radio],.navbar-form .checkbox input[type=checkbox]{position:relative;margin-left:0}.navbar-form .has-feedback .form-control-feedback{top:0}}@media (max-width:767px){.navbar-form .form-group{margin-bottom:5px}.navbar-form .form-group:last-child{margin-bottom:0}}@media (min-width:768px){.navbar-form{width:auto;padding-top:0;padding-bottom:0;margin-right:0;margin-left:0;border:0;-webkit-box-shadow:none;box-shadow:none}}.navbar-nav>li>.dropdown-menu{margin-top:0;border-top-left-radius:0;border-top-right-radius:0}.navbar-fixed-bottom .navbar-nav>li>.dropdown-menu{border-bottom-right-radius:0;border-bottom-left-radius:0}.navbar-btn{margin-top:8px;margin-bottom:8px}.navbar-btn.btn-sm{margin-top:10px;margin-bottom:10px}.navbar-btn.btn-xs{margin-top:14px;margin-bottom:14px}.navbar-text{margin-top:15px;margin-bottom:15px}@media (min-width:768px){.navbar-text{float:left;margin-right:15px;margin-left:15px}}@media (min-width:768px){.navbar-left{float:left!important}.navbar-right{float:right!important;margin-right:-15px}.navbar-right~.navbar-right{margin-right:0}}.navbar-default{background-color:#f8f8f8;border-color:#e7e7e7}.navbar-default .navbar-brand{color:#777}.navbar-default .navbar-brand:hover,.navbar-default .navbar-brand:focus{color:#5e5e5e;background-color:transparent}.navbar-default .navbar-text{color:#777}.navbar-default .navbar-nav>li>a{color:#777}.navbar-default .navbar-nav>li>a:hover,.navbar-default .navbar-nav>li>a:focus{color:#333;background-color:transparent}.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.active>a:focus{color:#555;background-color:#e7e7e7}.navbar-default .navbar-nav>.disabled>a,.navbar-default .navbar-nav>.disabled>a:hover,.navbar-default .navbar-nav>.disabled>a:focus{color:#ccc;background-color:transparent}.navbar-default .navbar-toggle{border-color:#ddd}.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{background-color:#ddd}.navbar-default .navbar-toggle .icon-bar{background-color:#888}.navbar-default .navbar-collapse,.navbar-default .navbar-form{border-color:#e7e7e7}.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.open>a:hover,.navbar-default .navbar-nav>.open>a:focus{color:#555;background-color:#e7e7e7}@media (max-width:767px){.navbar-default .navbar-nav .open .dropdown-menu>li>a{color:#777}.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover,.navbar-default .navbar-nav .open .dropdown-menu>li>a:focus{color:#333;background-color:transparent}.navbar-default .navbar-nav .open .dropdown-menu>.active>a,.navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover,.navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus{color:#555;background-color:#e7e7e7}.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:hover,.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:focus{color:#ccc;background-color:transparent}}.navbar-default .navbar-link{color:#777}.navbar-default .navbar-link:hover{color:#333}.navbar-default .btn-link{color:#777}.navbar-default .btn-link:hover,.navbar-default .btn-link:focus{color:#333}.navbar-default .btn-link[disabled]:hover,fieldset[disabled] .navbar-default .btn-link:hover,.navbar-default .btn-link[disabled]:focus,fieldset[disabled] .navbar-default .btn-link:focus{color:#ccc}.navbar-inverse{background-color:#222;border-color:#080808}.navbar-inverse .navbar-brand{color:#9d9d9d}.navbar-inverse .navbar-brand:hover,.navbar-inverse .navbar-brand:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-text{color:#9d9d9d}.navbar-inverse .navbar-nav>li>a{color:#9d9d9d}.navbar-inverse .navbar-nav>li>a:hover,.navbar-inverse .navbar-nav>li>a:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.active>a:hover,.navbar-inverse .navbar-nav>.active>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav>.disabled>a,.navbar-inverse .navbar-nav>.disabled>a:hover,.navbar-inverse .navbar-nav>.disabled>a:focus{color:#444;background-color:transparent}.navbar-inverse .navbar-toggle{border-color:#333}.navbar-inverse .navbar-toggle:hover,.navbar-inverse .navbar-toggle:focus{background-color:#333}.navbar-inverse .navbar-toggle .icon-bar{background-color:#fff}.navbar-inverse .navbar-collapse,.navbar-inverse .navbar-form{border-color:#101010}.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.open>a:hover,.navbar-inverse .navbar-nav>.open>a:focus{color:#fff;background-color:#080808}@media (max-width:767px){.navbar-inverse .navbar-nav .open .dropdown-menu>.dropdown-header{border-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu .divider{background-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu>li>a{color:#9d9d9d}.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover,.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:hover,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:focus{color:#444;background-color:transparent}}.navbar-inverse .navbar-link{color:#9d9d9d}.navbar-inverse .navbar-link:hover{color:#fff}.navbar-inverse .btn-link{color:#9d9d9d}.navbar-inverse .btn-link:hover,.navbar-inverse .btn-link:focus{color:#fff}.navbar-inverse .btn-link[disabled]:hover,fieldset[disabled] .navbar-inverse .btn-link:hover,.navbar-inverse .btn-link[disabled]:focus,fieldset[disabled] .navbar-inverse .btn-link:focus{color:#444}.breadcrumb{padding:8px 15px;margin-bottom:20px;list-style:none;background-color:#f5f5f5;border-radius:4px}.breadcrumb>li{display:inline-block}.breadcrumb>li+li:before{padding:0 5px;color:#ccc;content:"/\00a0"}.breadcrumb>.active{color:#777}.pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}.pagination>li{display:inline}.pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#428bca;text-decoration:none;background-color:#fff;border:1px solid #ddd}.pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-top-left-radius:4px;border-bottom-left-radius:4px}.pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px}.pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus{color:#2a6496;background-color:#eee;border-color:#ddd}.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus{z-index:2;color:#fff;cursor:default;background-color:#428bca;border-color:#428bca}.pagination>.disabled>span,.pagination>.disabled>span:hover,.pagination>.disabled>span:focus,.pagination>.disabled>a,.pagination>.disabled>a:hover,.pagination>.disabled>a:focus{color:#777;cursor:not-allowed;background-color:#fff;border-color:#ddd}.pagination-lg>li>a,.pagination-lg>li>span{padding:10px 16px;font-size:18px}.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span{border-top-left-radius:6px;border-bottom-left-radius:6px}.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px}.pagination-sm>li>a,.pagination-sm>li>span{padding:5px 10px;font-size:12px}.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span{border-top-left-radius:3px;border-bottom-left-radius:3px}.pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span{border-top-right-radius:3px;border-bottom-right-radius:3px}.pager{padding-left:0;margin:20px 0;text-align:center;list-style:none}.pager li{display:inline}.pager li>a,.pager li>span{display:inline-block;padding:5px 14px;background-color:#fff;border:1px solid #ddd;border-radius:15px}.pager li>a:hover,.pager li>a:focus{text-decoration:none;background-color:#eee}.pager .next>a,.pager .next>span{float:right}.pager .previous>a,.pager .previous>span{float:left}.pager .disabled>a,.pager .disabled>a:hover,.pager .disabled>a:focus,.pager .disabled>span{color:#777;cursor:not-allowed;background-color:#fff}.label{display:inline;padding:.2em .6em .3em;font-size:75%;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25em}a.label:hover,a.label:focus{color:#fff;text-decoration:none;cursor:pointer}.label:empty{display:none}.btn .label{position:relative;top:-1px}.label-default{background-color:#777}.label-default[href]:hover,.label-default[href]:focus{background-color:#5e5e5e}.label-primary{background-color:#428bca}.label-primary[href]:hover,.label-primary[href]:focus{background-color:#3071a9}.label-success{background-color:#5cb85c}.label-success[href]:hover,.label-success[href]:focus{background-color:#449d44}.label-info{background-color:#5bc0de}.label-info[href]:hover,.label-info[href]:focus{background-color:#31b0d5}.label-warning{background-color:#f0ad4e}.label-warning[href]:hover,.label-warning[href]:focus{background-color:#ec971f}.label-danger{background-color:#d9534f}.label-danger[href]:hover,.label-danger[href]:focus{background-color:#c9302c}.badge{display:inline-block;min-width:10px;padding:3px 7px;font-size:12px;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;background-color:#777;border-radius:10px}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.btn-xs .badge{top:0;padding:1px 5px}a.badge:hover,a.badge:focus{color:#fff;text-decoration:none;cursor:pointer}a.list-group-item.active>.badge,.nav-pills>.active>a>.badge{color:#428bca;background-color:#fff}.nav-pills>li>a>.badge{margin-left:3px}.jumbotron{padding:30px 15px;margin-bottom:30px;color:inherit;background-color:#eee}.jumbotron h1,.jumbotron .h1{color:inherit}.jumbotron p{margin-bottom:15px;font-size:21px;font-weight:200}.jumbotron>hr{border-top-color:#d5d5d5}.container .jumbotron,.container-fluid .jumbotron{border-radius:6px}.jumbotron .container{max-width:100%}@media screen and (min-width:768px){.jumbotron{padding:48px 0}.container .jumbotron{padding-right:60px;padding-left:60px}.jumbotron h1,.jumbotron .h1{font-size:63px}}.thumbnail{display:block;padding:4px;margin-bottom:20px;line-height:1.42857143;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:border .2s ease-in-out;-o-transition:border .2s ease-in-out;transition:border .2s ease-in-out}.thumbnail>img,.thumbnail a>img{margin-right:auto;margin-left:auto}a.thumbnail:hover,a.thumbnail:focus,a.thumbnail.active{border-color:#428bca}.thumbnail .caption{padding:9px;color:#333}.alert{padding:15px;margin-bottom:20px;border:1px solid transparent;border-radius:4px}.alert h4{margin-top:0;color:inherit}.alert .alert-link{font-weight:700}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:5px}.alert-dismissable,.alert-dismissible{padding-right:35px}.alert-dismissable .close,.alert-dismissible .close{position:relative;top:-2px;right:-21px;color:inherit}.alert-success{color:#3c763d;background-color:#dff0d8;border-color:#d6e9c6}.alert-success hr{border-top-color:#c9e2b3}.alert-success .alert-link{color:#2b542c}.alert-info{color:#31708f;background-color:#d9edf7;border-color:#bce8f1}.alert-info hr{border-top-color:#a6e1ec}.alert-info .alert-link{color:#245269}.alert-warning{color:#8a6d3b;background-color:#fcf8e3;border-color:#faebcc}.alert-warning hr{border-top-color:#f7e1b5}.alert-warning .alert-link{color:#66512c}.alert-danger{color:#a94442;background-color:#f2dede;border-color:#ebccd1}.alert-danger hr{border-top-color:#e4b9c0}.alert-danger .alert-link{color:#843534}@-webkit-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-o-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}.progress{height:20px;margin-bottom:20px;overflow:hidden;background-color:#f5f5f5;border-radius:4px;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);box-shadow:inset 0 1px 2px rgba(0,0,0,.1)}.progress-bar{float:left;width:0;height:100%;font-size:12px;line-height:20px;color:#fff;text-align:center;background-color:#428bca;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,.15);box-shadow:inset 0 -1px 0 rgba(0,0,0,.15);-webkit-transition:width .6s ease;-o-transition:width .6s ease;transition:width .6s ease}.progress-striped .progress-bar,.progress-bar-striped{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);-webkit-background-size:40px 40px;background-size:40px 40px}.progress.active .progress-bar,.progress-bar.active{-webkit-animation:progress-bar-stripes 2s linear infinite;-o-animation:progress-bar-stripes 2s linear infinite;animation:progress-bar-stripes 2s linear infinite}.progress-bar-success{background-color:#5cb85c}.progress-striped .progress-bar-success{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.progress-bar-info{background-color:#5bc0de}.progress-striped .progress-bar-info{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.progress-bar-warning{background-color:#f0ad4e}.progress-striped .progress-bar-warning{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.progress-bar-danger{background-color:#d9534f}.progress-striped .progress-bar-danger{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.media{margin-top:15px}.media:first-child{margin-top:0}.media-right,.media>.pull-right{padding-left:10px}.media-left,.media>.pull-left{padding-right:10px}.media-left,.media-right,.media-body{display:table-cell;vertical-align:top}.media-middle{vertical-align:middle}.media-bottom{vertical-align:bottom}.media-heading{margin-top:0;margin-bottom:5px}.media-list{padding-left:0;list-style:none}.list-group{padding-left:0;margin-bottom:20px}.list-group-item{position:relative;display:block;padding:10px 15px;margin-bottom:-1px;background-color:#fff;border:1px solid #ddd}.list-group-item:first-child{border-top-left-radius:4px;border-top-right-radius:4px}.list-group-item:last-child{margin-bottom:0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}.list-group-item>.badge{float:right}.list-group-item>.badge+.badge{margin-right:5px}a.list-group-item{color:#555}a.list-group-item .list-group-item-heading{color:#333}a.list-group-item:hover,a.list-group-item:focus{color:#555;text-decoration:none;background-color:#f5f5f5}.list-group-item.disabled,.list-group-item.disabled:hover,.list-group-item.disabled:focus{color:#777;cursor:not-allowed;background-color:#eee}.list-group-item.disabled .list-group-item-heading,.list-group-item.disabled:hover .list-group-item-heading,.list-group-item.disabled:focus .list-group-item-heading{color:inherit}.list-group-item.disabled .list-group-item-text,.list-group-item.disabled:hover .list-group-item-text,.list-group-item.disabled:focus .list-group-item-text{color:#777}.list-group-item.active,.list-group-item.active:hover,.list-group-item.active:focus{z-index:2;color:#fff;background-color:#428bca;border-color:#428bca}.list-group-item.active .list-group-item-heading,.list-group-item.active:hover .list-group-item-heading,.list-group-item.active:focus .list-group-item-heading,.list-group-item.active .list-group-item-heading>small,.list-group-item.active:hover .list-group-item-heading>small,.list-group-item.active:focus .list-group-item-heading>small,.list-group-item.active .list-group-item-heading>.small,.list-group-item.active:hover .list-group-item-heading>.small,.list-group-item.active:focus .list-group-item-heading>.small{color:inherit}.list-group-item.active .list-group-item-text,.list-group-item.active:hover .list-group-item-text,.list-group-item.active:focus .list-group-item-text{color:#e1edf7}.list-group-item-success{color:#3c763d;background-color:#dff0d8}a.list-group-item-success{color:#3c763d}a.list-group-item-success .list-group-item-heading{color:inherit}a.list-group-item-success:hover,a.list-group-item-success:focus{color:#3c763d;background-color:#d0e9c6}a.list-group-item-success.active,a.list-group-item-success.active:hover,a.list-group-item-success.active:focus{color:#fff;background-color:#3c763d;border-color:#3c763d}.list-group-item-info{color:#31708f;background-color:#d9edf7}a.list-group-item-info{color:#31708f}a.list-group-item-info .list-group-item-heading{color:inherit}a.list-group-item-info:hover,a.list-group-item-info:focus{color:#31708f;background-color:#c4e3f3}a.list-group-item-info.active,a.list-group-item-info.active:hover,a.list-group-item-info.active:focus{color:#fff;background-color:#31708f;border-color:#31708f}.list-group-item-warning{color:#8a6d3b;background-color:#fcf8e3}a.list-group-item-warning{color:#8a6d3b}a.list-group-item-warning .list-group-item-heading{color:inherit}a.list-group-item-warning:hover,a.list-group-item-warning:focus{color:#8a6d3b;background-color:#faf2cc}a.list-group-item-warning.active,a.list-group-item-warning.active:hover,a.list-group-item-warning.active:focus{color:#fff;background-color:#8a6d3b;border-color:#8a6d3b}.list-group-item-danger{color:#a94442;background-color:#f2dede}a.list-group-item-danger{color:#a94442}a.list-group-item-danger .list-group-item-heading{color:inherit}a.list-group-item-danger:hover,a.list-group-item-danger:focus{color:#a94442;background-color:#ebcccc}a.list-group-item-danger.active,a.list-group-item-danger.active:hover,a.list-group-item-danger.active:focus{color:#fff;background-color:#a94442;border-color:#a94442}.list-group-item-heading{margin-top:0;margin-bottom:5px}.list-group-item-text{margin-bottom:0;line-height:1.3}.panel{margin-bottom:20px;background-color:#fff;border:1px solid transparent;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,.05);box-shadow:0 1px 1px rgba(0,0,0,.05)}.panel-body{padding:15px}.panel-heading{padding:10px 15px;border-bottom:1px solid transparent;border-top-left-radius:3px;border-top-right-radius:3px}.panel-heading>.dropdown .dropdown-toggle{color:inherit}.panel-title{margin-top:0;margin-bottom:0;font-size:16px;color:inherit}.panel-title>a{color:inherit}.panel-footer{padding:10px 15px;background-color:#f5f5f5;border-top:1px solid #ddd;border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel>.list-group,.panel>.panel-collapse>.list-group{margin-bottom:0}.panel>.list-group .list-group-item,.panel>.panel-collapse>.list-group .list-group-item{border-width:1px 0;border-radius:0}.panel>.list-group:first-child .list-group-item:first-child,.panel>.panel-collapse>.list-group:first-child .list-group-item:first-child{border-top:0;border-top-left-radius:3px;border-top-right-radius:3px}.panel>.list-group:last-child .list-group-item:last-child,.panel>.panel-collapse>.list-group:last-child .list-group-item:last-child{border-bottom:0;border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel-heading+.list-group .list-group-item:first-child{border-top-width:0}.list-group+.panel-footer{border-top-width:0}.panel>.table,.panel>.table-responsive>.table,.panel>.panel-collapse>.table{margin-bottom:0}.panel>.table caption,.panel>.table-responsive>.table caption,.panel>.panel-collapse>.table caption{padding-right:15px;padding-left:15px}.panel>.table:first-child,.panel>.table-responsive:first-child>.table:first-child{border-top-left-radius:3px;border-top-right-radius:3px}.panel>.table:first-child>thead:first-child>tr:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child{border-top-left-radius:3px;border-top-right-radius:3px}.panel>.table:first-child>thead:first-child>tr:first-child td:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child td:first-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:first-child,.panel>.table:first-child>thead:first-child>tr:first-child th:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child th:first-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:first-child{border-top-left-radius:3px}.panel>.table:first-child>thead:first-child>tr:first-child td:last-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:last-child,.panel>.table:first-child>tbody:first-child>tr:first-child td:last-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:last-child,.panel>.table:first-child>thead:first-child>tr:first-child th:last-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:last-child,.panel>.table:first-child>tbody:first-child>tr:first-child th:last-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:last-child{border-top-right-radius:3px}.panel>.table:last-child,.panel>.table-responsive:last-child>.table:last-child{border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel>.table:last-child>tbody:last-child>tr:last-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child{border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel>.table:last-child>tbody:last-child>tr:last-child td:first-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:first-child,.panel>.table:last-child>tfoot:last-child>tr:last-child td:first-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:first-child,.panel>.table:last-child>tbody:last-child>tr:last-child th:first-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:first-child,.panel>.table:last-child>tfoot:last-child>tr:last-child th:first-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:first-child{border-bottom-left-radius:3px}.panel>.table:last-child>tbody:last-child>tr:last-child td:last-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child td:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child th:last-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child th:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:last-child{border-bottom-right-radius:3px}.panel>.panel-body+.table,.panel>.panel-body+.table-responsive,.panel>.table+.panel-body,.panel>.table-responsive+.panel-body{border-top:1px solid #ddd}.panel>.table>tbody:first-child>tr:first-child th,.panel>.table>tbody:first-child>tr:first-child td{border-top:0}.panel>.table-bordered,.panel>.table-responsive>.table-bordered{border:0}.panel>.table-bordered>thead>tr>th:first-child,.panel>.table-responsive>.table-bordered>thead>tr>th:first-child,.panel>.table-bordered>tbody>tr>th:first-child,.panel>.table-responsive>.table-bordered>tbody>tr>th:first-child,.panel>.table-bordered>tfoot>tr>th:first-child,.panel>.table-responsive>.table-bordered>tfoot>tr>th:first-child,.panel>.table-bordered>thead>tr>td:first-child,.panel>.table-responsive>.table-bordered>thead>tr>td:first-child,.panel>.table-bordered>tbody>tr>td:first-child,.panel>.table-responsive>.table-bordered>tbody>tr>td:first-child,.panel>.table-bordered>tfoot>tr>td:first-child,.panel>.table-responsive>.table-bordered>tfoot>tr>td:first-child{border-left:0}.panel>.table-bordered>thead>tr>th:last-child,.panel>.table-responsive>.table-bordered>thead>tr>th:last-child,.panel>.table-bordered>tbody>tr>th:last-child,.panel>.table-responsive>.table-bordered>tbody>tr>th:last-child,.panel>.table-bordered>tfoot>tr>th:last-child,.panel>.table-responsive>.table-bordered>tfoot>tr>th:last-child,.panel>.table-bordered>thead>tr>td:last-child,.panel>.table-responsive>.table-bordered>thead>tr>td:last-child,.panel>.table-bordered>tbody>tr>td:last-child,.panel>.table-responsive>.table-bordered>tbody>tr>td:last-child,.panel>.table-bordered>tfoot>tr>td:last-child,.panel>.table-responsive>.table-bordered>tfoot>tr>td:last-child{border-right:0}.panel>.table-bordered>thead>tr:first-child>td,.panel>.table-responsive>.table-bordered>thead>tr:first-child>td,.panel>.table-bordered>tbody>tr:first-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>td,.panel>.table-bordered>thead>tr:first-child>th,.panel>.table-responsive>.table-bordered>thead>tr:first-child>th,.panel>.table-bordered>tbody>tr:first-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>th{border-bottom:0}.panel>.table-bordered>tbody>tr:last-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>td,.panel>.table-bordered>tfoot>tr:last-child>td,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>td,.panel>.table-bordered>tbody>tr:last-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>th,.panel>.table-bordered>tfoot>tr:last-child>th,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>th{border-bottom:0}.panel>.table-responsive{margin-bottom:0;border:0}.panel-group{margin-bottom:20px}.panel-group .panel{margin-bottom:0;border-radius:4px}.panel-group .panel+.panel{margin-top:5px}.panel-group .panel-heading{border-bottom:0}.panel-group .panel-heading+.panel-collapse>.panel-body,.panel-group .panel-heading+.panel-collapse>.list-group{border-top:1px solid #ddd}.panel-group .panel-footer{border-top:0}.panel-group .panel-footer+.panel-collapse .panel-body{border-bottom:1px solid #ddd}.panel-default{border-color:#ddd}.panel-default>.panel-heading{color:#333;background-color:#f5f5f5;border-color:#ddd}.panel-default>.panel-heading+.panel-collapse>.panel-body{border-top-color:#ddd}.panel-default>.panel-heading .badge{color:#f5f5f5;background-color:#333}.panel-default>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#ddd}.panel-primary{border-color:#428bca}.panel-primary>.panel-heading{color:#fff;background-color:#428bca;border-color:#428bca}.panel-primary>.panel-heading+.panel-collapse>.panel-body{border-top-color:#428bca}.panel-primary>.panel-heading .badge{color:#428bca;background-color:#fff}.panel-primary>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#428bca}.panel-success{border-color:#d6e9c6}.panel-success>.panel-heading{color:#3c763d;background-color:#dff0d8;border-color:#d6e9c6}.panel-success>.panel-heading+.panel-collapse>.panel-body{border-top-color:#d6e9c6}.panel-success>.panel-heading .badge{color:#dff0d8;background-color:#3c763d}.panel-success>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#d6e9c6}.panel-info{border-color:#bce8f1}.panel-info>.panel-heading{color:#31708f;background-color:#d9edf7;border-color:#bce8f1}.panel-info>.panel-heading+.panel-collapse>.panel-body{border-top-color:#bce8f1}.panel-info>.panel-heading .badge{color:#d9edf7;background-color:#31708f}.panel-info>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#bce8f1}.panel-warning{border-color:#faebcc}.panel-warning>.panel-heading{color:#8a6d3b;background-color:#fcf8e3;border-color:#faebcc}.panel-warning>.panel-heading+.panel-collapse>.panel-body{border-top-color:#faebcc}.panel-warning>.panel-heading .badge{color:#fcf8e3;background-color:#8a6d3b}.panel-warning>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#faebcc}.panel-danger{border-color:#ebccd1}.panel-danger>.panel-heading{color:#a94442;background-color:#f2dede;border-color:#ebccd1}.panel-danger>.panel-heading+.panel-collapse>.panel-body{border-top-color:#ebccd1}.panel-danger>.panel-heading .badge{color:#f2dede;background-color:#a94442}.panel-danger>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#ebccd1}.embed-responsive{position:relative;display:block;height:0;padding:0;overflow:hidden}.embed-responsive .embed-responsive-item,.embed-responsive iframe,.embed-responsive embed,.embed-responsive object,.embed-responsive video{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0}.embed-responsive.embed-responsive-16by9{padding-bottom:56.25%}.embed-responsive.embed-responsive-4by3{padding-bottom:75%}.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.05);box-shadow:inset 0 1px 1px rgba(0,0,0,.05)}.well blockquote{border-color:#ddd;border-color:rgba(0,0,0,.15)}.well-lg{padding:24px;border-radius:6px}.well-sm{padding:9px;border-radius:3px}.close{float:right;font-size:21px;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;filter:alpha(opacity=20);opacity:.2}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;filter:alpha(opacity=50);opacity:.5}button.close{-webkit-appearance:none;padding:0;cursor:pointer;background:0 0;border:0}.modal-open{overflow:hidden}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1040;display:none;overflow:hidden;-webkit-overflow-scrolling:touch;outline:0}.modal.fade .modal-dialog{-webkit-transition:-webkit-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out;-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);-o-transform:translate(0,-25%);transform:translate(0,-25%)}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0)}.modal-open .modal{overflow-x:hidden;overflow-y:auto}.modal-dialog{position:relative;width:auto;margin:10px}.modal-content{position:relative;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #999;border:1px solid rgba(0,0,0,.2);border-radius:6px;outline:0;-webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);box-shadow:0 3px 9px rgba(0,0,0,.5)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}.modal-header{min-height:16.43px;padding:15px;border-bottom:1px solid #e5e5e5}.modal-header .close{margin-top:-2px}.modal-title{margin:0;line-height:1.42857143}.modal-body{position:relative;padding:15px}.modal-footer{padding:15px;text-align:right;border-top:1px solid #e5e5e5}.modal-footer .btn+.btn{margin-bottom:0;margin-left:5px}.modal-footer .btn-group .btn+.btn{margin-left:-1px}.modal-footer .btn-block+.btn-block{margin-left:0}.modal-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll}@media (min-width:768px){.modal-dialog{width:600px;margin:30px auto}.modal-content{-webkit-box-shadow:0 5px 15px rgba(0,0,0,.5);box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal-sm{width:300px}}@media (min-width:992px){.modal-lg{width:900px}}.tooltip{position:absolute;z-index:1070;display:block;font-size:12px;line-height:1.4;visibility:visible;filter:alpha(opacity=0);opacity:0}.tooltip.in{filter:alpha(opacity=90);opacity:.9}.tooltip.top{padding:5px 0;margin-top:-3px}.tooltip.right{padding:0 5px;margin-left:3px}.tooltip.bottom{padding:5px 0;margin-top:3px}.tooltip.left{padding:0 5px;margin-left:-3px}.tooltip-inner{max-width:200px;padding:3px 8px;color:#fff;text-align:center;text-decoration:none;background-color:#000;border-radius:4px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.top-left .tooltip-arrow{bottom:0;left:5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.top-right .tooltip-arrow{right:5px;bottom:0;border-width:5px 5px 0;border-top-color:#000}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#000}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#000}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#000}.tooltip.bottom-left .tooltip-arrow{top:0;left:5px;border-width:0 5px 5px;border-bottom-color:#000}.tooltip.bottom-right .tooltip-arrow{top:0;right:5px;border-width:0 5px 5px;border-bottom-color:#000}.popover{position:absolute;top:0;left:0;z-index:1060;display:none;max-width:276px;padding:1px;font-size:14px;font-weight:400;line-height:1.42857143;text-align:left;white-space:normal;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #ccc;border:1px solid rgba(0,0,0,.2);border-radius:6px;-webkit-box-shadow:0 5px 10px rgba(0,0,0,.2);box-shadow:0 5px 10px rgba(0,0,0,.2)}.popover.top{margin-top:-10px}.popover.right{margin-left:10px}.popover.bottom{margin-top:10px}.popover.left{margin-left:-10px}.popover-title{padding:8px 14px;margin:0;font-size:14px;background-color:#f7f7f7;border-bottom:1px solid #ebebeb;border-radius:5px 5px 0 0}.popover-content{padding:9px 14px}.popover>.arrow,.popover>.arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.popover>.arrow{border-width:11px}.popover>.arrow:after{content:"";border-width:10px}.popover.top>.arrow{bottom:-11px;left:50%;margin-left:-11px;border-top-color:#999;border-top-color:rgba(0,0,0,.25);border-bottom-width:0}.popover.top>.arrow:after{bottom:1px;margin-left:-10px;content:" ";border-top-color:#fff;border-bottom-width:0}.popover.right>.arrow{top:50%;left:-11px;margin-top:-11px;border-right-color:#999;border-right-color:rgba(0,0,0,.25);border-left-width:0}.popover.right>.arrow:after{bottom:-10px;left:1px;content:" ";border-right-color:#fff;border-left-width:0}.popover.bottom>.arrow{top:-11px;left:50%;margin-left:-11px;border-top-width:0;border-bottom-color:#999;border-bottom-color:rgba(0,0,0,.25)}.popover.bottom>.arrow:after{top:1px;margin-left:-10px;content:" ";border-top-width:0;border-bottom-color:#fff}.popover.left>.arrow{top:50%;right:-11px;margin-top:-11px;border-right-width:0;border-left-color:#999;border-left-color:rgba(0,0,0,.25)}.popover.left>.arrow:after{right:1px;bottom:-10px;content:" ";border-right-width:0;border-left-color:#fff}.carousel{position:relative}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner>.item{position:relative;display:none;-webkit-transition:.6s ease-in-out left;-o-transition:.6s ease-in-out left;transition:.6s ease-in-out left}.carousel-inner>.item>img,.carousel-inner>.item>a>img{line-height:1}@media all and (transform-3d),(-webkit-transform-3d){.carousel-inner>.item{-webkit-transition:-webkit-transform .6s ease-in-out;-o-transition:-o-transform .6s ease-in-out;transition:transform .6s ease-in-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;perspective:1000}.carousel-inner>.item.next,.carousel-inner>.item.active.right{left:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.carousel-inner>.item.prev,.carousel-inner>.item.active.left{left:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right,.carousel-inner>.item.active{left:0;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev{display:block}.carousel-inner>.active{left:0}.carousel-inner>.next,.carousel-inner>.prev{position:absolute;top:0;width:100%}.carousel-inner>.next{left:100%}.carousel-inner>.prev{left:-100%}.carousel-inner>.next.left,.carousel-inner>.prev.right{left:0}.carousel-inner>.active.left{left:-100%}.carousel-inner>.active.right{left:100%}.carousel-control{position:absolute;top:0;bottom:0;left:0;width:15%;font-size:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.6);filter:alpha(opacity=50);opacity:.5}.carousel-control.left{background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);background-image:-o-linear-gradient(left,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,.0001)));background-image:linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);background-repeat:repeat-x}.carousel-control.right{right:0;left:auto;background-image:-webkit-linear-gradient(left,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);background-image:-o-linear-gradient(left,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.0001)),to(rgba(0,0,0,.5)));background-image:linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);background-repeat:repeat-x}.carousel-control:hover,.carousel-control:focus{color:#fff;text-decoration:none;filter:alpha(opacity=90);outline:0;opacity:.9}.carousel-control .icon-prev,.carousel-control .icon-next,.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right{position:absolute;top:50%;z-index:5;display:inline-block}.carousel-control .icon-prev,.carousel-control .glyphicon-chevron-left{left:50%;margin-left:-10px}.carousel-control .icon-next,.carousel-control .glyphicon-chevron-right{right:50%;margin-right:-10px}.carousel-control .icon-prev,.carousel-control .icon-next{width:20px;height:20px;margin-top:-10px;font-family:serif}.carousel-control .icon-prev:before{content:'\2039'}.carousel-control .icon-next:before{content:'\203a'}.carousel-indicators{position:absolute;bottom:10px;left:50%;z-index:15;width:60%;padding-left:0;margin-left:-30%;text-align:center;list-style:none}.carousel-indicators li{display:inline-block;width:10px;height:10px;margin:1px;text-indent:-999px;cursor:pointer;background-color:#000 \9;background-color:rgba(0,0,0,0);border:1px solid #fff;border-radius:10px}.carousel-indicators .active{width:12px;height:12px;margin:0;background-color:#fff}.carousel-caption{position:absolute;right:15%;bottom:20px;left:15%;z-index:10;padding-top:20px;padding-bottom:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.6)}.carousel-caption .btn{text-shadow:none}@media screen and (min-width:768px){.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-prev,.carousel-control .icon-next{width:30px;height:30px;margin-top:-15px;font-size:30px}.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev{margin-left:-15px}.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next{margin-right:-15px}.carousel-caption{right:20%;left:20%;padding-bottom:30px}.carousel-indicators{bottom:20px}}.clearfix:before,.clearfix:after,.dl-horizontal dd:before,.dl-horizontal dd:after,.container:before,.container:after,.container-fluid:before,.container-fluid:after,.row:before,.row:after,.form-horizontal .form-group:before,.form-horizontal .form-group:after,.btn-toolbar:before,.btn-toolbar:after,.btn-group-vertical>.btn-group:before,.btn-group-vertical>.btn-group:after,.nav:before,.nav:after,.navbar:before,.navbar:after,.navbar-header:before,.navbar-header:after,.navbar-collapse:before,.navbar-collapse:after,.pager:before,.pager:after,.panel-body:before,.panel-body:after,.modal-footer:before,.modal-footer:after{display:table;content:" "}.clearfix:after,.dl-horizontal dd:after,.container:after,.container-fluid:after,.row:after,.form-horizontal .form-group:after,.btn-toolbar:after,.btn-group-vertical>.btn-group:after,.nav:after,.navbar:after,.navbar-header:after,.navbar-collapse:after,.pager:after,.panel-body:after,.modal-footer:after{clear:both}.center-block{display:block;margin-right:auto;margin-left:auto}.pull-right{float:right!important}.pull-left{float:left!important}.hide{display:none!important}.show{display:block!important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.hidden{display:none!important;visibility:hidden!important}.affix{position:fixed}@-ms-viewport{width:device-width}.visible-xs,.visible-sm,.visible-md,.visible-lg{display:none!important}.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block{display:none!important}@media (max-width:767px){.visible-xs{display:block!important}table.visible-xs{display:table}tr.visible-xs{display:table-row!important}th.visible-xs,td.visible-xs{display:table-cell!important}}@media (max-width:767px){.visible-xs-block{display:block!important}}@media (max-width:767px){.visible-xs-inline{display:inline!important}}@media (max-width:767px){.visible-xs-inline-block{display:inline-block!important}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block!important}table.visible-sm{display:table}tr.visible-sm{display:table-row!important}th.visible-sm,td.visible-sm{display:table-cell!important}}@media (min-width:768px) and (max-width:991px){.visible-sm-block{display:block!important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline{display:inline!important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline-block{display:inline-block!important}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block!important}table.visible-md{display:table}tr.visible-md{display:table-row!important}th.visible-md,td.visible-md{display:table-cell!important}}@media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block!important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline{display:inline!important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline-block{display:inline-block!important}}@media (min-width:1200px){.visible-lg{display:block!important}table.visible-lg{display:table}tr.visible-lg{display:table-row!important}th.visible-lg,td.visible-lg{display:table-cell!important}}@media (min-width:1200px){.visible-lg-block{display:block!important}}@media (min-width:1200px){.visible-lg-inline{display:inline!important}}@media (min-width:1200px){.visible-lg-inline-block{display:inline-block!important}}@media (max-width:767px){.hidden-xs{display:none!important}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none!important}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none!important}}@media (min-width:1200px){.hidden-lg{display:none!important}}.visible-print{display:none!important}@media print{.visible-print{display:block!important}table.visible-print{display:table}tr.visible-print{display:table-row!important}th.visible-print,td.visible-print{display:table-cell!important}}.visible-print-block{display:none!important}@media print{.visible-print-block{display:block!important}}.visible-print-inline{display:none!important}@media print{.visible-print-inline{display:inline!important}}.visible-print-inline-block{display:none!important}@media print{.visible-print-inline-block{display:inline-block!important}}@media print{.hidden-print{display:none!important}} -------------------------------------------------------------------------------- /server/static/css/canvastools.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * CanvasTools v1.0.0 3 | * (github)https://github.com/S-mohan/canvasTools 4 | * (url) https://smohan.net/lab/canvastools 5 | * (c) smohan 6 | * license MIT 7 | */ 8 | .canvas-tools, .canvas-tools * { 9 | -webkit-box-sizing: border-box; 10 | box-sizing: border-box; } 11 | 12 | @font-face { 13 | font-family: 'fontello'; 14 | src: url('../font/fontello.eot?54424584'); 15 | src: url('../font/fontello.eot?54424584#iefix') format('embedded-opentype'), 16 | url('../font/fontello.woff2?54424584') format('woff2'), 17 | url('../font/fontello.woff?54424584') format('woff'), 18 | url('../font/fontello.ttf?54424584') format('truetype'), 19 | url('../font/fontello.svg?54424584#fontello') format('svg'); 20 | font-weight: normal; 21 | font-style: normal; 22 | } 23 | 24 | [class^="canvas-tools-icon__"], [class*=" canvas-tools-icon__"] { 25 | font-family: "fontello" !important; 26 | font-size: 16px; 27 | font-style: normal; 28 | line-height: 1; 29 | -webkit-font-smoothing: antialiased; 30 | -moz-osx-font-smoothing: grayscale; } 31 | 32 | 33 | .canvas-tools-icon__ok:before{ 34 | content: '\e804'; 35 | } 36 | .canvas-tools-icon__cancel:before { 37 | content: '\31'; 38 | } 39 | 40 | .canvas-tools-icon__font:before { 41 | content: '\e802'; 42 | /* content: "\E620"; */ 43 | } 44 | 45 | .canvas-tools-icon__save:before { 46 | /* content: "\E60B"; */ 47 | content: '\e803'; 48 | } 49 | 50 | .canvas-tools-icon__undo:before { 51 | /* content: "\E631"; */ 52 | content: '\f112'; 53 | } 54 | 55 | .canvas-tools-icon__arrow:before { 56 | content: "\E50A"; } 57 | 58 | .canvas-tools-icon__rubber:before { 59 | content: "\E6B8"; } 60 | 61 | .canvas-tools-icon__rect:before { 62 | /* content: "\E619"; */ 63 | content: '\e800'; 64 | } 65 | 66 | .canvas-tools-icon__ellipse:before { 67 | /* content: "\E61A"; */ 68 | content: '\f1db'; 69 | } 70 | 71 | .canvas-tools-icon__mosaic:before { 72 | /* content: "\E622"; */ 73 | content: '\e801'; 74 | } 75 | 76 | .canvas-tools-icon__brush:before { 77 | /* content: "\E69A"; */ 78 | content: '\f1fc'; 79 | } 80 | 81 | 82 | .canvas-tools-icon__drag:before { 83 | content: '\f255'; 84 | } 85 | .canvas-tools { 86 | display: inline-block; 87 | height: 2rem; 88 | position: relative; 89 | font-size: 0; 90 | padding: 3px 5px; 91 | -webkit-user-select: none; 92 | -moz-user-select: none; 93 | -ms-user-select: none; 94 | user-select: none; 95 | background: #fff; 96 | 97 | /* -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.075), 0 1px 4px rgba(0, 0, 0, 0.075); 98 | box-shadow: 0 1px 3px rgba(0, 0, 0, 0.075), 0 1px 4px rgba(0, 0, 0, 0.075); */ 99 | } 100 | .canvas-tools [class^="canvas-tools-icon__"], .canvas-tools [class*=" canvas-tools-icon__"] { 101 | font-size: 1.125rem; 102 | position: relative; } 103 | .canvas-tools .canvas-tools-btn { 104 | display: inline-block; 105 | vertical-align: middle; 106 | height: 1.5rem; 107 | padding: .15rem .2rem; 108 | border: 1px solid transparent; 109 | -webkit-transition: all .2s; 110 | transition: all .2s; 111 | margin-right: .5rem; 112 | position: relative; 113 | text-align: center; } 114 | .canvas-tools .canvas-tools-btn .btn-toggle { 115 | display: -webkit-box; 116 | display: -ms-flexbox; 117 | display: flex; 118 | height: 100%; 119 | text-decoration: none; 120 | outline: none; 121 | -webkit-box-orient: vertical; 122 | -webkit-box-direction: normal; 123 | -ms-flex-flow: cloumn; 124 | flex-flow: cloumn; 125 | -webkit-box-align: center; 126 | -ms-flex-align: center; 127 | align-items: center; 128 | -webkit-box-pack: center; 129 | -ms-flex-pack: center; 130 | justify-content: center; 131 | cursor: pointer; } 132 | .canvas-tools .canvas-tools-btn:hover, .canvas-tools .canvas-tools-btn.active { 133 | background-image: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(#fff)); 134 | background-image: linear-gradient(to bottom, #dcdcdc, #fff); 135 | background-color: #efefef; 136 | border-color: #dedede; } 137 | .canvas-tools .canvas-tools-btn.active { 138 | border-color: #d2d5d7; } 139 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__font { 140 | position: relative; 141 | top: -1px; } 142 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__font, .canvas-tools .canvas-tools-btn .canvas-tools-icon__arrow { 143 | color: #2f96e0; } 144 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__save { 145 | color: #7492d7; 146 | top: 1px; } 147 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__undo { 148 | color: #68af45; } 149 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__cancel{ 150 | color: red; 151 | } 152 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__ok{ 153 | color: #68af45; 154 | } 155 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__drag{ 156 | color: #8eb1c8; 157 | } 158 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__rect, .canvas-tools .canvas-tools-btn .canvas-tools-icon__ellipse { 159 | color: #8eb1c8; } 160 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__rubber { 161 | color: #429fe2; } 162 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__mosaic { 163 | color: #a6c2d8; } 164 | .canvas-tools .canvas-tools-btn .canvas-tools-icon__brush { 165 | color: #68af45; } 166 | 167 | .canvas-tools .canvas-tools__panel { 168 | font-size: 0; 169 | position: absolute; 170 | top: 100%; 171 | margin-top: 5px; 172 | left: 0; 173 | background-color: rgba(255, 255, 255, 0.95); 174 | border: 1px solid #d7dee2; 175 | cursor: default; 176 | width: auto; 177 | padding: 4px 10px; 178 | text-align: left; 179 | display: none; 180 | white-space: nowrap !important; 181 | -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 4px rgba(0, 0, 0, 0.05); 182 | box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 4px rgba(0, 0, 0, 0.05); } 183 | .canvas-tools .canvas-tools__panel > .font-select { 184 | display: inline-block; 185 | vertical-align: middle; 186 | padding: 3px 5px; 187 | border: 1px solid #d2d5d7; 188 | outline: none; } 189 | .canvas-tools .canvas-tools__panel > .strokes { 190 | display: inline-block; 191 | vertical-align: middle; 192 | padding-right: 4px; 193 | border-right: 1px solid #d2d5d7; } 194 | .canvas-tools .canvas-tools__panel > .strokes > .stroke { 195 | width: 24px; 196 | height: 24px; 197 | display: inline-block; 198 | vertical-align: middle; 199 | border: 1px solid transparent; 200 | text-align: center; 201 | cursor: pointer; 202 | -webkit-transition: all .2s; 203 | transition: all .2s; 204 | margin-right: 2px; } 205 | .canvas-tools .canvas-tools__panel > .strokes > .stroke:last-child { 206 | margin-right: 0; } 207 | .canvas-tools .canvas-tools__panel > .strokes > .stroke:hover, .canvas-tools .canvas-tools__panel > .strokes > .stroke.active { 208 | background-color: #dee1e8; 209 | border-color: #d7dee2; } 210 | .canvas-tools .canvas-tools__panel > .strokes > .stroke.active { 211 | border-color: #d2d5d7; } 212 | .canvas-tools .canvas-tools__panel > .strokes > .stroke:before, .canvas-tools .canvas-tools__panel > .strokes > .stroke > i { 213 | display: inline-block; 214 | vertical-align: middle; } 215 | .canvas-tools .canvas-tools__panel > .strokes > .stroke:before { 216 | content: ''; 217 | height: 100%; } 218 | .canvas-tools .canvas-tools__panel > .strokes > .stroke i { 219 | border-radius: 50%; 220 | background-color: #2f8ddd; } 221 | .canvas-tools .canvas-tools__panel > .colors { 222 | display: inline-block; 223 | vertical-align: middle; 224 | margin-left: 8px; } 225 | .canvas-tools .canvas-tools__panel > .colors > .color-selected, .canvas-tools .canvas-tools__panel > .colors > .color-list { 226 | display: inline-block; 227 | vertical-align: middle; } 228 | .canvas-tools .canvas-tools__panel > .colors > .color-selected { 229 | width: 28px; 230 | height: 28px; 231 | border: 1px solid #d2d5d7; 232 | padding: 2px; 233 | background-color: #fff; } 234 | .canvas-tools .canvas-tools__panel > .colors > .color-selected > i { 235 | display: block; 236 | width: 100%; 237 | height: 100%; 238 | -webkit-transition: all .2s; 239 | transition: all .2s; } 240 | .canvas-tools .canvas-tools__panel > .colors > .color-list { 241 | margin-left: 4px; 242 | height: 28px; } 243 | .canvas-tools .canvas-tools__panel > .colors > .color-list > ul { 244 | list-style-type: none; 245 | margin: 0; 246 | padding: 0; } 247 | .canvas-tools .canvas-tools__panel > .colors > .color-list > ul > li { 248 | display: inline-block; 249 | vertical-align: middle; 250 | width: 13px; 251 | height: 13px; 252 | border: 1px solid #d2d5d7; 253 | margin-right: 2px; } 254 | .canvas-tools .canvas-tools__panel > .colors > .color-list > ul > li:last-child { 255 | margin-right: 0; } 256 | .canvas-tools .canvas-tools__panel > .colors > .color-list > ul > li:hover { 257 | -webkit-transform: scale(1.2); 258 | transform: scale(1.2); 259 | border-color: #fff; } 260 | .canvas-tools .canvas-tools__panel > .colors > .color-list > ul:last-child { 261 | margin-top: 2px; } 262 | .canvas-tools .canvas-tools__panel > .ambiguite-range { 263 | font-size: 12px; 264 | display: inline-block; 265 | vertical-align: middle; 266 | margin-left: 8px; } 267 | .canvas-tools .canvas-tools__panel > .ambiguite-range span, .canvas-tools .canvas-tools__panel > .ambiguite-range input { 268 | display: inline-block; 269 | vertical-align: middle; } 270 | .canvas-tools .canvas-tools__panel > .ambiguite-range input { 271 | width: 100px; 272 | margin-left: 5px; } 273 | 274 | .canvas-cursor__brush { 275 | cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABGdBTUEAALGPC/xhBQAAARpJREFUOBGdkr1KA0EUhTcxEkSQQIpAihQWPoedD2BnIVsZQiBVEkiR7SwtBDsJqXwBLQwEgoWNjY2FjYUQ38Ei5Oc7sBeGLTKze+Djzsyecxh2N4ryq0zkHpYQQ2H1SW5TNsxukaZzQsewACvTvIBg3eFUaABHMEv3OruBIN3icm8wZl+FZ3iBQ/AqweGW2FrlKlChV0McFsxOvaegm/T2lLzzTC/dqzaO7A1s/8GzE28Dhhj0f1jQnZ+c18CrKxxrcMO2/uK87m3AcAkrsKA7vzlvQJAmuNywrX84bwY1YBrBATyCFWj+QguCJKNCU1DZQ7r/Y55CsK5x2i2eWFcggTPIJd3Eiv5Zd3KlU3OJOQd9lVd4A5Xl1g4YG2GGhwRfegAAAABJRU5ErkJggg==) 0 17, default; 276 | cursor: -webkit-image-set(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABGdBTUEAALGPC/xhBQAAARpJREFUOBGdkr1KA0EUhTcxEkSQQIpAihQWPoedD2BnIVsZQiBVEkiR7SwtBDsJqXwBLQwEgoWNjY2FjYUQ38Ei5Oc7sBeGLTKze+Djzsyecxh2N4ryq0zkHpYQQ2H1SW5TNsxukaZzQsewACvTvIBg3eFUaABHMEv3OruBIN3icm8wZl+FZ3iBQ/AqweGW2FrlKlChV0McFsxOvaegm/T2lLzzTC/dqzaO7A1s/8GzE28Dhhj0f1jQnZ+c18CrKxxrcMO2/uK87m3AcAkrsKA7vzlvQJAmuNywrX84bwY1YBrBATyCFWj+QguCJKNCU1DZQ7r/Y55CsK5x2i2eWFcggTPIJd3Eiv5Zd3KlU3OJOQd9lVd4A5Xl1g4YG2GGhwRfegAAAABJRU5ErkJggg==) 1x, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABGdBTUEAALGPC/xhBQAAARpJREFUOBGdkr1KA0EUhTcxEkSQQIpAihQWPoedD2BnIVsZQiBVEkiR7SwtBDsJqXwBLQwEgoWNjY2FjYUQ38Ei5Oc7sBeGLTKze+Djzsyecxh2N4ryq0zkHpYQQ2H1SW5TNsxukaZzQsewACvTvIBg3eFUaABHMEv3OruBIN3icm8wZl+FZ3iBQ/AqweGW2FrlKlChV0McFsxOvaegm/T2lLzzTC/dqzaO7A1s/8GzE28Dhhj0f1jQnZ+c18CrKxxrcMO2/uK87m3AcAkrsKA7vzlvQJAmuNywrX84bwY1YBrBATyCFWj+QguCJKNCU1DZQ7r/Y55CsK5x2i2eWFcggTPIJd3Eiv5Zd3KlU3OJOQd9lVd4A5Xl1g4YG2GGhwRfegAAAABJRU5ErkJggg==) 2x) 0 17, default; } 277 | 278 | .canvas-cursor__mosaic { 279 | cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NDkxMSwgMjAxMy8xMC8yOS0xMTo0NzoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpGM0NFMkEyQTRCOTcxMUU3OTc2Mzg4ODUyQTFDQUVGNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpGM0NFMkEyQjRCOTcxMUU3OTc2Mzg4ODUyQTFDQUVGNyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkYzQ0UyQTI4NEI5NzExRTc5NzYzODg4NTJBMUNBRUY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkYzQ0UyQTI5NEI5NzExRTc5NzYzODg4NTJBMUNBRUY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+BtIaIAAAA8pJREFUeNrEl99LU2Ecxs9++IOcmdZkieg2CdmchWgWSCBpFIRk3kldCKLhdIpo/hMVQkujRNlFoHeVdqGQIlRQpijlDxRsmpJjymhtlem2eh45iyUSJ93WFx7PPBvn87zve855n69Mr9cLEisBKoGKoBwoAzosfvcF+gjNQK+gYeirlIvKJBjQQg1QuUKhSJTJZHIc5TKx+IOfYvn9/gAOARw9OP0Eugct7ddAHNQKxg25XB4fExOjSE1NXczJyZkuLCz8kJeXt67T6XZGabfbEyYnJ9VjY2P6mZkZk9PpzNre3vYHAoFNGHqIn9yCfvyLAY66CyM9GRsbq8zOzn5TV1c3VFpa6pQyrcPDw+rOzs5L8/PzZ7a2tnyYkXc4XbPXbOxlIBd6pFQq05KTk11NTU22ysrKJWEf1dvbq21vb692u91JPp/vE05dh97/zQBHPoDpPp6RkbHQ09PTlZ6evikcoGZnZ1X19fW1a2trOizLGk6Vhc5EqIF46BlGfiotLc0+MDBwV6VS+YUwlNfrVZSXlzesrKxkYSa4HJehnYHJQ37XijXPTUpKcnd0dHSFC87itWw224OUlBQXGCaygt8FDWhxt9fyhmtubu42Go1eIczFpWxsbLSRQZa43L8NNPBR492+3xtOSvHaYLwmC/9aggZUfMnwObdYLINChAuMIbLw8QrZNHCebziNRrNYXFy8HmkDZJBFJtk0cI6vV4PBMC1Eqcgik2z+MfDdnp+fb4+WAbzG7WSSLRefAFlBQYEzWgawlzjFjUxLA9zhZJmZmd+iZYCbmGggUS7856IBD/fy5eXlQ9GCcvsmk2waWOI/4+PjqdEyQJZoYIkG5phkJiYmdNEyQBaZZNPAC8aoubk5U7QMkEUm2TQwwgzncDiyRkdH1ZGGk0EWmNzwRmiAH54yw1mt1ouRNkAGWWJo9QYfQysDJDLcWcaoSMH7+voymRPJEhOzoEDu4/Ezcz/W5fTU1JSxqKjorVqt3gonfHV1Nb6lpaUB6SgOBu7jVP/uRHQb6zKNAHkEGa6GMSpccF6rqqqq1uVyHSUDp+7sTkSCmNGqkdkcCJD6iooKM45xB4VjylVlZWVNmIETvDYZ0Pfg98ElCBaX4iWm6ILH49H29/cXIM/ZTSaTe79r3tbWZtnY2NCIsfwatCC1MelmgAw2JmazebCkpERSYBEbk4u8qcXGZFocuaTGJLQ1u8kAuUdrtog9fWNXa3YMrVlWuFqzP3ZPqB66ihlRSWxOaeyx+KjZD9odh7bnpRLb8+dS2/NfAgwAg5rkol00QQkAAAAASUVORK5CYII=) 0 17, default; 280 | cursor: -webkit-image-set(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NDkxMSwgMjAxMy8xMC8yOS0xMTo0NzoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpGM0NFMkEyQTRCOTcxMUU3OTc2Mzg4ODUyQTFDQUVGNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpGM0NFMkEyQjRCOTcxMUU3OTc2Mzg4ODUyQTFDQUVGNyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkYzQ0UyQTI4NEI5NzExRTc5NzYzODg4NTJBMUNBRUY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkYzQ0UyQTI5NEI5NzExRTc5NzYzODg4NTJBMUNBRUY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+BtIaIAAAA8pJREFUeNrEl99LU2Ecxs9++IOcmdZkieg2CdmchWgWSCBpFIRk3kldCKLhdIpo/hMVQkujRNlFoHeVdqGQIlRQpijlDxRsmpJjymhtlem2eh45iyUSJ93WFx7PPBvn87zve855n69Mr9cLEisBKoGKoBwoAzosfvcF+gjNQK+gYeirlIvKJBjQQg1QuUKhSJTJZHIc5TKx+IOfYvn9/gAOARw9OP0Eugct7ddAHNQKxg25XB4fExOjSE1NXczJyZkuLCz8kJeXt67T6XZGabfbEyYnJ9VjY2P6mZkZk9PpzNre3vYHAoFNGHqIn9yCfvyLAY66CyM9GRsbq8zOzn5TV1c3VFpa6pQyrcPDw+rOzs5L8/PzZ7a2tnyYkXc4XbPXbOxlIBd6pFQq05KTk11NTU22ysrKJWEf1dvbq21vb692u91JPp/vE05dh97/zQBHPoDpPp6RkbHQ09PTlZ6evikcoGZnZ1X19fW1a2trOizLGk6Vhc5EqIF46BlGfiotLc0+MDBwV6VS+YUwlNfrVZSXlzesrKxkYSa4HJehnYHJQ37XijXPTUpKcnd0dHSFC87itWw224OUlBQXGCaygt8FDWhxt9fyhmtubu42Go1eIczFpWxsbLSRQZa43L8NNPBR492+3xtOSvHaYLwmC/9aggZUfMnwObdYLINChAuMIbLw8QrZNHCebziNRrNYXFy8HmkDZJBFJtk0cI6vV4PBMC1Eqcgik2z+MfDdnp+fb4+WAbzG7WSSLRefAFlBQYEzWgawlzjFjUxLA9zhZJmZmd+iZYCbmGggUS7856IBD/fy5eXlQ9GCcvsmk2waWOI/4+PjqdEyQJZoYIkG5phkJiYmdNEyQBaZZNPAC8aoubk5U7QMkEUm2TQwwgzncDiyRkdH1ZGGk0EWmNzwRmiAH54yw1mt1ouRNkAGWWJo9QYfQysDJDLcWcaoSMH7+voymRPJEhOzoEDu4/Ezcz/W5fTU1JSxqKjorVqt3gonfHV1Nb6lpaUB6SgOBu7jVP/uRHQb6zKNAHkEGa6GMSpccF6rqqqq1uVyHSUDp+7sTkSCmNGqkdkcCJD6iooKM45xB4VjylVlZWVNmIETvDYZ0Pfg98ElCBaX4iWm6ILH49H29/cXIM/ZTSaTe79r3tbWZtnY2NCIsfwatCC1MelmgAw2JmazebCkpERSYBEbk4u8qcXGZFocuaTGJLQ1u8kAuUdrtog9fWNXa3YMrVlWuFqzP3ZPqB66ihlRSWxOaeyx+KjZD9odh7bnpRLb8+dS2/NfAgwAg5rkol00QQkAAAAASUVORK5CYII=) 1x, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NDkxMSwgMjAxMy8xMC8yOS0xMTo0NzoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpGM0NFMkEyQTRCOTcxMUU3OTc2Mzg4ODUyQTFDQUVGNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpGM0NFMkEyQjRCOTcxMUU3OTc2Mzg4ODUyQTFDQUVGNyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkYzQ0UyQTI4NEI5NzExRTc5NzYzODg4NTJBMUNBRUY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkYzQ0UyQTI5NEI5NzExRTc5NzYzODg4NTJBMUNBRUY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+BtIaIAAAA8pJREFUeNrEl99LU2Ecxs9++IOcmdZkieg2CdmchWgWSCBpFIRk3kldCKLhdIpo/hMVQkujRNlFoHeVdqGQIlRQpijlDxRsmpJjymhtlem2eh45iyUSJ93WFx7PPBvn87zve855n69Mr9cLEisBKoGKoBwoAzosfvcF+gjNQK+gYeirlIvKJBjQQg1QuUKhSJTJZHIc5TKx+IOfYvn9/gAOARw9OP0Eugct7ddAHNQKxg25XB4fExOjSE1NXczJyZkuLCz8kJeXt67T6XZGabfbEyYnJ9VjY2P6mZkZk9PpzNre3vYHAoFNGHqIn9yCfvyLAY66CyM9GRsbq8zOzn5TV1c3VFpa6pQyrcPDw+rOzs5L8/PzZ7a2tnyYkXc4XbPXbOxlIBd6pFQq05KTk11NTU22ysrKJWEf1dvbq21vb692u91JPp/vE05dh97/zQBHPoDpPp6RkbHQ09PTlZ6evikcoGZnZ1X19fW1a2trOizLGk6Vhc5EqIF46BlGfiotLc0+MDBwV6VS+YUwlNfrVZSXlzesrKxkYSa4HJehnYHJQ37XijXPTUpKcnd0dHSFC87itWw224OUlBQXGCaygt8FDWhxt9fyhmtubu42Go1eIczFpWxsbLSRQZa43L8NNPBR492+3xtOSvHaYLwmC/9aggZUfMnwObdYLINChAuMIbLw8QrZNHCebziNRrNYXFy8HmkDZJBFJtk0cI6vV4PBMC1Eqcgik2z+MfDdnp+fb4+WAbzG7WSSLRefAFlBQYEzWgawlzjFjUxLA9zhZJmZmd+iZYCbmGggUS7856IBD/fy5eXlQ9GCcvsmk2waWOI/4+PjqdEyQJZoYIkG5phkJiYmdNEyQBaZZNPAC8aoubk5U7QMkEUm2TQwwgzncDiyRkdH1ZGGk0EWmNzwRmiAH54yw1mt1ouRNkAGWWJo9QYfQysDJDLcWcaoSMH7+voymRPJEhOzoEDu4/Ezcz/W5fTU1JSxqKjorVqt3gonfHV1Nb6lpaUB6SgOBu7jVP/uRHQb6zKNAHkEGa6GMSpccF6rqqqq1uVyHSUDp+7sTkSCmNGqkdkcCJD6iooKM45xB4VjylVlZWVNmIETvDYZ0Pfg98ElCBaX4iWm6ILH49H29/cXIM/ZTSaTe79r3tbWZtnY2NCIsfwatCC1MelmgAw2JmazebCkpERSYBEbk4u8qcXGZFocuaTGJLQ1u8kAuUdrtog9fWNXa3YMrVlWuFqzP3ZPqB66ihlRSWxOaeyx+KjZD9odh7bnpRLb8+dS2/NfAgwAg5rkol00QQkAAAAASUVORK5CYII=) 2x) 0 17, default; } 281 | 282 | .canvas-cursor__crosshair { 283 | cursor: crosshair; } 284 | 285 | .canvas-cursor__font { 286 | cursor: text; } 287 | 288 | .canvas-cursor__default { 289 | cursor: default; } 290 | 291 | .canvas-cursor__drag { 292 | cursor: move; } 293 | .canvas-tools_text_helper { 294 | display: none; 295 | position: absolute; 296 | border: 1px dashed #000; 297 | padding: 2px; 298 | outline: none; 299 | min-width: 16px; 300 | min-height: 16px; 301 | line-height: 16px; 302 | resize: none; 303 | overflow: hidden; 304 | background-color: transparent; } 305 | 306 | /*# sourceMappingURL=canvastools.css.map*/ -------------------------------------------------------------------------------- /server/static/font/fontello.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/harveyyeung/screenshot-electron/ae8b0275385e8182173e30e886f36a28caa08b91/server/static/font/fontello.eot -------------------------------------------------------------------------------- /server/static/font/fontello.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Copyright (C) 2018 by original authors @ fontello.com 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /server/static/font/fontello.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/harveyyeung/screenshot-electron/ae8b0275385e8182173e30e886f36a28caa08b91/server/static/font/fontello.ttf -------------------------------------------------------------------------------- /server/static/font/fontello.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/harveyyeung/screenshot-electron/ae8b0275385e8182173e30e886f36a28caa08b91/server/static/font/fontello.woff -------------------------------------------------------------------------------- /server/static/font/fontello.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/harveyyeung/screenshot-electron/ae8b0275385e8182173e30e886f36a28caa08b91/server/static/font/fontello.woff2 --------------------------------------------------------------------------------