smock 0.1.13 → 0.1.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/Gemfile.lock +2 -1
- data/Rakefile +11 -0
- data/app/assets/stylesheets/modules/_styleguide.sass +9 -1
- data/app/assets/stylesheets/smock.sass +15 -8
- data/app/assets/stylesheets/thirdparty/{normalize.css → normalize.scss} +0 -0
- data/app/assets/stylesheets/thirdparty/{nprogress.css → nprogress.scss} +0 -0
- data/app/assets/stylesheets/thirdparty/{video-js.css → video-js.scss} +0 -0
- data/examples/blackbox.html +184 -0
- data/lib/smock/generator.rb +1 -1
- data/smock.gemspec +1 -0
- metadata +23 -7
- data/app/assets/stylesheets/thirdparty/jquery.fancybox.css.erb +0 -274
data/Gemfile.lock
CHANGED
data/Rakefile
CHANGED
|
@@ -1,2 +1,13 @@
|
|
|
1
1
|
require 'bundler'
|
|
2
|
+
require 'fileutils'
|
|
3
|
+
|
|
4
|
+
$:.push File.expand_path("../lib", __FILE__)
|
|
5
|
+
require "smock/version"
|
|
6
|
+
|
|
2
7
|
Bundler::GemHelper.install_tasks
|
|
8
|
+
|
|
9
|
+
desc "build a version of smock ready for deploy"
|
|
10
|
+
task :build_version do
|
|
11
|
+
FileUtils.mkdir_p "./versions/#{Smock::VERSION}/"
|
|
12
|
+
sh "bundle exec sass ./app/assets/stylesheets/smock.sass ./versions/#{Smock::VERSION}/smock.css"
|
|
13
|
+
end
|
|
@@ -1,10 +1,18 @@
|
|
|
1
|
+
.classification
|
|
2
|
+
> h2
|
|
3
|
+
+bottom-horizontal-rule
|
|
4
|
+
|
|
5
|
+
.style-group
|
|
6
|
+
+clearfix
|
|
7
|
+
|
|
1
8
|
.style-group__example
|
|
2
9
|
+space(margin-bottom, 2)
|
|
3
10
|
|
|
4
11
|
.style-group__example__label
|
|
5
12
|
clear: both
|
|
6
13
|
display: block
|
|
7
|
-
|
|
14
|
+
background: $gray-lightest
|
|
15
|
+
+space(margin-bottom)
|
|
8
16
|
|
|
9
17
|
.style-group__example__colors
|
|
10
18
|
margin: 0
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
@import "thirdparty/normalize
|
|
1
|
+
@import "thirdparty/normalize"
|
|
2
2
|
@import "thirdparty/bourbon/bourbon"
|
|
3
3
|
@import "includes/grid"
|
|
4
4
|
@import "thirdparty/neat/neat"
|
|
5
5
|
|
|
6
6
|
@import "thirdparty/flexbox_mixins"
|
|
7
|
-
@import "thirdparty/nprogress
|
|
8
|
-
@import "thirdparty/video-js
|
|
9
|
-
//@import "thirdparty/jquery.fancybox"
|
|
7
|
+
@import "thirdparty/nprogress"
|
|
8
|
+
@import "thirdparty/video-js"
|
|
10
9
|
@import "includes/typography_settings"
|
|
11
10
|
@import "thirdparty/typecsset"
|
|
12
11
|
@import "includes/colors"
|
|
@@ -110,18 +109,26 @@
|
|
|
110
109
|
.block__icon--top
|
|
111
110
|
+space(margin-top)
|
|
112
111
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
+shift(4)
|
|
112
|
+
@mixin button($background: $orange)
|
|
113
|
+
display: block
|
|
116
114
|
border: 0
|
|
117
115
|
box-shadow: inset 0 0 0 0 transparent
|
|
118
|
-
background-color: $
|
|
116
|
+
background-color: $background
|
|
119
117
|
border-radius: 4px
|
|
120
118
|
text-align: center
|
|
121
119
|
text-decoration: none
|
|
122
120
|
color: $white
|
|
123
121
|
font-weight: bold
|
|
124
122
|
+space(line-height, 2)
|
|
123
|
+
&:hover
|
|
124
|
+
background-color: lighten($background, 5%)
|
|
125
|
+
text-decoration: none
|
|
126
|
+
|
|
127
|
+
.button
|
|
128
|
+
+button($orange)
|
|
129
|
+
|
|
130
|
+
.button--muted
|
|
131
|
+
+button($gray-light)
|
|
125
132
|
|
|
126
133
|
.button--large
|
|
127
134
|
width: 100%
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,184 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<!--[if lt IE 7]> <html lang="en" ng-app="moodBoard" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
|
|
3
|
+
<!--[if IE 7]> <html lang="en" ng-app="moodBoard" class="no-js lt-ie9 lt-ie8"> <![endif]-->
|
|
4
|
+
<!--[if IE 8]> <html lang="en" ng-app="moodBoard" class="no-js lt-ie9"> <![endif]-->
|
|
5
|
+
<!--[if gt IE 8]><!-->
|
|
6
|
+
<html lang="en" class="no-js">
|
|
7
|
+
<!--<![endif]-->
|
|
8
|
+
<head>
|
|
9
|
+
<meta charset="utf-8">
|
|
10
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
11
|
+
<title>Landing Page</title>
|
|
12
|
+
<meta name="description" content="">
|
|
13
|
+
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
14
|
+
|
|
15
|
+
<link rel="stylesheet" href="css/custom.css" />
|
|
16
|
+
</head>
|
|
17
|
+
|
|
18
|
+
<body ng-app="blackBoxApp" ng-controller="WordpressThemeInstallationController">
|
|
19
|
+
<header class="header header--inverse">
|
|
20
|
+
<div class="container">
|
|
21
|
+
<a class="header__logo header__logo--inverse" href="/">Envato Studio</a>
|
|
22
|
+
</div>
|
|
23
|
+
</header>
|
|
24
|
+
|
|
25
|
+
<section class="l-container">
|
|
26
|
+
<h2 class="heading--mast heading--normal-weight">Get your theme installed fast for $50</h2>
|
|
27
|
+
|
|
28
|
+
<section class="l-content l-content--smaller">
|
|
29
|
+
<div class="image--mast">
|
|
30
|
+
<img src="http://placehold.it/590x300" alt="Theme title"/>
|
|
31
|
+
</div>
|
|
32
|
+
|
|
33
|
+
<h3 class="heading--normal-weight">We'll match you with an expert who <br/> will install your theme in 24 hours</h3>
|
|
34
|
+
|
|
35
|
+
<div class="l-sideby">
|
|
36
|
+
<div class="l-sideby__five-of-eight">
|
|
37
|
+
<p class="paragraph--bigger">You get WordPress, your theme, its demo content, and your logo installed on
|
|
38
|
+
your server</p>
|
|
39
|
+
|
|
40
|
+
<p class="paragraph--bigger">If you need more work done, you can create a follow-up job once your theme
|
|
41
|
+
is installed.</p>
|
|
42
|
+
|
|
43
|
+
<p class="paragraph--bigger paragraph--no-margin"><a
|
|
44
|
+
href="https://envatostudio.zendesk.com/hc/en-us/categories/200211534">More on how this works.</a></p>
|
|
45
|
+
</div>
|
|
46
|
+
<div class="l-sideby__three-of-eight">
|
|
47
|
+
<div class="marketing-countdown">
|
|
48
|
+
<div class="marketing-countdown__svg hot-icon__clock--green"></div>
|
|
49
|
+
<span class="marketing-countdown__copy">in 24 hours</span>
|
|
50
|
+
</div>
|
|
51
|
+
</div>
|
|
52
|
+
</div>
|
|
53
|
+
|
|
54
|
+
<aside class="testimonials">
|
|
55
|
+
<blockquote class="testimonial testimonial--single">
|
|
56
|
+
<div class="testimonial__image">
|
|
57
|
+
<img alt="Peter Fitzgibbon" height="140" src="/assets/placeholder/blackbox_testimonial_erin.jpg" width="140"/>
|
|
58
|
+
</div>
|
|
59
|
+
<div class="testimonial__content">
|
|
60
|
+
<p class="testimonial__content__body">I have been wanting to update my
|
|
61
|
+
Wordpress theme for over a year but was intimidated to do it. I was
|
|
62
|
+
contacted by my installer right away and he was awesome to work with!</p>
|
|
63
|
+
<cite>Erin Southwell</cite>
|
|
64
|
+
</div>
|
|
65
|
+
</blockquote>
|
|
66
|
+
<blockquote class="testimonial testimonial--single">
|
|
67
|
+
<div class="testimonial__image">
|
|
68
|
+
<img alt="Sandra Hahn" height="140" src="/assets/placeholder/blackbox_testimonial_sandra.jpg" width="140"/>
|
|
69
|
+
</div>
|
|
70
|
+
<div class="testimonial__content">
|
|
71
|
+
<p class="testimonial__content__body">Maia was very patient
|
|
72
|
+
with all my questions and we problem-solved together. I would highly
|
|
73
|
+
recommend this service to anyone getting started.</p>
|
|
74
|
+
<cite>Sandra Hahn</cite>
|
|
75
|
+
</div>
|
|
76
|
+
</blockquote>
|
|
77
|
+
</aside>
|
|
78
|
+
</section>
|
|
79
|
+
|
|
80
|
+
<section class="l-sidebar--right l-sidebar--larger">
|
|
81
|
+
<form accept-charset="UTF-8" action="/" class=" new_form_order" id="new_form_order" method="post" novalidate="novalidate">
|
|
82
|
+
<div style="display:none">
|
|
83
|
+
<input name="utf8" type="hidden" value="✓"/>
|
|
84
|
+
<input name="authenticity_token" type="hidden" value="ysaqnPjhzoiZgq1owDimyR43WozJwxhMFnTLGR6eVPc="/>
|
|
85
|
+
</div>
|
|
86
|
+
<fieldset>
|
|
87
|
+
<div class="input string optional form_order_website_name">
|
|
88
|
+
<label class="string optional" for="form_order_website_name">Your website's name</label>
|
|
89
|
+
<input class="string optional" id="form_order_website_name" name="form_order[website_name]" type="text"/>
|
|
90
|
+
</div>
|
|
91
|
+
|
|
92
|
+
<div class="input string optional form_order_website_address">
|
|
93
|
+
<label class="string optional" for="form_order_website_address">Your website's address</label>
|
|
94
|
+
<input class="string optional" id="form_order_website_address" name="form_order[website_address]" type="text"/>
|
|
95
|
+
</div>
|
|
96
|
+
|
|
97
|
+
<div class="input string optional form_order_hosting_panel_details">
|
|
98
|
+
<label class="string optional" for="form_order_hosting_panel_details">Your hosting panel details ?</label>
|
|
99
|
+
<input class="string optional" id="form_order_hosting_panel_details" name="form_order[hosting_panel_details]" type="text"/>
|
|
100
|
+
</div>
|
|
101
|
+
|
|
102
|
+
<div class="payment-method">
|
|
103
|
+
<label>Payment</label>
|
|
104
|
+
<span>
|
|
105
|
+
<input id="form_order_payment_method_paypal" name="form_order[payment_method]" type="radio" value="paypal"/>
|
|
106
|
+
<label class="collection_radio_buttons" for="form_order_payment_method_paypal">Paypal</label>
|
|
107
|
+
</span>
|
|
108
|
+
<span>
|
|
109
|
+
<input id="form_order_payment_method_braintree" name="form_order[payment_method]" type="radio" value="braintree"/>
|
|
110
|
+
<label class="collection_radio_buttons" for="form_order_payment_method_braintree">Creditcard</label>
|
|
111
|
+
</span>
|
|
112
|
+
</div>
|
|
113
|
+
|
|
114
|
+
<div class="credit-card" data-panel="braintree">
|
|
115
|
+
<div class="credit-card__numbers">
|
|
116
|
+
<div class="input string optional form_order_card_number credit-card__numbers__card-number">
|
|
117
|
+
<label class="string optional" for="form_order_card_number">Card number</label>
|
|
118
|
+
<input class="string optional"
|
|
119
|
+
id="form_order_card_number"
|
|
120
|
+
name="form_order[card_number]"
|
|
121
|
+
placeholder="0000 0000 0000 0000"
|
|
122
|
+
type="text"/>
|
|
123
|
+
</div>
|
|
124
|
+
|
|
125
|
+
<div class="input string optional form_order_cvv credit-card__numbers__cvv">
|
|
126
|
+
<label class="string optional" for="form_order_cvv">CVV</label>
|
|
127
|
+
<input class="string optional" id="form_order_cvv" name="form_order[cvv]" placeholder="000" type="text"/>
|
|
128
|
+
</div>
|
|
129
|
+
</div>
|
|
130
|
+
|
|
131
|
+
<div class="credit-card__expiry">
|
|
132
|
+
<label>Expiry date</label>
|
|
133
|
+
|
|
134
|
+
<div class="input string optional form_order_expiry_month credit-card__expiry__month">
|
|
135
|
+
<input class="string optional"
|
|
136
|
+
id="form_order_expiry_month"
|
|
137
|
+
name="form_order[expiry_month]"
|
|
138
|
+
placeholder="Month (MM)"
|
|
139
|
+
type="text"/>
|
|
140
|
+
</div>
|
|
141
|
+
<div class="input string optional form_order_expiry_year credit-card__expiry__year">
|
|
142
|
+
<input class="string optional"
|
|
143
|
+
id="form_order_expiry_year"
|
|
144
|
+
name="form_order[expiry_year]"
|
|
145
|
+
placeholder="Year (YY)"
|
|
146
|
+
type="text"/>
|
|
147
|
+
</div>
|
|
148
|
+
</div>
|
|
149
|
+
</div>
|
|
150
|
+
|
|
151
|
+
<div class="asset-uploader">
|
|
152
|
+
<label>Your logo (optional)</label>
|
|
153
|
+
|
|
154
|
+
<div class="asset-uploader__button asset-uploader__button--drop">
|
|
155
|
+
Drop files here or <strong>browse</strong> to add attachments
|
|
156
|
+
</div>
|
|
157
|
+
<div class="asset-uploader__previews"></div>
|
|
158
|
+
</div>
|
|
159
|
+
|
|
160
|
+
<div class="input string optional form_order_extra_comments">
|
|
161
|
+
<label class="string optional" for="form_order_extra_comments">Extra comments (optional)</label>
|
|
162
|
+
<input class="string optional"
|
|
163
|
+
id="form_order_extra_comments"
|
|
164
|
+
name="form_order[extra_comments]"
|
|
165
|
+
placeholder="Anything else you would like to share with your expert"
|
|
166
|
+
type="text"/>
|
|
167
|
+
</div>
|
|
168
|
+
</fieldset>
|
|
169
|
+
|
|
170
|
+
<input class="button button--large" name="commit" type="submit" value="Install my theme"/>
|
|
171
|
+
</form>
|
|
172
|
+
</section>
|
|
173
|
+
</section>
|
|
174
|
+
|
|
175
|
+
<div class="container">
|
|
176
|
+
<footer class="sub-footer">
|
|
177
|
+
<p>Copyright © 2014 Envato Studio. All Rights Reserved</p>
|
|
178
|
+
<a class="sub-footer__envato" href="http://envato.com">Envato</a>
|
|
179
|
+
</footer>
|
|
180
|
+
</div>
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
</body>
|
|
184
|
+
</html>
|
data/lib/smock/generator.rb
CHANGED
data/smock.gemspec
CHANGED
|
@@ -23,6 +23,7 @@ This gem provides the basic styles and files for use in an application that need
|
|
|
23
23
|
s.require_paths = ["lib"]
|
|
24
24
|
|
|
25
25
|
s.add_dependency('sass', '3.2.19')
|
|
26
|
+
s.add_dependency('thor', '0.19.1')
|
|
26
27
|
|
|
27
28
|
s.add_development_dependency('bourbon', '~> 3.2')
|
|
28
29
|
s.add_development_dependency('neat', '~> 1.5')
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: smock
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1.
|
|
4
|
+
version: 0.1.14
|
|
5
5
|
prerelease:
|
|
6
6
|
platform: ruby
|
|
7
7
|
authors:
|
|
@@ -27,6 +27,22 @@ dependencies:
|
|
|
27
27
|
- - '='
|
|
28
28
|
- !ruby/object:Gem::Version
|
|
29
29
|
version: 3.2.19
|
|
30
|
+
- !ruby/object:Gem::Dependency
|
|
31
|
+
name: thor
|
|
32
|
+
requirement: !ruby/object:Gem::Requirement
|
|
33
|
+
none: false
|
|
34
|
+
requirements:
|
|
35
|
+
- - '='
|
|
36
|
+
- !ruby/object:Gem::Version
|
|
37
|
+
version: 0.19.1
|
|
38
|
+
type: :runtime
|
|
39
|
+
prerelease: false
|
|
40
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
41
|
+
none: false
|
|
42
|
+
requirements:
|
|
43
|
+
- - '='
|
|
44
|
+
- !ruby/object:Gem::Version
|
|
45
|
+
version: 0.19.1
|
|
30
46
|
- !ruby/object:Gem::Dependency
|
|
31
47
|
name: bourbon
|
|
32
48
|
requirement: !ruby/object:Gem::Requirement
|
|
@@ -184,7 +200,6 @@ files:
|
|
|
184
200
|
- app/assets/stylesheets/thirdparty/bourbon/settings/_prefixer.scss
|
|
185
201
|
- app/assets/stylesheets/thirdparty/bourbon/settings/_px-to-em.scss
|
|
186
202
|
- app/assets/stylesheets/thirdparty/flexbox_mixins.scss
|
|
187
|
-
- app/assets/stylesheets/thirdparty/jquery.fancybox.css.erb
|
|
188
203
|
- app/assets/stylesheets/thirdparty/neat/_neat-helpers.scss
|
|
189
204
|
- app/assets/stylesheets/thirdparty/neat/_neat.scss
|
|
190
205
|
- app/assets/stylesheets/thirdparty/neat/functions/_new-breakpoint.scss
|
|
@@ -204,11 +219,12 @@ files:
|
|
|
204
219
|
- app/assets/stylesheets/thirdparty/neat/grid/_visual-grid.scss
|
|
205
220
|
- app/assets/stylesheets/thirdparty/neat/settings/_grid.scss
|
|
206
221
|
- app/assets/stylesheets/thirdparty/neat/settings/_visual-grid.scss
|
|
207
|
-
- app/assets/stylesheets/thirdparty/normalize.
|
|
208
|
-
- app/assets/stylesheets/thirdparty/nprogress.
|
|
222
|
+
- app/assets/stylesheets/thirdparty/normalize.scss
|
|
223
|
+
- app/assets/stylesheets/thirdparty/nprogress.scss
|
|
209
224
|
- app/assets/stylesheets/thirdparty/typecsset.scss
|
|
210
|
-
- app/assets/stylesheets/thirdparty/video-js.
|
|
225
|
+
- app/assets/stylesheets/thirdparty/video-js.scss
|
|
211
226
|
- bin/smock
|
|
227
|
+
- examples/blackbox.html
|
|
212
228
|
- lib/smock.rb
|
|
213
229
|
- lib/smock/engine.rb
|
|
214
230
|
- lib/smock/generator.rb
|
|
@@ -255,7 +271,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
|
255
271
|
version: '0'
|
|
256
272
|
segments:
|
|
257
273
|
- 0
|
|
258
|
-
hash:
|
|
274
|
+
hash: 3557092988739825132
|
|
259
275
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
260
276
|
none: false
|
|
261
277
|
requirements:
|
|
@@ -264,7 +280,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
264
280
|
version: '0'
|
|
265
281
|
segments:
|
|
266
282
|
- 0
|
|
267
|
-
hash:
|
|
283
|
+
hash: 3557092988739825132
|
|
268
284
|
requirements: []
|
|
269
285
|
rubyforge_project: smock
|
|
270
286
|
rubygems_version: 1.8.21
|
|
@@ -1,274 +0,0 @@
|
|
|
1
|
-
/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
|
|
2
|
-
.fancybox-wrap,
|
|
3
|
-
.fancybox-skin,
|
|
4
|
-
.fancybox-outer,
|
|
5
|
-
.fancybox-inner,
|
|
6
|
-
.fancybox-image,
|
|
7
|
-
.fancybox-wrap iframe,
|
|
8
|
-
.fancybox-wrap object,
|
|
9
|
-
.fancybox-nav,
|
|
10
|
-
.fancybox-nav span,
|
|
11
|
-
.fancybox-tmp
|
|
12
|
-
{
|
|
13
|
-
padding: 0;
|
|
14
|
-
margin: 0;
|
|
15
|
-
border: 0;
|
|
16
|
-
outline: none;
|
|
17
|
-
vertical-align: top;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.fancybox-wrap {
|
|
21
|
-
position: absolute;
|
|
22
|
-
top: 0;
|
|
23
|
-
left: 0;
|
|
24
|
-
z-index: 8020;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
.fancybox-skin {
|
|
28
|
-
position: relative;
|
|
29
|
-
background: #f9f9f9;
|
|
30
|
-
color: #444;
|
|
31
|
-
text-shadow: none;
|
|
32
|
-
-webkit-border-radius: 4px;
|
|
33
|
-
-moz-border-radius: 4px;
|
|
34
|
-
border-radius: 4px;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.fancybox-opened {
|
|
38
|
-
z-index: 8030;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.fancybox-opened .fancybox-skin {
|
|
42
|
-
-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
|
|
43
|
-
-moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
|
|
44
|
-
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.fancybox-outer, .fancybox-inner {
|
|
48
|
-
position: relative;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
.fancybox-inner {
|
|
52
|
-
overflow: hidden;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.fancybox-type-iframe .fancybox-inner {
|
|
56
|
-
-webkit-overflow-scrolling: touch;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
.fancybox-error {
|
|
60
|
-
color: #444;
|
|
61
|
-
font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
|
|
62
|
-
margin: 0;
|
|
63
|
-
padding: 15px;
|
|
64
|
-
white-space: nowrap;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
.fancybox-image, .fancybox-iframe {
|
|
68
|
-
display: block;
|
|
69
|
-
width: 100%;
|
|
70
|
-
height: 100%;
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
.fancybox-image {
|
|
74
|
-
max-width: 100%;
|
|
75
|
-
max-height: 100%;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
|
|
79
|
-
background-image: url("<%= image_path 'fancybox_sprite.png' %>");
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
#fancybox-loading {
|
|
83
|
-
position: fixed;
|
|
84
|
-
top: 50%;
|
|
85
|
-
left: 50%;
|
|
86
|
-
margin-top: -22px;
|
|
87
|
-
margin-left: -22px;
|
|
88
|
-
background-position: 0 -108px;
|
|
89
|
-
opacity: 0.8;
|
|
90
|
-
cursor: pointer;
|
|
91
|
-
z-index: 8060;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
#fancybox-loading div {
|
|
95
|
-
width: 44px;
|
|
96
|
-
height: 44px;
|
|
97
|
-
background: url("<%= image_path 'fancybox_loading.gif' %>") center center no-repeat;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
.fancybox-close {
|
|
101
|
-
position: absolute;
|
|
102
|
-
top: -18px;
|
|
103
|
-
right: -18px;
|
|
104
|
-
width: 36px;
|
|
105
|
-
height: 36px;
|
|
106
|
-
cursor: pointer;
|
|
107
|
-
z-index: 8040;
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
.fancybox-nav {
|
|
111
|
-
position: absolute;
|
|
112
|
-
top: 0;
|
|
113
|
-
width: 40%;
|
|
114
|
-
height: 100%;
|
|
115
|
-
cursor: pointer;
|
|
116
|
-
text-decoration: none;
|
|
117
|
-
background: transparent url("<%= image_path 'blank.gif' %>"); /* helps IE */
|
|
118
|
-
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
|
119
|
-
z-index: 8040;
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
.fancybox-prev {
|
|
123
|
-
left: 0;
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
.fancybox-next {
|
|
127
|
-
right: 0;
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
.fancybox-nav span {
|
|
131
|
-
position: absolute;
|
|
132
|
-
top: 50%;
|
|
133
|
-
width: 36px;
|
|
134
|
-
height: 34px;
|
|
135
|
-
margin-top: -18px;
|
|
136
|
-
cursor: pointer;
|
|
137
|
-
z-index: 8040;
|
|
138
|
-
visibility: hidden;
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
.fancybox-prev span {
|
|
142
|
-
left: 10px;
|
|
143
|
-
background-position: 0 -36px;
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
.fancybox-next span {
|
|
147
|
-
right: 10px;
|
|
148
|
-
background-position: 0 -72px;
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
.fancybox-nav:hover span {
|
|
152
|
-
visibility: visible;
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
.fancybox-tmp {
|
|
156
|
-
position: absolute;
|
|
157
|
-
top: -99999px;
|
|
158
|
-
left: -99999px;
|
|
159
|
-
visibility: hidden;
|
|
160
|
-
max-width: 99999px;
|
|
161
|
-
max-height: 99999px;
|
|
162
|
-
overflow: visible !important;
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
/* Overlay helper */
|
|
166
|
-
|
|
167
|
-
.fancybox-lock {
|
|
168
|
-
overflow: hidden !important;
|
|
169
|
-
width: auto;
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
.fancybox-lock body {
|
|
173
|
-
overflow: hidden !important;
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
.fancybox-lock-test {
|
|
177
|
-
overflow-y: hidden !important;
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
.fancybox-overlay {
|
|
181
|
-
position: absolute;
|
|
182
|
-
top: 0;
|
|
183
|
-
left: 0;
|
|
184
|
-
overflow: hidden;
|
|
185
|
-
display: none;
|
|
186
|
-
z-index: 8010;
|
|
187
|
-
background: url("<%= image_path 'fancybox_overlay.png' %>");
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
.fancybox-overlay-fixed {
|
|
191
|
-
position: fixed;
|
|
192
|
-
bottom: 0;
|
|
193
|
-
right: 0;
|
|
194
|
-
}
|
|
195
|
-
|
|
196
|
-
.fancybox-lock .fancybox-overlay {
|
|
197
|
-
overflow: auto;
|
|
198
|
-
overflow-y: scroll;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
/* Title helper */
|
|
202
|
-
|
|
203
|
-
.fancybox-title {
|
|
204
|
-
visibility: hidden;
|
|
205
|
-
font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
|
|
206
|
-
position: relative;
|
|
207
|
-
text-shadow: none;
|
|
208
|
-
z-index: 8050;
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
.fancybox-opened .fancybox-title {
|
|
212
|
-
visibility: visible;
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
.fancybox-title-float-wrap {
|
|
216
|
-
position: absolute;
|
|
217
|
-
bottom: 0;
|
|
218
|
-
right: 50%;
|
|
219
|
-
margin-bottom: -35px;
|
|
220
|
-
z-index: 8050;
|
|
221
|
-
text-align: center;
|
|
222
|
-
}
|
|
223
|
-
|
|
224
|
-
.fancybox-title-float-wrap .child {
|
|
225
|
-
display: inline-block;
|
|
226
|
-
margin-right: -100%;
|
|
227
|
-
padding: 2px 20px;
|
|
228
|
-
background: transparent; /* Fallback for web browsers that doesn't support RGBa */
|
|
229
|
-
background: rgba(0, 0, 0, 0.8);
|
|
230
|
-
-webkit-border-radius: 15px;
|
|
231
|
-
-moz-border-radius: 15px;
|
|
232
|
-
border-radius: 15px;
|
|
233
|
-
text-shadow: 0 1px 2px #222;
|
|
234
|
-
color: #FFF;
|
|
235
|
-
font-weight: bold;
|
|
236
|
-
line-height: 24px;
|
|
237
|
-
white-space: nowrap;
|
|
238
|
-
}
|
|
239
|
-
|
|
240
|
-
.fancybox-title-outside-wrap {
|
|
241
|
-
position: relative;
|
|
242
|
-
margin-top: 10px;
|
|
243
|
-
color: #fff;
|
|
244
|
-
}
|
|
245
|
-
|
|
246
|
-
.fancybox-title-inside-wrap {
|
|
247
|
-
padding-top: 10px;
|
|
248
|
-
}
|
|
249
|
-
|
|
250
|
-
.fancybox-title-over-wrap {
|
|
251
|
-
position: absolute;
|
|
252
|
-
bottom: 0;
|
|
253
|
-
left: 0;
|
|
254
|
-
color: #fff;
|
|
255
|
-
padding: 10px;
|
|
256
|
-
background: #000;
|
|
257
|
-
background: rgba(0, 0, 0, .8);
|
|
258
|
-
}
|
|
259
|
-
|
|
260
|
-
/*Retina graphics!*/
|
|
261
|
-
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
|
|
262
|
-
only screen and (min--moz-device-pixel-ratio: 1.5),
|
|
263
|
-
only screen and (min-device-pixel-ratio: 1.5){
|
|
264
|
-
|
|
265
|
-
#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
|
|
266
|
-
background-image: url("<%= image_path 'fancybox_sprite@2x.png' %>");
|
|
267
|
-
background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
#fancybox-loading div {
|
|
271
|
-
background-image: url("<%= image_path 'fancybox_loading@2x.gif' %>");
|
|
272
|
-
background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
|
|
273
|
-
}
|
|
274
|
-
}
|