crimagify 0.0.3.9 → 0.0.4.0
Sign up to get free protection for your applications and to get access to all the features.
- data/README.rdoc +1 -2
- data/app/helpers/crimagify/application_helper.rb +8 -2
- data/app/views/crimagify/crop_partials/_fields_cropper.html.erb +18 -9
- data/app/views/crimagify/crop_partials/_nested_cropper.html.erb +18 -10
- data/lib/crimagify/version.rb +1 -1
- data/lib/generators/crimagify/install/templates/cropify_cropper.css.scss +30 -8
- data/test/dummy/app/assets/stylesheets/application.css +0 -1
- data/test/dummy/app/assets/stylesheets/cropify_cropper.css.scss +30 -8
- data/test/dummy/app/views/products/_form.html.erb +2 -2
- data/test/dummy/app/views/users/_product_fields.html.erb +1 -1
- metadata +1 -4
- data/app/assets/stylesheets/crimagify/cropify_cropper.css.scss +0 -71
- data/app/assets/stylesheets/crimagify/cropify_mixin.css.scss +0 -85
- data/app/assets/stylesheets/crimagify/jquery.cropify.Jcrop.css +0 -165
data/README.rdoc
CHANGED
|
@@ -42,7 +42,6 @@ Add to your controller:
|
|
|
42
42
|
|
|
43
43
|
Add to application.js:<tt>//= require crimagify/application</tt>
|
|
44
44
|
|
|
45
|
-
Add to application.css:<tt>*= require crimagify/application</tt>
|
|
46
45
|
|
|
47
46
|
Edit the file generated for the gem: config/crimagify_versions.yml, with the specific format mantaining the same ratio for all versions in each blocks, adding models that use images:
|
|
48
47
|
|
|
@@ -77,4 +76,4 @@ Add to your form view:
|
|
|
77
76
|
<%= image_cropper(@object, { image_name: "imgA", ratio: :big}) %> #The attributes "imgA" and :big or :small are defined
|
|
78
77
|
<%= image_cropper(@object, { image_name: "imgB", ratio: :small}) %> #into file config/crimagify_versions.yml generated for the gem
|
|
79
78
|
...
|
|
80
|
-
<% end %>
|
|
79
|
+
<% end %>
|
|
@@ -8,6 +8,9 @@ module Crimagify
|
|
|
8
8
|
if options[:label_title].nil?
|
|
9
9
|
options[:label_title] == "Image"
|
|
10
10
|
end
|
|
11
|
+
if options[:choose_text].nil?
|
|
12
|
+
options[:choose_text] == "Choose image"
|
|
13
|
+
end
|
|
11
14
|
if img == []
|
|
12
15
|
url_image = "crimagify/no_selected_image.jpg"
|
|
13
16
|
else
|
|
@@ -20,7 +23,7 @@ module Crimagify
|
|
|
20
23
|
url_image = ENV['DEFAULT_IMAGE'].to_s
|
|
21
24
|
end
|
|
22
25
|
end
|
|
23
|
-
render(:partial => "crimagify/crop_partials/fields_cropper", :locals => { id_image: options[:image_name], url_image: url_image, image_options: image_options, version_name: version_name, label_title: options[:label_title] })
|
|
26
|
+
render(:partial => "crimagify/crop_partials/fields_cropper", :locals => { id_image: options[:image_name], url_image: url_image, image_options: image_options, version_name: version_name, label_title: options[:label_title], choose_text: options[:choose_text] })
|
|
24
27
|
end
|
|
25
28
|
|
|
26
29
|
def images_id(object)
|
|
@@ -38,6 +41,9 @@ module Crimagify
|
|
|
38
41
|
if options[:label_title].nil?
|
|
39
42
|
options[:label_title] == "Image"
|
|
40
43
|
end
|
|
44
|
+
if options[:choose_text].nil?
|
|
45
|
+
options[:choose_text] == "Choose image"
|
|
46
|
+
end
|
|
41
47
|
if img == []
|
|
42
48
|
if ENV['DEFAULT_IMAGE'].nil?
|
|
43
49
|
url_image = "crimagify/no_selected_image.jpg"
|
|
@@ -54,7 +60,7 @@ module Crimagify
|
|
|
54
60
|
url_image = ENV['DEFAULT_IMAGE'].to_s
|
|
55
61
|
end
|
|
56
62
|
end
|
|
57
|
-
render(:partial => "crimagify/crop_partials/nested_cropper", :locals => { id_image: options[:image_name], url_image: url_image, image_options: image_options, version_name: version_name, label_title: options[:label_title] })
|
|
63
|
+
render(:partial => "crimagify/crop_partials/nested_cropper", :locals => { id_image: options[:image_name], url_image: url_image, image_options: image_options, version_name: version_name, label_title: options[:label_title], choose_text: options[:choose_text] })
|
|
58
64
|
end
|
|
59
65
|
|
|
60
66
|
def nested_images_id(object)
|
|
@@ -4,19 +4,28 @@
|
|
|
4
4
|
image_options ||= {}
|
|
5
5
|
version_name ||= {}
|
|
6
6
|
label_title ||= "Image"
|
|
7
|
+
choose_text ||= "Choose image"
|
|
7
8
|
%>
|
|
8
9
|
<div class="crimagify_item">
|
|
9
10
|
<div id="<%= id_image %>" class="global_parent" name="<%= version_name %>">
|
|
10
11
|
<%= hidden_field_tag "image_temporal_#{id_image}", {}, :class => "image_temporal", :value => "" %>
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
<div id="parent_image" class="parent_image" style="display:block;float:left"></div>
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
12
|
+
<label class="crimagify_label"><%= label_title %></label>
|
|
13
|
+
<div class="crimagify_container">
|
|
14
|
+
<div id="parent_image" class="parent_image crimagify_parent_image" style="display:block;float:left"></div>
|
|
15
|
+
<div class="crimagify_default_image">
|
|
16
|
+
<span>
|
|
17
|
+
<%= image_tag url_image, image_options %>
|
|
18
|
+
</span>
|
|
19
|
+
</div>
|
|
20
|
+
<div class="crimagify_clear"></div>
|
|
21
|
+
<div class="crimagify_otions">
|
|
22
|
+
<label class="crimagify_otions">
|
|
23
|
+
<%= choose_text %>
|
|
24
|
+
</label>
|
|
25
|
+
<%= file_field_tag :image, :id => "uploader", :class => "uploader" %>
|
|
26
|
+
</div>
|
|
27
|
+
|
|
28
|
+
<div class="crimagify_clear"></div>
|
|
20
29
|
</div>
|
|
21
30
|
</div>
|
|
22
31
|
</div>
|
|
@@ -4,19 +4,27 @@
|
|
|
4
4
|
image_options ||= {}
|
|
5
5
|
version_name ||= {}
|
|
6
6
|
label_title ||= "Image"
|
|
7
|
+
choose_text ||= "Choose image"
|
|
7
8
|
%>
|
|
8
9
|
<div class="crimagify_item">
|
|
9
10
|
<div data-img="<%= id_image %>" class="global_parent <%= id_image %>" name="<%= version_name %>">
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
<div class="parent_image"></div>
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
11
|
+
<%= hidden_field_tag "image_temporal_#{id_image}", {}, :value => "", :name => "image_temporal_#{id_image}", :class => "image_temporal image_temporal_#{id_image}" %>
|
|
12
|
+
<label class="crimagify_label"><%= label_title %></label>
|
|
13
|
+
<div class="crimagify_container">
|
|
14
|
+
<div class="parent_image crimagify_parent_image"></div>
|
|
15
|
+
<div class="crimagify_default_image">
|
|
16
|
+
<span>
|
|
17
|
+
<%= image_tag url_image, image_options %>
|
|
18
|
+
</span>
|
|
19
|
+
</div>
|
|
20
|
+
<div class="crimagify_clear"></div>
|
|
21
|
+
<div class="crimagify_otions">
|
|
22
|
+
<label class="crimagify_otions">
|
|
23
|
+
<%= choose_text %>
|
|
24
|
+
</label>
|
|
25
|
+
<%= file_field_tag :image, :class => "nested_uploader crimagify_nested_uploader" %>
|
|
26
|
+
</div>
|
|
27
|
+
<div class="crimagify_clear"></div>
|
|
20
28
|
</div>
|
|
21
29
|
</div>
|
|
22
30
|
</div>
|
data/lib/crimagify/version.rb
CHANGED
|
@@ -1,13 +1,37 @@
|
|
|
1
1
|
@import 'cropify_mixin.css.scss';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
|
|
3
|
+
div.crimagify_item{
|
|
4
|
+
display:block;
|
|
5
|
+
label{
|
|
6
|
+
display:block;
|
|
7
|
+
}
|
|
8
|
+
label.crimagify_label{
|
|
9
|
+
font-size:14px;
|
|
10
|
+
font-weight:bold;
|
|
11
|
+
line-height:25px;
|
|
12
|
+
}
|
|
13
|
+
div.crimagify_clear{
|
|
14
|
+
clear:both;
|
|
15
|
+
}
|
|
16
|
+
div.crimagify_parent_image{
|
|
17
|
+
position:relative;
|
|
18
|
+
}
|
|
19
|
+
div.crimagify_container{
|
|
20
|
+
div.crimagify_parent_image{
|
|
21
|
+
|
|
22
|
+
}
|
|
23
|
+
div.crimagify_default_image{
|
|
24
|
+
|
|
25
|
+
}
|
|
26
|
+
div.crimagify_otions{
|
|
27
|
+
|
|
28
|
+
}
|
|
29
|
+
}//div.crimagify_container
|
|
30
|
+
}//div.crimagify_item
|
|
6
31
|
div#cropper_div{
|
|
7
32
|
position: absolute !important;
|
|
8
33
|
top: 0 !important;
|
|
9
34
|
left: 0 !important;
|
|
10
|
-
//display: none !important;
|
|
11
35
|
padding:0 0 85px 0 !important;
|
|
12
36
|
z-index:500 !important;
|
|
13
37
|
div.cropper_container{
|
|
@@ -28,12 +52,10 @@ div#cropper_div{
|
|
|
28
52
|
background:#FFF !important;
|
|
29
53
|
padding:10px !important;
|
|
30
54
|
margin-top:0 !important;
|
|
31
|
-
border:1px solid #777 !important;
|
|
32
|
-
border-top:none !important;
|
|
33
55
|
@include rounded(0 0 3px 3px);
|
|
34
56
|
//@include boxShadow(1px 4px 6px,#666) !important;
|
|
35
57
|
position:absolute !important;
|
|
36
|
-
right
|
|
58
|
+
right:0px !important;
|
|
37
59
|
bottom:-57px !important;
|
|
38
60
|
z-index:15 !important;
|
|
39
61
|
a{
|
|
@@ -1,13 +1,37 @@
|
|
|
1
1
|
@import 'cropify_mixin.css.scss';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
|
|
3
|
+
div.crimagify_item{
|
|
4
|
+
display:block;
|
|
5
|
+
label{
|
|
6
|
+
display:block;
|
|
7
|
+
}
|
|
8
|
+
label.crimagify_label{
|
|
9
|
+
font-size:14px;
|
|
10
|
+
font-weight:bold;
|
|
11
|
+
line-height:25px;
|
|
12
|
+
}
|
|
13
|
+
div.crimagify_clear{
|
|
14
|
+
clear:both;
|
|
15
|
+
}
|
|
16
|
+
div.crimagify_parent_image{
|
|
17
|
+
position:relative;
|
|
18
|
+
}
|
|
19
|
+
div.crimagify_container{
|
|
20
|
+
div.crimagify_parent_image{
|
|
21
|
+
|
|
22
|
+
}
|
|
23
|
+
div.crimagify_default_image{
|
|
24
|
+
|
|
25
|
+
}
|
|
26
|
+
div.crimagify_otions{
|
|
27
|
+
|
|
28
|
+
}
|
|
29
|
+
}//div.crimagify_container
|
|
30
|
+
}//div.crimagify_item
|
|
6
31
|
div#cropper_div{
|
|
7
32
|
position: absolute !important;
|
|
8
33
|
top: 0 !important;
|
|
9
34
|
left: 0 !important;
|
|
10
|
-
//display: none !important;
|
|
11
35
|
padding:0 0 85px 0 !important;
|
|
12
36
|
z-index:500 !important;
|
|
13
37
|
div.cropper_container{
|
|
@@ -28,12 +52,10 @@ div#cropper_div{
|
|
|
28
52
|
background:#FFF !important;
|
|
29
53
|
padding:10px !important;
|
|
30
54
|
margin-top:0 !important;
|
|
31
|
-
border:1px solid #777 !important;
|
|
32
|
-
border-top:none !important;
|
|
33
55
|
@include rounded(0 0 3px 3px);
|
|
34
56
|
//@include boxShadow(1px 4px 6px,#666) !important;
|
|
35
57
|
position:absolute !important;
|
|
36
|
-
right
|
|
58
|
+
right:0px !important;
|
|
37
59
|
bottom:-57px !important;
|
|
38
60
|
z-index:15 !important;
|
|
39
61
|
a{
|
|
@@ -21,8 +21,8 @@
|
|
|
21
21
|
</div>
|
|
22
22
|
<!--StartCropperImagesSection-->
|
|
23
23
|
<%= images_id(@product) %>
|
|
24
|
-
<%= image_cropper(@product, { image_name: "imgA", ratio: :user , :label_title => "tralalal"}) %><br/>
|
|
25
|
-
<%= image_cropper(@product, { image_name: "imgB", ratio: :big }) %><br/>
|
|
24
|
+
<%= image_cropper(@product, { image_name: "imgA", ratio: :user , :label_title => "tralalal", :choose_text => "Elegir Imagen"}) %><br/>
|
|
25
|
+
<%= image_cropper(@product, { image_name: "imgB", ratio: :big , :choose_text => "Cambiar Imagen"}) %><br/>
|
|
26
26
|
<%#= image_cropper(@product, { image_name: "imgC", ratio: :gigant }) %><br/>
|
|
27
27
|
<%#= image_tag @product.imgA.user %>
|
|
28
28
|
<!--StartCropperImagesSection-->
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
</div>
|
|
23
23
|
</fieldset>
|
|
24
24
|
<%= nested_images_id(f.object) %>
|
|
25
|
-
<%= nested_image_cropper(f.object, { image_name: "imgA", ratio: :user ,:label_title => "tralalal"}, { :class => "img_start" }) %>
|
|
25
|
+
<%= nested_image_cropper(f.object, { image_name: "imgA", ratio: :user ,:label_title => "tralalal", :choose_text => "Elegir Imagen"}, { :class => "img_start" }) %>
|
|
26
26
|
<%= nested_image_cropper(f.object, { image_name: "imgB", ratio: :user }, { :class => "img_start" }) %>
|
|
27
27
|
<hr>
|
|
28
28
|
</div>
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: crimagify
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.4.0
|
|
5
5
|
prerelease:
|
|
6
6
|
platform: ruby
|
|
7
7
|
authors:
|
|
@@ -106,9 +106,6 @@ files:
|
|
|
106
106
|
- app/assets/javascripts/crimagify/jquery.Jcrop.js
|
|
107
107
|
- app/assets/javascripts/crimagify/nested_forms.js
|
|
108
108
|
- app/assets/stylesheets/crimagify/application.css
|
|
109
|
-
- app/assets/stylesheets/crimagify/cropify_cropper.css.scss
|
|
110
|
-
- app/assets/stylesheets/crimagify/cropify_mixin.css.scss
|
|
111
|
-
- app/assets/stylesheets/crimagify/jquery.cropify.Jcrop.css
|
|
112
109
|
- app/controllers/crimagify/application_controller.rb
|
|
113
110
|
- app/controllers/crimagify/cropper_controller.rb
|
|
114
111
|
- app/helpers/crimagify/application_helper.rb
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
@import 'cropify_mixin.css.scss';
|
|
2
|
-
div.parent_image,
|
|
3
|
-
div#parent_image{
|
|
4
|
-
position:relative !important;
|
|
5
|
-
z-index:500 !important;
|
|
6
|
-
float:left;
|
|
7
|
-
display:block;
|
|
8
|
-
}
|
|
9
|
-
div#cropper_div{
|
|
10
|
-
position: absolute !important;
|
|
11
|
-
top: 0 !important;
|
|
12
|
-
left: 0 !important;
|
|
13
|
-
//display: none !important;
|
|
14
|
-
padding:0 0 85px 0 !important;
|
|
15
|
-
z-index:500 !important;
|
|
16
|
-
div.cropper_container{
|
|
17
|
-
position:relative !important;
|
|
18
|
-
div.image_cropper{
|
|
19
|
-
@include rounded(3px 3px 0 3px);
|
|
20
|
-
background:#FFF !important;
|
|
21
|
-
//@include boxShadow(0px 0px 6px,#222) !important;
|
|
22
|
-
z-index: 1000 !important;
|
|
23
|
-
@include dropShadow();
|
|
24
|
-
//border:1px solid #777 !important;
|
|
25
|
-
padding:10px !important;
|
|
26
|
-
z-index:10 !important;
|
|
27
|
-
position:relative !important;
|
|
28
|
-
}
|
|
29
|
-
div.actions{
|
|
30
|
-
padding:8px 0 !important;
|
|
31
|
-
background:#FFF !important;
|
|
32
|
-
padding:10px !important;
|
|
33
|
-
margin-top:0 !important;
|
|
34
|
-
//border:1px solid #777 !important;
|
|
35
|
-
//border-top:none !important;
|
|
36
|
-
@include rounded(0 0 3px 3px);
|
|
37
|
-
//@include boxShadow(1px 4px 6px,#666) !important;
|
|
38
|
-
position:absolute !important;
|
|
39
|
-
right:0px !important;
|
|
40
|
-
bottom:-61px !important;
|
|
41
|
-
z-index:15 !important;
|
|
42
|
-
a{
|
|
43
|
-
text-decoration:none !important;
|
|
44
|
-
font-size:12px !important;
|
|
45
|
-
font-weight:bold !important;
|
|
46
|
-
@include rounded(5px);
|
|
47
|
-
margin:0 10px 0 0 !important;
|
|
48
|
-
float:right !important;
|
|
49
|
-
}
|
|
50
|
-
a#crop_image{
|
|
51
|
-
color:#FFFFFF !important;
|
|
52
|
-
padding:7px 10px !important;
|
|
53
|
-
@include blue_skye_to_blue_hard_vert;
|
|
54
|
-
@include boxShadow(1px 1px 4px,#000);
|
|
55
|
-
}
|
|
56
|
-
a#cancel_crop{
|
|
57
|
-
color:#FFFFFF !important;
|
|
58
|
-
padding:7px 10px !important;
|
|
59
|
-
@include black_easy_to_black_dark;
|
|
60
|
-
@include boxShadow(1px 1px 4px,#000);
|
|
61
|
-
margin:0 !important;
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
.cropper_element{
|
|
67
|
-
position: relative !important;
|
|
68
|
-
}
|
|
69
|
-
.refresh_image{
|
|
70
|
-
position: relative !important;
|
|
71
|
-
}
|
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
@mixin opacity($n:1,$ie:100){
|
|
2
|
-
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity="$n")";
|
|
3
|
-
moz-opacity:$n;
|
|
4
|
-
filter: alpha(opacity=$ie);
|
|
5
|
-
opacity:$n;
|
|
6
|
-
}
|
|
7
|
-
@mixin textShadow($px:2px 1px 1px,$color:#000000){
|
|
8
|
-
text-shadow: $px $color;
|
|
9
|
-
filter: dropshadow(color=$color, offx=2, offy=2);
|
|
10
|
-
}
|
|
11
|
-
@mixin rounded($rounded:5px){
|
|
12
|
-
-webkit-border-radius:$rounded;
|
|
13
|
-
-khtml-border-radius:$rounded;
|
|
14
|
-
-moz-border-radius:$rounded;
|
|
15
|
-
-o-border-radius:$rounded;
|
|
16
|
-
border-radius:$rounded;
|
|
17
|
-
}
|
|
18
|
-
@mixin spriteImages($padding:10px,$position:-10px -10px,$color:transparent){
|
|
19
|
-
padding:$padding;
|
|
20
|
-
background:$color url('/assets/sprite.png') $position no-repeat;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
@mixin sampleSprite($x){
|
|
24
|
-
background:transparent image-url('/assets/sprite.png') $x no-repeat;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
/**/
|
|
28
|
-
@mixin backgroundImage($imageName:no-logo,$format:png, $repeat:no-repeat,$color:transparent){
|
|
29
|
-
background:$color url(/assets/system/$imageName$format) $repeat !important;
|
|
30
|
-
}
|
|
31
|
-
/*store.scc.scss*/
|
|
32
|
-
@mixin tableCell(){
|
|
33
|
-
display:table-cell;
|
|
34
|
-
vertical-align:middle;
|
|
35
|
-
text-align:center;
|
|
36
|
-
}
|
|
37
|
-
@mixin animation($position:all, $time:0.5s, $move:ease-in-out){
|
|
38
|
-
-webkit-transition: $position $time $move;
|
|
39
|
-
-moz-transition: $position $time $move;
|
|
40
|
-
-o-transition: $position $time $move;
|
|
41
|
-
-ms-transition: $position $time $move;
|
|
42
|
-
transition: $position $time $move;
|
|
43
|
-
}
|
|
44
|
-
@mixin transformAnimation($scale:1.2){
|
|
45
|
-
-webkit-transform: scale($scale);
|
|
46
|
-
-moz-transform: scale($scale);
|
|
47
|
-
-o-transform: scale($scale);
|
|
48
|
-
-ms-transform: scale($scale);
|
|
49
|
-
transform: scale($scale);
|
|
50
|
-
}
|
|
51
|
-
@mixin animationdelay($time:0.1s){
|
|
52
|
-
-webkit-transition-delay: $time;
|
|
53
|
-
-moz-transition-delay: $time;
|
|
54
|
-
-o-transition-delay: $time;
|
|
55
|
-
-ms-transition-delay: $time;
|
|
56
|
-
transition-delay: $time;
|
|
57
|
-
|
|
58
|
-
}
|
|
59
|
-
@mixin boxShadow($size:1px 1px 1px, $color:#333){
|
|
60
|
-
-webkit-box-shadow: $size $color;
|
|
61
|
-
-moz-box-shadow: $size $color;
|
|
62
|
-
box-shadow: $size $color;
|
|
63
|
-
}
|
|
64
|
-
@mixin rotate($rotate:-180deg){
|
|
65
|
-
-webkit-transform:rotate($rotate);
|
|
66
|
-
-moz-transform:rotate($rotate);
|
|
67
|
-
-o-transform:rotate($rotate);
|
|
68
|
-
-ms-transform:rotate($rotate);
|
|
69
|
-
transform:rotate($rotate);
|
|
70
|
-
}
|
|
71
|
-
@mixin boderRadius($rad){
|
|
72
|
-
-webkit-border-radius:$rad;
|
|
73
|
-
-moz-border-radius:$rad;
|
|
74
|
-
border-radius:$rad;
|
|
75
|
-
}
|
|
76
|
-
@mixin dropShadow($size:2px 2px 12px,$op:0.8){
|
|
77
|
-
filter: drop-shadow($size rgba(0,0,0,$op));
|
|
78
|
-
-webkit-filter: drop-shadow($size rgba(0,0,0,$op));
|
|
79
|
-
-moz-filter: drop-shadow($size rgba(0,0,0,$op));
|
|
80
|
-
-o-filter: drop-shadow($size rgba(0,0,0,$op));
|
|
81
|
-
ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='rgba(0,0,0,"$op")')";
|
|
82
|
-
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5,Direction=135,Color='rgba(0,0,0,$op)');
|
|
83
|
-
//filter: url(#drop-shadow);
|
|
84
|
-
}
|
|
85
|
-
/*Degradiants*/
|
|
@@ -1,165 +0,0 @@
|
|
|
1
|
-
/* jquery.Jcrop.css v0.9.12 - MIT License */
|
|
2
|
-
/*
|
|
3
|
-
The outer-most container in a typical Jcrop instance
|
|
4
|
-
If you are having difficulty with formatting related to styles
|
|
5
|
-
on a parent element, place any fixes here or in a like selector
|
|
6
|
-
|
|
7
|
-
You can also style this element if you want to add a border, etc
|
|
8
|
-
A better method for styling can be seen below with .jcrop-light
|
|
9
|
-
(Add a class to the holder and style elements for that extended class)
|
|
10
|
-
*/
|
|
11
|
-
.jcrop-holder {
|
|
12
|
-
direction: ltr;
|
|
13
|
-
text-align: left;
|
|
14
|
-
}
|
|
15
|
-
/* Selection Border */
|
|
16
|
-
.jcrop-vline,
|
|
17
|
-
.jcrop-hline {
|
|
18
|
-
background: #ffffff url("Jcrop.gif");
|
|
19
|
-
font-size: 0;
|
|
20
|
-
position: absolute;
|
|
21
|
-
}
|
|
22
|
-
.jcrop-vline {
|
|
23
|
-
height: 100%;
|
|
24
|
-
width: 1px !important;
|
|
25
|
-
}
|
|
26
|
-
.jcrop-vline.right {
|
|
27
|
-
right: 0;
|
|
28
|
-
}
|
|
29
|
-
.jcrop-hline {
|
|
30
|
-
height: 1px !important;
|
|
31
|
-
width: 100%;
|
|
32
|
-
}
|
|
33
|
-
.jcrop-hline.bottom {
|
|
34
|
-
bottom: 0;
|
|
35
|
-
}
|
|
36
|
-
/* Invisible click targets */
|
|
37
|
-
.jcrop-tracker {
|
|
38
|
-
height: 100%;
|
|
39
|
-
width: 100%;
|
|
40
|
-
/* "turn off" link highlight */
|
|
41
|
-
-webkit-tap-highlight-color: transparent;
|
|
42
|
-
/* disable callout, image save panel */
|
|
43
|
-
-webkit-touch-callout: none;
|
|
44
|
-
/* disable cut copy paste */
|
|
45
|
-
-webkit-user-select: none;
|
|
46
|
-
}
|
|
47
|
-
/* Selection Handles */
|
|
48
|
-
.jcrop-handle {
|
|
49
|
-
background-color: #333333;
|
|
50
|
-
border: 1px #eeeeee solid;
|
|
51
|
-
width: 7px;
|
|
52
|
-
height: 7px;
|
|
53
|
-
font-size: 1px;
|
|
54
|
-
}
|
|
55
|
-
.jcrop-handle.ord-n {
|
|
56
|
-
left: 50%;
|
|
57
|
-
margin-left: -4px;
|
|
58
|
-
margin-top: -4px;
|
|
59
|
-
top: 0;
|
|
60
|
-
}
|
|
61
|
-
.jcrop-handle.ord-s {
|
|
62
|
-
bottom: 0;
|
|
63
|
-
left: 50%;
|
|
64
|
-
margin-bottom: -4px;
|
|
65
|
-
margin-left: -4px;
|
|
66
|
-
}
|
|
67
|
-
.jcrop-handle.ord-e {
|
|
68
|
-
margin-right: -4px;
|
|
69
|
-
margin-top: -4px;
|
|
70
|
-
right: 0;
|
|
71
|
-
top: 50%;
|
|
72
|
-
}
|
|
73
|
-
.jcrop-handle.ord-w {
|
|
74
|
-
left: 0;
|
|
75
|
-
margin-left: -4px;
|
|
76
|
-
margin-top: -4px;
|
|
77
|
-
top: 50%;
|
|
78
|
-
}
|
|
79
|
-
.jcrop-handle.ord-nw {
|
|
80
|
-
left: 0;
|
|
81
|
-
margin-left: -4px;
|
|
82
|
-
margin-top: -4px;
|
|
83
|
-
top: 0;
|
|
84
|
-
}
|
|
85
|
-
.jcrop-handle.ord-ne {
|
|
86
|
-
margin-right: -4px;
|
|
87
|
-
margin-top: -4px;
|
|
88
|
-
right: 0;
|
|
89
|
-
top: 0;
|
|
90
|
-
}
|
|
91
|
-
.jcrop-handle.ord-se {
|
|
92
|
-
bottom: 0;
|
|
93
|
-
margin-bottom: -4px;
|
|
94
|
-
margin-right: -4px;
|
|
95
|
-
right: 0;
|
|
96
|
-
}
|
|
97
|
-
.jcrop-handle.ord-sw {
|
|
98
|
-
bottom: 0;
|
|
99
|
-
left: 0;
|
|
100
|
-
margin-bottom: -4px;
|
|
101
|
-
margin-left: -4px;
|
|
102
|
-
}
|
|
103
|
-
/* Dragbars */
|
|
104
|
-
.jcrop-dragbar.ord-n,
|
|
105
|
-
.jcrop-dragbar.ord-s {
|
|
106
|
-
height: 7px;
|
|
107
|
-
width: 100%;
|
|
108
|
-
}
|
|
109
|
-
.jcrop-dragbar.ord-e,
|
|
110
|
-
.jcrop-dragbar.ord-w {
|
|
111
|
-
height: 100%;
|
|
112
|
-
width: 7px;
|
|
113
|
-
}
|
|
114
|
-
.jcrop-dragbar.ord-n {
|
|
115
|
-
margin-top: -4px;
|
|
116
|
-
}
|
|
117
|
-
.jcrop-dragbar.ord-s {
|
|
118
|
-
bottom: 0;
|
|
119
|
-
margin-bottom: -4px;
|
|
120
|
-
}
|
|
121
|
-
.jcrop-dragbar.ord-e {
|
|
122
|
-
margin-right: -4px;
|
|
123
|
-
right: 0;
|
|
124
|
-
}
|
|
125
|
-
.jcrop-dragbar.ord-w {
|
|
126
|
-
margin-left: -4px;
|
|
127
|
-
}
|
|
128
|
-
/* The "jcrop-light" class/extension */
|
|
129
|
-
.jcrop-light .jcrop-vline,
|
|
130
|
-
.jcrop-light .jcrop-hline {
|
|
131
|
-
background: #ffffff;
|
|
132
|
-
filter: alpha(opacity=70) !important;
|
|
133
|
-
opacity: .70!important;
|
|
134
|
-
}
|
|
135
|
-
.jcrop-light .jcrop-handle {
|
|
136
|
-
-moz-border-radius: 3px;
|
|
137
|
-
-webkit-border-radius: 3px;
|
|
138
|
-
background-color: #000000;
|
|
139
|
-
border-color: #ffffff;
|
|
140
|
-
border-radius: 3px;
|
|
141
|
-
}
|
|
142
|
-
/* The "jcrop-dark" class/extension */
|
|
143
|
-
.jcrop-dark .jcrop-vline,
|
|
144
|
-
.jcrop-dark .jcrop-hline {
|
|
145
|
-
background: #000000;
|
|
146
|
-
filter: alpha(opacity=70) !important;
|
|
147
|
-
opacity: 0.7 !important;
|
|
148
|
-
}
|
|
149
|
-
.jcrop-dark .jcrop-handle {
|
|
150
|
-
-moz-border-radius: 3px;
|
|
151
|
-
-webkit-border-radius: 3px;
|
|
152
|
-
background-color: #ffffff;
|
|
153
|
-
border-color: #000000;
|
|
154
|
-
border-radius: 3px;
|
|
155
|
-
}
|
|
156
|
-
/* Simple macro to turn off the antlines */
|
|
157
|
-
.solid-line .jcrop-vline,
|
|
158
|
-
.solid-line .jcrop-hline {
|
|
159
|
-
background: #ffffff;
|
|
160
|
-
}
|
|
161
|
-
/* Fix for twitter bootstrap et al. */
|
|
162
|
-
.jcrop-holder img,
|
|
163
|
-
img.jcrop-preview {
|
|
164
|
-
max-width: none;
|
|
165
|
-
}
|