diff options
Diffstat (limited to 'library/cropperjs/docs/css')
-rw-r--r-- | library/cropperjs/docs/css/cropper.css | 306 | ||||
-rw-r--r-- | library/cropperjs/docs/css/main.css | 252 |
2 files changed, 558 insertions, 0 deletions
diff --git a/library/cropperjs/docs/css/cropper.css b/library/cropperjs/docs/css/cropper.css new file mode 100644 index 000000000..dd22178fe --- /dev/null +++ b/library/cropperjs/docs/css/cropper.css @@ -0,0 +1,306 @@ +/*! + * Cropper.js v1.2.2 + * https://github.com/fengyuanchen/cropperjs + * + * Copyright (c) 2015-2018 Chen Fengyuan + * Released under the MIT license + * + * Date: 2018-01-03T13:26:29.610Z + */ + +.cropper-container { + direction: ltr; + font-size: 0; + line-height: 0; + position: relative; + -ms-touch-action: none; + touch-action: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.cropper-container img {/*Avoid margin top issue (Occur only when margin-top <= -height) + */ + display: block; + height: 100%; + image-orientation: 0deg; + max-height: none !important; + max-width: none !important; + min-height: 0 !important; + min-width: 0 !important; + width: 100%; +} + +.cropper-wrap-box, +.cropper-canvas, +.cropper-drag-box, +.cropper-crop-box, +.cropper-modal { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; +} + +.cropper-wrap-box, +.cropper-canvas { + overflow: hidden; +} + +.cropper-drag-box { + background-color: #fff; + opacity: 0; +} + +.cropper-modal { + background-color: #000; + opacity: .5; +} + +.cropper-view-box { + display: block; + height: 100%; + outline-color: rgba(51, 153, 255, 0.75); + outline: 1px solid #39f; + overflow: hidden; + width: 100%; +} + +.cropper-dashed { + border: 0 dashed #eee; + display: block; + opacity: .5; + position: absolute; +} + +.cropper-dashed.dashed-h { + border-bottom-width: 1px; + border-top-width: 1px; + height: 33.33333%; + left: 0; + top: 33.33333%; + width: 100%; +} + +.cropper-dashed.dashed-v { + border-left-width: 1px; + border-right-width: 1px; + height: 100%; + left: 33.33333%; + top: 0; + width: 33.33333%; +} + +.cropper-center { + display: block; + height: 0; + left: 50%; + opacity: .75; + position: absolute; + top: 50%; + width: 0; +} + +.cropper-center:before, +.cropper-center:after { + background-color: #eee; + content: ' '; + display: block; + position: absolute; +} + +.cropper-center:before { + height: 1px; + left: -3px; + top: 0; + width: 7px; +} + +.cropper-center:after { + height: 7px; + left: 0; + top: -3px; + width: 1px; +} + +.cropper-face, +.cropper-line, +.cropper-point { + display: block; + height: 100%; + opacity: .1; + position: absolute; + width: 100%; +} + +.cropper-face { + background-color: #fff; + left: 0; + top: 0; +} + +.cropper-line { + background-color: #39f; +} + +.cropper-line.line-e { + cursor: ew-resize; + right: -3px; + top: 0; + width: 5px; +} + +.cropper-line.line-n { + cursor: ns-resize; + height: 5px; + left: 0; + top: -3px; +} + +.cropper-line.line-w { + cursor: ew-resize; + left: -3px; + top: 0; + width: 5px; +} + +.cropper-line.line-s { + bottom: -3px; + cursor: ns-resize; + height: 5px; + left: 0; +} + +.cropper-point { + background-color: #39f; + height: 5px; + opacity: .75; + width: 5px; +} + +.cropper-point.point-e { + cursor: ew-resize; + margin-top: -3px; + right: -3px; + top: 50%; +} + +.cropper-point.point-n { + cursor: ns-resize; + left: 50%; + margin-left: -3px; + top: -3px; +} + +.cropper-point.point-w { + cursor: ew-resize; + left: -3px; + margin-top: -3px; + top: 50%; +} + +.cropper-point.point-s { + bottom: -3px; + cursor: s-resize; + left: 50%; + margin-left: -3px; +} + +.cropper-point.point-ne { + cursor: nesw-resize; + right: -3px; + top: -3px; +} + +.cropper-point.point-nw { + cursor: nwse-resize; + left: -3px; + top: -3px; +} + +.cropper-point.point-sw { + bottom: -3px; + cursor: nesw-resize; + left: -3px; +} + +.cropper-point.point-se { + bottom: -3px; + cursor: nwse-resize; + height: 20px; + opacity: 1; + right: -3px; + width: 20px; +} + +@media (min-width: 768px) { + .cropper-point.point-se { + height: 15px; + width: 15px; + } +} + +@media (min-width: 992px) { + .cropper-point.point-se { + height: 10px; + width: 10px; + } +} + +@media (min-width: 1200px) { + .cropper-point.point-se { + height: 5px; + opacity: .75; + width: 5px; + } +} + +.cropper-point.point-se:before { + background-color: #39f; + bottom: -50%; + content: ' '; + display: block; + height: 200%; + opacity: 0; + position: absolute; + right: -50%; + width: 200%; +} + +.cropper-invisible { + opacity: 0; +} + +.cropper-bg { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC'); +} + +.cropper-hide { + display: block; + height: 0; + position: absolute; + width: 0; +} + +.cropper-hidden { + display: none !important; +} + +.cropper-move { + cursor: move; +} + +.cropper-crop { + cursor: crosshair; +} + +.cropper-disabled .cropper-drag-box, +.cropper-disabled .cropper-face, +.cropper-disabled .cropper-line, +.cropper-disabled .cropper-point { + cursor: not-allowed; +} + diff --git a/library/cropperjs/docs/css/main.css b/library/cropperjs/docs/css/main.css new file mode 100644 index 000000000..d89f82d27 --- /dev/null +++ b/library/cropperjs/docs/css/main.css @@ -0,0 +1,252 @@ +.btn { + padding-left: .75rem; + padding-right: .75rem; +} + +label.btn { + margin-bottom: 0; +} + +.d-flex > .btn { + flex: 1; +} + +.carbonads { + border-radius: .25rem; + border: 1px solid #ccc; + font-size: .875rem; + overflow: hidden; + padding: 1rem; +} + +.carbon-wrap { + overflow: hidden; +} + +.carbon-img { + clear: left; + display: block; + float: left; +} + +.carbon-text, +.carbon-poweredby { + display: block; + margin-left: 140px; +} + +.carbon-text, +.carbon-text:hover, +.carbon-text:focus { + color: #fff; + text-decoration: none; +} + +.carbon-poweredby, +.carbon-poweredby:hover, +.carbon-poweredby:focus { + color: #ddd; + text-decoration: none; +} + +@media (min-width: 768px) { + .carbonads { + float: right; + margin-bottom: -1rem; + margin-top: -1rem; + max-width: 360px; + } +} + +.footer { + font-size: .875rem; +} + +.heart { + color: #ddd; + display: block; + height: 2rem; + line-height: 2rem; + margin-bottom: 0; + margin-top: 1rem; + position: relative; + text-align: center; + width: 100%; +} + +.heart:hover { + color: #ff4136; +} + +.heart::before { + border-top: 1px solid #eee; + content: " "; + display: block; + height: 0; + left: 0; + position: absolute; + right: 0; + top: 50%; +} + +.heart::after { + background-color: #fff; + content: "♥"; + padding-left: .5rem; + padding-right: .5rem; + position: relative; + z-index: 1; +} + +.img-container, +.img-preview { + background-color: #f7f7f7; + text-align: center; + width: 100%; +} + +.img-container { + margin-bottom: 1rem; + max-height: 497px; + min-height: 200px; +} + +@media (min-width: 768px) { + .img-container { + min-height: 497px; + } +} + +.img-container > img { + max-width: 100%; +} + +.docs-preview { + margin-right: -1rem; +} + +.img-preview { + float: left; + margin-bottom: .5rem; + margin-right: .5rem; + overflow: hidden; +} + +.img-preview > img { + max-width: 100%; +} + +.preview-lg { + height: 9rem; + width: 16rem; +} + +.preview-md { + height: 4.5rem; + width: 8rem; +} + +.preview-sm { + height: 2.25rem; + width: 4rem; +} + +.preview-xs { + height: 1.125rem; + margin-right: 0; + width: 2rem; +} + +.docs-data > .input-group { + margin-bottom: .5rem; +} + +.docs-data .input-group-prepend .input-group-text { + min-width: 4rem; +} + +.docs-data .input-group-append .input-group-text { + min-width: 3rem; +} + +.docs-buttons > .btn, +.docs-buttons > .btn-group, +.docs-buttons > .form-control { + margin-bottom: .5rem; + margin-right: .25rem; +} + +.docs-toggles > .btn, +.docs-toggles > .btn-group, +.docs-toggles > .dropdown { + margin-bottom: .5rem; +} + +.docs-tooltip { + display: block; + margin: -.5rem -.75rem; + padding: .5rem .75rem; +} + +.docs-tooltip > .icon { + margin: 0 -.25rem; + vertical-align: top; +} + +.tooltip-inner { + white-space: normal; +} + +.btn-upload .tooltip-inner, +.btn-toggle .tooltip-inner { + white-space: nowrap; +} + +.btn-toggle { + padding: .5rem; +} + +.btn-toggle > .docs-tooltip { + margin: -.5rem; + padding: .5rem; +} + +@media (max-width: 400px) { + .btn-group-crop { + margin-right: -1rem!important; + } + + .btn-group-crop > .btn { + padding-left: .5rem; + padding-right: .5rem; + } + + .btn-group-crop .docs-tooltip { + margin-left: -.5rem; + margin-right: -.5rem; + padding-left: .5rem; + padding-right: .5rem; + } +} + +.docs-options .dropdown-menu { + width: 100%; +} + +.docs-options .dropdown-menu > li { + font-size: .875rem; + padding: .125rem 1rem; +} + +.docs-options .dropdown-menu .form-check-label { + display: block; +} + +.docs-cropped .modal-body { + text-align: center; +} + +.docs-cropped .modal-body > img, +.docs-cropped .modal-body > canvas { + max-width: 100%; +} |