jab-image-editor
Version:
JAB TOAST UI Component: ImageEditor
1 lines • 105 kB
Source Map (JSON)
{"version":3,"sources":["jab-image-editor.min.css","src/css/main.styl","index.styl","src/css/gridtable.styl","src/css/submenu.styl","src/css/checkbox.styl","src/css/range.styl","src/css/position.styl","src/css/icon.styl","src/css/colorpicker.styl","src/css/buttons.styl","src/css/index.styl"],"names":[],"mappings":"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","file":"jab-image-editor.min.css","sourcesContent":["/*!\n * jab-image-editor.min.js\n * @version 1.0.5\n * @author Notin <jjabenza81@gmail.com>\n * @license MIT\n */\nbody > textarea {\n position: fixed !important;\n}\n.tui-image-editor-container {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n min-height: 300px;\n height: 100%;\n position: relative;\n background-color: #282828;\n overflow: hidden;\n letter-spacing: 0.3px;\n}\n.tui-image-editor-container div,\n.tui-image-editor-container ul,\n.tui-image-editor-container label,\n.tui-image-editor-container input,\n.tui-image-editor-container li {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n -ms-user-select: none;\n -moz-user-select: -moz-none;\n -khtml-user-select: none;\n -webkit-user-select: none;\n user-select: none;\n}\n.tui-image-editor-container .tui-image-editor-header {\n/* BUTTON AND LOGO */\n min-width: 533px;\n position: absolute;\n background-color: #151515;\n top: 0;\n width: 100%;\n}\n.tui-image-editor-container .tui-image-editor-header-buttons,\n.tui-image-editor-container .tui-image-editor-controls-buttons {\n float: right;\n margin: 8px;\n}\n.tui-image-editor-container .tui-image-editor-header-logo,\n.tui-image-editor-container .tui-image-editor-controls-logo {\n float: left;\n width: 30%;\n padding: 17px;\n}\n.tui-image-editor-container .tui-image-editor-controls-logo,\n.tui-image-editor-container .tui-image-editor-controls-buttons {\n width: 270px;\n height: 100%;\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-header-buttons button,\n.tui-image-editor-container .tui-image-editor-header-buttons div,\n.tui-image-editor-container .tui-image-editor-controls-buttons button,\n.tui-image-editor-container .tui-image-editor-controls-buttons div {\n display: inline-block;\n position: relative;\n width: 120px;\n height: 40px;\n padding: 0;\n line-height: 40px;\n outline: none;\n border-radius: 20px;\n border: 1px solid #ddd;\n font-family: 'Noto Sans', sans-serif;\n font-size: 12px;\n font-weight: bold;\n cursor: pointer;\n vertical-align: middle;\n letter-spacing: 0.3px;\n text-align: center;\n}\n.tui-image-editor-container .tui-image-editor-download-btn {\n background-color: #fdba3b;\n border-color: #fdba3b;\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-load-btn {\n position: absolute;\n left: 0;\n right: 0;\n display: inline-block;\n top: 0;\n bottom: 0;\n width: 100%;\n cursor: pointer;\n opacity: 0;\n}\n.tui-image-editor-container .tui-image-editor-main-container {\n position: absolute;\n width: 100%;\n top: 0;\n bottom: 64px;\n}\n.tui-image-editor-container .tui-image-editor-main {\n position: absolute;\n text-align: center;\n top: 64px;\n bottom: 0;\n right: 0;\n left: 0;\n}\n.tui-image-editor-container .tui-image-editor-wrap {\n position: absolute;\n bottom: 0;\n width: 100%;\n overflow: auto;\n}\n.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap {\n display: table;\n width: 100%;\n height: 100%;\n}\n.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap {\n display: table-cell;\n vertical-align: middle;\n}\n.tui-image-editor-container .tui-image-editor {\n position: relative;\n display: inline-block;\n}\n.tui-image-editor-container .tui-image-editor-menu {\n width: auto;\n list-style: none;\n padding: 0;\n margin: 0 auto;\n display: table-cell;\n text-align: center;\n vertical-align: middle;\n white-space: nowrap;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item {\n position: relative;\n display: inline-block;\n border-radius: 2px;\n padding: 7px 8px 3px 8px;\n cursor: pointer;\n margin: 0 4px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:hover:before {\n content: '';\n position: absolute;\n display: inline-block;\n margin: 0 auto 0;\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 7px solid #2f2f2f;\n border-left: 7px solid transparent;\n left: 13px;\n top: -2px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:hover:after {\n content: attr(tooltip-content);\n position: absolute;\n display: inline-block;\n background-color: #2f2f2f;\n color: #fff;\n padding: 5px 8px;\n font-size: 11px;\n font-weight: lighter;\n border-radius: 3px;\n max-height: 23px;\n top: -25px;\n left: 0;\n min-width: 24px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item.active {\n background-color: #fff;\n transition: all 0.3s ease;\n}\n.tui-image-editor-container .tui-image-editor-wrap {\n position: absolute;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual {\n display: none;\n position: absolute;\n width: 100%;\n height: 100%;\n border: 1px solid rgba(255,255,255,0.7);\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor {\n transition: none;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table {\n width: 100%;\n height: 100%;\n border-collapse: collapse;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td {\n border: 1px solid rgba(255,255,255,0.3);\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before {\n content: '';\n position: absolute;\n box-sizing: border-box;\n width: 10px;\n height: 10px;\n border: 0;\n box-shadow: 0 0 1px 0 rgba(0,0,0,0.3);\n border-radius: 100%;\n background-color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before {\n top: -5px;\n left: -5px;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before {\n top: -5px;\n right: -5px;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before {\n bottom: -5px;\n left: -5px;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before {\n bottom: -5px;\n right: -5px;\n}\n.tui-image-editor-container .tui-image-editor-submenu {\n display: none;\n position: absolute;\n bottom: 0;\n width: 100%;\n height: 150px;\n white-space: nowrap;\n z-index: 2;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg > use.active {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li {\n display: inline-block;\n vertical-align: top;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline {\n display: block;\n margin-top: 0;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button {\n position: relative;\n cursor: pointer;\n display: inline-block;\n font-weight: normal;\n font-size: 11px;\n margin: 0 9px 0 9px;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.preset {\n margin: 0 9px 20px 5px;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label > span {\n display: inline-block;\n cursor: pointer;\n padding-top: 5px;\n font-family: \"Noto Sans\", sans-serif;\n font-size: 11px;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label {\n vertical-align: 7px;\n}\n.tui-image-editor-container .tui-image-editor-submenu > div {\n display: none;\n vertical-align: bottom;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style {\n opacity: 0.95;\n z-index: -1;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-partition > div {\n width: 1px;\n height: 52px;\n border-left: 1px solid #3c3c3c;\n margin: 0 8px 0 8px;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition > div {\n height: 108px;\n margin: 0 29px 0 0px;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align {\n text-align: left;\n margin-right: 30px;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align label > span {\n width: 55px;\n white-space: nowrap;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align:first-child {\n margin-right: 0;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align:first-child label > span {\n width: 70px;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu > div.tui-image-editor-menu-crop,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu > div.tui-image-editor-menu-flip,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu > div.tui-image-editor-menu-rotate,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu > div.tui-image-editor-menu-shape,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu > div.tui-image-editor-menu-text,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu > div.tui-image-editor-menu-mask,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu > div.tui-image-editor-menu-icon,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu > div.tui-image-editor-menu-draw,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu > div.tui-image-editor-menu-filter {\n display: table-cell;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu {\n display: table;\n}\n.tui-image-editor-container .filter-color-item {\n display: inline-block;\n}\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-checkbox-wrap {\n display: inline-block !important;\n text-align: left;\n}\n.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width {\n width: 187px;\n white-space: normal;\n}\n.tui-image-editor-container .tui-image-editor-checkbox {\n display: inline-block;\n margin: 1px 0 1px 0;\n}\n.tui-image-editor-container .tui-image-editor-checkbox input {\n width: 14px;\n height: 14px;\n opacity: 0;\n}\n.tui-image-editor-container .tui-image-editor-checkbox > label > span {\n color: #fff;\n height: 14px;\n position: relative;\n}\n.tui-image-editor-container .tui-image-editor-checkbox input + label:before,\n.tui-image-editor-container .tui-image-editor-checkbox > label > span:before {\n content: '';\n position: absolute;\n width: 14px;\n height: 14px;\n background-color: #fff;\n top: 6px;\n left: -19px;\n display: inline-block;\n margin: 0;\n text-align: center;\n font-size: 11px;\n border: 0;\n border-radius: 2px;\n padding-top: 1px;\n box-sizing: border-box;\n}\n.tui-image-editor-container .tui-image-editor-checkbox input[type='checkbox']:checked + span:before {\n background-size: cover;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==\");\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap {\n position: relative;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap select {\n width: 100%;\n height: 28px;\n margin-top: 4px;\n border: 0;\n outline: 0;\n border-radius: 0;\n border: 1px solid #cbdbdb;\n background-color: #fff;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n padding: 0 7px 0 10px;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist {\n display: none;\n position: relative;\n top: -1px;\n border: 1px solid #ccc;\n background-color: #fff;\n border-top: 0px;\n padding: 4px 0;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li {\n display: block;\n text-align: left;\n padding: 7px 10px;\n font-family: 'Noto Sans', sans-serif;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover {\n background-color: rgba(81,92,230,0.05);\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap:before {\n content: '';\n position: absolute;\n display: inline-block;\n width: 14px;\n height: 14px;\n right: 5px;\n top: 10px;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=\");\n background-size: cover;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,\n.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled,\n.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled {\n backbround-color: #f00;\n}\n.tui-image-editor-container .tui-image-editor-range {\n position: relative;\n top: 5px;\n width: 166px;\n height: 17px;\n display: inline-block;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-bar {\n top: 7px;\n position: absolute;\n width: 100%;\n height: 2px;\n background-color: #666;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n position: absolute;\n height: 100%;\n left: 0;\n right: 0;\n background-color: #d1d1d1;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n position: absolute;\n cursor: pointer;\n top: -5px;\n left: 0;\n width: 12px;\n height: 12px;\n background-color: #fff;\n border-radius: 100%;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap {\n display: inline-block;\n margin-left: 4px;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range {\n width: 100px;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-range {\n width: 108px;\n margin-left: 10px;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer {\n background-color: #333;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar {\n background-color: #ccc;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar {\n background-color: #606060;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short {\n margin-top: -2px;\n margin-left: 19px;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n color: #8e8e8e;\n font-weight: normal;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap label {\n vertical-align: baseline;\n font-size: 11px;\n margin-right: 7px;\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-range-value {\n cursor: default;\n width: 40px;\n height: 24px;\n outline: none;\n border-radius: 2px;\n box-shadow: none;\n border: 1px solid #d5d5d5;\n text-align: center;\n background-color: #1c1c1c;\n color: #fff;\n font-weight: lighter;\n vertical-align: baseline;\n font-family: 'Noto Sans', sans-serif;\n margin-top: 21px;\n margin-left: 4px;\n}\n.tui-image-editor-container .tui-image-editor-controls {\n position: absolute;\n background-color: #151515;\n width: 100%;\n height: 64px;\n display: table;\n bottom: 0;\n z-index: 2;\n}\n.tui-image-editor-container .tui-image-editor-icpartition {\n display: inline-block;\n background-color: #282828;\n width: 1px;\n height: 24px;\n}\n.tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:before {\n left: 28px;\n top: 11px;\n border-right: 7px solid #2f2f2f;\n border-top: 7px solid transparent;\n border-bottom: 7px solid transparent;\n}\n.tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:after {\n top: 7px;\n left: 42px;\n white-space: nowrap;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu {\n left: 0;\n height: 100%;\n width: 248px;\n}\n.tui-image-editor-container.left .tui-image-editor-main-container {\n left: 64px;\n width: calc(100% - 64px);\n height: 100%;\n}\n.tui-image-editor-container.left .tui-image-editor-controls {\n width: 64px;\n height: 100%;\n display: table;\n}\n.tui-image-editor-container.left .tui-image-editor-menu,\n.tui-image-editor-container.right .tui-image-editor-menu {\n white-space: inherit;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu,\n.tui-image-editor-container.right .tui-image-editor-submenu {\n white-space: normal;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu > div,\n.tui-image-editor-container.right .tui-image-editor-submenu > div {\n vertical-align: middle;\n}\n.tui-image-editor-container.left .tui-image-editor-controls li,\n.tui-image-editor-container.right .tui-image-editor-controls li {\n display: inline-block;\n margin: 4px auto;\n}\n.tui-image-editor-container.left .tui-image-editor-icpartition,\n.tui-image-editor-container.right .tui-image-editor-icpartition {\n position: relative;\n top: -7px;\n width: 24px;\n height: 1px;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition {\n display: block;\n width: 75%;\n margin: auto;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n border-left: 0;\n height: 10px;\n border-bottom: 1px solid #3c3c3c;\n width: 100%;\n margin: 0;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align {\n margin-right: 0;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li {\n margin-top: 15px;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li {\n margin-top: 0;\n}\n.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,\n.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width {\n width: 182px;\n white-space: normal;\n}\n.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,\n.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range {\n display: block;\n text-align: left;\n width: 75%;\n margin: auto;\n}\n.tui-image-editor-container.left .tui-image-editor-range,\n.tui-image-editor-container.right .tui-image-editor-range {\n width: 136px;\n}\n.tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:before {\n left: -3px;\n top: 11px;\n border-left: 7px solid #2f2f2f;\n border-top: 7px solid transparent;\n border-bottom: 7px solid transparent;\n}\n.tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:after {\n top: 7px;\n left: unset;\n right: 43px;\n white-space: nowrap;\n}\n.tui-image-editor-container.right .tui-image-editor-submenu {\n right: 0;\n height: 100%;\n width: 248px;\n}\n.tui-image-editor-container.right .tui-image-editor-main-container {\n right: 64px;\n width: calc(100% - 64px);\n height: 100%;\n}\n.tui-image-editor-container.right .tui-image-editor-controls {\n right: 0;\n width: 64px;\n height: 100%;\n display: table;\n}\n.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,\n.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right {\n display: none;\n}\n.tui-image-editor-container.bottom .tui-image-editor-submenu > div {\n padding-bottom: 24px;\n}\n.tui-image-editor-container.top .color-picker-control .triangle {\n top: -8px;\n border-right: 7px solid transparent;\n border-top: 0px;\n border-left: 7px solid transparent;\n border-bottom: 8px solid #fff;\n}\n.tui-image-editor-container.top .tui-image-editor-size-wrap {\n height: 100%;\n}\n.tui-image-editor-container.top .tui-image-editor-main-container {\n bottom: 0;\n}\n.tui-image-editor-container.top .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:before {\n left: 13px;\n border-top: 0;\n border-bottom: 7px solid #2f2f2f;\n top: 33px;\n}\n.tui-image-editor-container.top .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:after {\n top: 38px;\n}\n.tui-image-editor-container.top .tui-image-editor-submenu {\n top: 0;\n bottom: auto;\n}\n.tui-image-editor-container.top .tui-image-editor-submenu > div {\n padding-top: 24px;\n vertical-align: top;\n}\n.tui-image-editor-container.top .tui-image-editor-controls-logo {\n display: table-cell;\n}\n.tui-image-editor-container.top .tui-image-editor-controls-buttons {\n display: table-cell;\n}\n.tui-image-editor-container.top .tui-image-editor-main {\n top: 64px;\n height: calc(100% - 64px);\n}\n.tui-image-editor-container.top .tui-image-editor-controls {\n top: 0;\n bottom: inherit;\n}\n.tui-image-editor-container .tie-icon-add-button .tui-image-editor-button {\n min-width: 42px;\n}\n.tui-image-editor-container .svg_ic-menu,\n.tui-image-editor-container .svg_ic-helpmenu {\n width: 24px;\n height: 24px;\n}\n.tui-image-editor-container .svg_ic-submenu {\n width: 32px;\n height: 32px;\n}\n.tui-image-editor-container .svg_img-bi {\n width: 257px;\n height: 26px;\n}\n.tui-image-editor-container .tui-image-editor-controls svg > use {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover > use.hover,\n.tui-image-editor-container .tui-image-editor-controls .normal svg:hover > use.hover {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .active svg:hover > use.hover {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls svg > use.normal {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .active svg > use.active {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .enabled svg > use.enabled {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .active svg > use.normal,\n.tui-image-editor-container .tui-image-editor-controls .enabled svg > use.normal {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls .help svg > use.disabled,\n.tui-image-editor-container .tui-image-editor-controls .help.enabled svg > use.normal {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .help.enabled svg > use.disabled {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls:hover {\n z-index: 3;\n}\n.tui-image-editor-container div.tui-colorpicker-clearfix {\n width: 159px;\n height: 28px;\n border: 1px solid #d5d5d5;\n border-radius: 2px;\n background-color: #f5f5f5;\n margin-top: 6px;\n padding: 4px 7px 4px 7px;\n}\n.tui-image-editor-container .tui-colorpicker-palette-hex {\n width: 114px;\n background-color: #f5f5f5;\n border: 0;\n font-size: 11px;\n margin-top: 2px;\n font-family: 'Noto Sans', sans-serif;\n}\n.tui-image-editor-container .tui-colorpicker-palette-hex[value='#ffffff'] + .tui-colorpicker-palette-preview,\n.tui-image-editor-container .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview {\n border: 1px solid #ccc;\n}\n.tui-image-editor-container .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview {\n background-size: cover;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC\");\n}\n.tui-image-editor-container .tui-colorpicker-palette-preview {\n border-radius: 100%;\n float: left;\n width: 17px;\n height: 17px;\n border: 0;\n}\n.tui-image-editor-container .color-picker-control {\n position: absolute;\n display: none;\n z-index: 99;\n width: 192px;\n background-color: #fff;\n box-shadow: 0 3px 22px 6px rgba(0,0,0,0.15);\n padding: 16px;\n border-radius: 2px;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider {\n display: none;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button {\n border: 0;\n border-radius: 100%;\n margin: 2px;\n background-size: cover;\n font-size: 1px;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title='#ffffff'] {\n border: 1px solid #ccc;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=''] {\n border: 1px solid #ccc;\n}\n.tui-image-editor-container .color-picker-control .triangle {\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 8px solid #fff;\n border-left: 7px solid transparent;\n position: absolute;\n bottom: -8px;\n left: 84px;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-container,\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul,\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container {\n width: 100%;\n height: auto;\n}\n.tui-image-editor-container .filter-color-item .color-picker-control label {\n font-color: #333;\n font-weight: normal;\n margin-right: 7pxleft;\n}\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox {\n margin-top: 0;\n}\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input + label:before,\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox > label:before {\n left: -16px;\n}\n.tui-image-editor-container .color-picker {\n width: 100%;\n height: auto;\n}\n.tui-image-editor-container .color-picker-value {\n width: 32px;\n height: 32px;\n border: 0px;\n border-radius: 100%;\n margin: auto;\n margin-bottom: 1px;\n}\n.tui-image-editor-container .color-picker-value.transparent {\n border: 1px solid #cbcbcb;\n background-size: cover;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC\");\n}\n.tui-image-editor-container .color-picker-value + label {\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-submenu svg > use {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-submenu svg > use.normal {\n display: block;\n}\n.tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] svg > use.active,\n.tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] svg > use.active,\n.tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] svg > use.active,\n.tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] svg > use.active,\n.tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] svg > use.active,\n.tie-icon-add-button.icon-star-2 .tui-image-editor-button[data-icontype=\"icon-star-2\"] svg > use.active,\n.tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] svg > use.active,\n.tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] svg > use.active,\n.tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] svg > use.active {\n display: block;\n}\n.tie-draw-line-select-button.line .tui-image-editor-button.line svg > use.normal,\n.tie-draw-line-select-button.free .tui-image-editor-button.free svg > use.normal {\n display: none;\n}\n.tie-draw-line-select-button.line .tui-image-editor-button.line svg > use.active,\n.tie-draw-line-select-button.free .tui-image-editor-button.free svg > use.active {\n display: block;\n}\n.tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg > use.normal,\n.tie-flip-button.flipX .tui-image-editor-button.flipX svg > use.normal,\n.tie-flip-button.flipY .tui-image-editor-button.flipY svg > use.normal {\n display: none;\n}\n.tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg > use.active,\n.tie-flip-button.flipX .tui-image-editor-button.flipX svg > use.active,\n.tie-flip-button.flipY .tui-image-editor-button.flipY svg > use.active {\n display: block;\n}\n.tie-mask-apply.apply.active .tui-image-editor-button.apply label {\n color: #fff;\n}\n.tie-mask-apply.apply.active .tui-image-editor-button.apply svg > use.active {\n display: block;\n}\n.tie-crop-button .tui-image-editor-button.apply,\n.tie-crop-preset-button .tui-image-editor-button.apply {\n margin-right: 24px;\n}\n.tie-crop-button .tui-image-editor-button.preset.active svg > use.active,\n.tie-crop-preset-button .tui-image-editor-button.preset.active svg > use.active {\n display: block;\n}\n.tie-crop-button .tui-image-editor-button.apply.active svg > use.active,\n.tie-crop-preset-button .tui-image-editor-button.apply.active svg > use.active {\n display: block;\n}\n.tie-shape-button.rect .tui-image-editor-button.rect svg > use.normal,\n.tie-shape-button.circle .tui-image-editor-button.circle svg > use.normal,\n.tie-shape-button.triangle .tui-image-editor-button.triangle svg > use.normal {\n display: none;\n}\n.tie-shape-button.rect .tui-image-editor-button.rect svg > use.active,\n.tie-shape-button.circle .tui-image-editor-button.circle svg > use.active,\n.tie-shape-button.triangle .tui-image-editor-button.triangle svg > use.active {\n display: block;\n}\n.tie-text-effect-button .tui-image-editor-button.active svg > use.active {\n display: block;\n}\n.tie-text-align-button.left .tui-image-editor-button.left svg > use.active,\n.tie-text-align-button.center .tui-image-editor-button.center svg > use.active,\n.tie-text-align-button.right .tui-image-editor-button.right svg > use.active {\n display: block;\n}\n.tie-mask-image-file,\n.tie-icon-image-file {\n opacity: 0;\n position: absolute;\n width: 100%;\n height: 100%;\n border: 1px solid #008000;\n cursor: inherit;\n left: 0;\n top: 0;\n}\n.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul {\n text-align: right;\n}\n.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo {\n display: none;\n}\n/*# sourceMappingURL=src/css/index.css.map */\n","body > textarea\r\n position: fixed !important;\r\n\r\n+prefix-classes(prefix)\r\n .-container\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n min-height: 300px;\r\n height: 100%;\r\n position: relative;\r\n background-color: #282828;\r\n overflow: hidden;\r\n letter-spacing: 0.3px;\r\n \r\n div, ul, label, input, li\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n -ms-user-select: none; \r\n -moz-user-select: -moz-none;\r\n -khtml-user-select: none;\r\n -webkit-user-select: none;\r\n user-select: none;\r\n \r\n .-header\r\n /* BUTTON AND LOGO */\r\n min-width: 533px;\r\n position: absolute;\r\n background-color: #151515;\r\n top: 0;\r\n width: 100%;\r\n .-header-buttons,\r\n .-controls-buttons\r\n float: right;\r\n margin: 8px;\r\n\r\n .-header-logo,\r\n .-controls-logo\r\n float: left;\r\n width: 30%;\r\n padding: 17px;\r\n\r\n .-controls-logo,\r\n .-controls-buttons\r\n width: 270px;\r\n height: 100%;\r\n display: none;\r\n\r\n .-header-buttons button,\r\n .-header-buttons div,\r\n .-controls-buttons button,\r\n .-controls-buttons div\r\n display: inline-block;\r\n position: relative;\r\n width: 120px;\r\n height: 40px;\r\n padding: 0;\r\n line-height: 40px;\r\n outline: none;\r\n border-radius: 20px;\r\n border: 1px solid #ddd;\r\n font-family: 'Noto Sans', sans-serif;\r\n font-size: 12px;\r\n font-weight: bold;\r\n cursor: pointer;\r\n vertical-align: middle;\r\n letter-spacing: 0.3px;\r\n text-align: center;\r\n\r\n .-download-btn\r\n background-color: #fdba3b;\r\n border-color: #fdba3b;\r\n color: #fff;\r\n .-load-btn\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n display: inline-block;\r\n top: 0;\r\n bottom: 0;\r\n width: 100%;\r\n cursor: pointer;\r\n opacity: 0;\r\n .-main-container\r\n position: absolute;\r\n width: 100%;\r\n top: 0;\r\n bottom: 64px;\r\n .-main\r\n position: absolute;\r\n text-align: center;\r\n top: 64px;\r\n bottom: 0;\r\n right: 0;\r\n left: 0;\r\n .-wrap\r\n position: absolute;\r\n bottom: 0;\r\n width: 100%;\r\n overflow: auto;\r\n .-size-wrap\r\n display: table;\r\n width: 100%;\r\n height: 100%\r\n .-align-wrap\r\n display: table-cell;\r\n vertical-align: middle;\r\n .\r\n position: relative;\r\n display: inline-block;\r\n\r\n\r\n/* BIG MENU */\r\n.{prefix}-container\r\n .{prefix}-menu\r\n width: auto;\r\n list-style: none;\r\n padding: 0;\r\n margin: 0 auto;\r\n display: table-cell;\r\n text-align: center;\r\n vertical-align: middle;\r\n white-space: nowrap;\r\n > .{prefix}-item\r\n position: relative;\r\n display: inline-block;\r\n border-radius: 2px;\r\n padding: 7px 8px 3px 8px;\r\n cursor: pointer;\r\n margin: 0 4px;\r\n > .{prefix}-item[tooltip-content]:hover\r\n &:before\r\n content: '';\r\n position: absolute;\r\n display: inline-block;\r\n margin: 0 auto 0;\r\n width: 0;\r\n height: 0;\r\n border-right: 7px solid transparent;\r\n border-top: 7px solid #2f2f2f;\r\n border-left: 7px solid transparent;\r\n left: 13px;\r\n top: -2px;\r\n &:after\r\n content: attr(tooltip-content);\r\n position: absolute;\r\n display: inline-block;\r\n background-color: #2f2f2f;\r\n color: #fff;\r\n padding: 5px 8px;\r\n font-size: 11px;\r\n font-weight: lighter;\r\n border-radius: 3px;\r\n max-height: 23px;\r\n top: -25px;\r\n left: 0;\r\n min-width: 24px;\r\n > .{prefix}-item.active\r\n background-color: #fff;\r\n transition: all .3s ease;\r\n .{prefix}-wrap\r\n position: absolute;\r\n","body > textarea {\n position: fixed !important;\n}\n.tui-image-editor-container {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n min-height: 300px;\n height: 100%;\n position: relative;\n background-color: #282828;\n overflow: hidden;\n letter-spacing: 0.3px;\n}\n.tui-image-editor-container div,\n.tui-image-editor-container ul,\n.tui-image-editor-container label,\n.tui-image-editor-container input,\n.tui-image-editor-container li {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n -ms-user-select: none;\n -moz-user-select: -moz-none;\n -khtml-user-select: none;\n -webkit-user-select: none;\n user-select: none;\n}\n.tui-image-editor-container .tui-image-editor-header {\n/* BUTTON AND LOGO */\n min-width: 533px;\n position: absolute;\n background-color: #151515;\n top: 0;\n width: 100%;\n}\n.tui-image-editor-container .tui-image-editor-header-buttons,\n.tui-image-editor-container .tui-image-editor-controls-buttons {\n float: right;\n margin: 8px;\n}\n.tui-image-editor-container .tui-image-editor-header-logo,\n.tui-image-editor-container .tui-image-editor-controls-logo {\n float: left;\n width: 30%;\n padding: 17px;\n}\n.tui-image-editor-container .tui-image-editor-controls-logo,\n.tui-image-editor-container .tui-image-editor-controls-buttons {\n width: 270px;\n height: 100%;\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-header-buttons button,\n.tui-image-editor-container .tui-image-editor-header-buttons div,\n.tui-image-editor-container .tui-image-editor-controls-buttons button,\n.tui-image-editor-container .tui-image-editor-controls-buttons div {\n display: inline-block;\n position: relative;\n width: 120px;\n height: 40px;\n padding: 0;\n line-height: 40px;\n outline: none;\n border-radius: 20px;\n border: 1px solid #ddd;\n font-family: 'Noto Sans', sans-serif;\n font-size: 12px;\n font-weight: bold;\n cursor: pointer;\n vertical-align: middle;\n letter-spacing: 0.3px;\n text-align: center;\n}\n.tui-image-editor-container .tui-image-editor-download-btn {\n background-color: #fdba3b;\n border-color: #fdba3b;\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-load-btn {\n position: absolute;\n left: 0;\n right: 0;\n display: inline-block;\n top: 0;\n bottom: 0;\n width: 100%;\n cursor: pointer;\n opacity: 0;\n}\n.tui-image-editor-container .tui-image-editor-main-container {\n position: absolute;\n width: 100%;\n top: 0;\n bottom: 64px;\n}\n.tui-image-editor-container .tui-image-editor-main {\n position: absolute;\n text-align: center;\n top: 64px;\n bottom: 0;\n right: 0;\n left: 0;\n}\n.tui-image-editor-container .tui-image-editor-wrap {\n position: absolute;\n bottom: 0;\n width: 100%;\n overflow: auto;\n}\n.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap {\n display: table;\n width: 100%;\n height: 100%;\n}\n.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap {\n display: table-cell;\n vertical-align: middle;\n}\n.tui-image-editor-container .tui-image-editor {\n position: relative;\n display: inline-block;\n}\n.tui-image-editor-container .tui-image-editor-menu {\n width: auto;\n list-style: none;\n padding: 0;\n margin: 0 auto;\n display: table-cell;\n text-align: center;\n vertical-align: middle;\n white-space: nowrap;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item {\n position: relative;\n display: inline-block;\n border-radius: 2px;\n padding: 7px 8px 3px 8px;\n cursor: pointer;\n margin: 0 4px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:hover:before {\n content: '';\n position: absolute;\n display: inline-block;\n margin: 0 auto 0;\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 7px solid #2f2f2f;\n border-left: 7px solid transparent;\n left: 13px;\n top: -2px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-imag