META-INF.resources.primefaces.imagecropper.imagecropper.css Maven / Gradle / Ivy
Go to download
Show more of this group Show more artifacts with this name
Show all versions of primefaces Show documentation
Show all versions of primefaces Show documentation
PrimeFaces is one of the most popular UI libraries in Java EE Ecosystem and widely used by software companies, world renowned brands, banks, financial institutions, insurance companies, universities and more.
/*! Jcrop.css v2.0.4 - build: 20151117
* Copyright 2008-2015 Tapmodo Interactive LLC
* Free software under MIT License
**/
/*
The outer-most container in a typical Jcrop instance
If you are having difficulty with formatting related to styles
on a parent element, place any fixes here or in a like selector
You can also style this element if you want to add a border, etc
A better method for styling can be seen below with .jcrop-light
(Add a class to the holder and style elements for that extended class)
*/
.jcrop-active {
direction: ltr;
text-align: left;
/* IE10 touch compatibility */
-ms-touch-action: none;
}
.jcrop-dragging {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
.jcrop-selection {
z-index: 2;
}
.jcrop-selection.jcrop-current {
z-index: 4;
}
/* Selection Borders */
.jcrop-border {
background: #ffffff url("#{resource['primefaces:imagecropper/Jcrop.gif']}");
line-height: 1px !important;
font-size: 0 !important;
overflow: hidden;
position: absolute;
filter: alpha(opacity=50) !important;
opacity: 0.5 !important;
}
.jcrop-border.ord-w,
.jcrop-border.ord-e,
.jcrop-border.ord-n {
top: 0px;
}
.jcrop-border.ord-n,
.jcrop-border.ord-s {
width: 100%;
height: 1px !important;
}
.jcrop-border.ord-w,
.jcrop-border.ord-e {
height: 100%;
width: 1px !important;
}
.jcrop-border.ord-e {
right: -1px;
}
.jcrop-border.ord-n {
top: -1px;
}
.jcrop-border.ord-w {
left: -1px;
}
.jcrop-border.ord-s {
bottom: -1px;
}
.jcrop-selection {
position: absolute;
}
.jcrop-box {
z-index: 2;
display: block;
background: none;
border: none;
padding: 0;
margin: 0;
font-size: 0;
}
.jcrop-box:hover {
background: none;
}
.jcrop-box:active {
background: none;
}
.jcrop-box:focus {
outline: 1px rgba(128, 128, 128, 0.65) dotted;
}
.jcrop-active,
.jcrop-box {
position: relative;
}
.jcrop-box {
width: 100%;
height: 100%;
cursor: move;
}
/* Selection Handles */
.jcrop-handle {
z-index: 4;
box-sizing: border-box;
background-color: rgba(49, 28, 28, 0.58);
border: 1px #eeeeee solid;
width: 9px;
height: 9px;
font-size: 0;
position: absolute;
filter: alpha(opacity=80) !important;
opacity: 0.8 !important;
}
.jcrop-handle.ord-n {
left: 50%;
margin-left: -5px;
margin-top: -5px;
top: 0;
cursor: n-resize;
}
.jcrop-handle.ord-s {
bottom: 0;
left: 50%;
margin-bottom: -5px;
margin-left: -5px;
cursor: s-resize;
}
.jcrop-handle.ord-e {
margin-right: -5px;
margin-top: -5px;
right: 0;
top: 50%;
cursor: e-resize;
}
.jcrop-handle.ord-w {
left: 0;
margin-left: -5px;
margin-top: -5px;
top: 50%;
cursor: w-resize;
}
.jcrop-handle.ord-nw {
left: 0;
margin-left: -5px;
margin-top: -5px;
top: 0;
cursor: nw-resize;
}
.jcrop-handle.ord-ne {
margin-right: -5px;
margin-top: -5px;
right: 0;
top: 0;
cursor: ne-resize;
}
.jcrop-handle.ord-se {
bottom: 0;
margin-bottom: -5px;
margin-right: -5px;
right: 0;
cursor: se-resize;
}
.jcrop-handle.ord-sw {
bottom: 0;
left: 0;
margin-bottom: -5px;
margin-left: -5px;
cursor: sw-resize;
}
/* Larger Selection Handles for Touch */
.jcrop-touch .jcrop-handle {
z-index: 4;
box-sizing: border-box;
background-color: rgba(49, 28, 28, 0.58);
border: 1px #eeeeee solid;
width: 18px;
height: 18px;
font-size: 0;
position: absolute;
filter: alpha(opacity=80) !important;
opacity: 0.8 !important;
}
.jcrop-touch .jcrop-handle.ord-n {
left: 50%;
margin-left: -10px;
margin-top: -10px;
top: 0;
cursor: n-resize;
}
.jcrop-touch .jcrop-handle.ord-s {
bottom: 0;
left: 50%;
margin-bottom: -10px;
margin-left: -10px;
cursor: s-resize;
}
.jcrop-touch .jcrop-handle.ord-e {
margin-right: -10px;
margin-top: -10px;
right: 0;
top: 50%;
cursor: e-resize;
}
.jcrop-touch .jcrop-handle.ord-w {
left: 0;
margin-left: -10px;
margin-top: -10px;
top: 50%;
cursor: w-resize;
}
.jcrop-touch .jcrop-handle.ord-nw {
left: 0;
margin-left: -10px;
margin-top: -10px;
top: 0;
cursor: nw-resize;
}
.jcrop-touch .jcrop-handle.ord-ne {
margin-right: -10px;
margin-top: -10px;
right: 0;
top: 0;
cursor: ne-resize;
}
.jcrop-touch .jcrop-handle.ord-se {
bottom: 0;
margin-bottom: -10px;
margin-right: -10px;
right: 0;
cursor: se-resize;
}
.jcrop-touch .jcrop-handle.ord-sw {
bottom: 0;
left: 0;
margin-bottom: -10px;
margin-left: -10px;
cursor: sw-resize;
}
/* Selection Dragbars */
.jcrop-dragbar {
font-size: 0;
position: absolute;
}
.jcrop-dragbar.ord-n,
.jcrop-dragbar.ord-s {
height: 9px !important;
width: 100%;
}
.jcrop-dragbar.ord-e,
.jcrop-dragbar.ord-w {
top: 0px;
height: 100%;
width: 9px !important;
}
.jcrop-dragbar.ord-n {
margin-top: -5px;
cursor: n-resize;
top: 0px;
}
.jcrop-dragbar.ord-s {
bottom: 0;
margin-bottom: -5px;
cursor: s-resize;
}
.jcrop-dragbar.ord-e {
margin-right: -5px;
right: 0;
cursor: e-resize;
}
.jcrop-dragbar.ord-w {
margin-left: -5px;
cursor: w-resize;
}
/* Shading panels */
.jcrop-shades {
position: relative;
top: 0;
left: 0;
}
.jcrop-shades div {
cursor: crosshair;
}
/* Various special states */
.jcrop-noresize .jcrop-dragbar,
.jcrop-noresize .jcrop-handle {
display: none;
}
.jcrop-selection.jcrop-nodrag .jcrop-box,
.jcrop-nodrag .jcrop-shades div {
cursor: default;
}
/* The "jcrop-light" class/extension */
.jcrop-light .jcrop-border {
background: #ffffff;
filter: alpha(opacity=70) !important;
opacity: .70!important;
}
.jcrop-light .jcrop-handle {
background-color: #000000;
border-color: #ffffff;
}
/* The "jcrop-dark" class/extension */
.jcrop-dark .jcrop-border {
background: #000000;
filter: alpha(opacity=70) !important;
opacity: 0.7 !important;
}
.jcrop-dark .jcrop-handle {
background-color: #ffffff;
border-color: #000000;
}
/* Simple macro to turn off the antlines */
.solid-line .jcrop-border {
background: #ffffff;
}
.jcrop-thumb {
position: absolute;
overflow: hidden;
z-index: 5;
}
/* Fix for twitter bootstrap et al. */
.jcrop-active img,
.jcrop-thumb img,
.jcrop-thumb canvas {
min-width: none;
min-height: none;
max-width: none;
max-height: none;
}
/* Improved multiple selection styles - in progress */
.jcrop-hl-active .jcrop-border {
filter: alpha(opacity=20) !important;
opacity: .20!important;
}
.jcrop-hl-active .jcrop-handle {
filter: alpha(opacity=10) !important;
opacity: .10!important;
}
.jcrop-hl-active .jcrop-selection:hover {
/*
.jcrop-handle {
filter:Alpha(opacity=35)!important;
opacity:.35!important;
}
*/
}
.jcrop-hl-active .jcrop-selection:hover .jcrop-border {
background-color: #ccc;
filter: alpha(opacity=50) !important;
opacity: .50!important;
}
.jcrop-hl-active .jcrop-selection.jcrop-current .jcrop-border {
background: #808080 url('Jcrop.gif');
opacity: .35!important;
filter: alpha(opacity=35) !important;
}
.jcrop-hl-active .jcrop-selection.jcrop-current .jcrop-handle {
filter: alpha(opacity=30) !important;
opacity: .30!important;
}
.jcrop-hl-active .jcrop-selection.jcrop-focus .jcrop-border {
background: url('Jcrop.gif');
opacity: .65!important;
filter: alpha(opacity=65) !important;
}
.jcrop-hl-active .jcrop-selection.jcrop-focus .jcrop-handle {
filter: alpha(opacity=60) !important;
opacity: .60!important;
}
/* Prevent background on button element */
button.jcrop-box {
background: none;
}