phrasing 4.0.0rc5 → 4.0.0rc6
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.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/phrasing.scss +252 -0
- data/app/assets/stylesheets/{phrasing_edit_mode_bubble.css.scss → phrasing_edit_mode_bubble.scss} +1 -1
- data/app/assets/stylesheets/phrasing_fonts.scss +138 -0
- data/lib/phrasing/version.rb +1 -1
- data/spec/dummy/app/assets/stylesheets/application.scss +3 -0
- metadata +6 -6
- data/app/assets/stylesheets/phrasing.css.scss +0 -251
- data/app/assets/stylesheets/phrasing_fonts.css.scss +0 -60
- data/spec/dummy/app/assets/stylesheets/application.css +0 -8
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 6a1ab3331dcb2b9969b3f01d4ac9a98a02ee22c2
|
4
|
+
data.tar.gz: dfb583877cf37739245817a9c318419db2a47815
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 284731f64b687037616a5411c0b50a5a903bd3ba6be6b703578134de37ac4204e7ee99a1c69ea12401f11f1eb76f9b51916050672ef4ece2c61c78f00ddfb5dd
|
7
|
+
data.tar.gz: 826c167f861421e81b6362bed6190ee8a4a945a64de1a4174489763fc998d648d8af6593ee34009f9fce978c7f6b6f6ef6d373cee76d40623f33ca8deb7c4604
|
@@ -0,0 +1,252 @@
|
|
1
|
+
@import "phrasing_fonts";
|
2
|
+
@import "phrasing_edit_mode_bubble";
|
3
|
+
|
4
|
+
/*********************************************
|
5
|
+
* BASE STYLES
|
6
|
+
*********************************************/
|
7
|
+
|
8
|
+
/*html {
|
9
|
+
overflow: hidden;
|
10
|
+
}*/
|
11
|
+
|
12
|
+
.phrasable.phrasable-on{
|
13
|
+
border-bottom: 1px dashed black;
|
14
|
+
|
15
|
+
a{
|
16
|
+
pointer-events: none;
|
17
|
+
cursor: default;
|
18
|
+
}
|
19
|
+
|
20
|
+
&:focus{
|
21
|
+
outline: none;
|
22
|
+
}
|
23
|
+
|
24
|
+
&:hover{
|
25
|
+
background-color: #fffadc;
|
26
|
+
cursor: pointer;
|
27
|
+
}
|
28
|
+
|
29
|
+
&.inverse{
|
30
|
+
border-bottom: 1px dashed white;
|
31
|
+
|
32
|
+
&:hover{
|
33
|
+
background-color: #333333;
|
34
|
+
}
|
35
|
+
}
|
36
|
+
|
37
|
+
}
|
38
|
+
|
39
|
+
/*blockquote {
|
40
|
+
border-left: 4px solid deepskyblue;
|
41
|
+
margin-left: -19px;
|
42
|
+
padding-left: 15px;
|
43
|
+
margin-right: 0px;
|
44
|
+
}*/
|
45
|
+
|
46
|
+
span.no-overflow {
|
47
|
+
overflow: hidden;
|
48
|
+
display: block;
|
49
|
+
height: 100%;
|
50
|
+
width: 100%;
|
51
|
+
}
|
52
|
+
|
53
|
+
/* Used by the ui bubble to stop wrapping */
|
54
|
+
.lengthen {
|
55
|
+
display: block;
|
56
|
+
width: 300px;
|
57
|
+
height: 100%;
|
58
|
+
}
|
59
|
+
|
60
|
+
.useicons {
|
61
|
+
-webkit-font-smoothing: antialiased;
|
62
|
+
font-size: 20px !important;
|
63
|
+
font-family: 'icomoon' !important;
|
64
|
+
}
|
65
|
+
|
66
|
+
/*.ui {
|
67
|
+
position: fixed;
|
68
|
+
padding: 20px;
|
69
|
+
width: 65px;
|
70
|
+
bottom: 0px;
|
71
|
+
left: 0px;
|
72
|
+
top: 0px;
|
73
|
+
}
|
74
|
+
|
75
|
+
.ui:hover button {
|
76
|
+
opacity: 0.4;
|
77
|
+
}
|
78
|
+
|
79
|
+
.ui button:hover {
|
80
|
+
opacity: 1;
|
81
|
+
}*/
|
82
|
+
|
83
|
+
.text-options button {
|
84
|
+
|
85
|
+
-webkit-transition: opacity 400ms;
|
86
|
+
-moz-transition: opacity 400ms;
|
87
|
+
-ms-transition: opacity 400ms;
|
88
|
+
-o-transition: opacity 400ms;
|
89
|
+
transition: opacity 400ms;
|
90
|
+
|
91
|
+
font-family: inherit;
|
92
|
+
background: none;
|
93
|
+
cursor: pointer;
|
94
|
+
font-size: 25px;
|
95
|
+
color: inherit;
|
96
|
+
opacity: 0.1;
|
97
|
+
padding: 0px;
|
98
|
+
height: 32px;
|
99
|
+
width: 25px;
|
100
|
+
border: 0px;
|
101
|
+
}
|
102
|
+
|
103
|
+
/*.quote {
|
104
|
+
line-height: 60px !important;
|
105
|
+
font-size: 49px !important;
|
106
|
+
}*/
|
107
|
+
|
108
|
+
/*********************************************
|
109
|
+
* UI BUBBLE
|
110
|
+
*********************************************/
|
111
|
+
|
112
|
+
.text-options {
|
113
|
+
|
114
|
+
-webkit-transition: opacity 250ms, margin 250ms;
|
115
|
+
-moz-transition: opacity 250ms, margin 250ms;
|
116
|
+
-ms-transition: opacity 250ms, margin 250ms;
|
117
|
+
-o-transition: opacity 250ms, margin 250ms;
|
118
|
+
transition: opacity 250ms, margin 250ms;
|
119
|
+
*, *:before, *:after{
|
120
|
+
box-sizing: content-box;
|
121
|
+
-webkit-box-sizing: content-box;
|
122
|
+
}
|
123
|
+
position: absolute;
|
124
|
+
left: -999px;
|
125
|
+
top: -999px;
|
126
|
+
color: #fff;
|
127
|
+
height: 0px;
|
128
|
+
width: 0px;
|
129
|
+
z-index: 5;
|
130
|
+
margin-top: 5px;
|
131
|
+
opacity: 0;
|
132
|
+
|
133
|
+
&.fade {
|
134
|
+
opacity: 0;
|
135
|
+
margin-top: -5px;
|
136
|
+
}
|
137
|
+
|
138
|
+
&.active {
|
139
|
+
opacity: 1;
|
140
|
+
margin-top: 0px;
|
141
|
+
}
|
142
|
+
}
|
143
|
+
|
144
|
+
|
145
|
+
.text-options .options {
|
146
|
+
background-color: rgba(0,0,0,0.9);
|
147
|
+
position: absolute;
|
148
|
+
border-radius: 5px;
|
149
|
+
margin-left: -48px;
|
150
|
+
margin-top: -46px;
|
151
|
+
z-index: 1000;
|
152
|
+
padding: 5px 4px 5px 5px;
|
153
|
+
width: 96px;
|
154
|
+
height: 40px;
|
155
|
+
|
156
|
+
-moz-box-sizing: border-box;
|
157
|
+
box-sizing: border-box;
|
158
|
+
|
159
|
+
-webkit-transition: all 300ms ease-in-out;
|
160
|
+
-moz-transition: all 300ms ease-in-out;
|
161
|
+
-ms-transition: all 300ms ease-in-out;
|
162
|
+
-o-transition: all 300ms ease-in-out;
|
163
|
+
transition: all 300ms ease-in-out;
|
164
|
+
|
165
|
+
|
166
|
+
&.url-mode {
|
167
|
+
width: 275px;
|
168
|
+
margin-left: -137px;
|
169
|
+
|
170
|
+
.bold, .options.url-mode .italic, .options.url-mode .quote {
|
171
|
+
width: 0px;
|
172
|
+
overflow: hidden;
|
173
|
+
margin-right: 0px;
|
174
|
+
opacity: 0;
|
175
|
+
}
|
176
|
+
|
177
|
+
input{
|
178
|
+
border-left: 2px solid transparent;
|
179
|
+
padding-right: 5px;
|
180
|
+
padding-left: 5px;
|
181
|
+
width: 236px;
|
182
|
+
}
|
183
|
+
}
|
184
|
+
|
185
|
+
.italic {
|
186
|
+
font-style: italic;
|
187
|
+
}
|
188
|
+
.bold, .italic{
|
189
|
+
line-height:normal;
|
190
|
+
}
|
191
|
+
|
192
|
+
button {
|
193
|
+
-webkit-transition: all 250ms ease-in-out;
|
194
|
+
-moz-transition: all 250ms ease-in-out;
|
195
|
+
-ms-transition: all 250ms ease-in-out;
|
196
|
+
-o-transition: all 250ms ease-in-out;
|
197
|
+
transition: all 250ms ease-in-out;
|
198
|
+
|
199
|
+
float: left;
|
200
|
+
width: 28px;
|
201
|
+
opacity: 0.7;
|
202
|
+
height: 30px;
|
203
|
+
border-radius: 3px;
|
204
|
+
margin-right: 1px;
|
205
|
+
font-family: 'Lora', serif;
|
206
|
+
|
207
|
+
&.active {
|
208
|
+
background-color: rgba(255,255,255,0.4);
|
209
|
+
opacity: 1;
|
210
|
+
}
|
211
|
+
|
212
|
+
&:hover {
|
213
|
+
opacity: 0.95;
|
214
|
+
}
|
215
|
+
}
|
216
|
+
|
217
|
+
input {
|
218
|
+
-webkit-transition: all 300ms ease-in-out;
|
219
|
+
-moz-transition: all 300ms ease-in-out;
|
220
|
+
-ms-transition: all 300ms ease-in-out;
|
221
|
+
-o-transition: all 300ms ease-in-out;
|
222
|
+
transition: all 300ms ease-in-out;
|
223
|
+
|
224
|
+
border-radius: 3px;
|
225
|
+
overflow: hidden;
|
226
|
+
outline: 0px;
|
227
|
+
height: 30px;
|
228
|
+
padding: 0px;
|
229
|
+
margin: 0px;
|
230
|
+
border: 0px;
|
231
|
+
float: left;
|
232
|
+
width: 0px;
|
233
|
+
}
|
234
|
+
|
235
|
+
&:before {
|
236
|
+
content: "";
|
237
|
+
border-top: 5px solid rgba(0,0,0,0.9);
|
238
|
+
border-bottom: 5px solid transparent;
|
239
|
+
border-right: 5px solid transparent;
|
240
|
+
border-left: 5px solid transparent;
|
241
|
+
position: absolute;
|
242
|
+
margin-left: -5px;
|
243
|
+
bottom: -15px;
|
244
|
+
height: 5px;
|
245
|
+
width: 0px;
|
246
|
+
left: 50%;
|
247
|
+
}
|
248
|
+
}
|
249
|
+
|
250
|
+
.url {
|
251
|
+
-webkit-font-smoothing: antialiased;
|
252
|
+
}
|
@@ -0,0 +1,138 @@
|
|
1
|
+
#phrasing-edit-mode-bubble{
|
2
|
+
*, *:after, *:before{
|
3
|
+
webkit-box-sizing:content-box;
|
4
|
+
box-sizing:content-box;
|
5
|
+
}
|
6
|
+
webkit-box-sizing:content-box;
|
7
|
+
box-sizing:content-box;
|
8
|
+
background: rgba(255,255,255, 1);
|
9
|
+
color:grey;
|
10
|
+
border: 2px solid #EFEFEF;
|
11
|
+
position: fixed;
|
12
|
+
width:130px;
|
13
|
+
height:135px;
|
14
|
+
bottom:10px;
|
15
|
+
right:10px;
|
16
|
+
z-index: 9999;
|
17
|
+
font-family: Arial, Helvetica, sans-serif;
|
18
|
+
font-size:14px;
|
19
|
+
-webkit-border-radius: 10px;
|
20
|
+
-moz-border-radius: 10px;
|
21
|
+
border-radius: 10px;
|
22
|
+
|
23
|
+
p{
|
24
|
+
line-height:20px;
|
25
|
+
}
|
26
|
+
::selection{ color: grey; background: white; }
|
27
|
+
|
28
|
+
#phrasing-edit-mode, #phrasing-saved-status, #phrasing-edit-all-phrases{
|
29
|
+
height:32px;
|
30
|
+
margin-top:10px;
|
31
|
+
}
|
32
|
+
#phrasing-edit-mode-headline, #phrasing-edit-all-phrases-headline, #phrasing-saved-status-headline{
|
33
|
+
p{
|
34
|
+
display: inline;
|
35
|
+
}
|
36
|
+
}
|
37
|
+
|
38
|
+
#phrasing-edit-mode-headline{
|
39
|
+
height:30px;
|
40
|
+
width:45px;
|
41
|
+
float:left;
|
42
|
+
padding-left:15px;
|
43
|
+
padding-top:5px;
|
44
|
+
}
|
45
|
+
#phrasing-onoffswitch{
|
46
|
+
float:left;
|
47
|
+
}
|
48
|
+
// On/Off Switch
|
49
|
+
.onoffswitch {
|
50
|
+
position: relative; width: 60px;
|
51
|
+
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
|
52
|
+
.onoffswitch-checkbox {
|
53
|
+
display: none;
|
54
|
+
}
|
55
|
+
.onoffswitch-label {
|
56
|
+
display: block; overflow: hidden; cursor: pointer;
|
57
|
+
border: 2px solid #CCCCCC; border-radius: 5px;
|
58
|
+
}
|
59
|
+
.onoffswitch-inner {
|
60
|
+
width: 200%; margin-left: -100%;
|
61
|
+
-moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
|
62
|
+
-o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
|
63
|
+
&:before, &:after {
|
64
|
+
float: left; width: 50%; height: 25px; padding: 0; line-height: 25px;
|
65
|
+
font-size: 40px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
|
66
|
+
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; content: "";
|
67
|
+
}
|
68
|
+
&:before {
|
69
|
+
padding-left: 10px;
|
70
|
+
background-color: #56AE45;
|
71
|
+
}
|
72
|
+
&:after {
|
73
|
+
padding-right: 10px;
|
74
|
+
background-color: #CCCCCC;
|
75
|
+
text-align: right;
|
76
|
+
}
|
77
|
+
}
|
78
|
+
.onoffswitch-switch {
|
79
|
+
width: 27px; margin: 0px;
|
80
|
+
background: #FFFFFF;
|
81
|
+
border: 3px solid #CCCCCC; border-radius: 5px;
|
82
|
+
position: absolute; top: 0; bottom: 0; right: 29px;
|
83
|
+
-moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s;
|
84
|
+
-o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s;
|
85
|
+
background-image: -moz-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
|
86
|
+
background-image: -webkit-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
|
87
|
+
background-image: -o-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
|
88
|
+
background-image: linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
|
89
|
+
}
|
90
|
+
|
91
|
+
.onoffswitch-checkbox:checked {
|
92
|
+
+.onoffswitch-label {
|
93
|
+
border: 2px solid #56AE45;
|
94
|
+
.onoffswitch-inner {
|
95
|
+
margin-left: 0;
|
96
|
+
}
|
97
|
+
.onoffswitch-switch {
|
98
|
+
right: 0px;
|
99
|
+
border: 3px solid #56AE45;
|
100
|
+
}
|
101
|
+
}
|
102
|
+
}
|
103
|
+
}
|
104
|
+
#phrasing-saved-status-headline{
|
105
|
+
height:30px;
|
106
|
+
width:45px;
|
107
|
+
float:left;
|
108
|
+
padding-left:15px;
|
109
|
+
padding-top:5px;
|
110
|
+
}
|
111
|
+
#phrasing-saved-status-indicator{
|
112
|
+
float:left;
|
113
|
+
}
|
114
|
+
#phrasing-saved-status-indicator-circle{
|
115
|
+
background-color: #56AE45;
|
116
|
+
width:20px;
|
117
|
+
height:20px;
|
118
|
+
-webkit-border-radius: 10px;
|
119
|
+
-moz-border-radius: 10px;
|
120
|
+
margin-left:10px;
|
121
|
+
margin-top:5px;
|
122
|
+
}
|
123
|
+
#phrasing-edit-all-phrases-headline{
|
124
|
+
height:30px;
|
125
|
+
width:45px;
|
126
|
+
float:left;
|
127
|
+
padding-left:15px;
|
128
|
+
padding-top:5px;
|
129
|
+
}
|
130
|
+
#phrasing-edit-all-phrases-icon-container{
|
131
|
+
float:left;
|
132
|
+
.phrasing-edit-all-phrases-icon{
|
133
|
+
margin-left:10px;
|
134
|
+
margin-top:7px;
|
135
|
+
}
|
136
|
+
}
|
137
|
+
|
138
|
+
}
|
data/lib/phrasing/version.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: phrasing
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 4.0.
|
4
|
+
version: 4.0.0rc6
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Tomislav Car
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2015-05-
|
12
|
+
date: 2015-05-22 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: rails
|
@@ -120,10 +120,10 @@ files:
|
|
120
120
|
- app/assets/javascripts/editor.js
|
121
121
|
- app/assets/javascripts/phrasing.js
|
122
122
|
- app/assets/javascripts/phrasing_engine.js
|
123
|
-
- app/assets/stylesheets/phrasing.
|
124
|
-
- app/assets/stylesheets/phrasing_edit_mode_bubble.
|
123
|
+
- app/assets/stylesheets/phrasing.scss
|
124
|
+
- app/assets/stylesheets/phrasing_edit_mode_bubble.scss
|
125
125
|
- app/assets/stylesheets/phrasing_engine.css
|
126
|
-
- app/assets/stylesheets/phrasing_fonts.
|
126
|
+
- app/assets/stylesheets/phrasing_fonts.scss
|
127
127
|
- app/controllers/phrasing_phrase_versions_controller.rb
|
128
128
|
- app/controllers/phrasing_phrases_controller.rb
|
129
129
|
- app/helpers/inline_helper.rb
|
@@ -152,7 +152,7 @@ files:
|
|
152
152
|
- spec/controllers/phrasing_phrases_controller.rb
|
153
153
|
- spec/dummy/Rakefile
|
154
154
|
- spec/dummy/app/assets/javascripts/application.js
|
155
|
-
- spec/dummy/app/assets/stylesheets/application.
|
155
|
+
- spec/dummy/app/assets/stylesheets/application.scss
|
156
156
|
- spec/dummy/app/controllers/application_controller.rb
|
157
157
|
- spec/dummy/app/controllers/site_controller.rb
|
158
158
|
- spec/dummy/app/helpers/application_helper.rb
|
@@ -1,251 +0,0 @@
|
|
1
|
-
//= require phrasing_fonts
|
2
|
-
//= require phrasing_edit_mode_bubble
|
3
|
-
/*********************************************
|
4
|
-
* BASE STYLES
|
5
|
-
*********************************************/
|
6
|
-
|
7
|
-
/*html {
|
8
|
-
overflow: hidden;
|
9
|
-
}*/
|
10
|
-
|
11
|
-
.phrasable.phrasable-on{
|
12
|
-
border-bottom: 1px dashed black;
|
13
|
-
|
14
|
-
a{
|
15
|
-
pointer-events: none;
|
16
|
-
cursor: default;
|
17
|
-
}
|
18
|
-
|
19
|
-
&:focus{
|
20
|
-
outline: none;
|
21
|
-
}
|
22
|
-
|
23
|
-
&:hover{
|
24
|
-
background-color: #fffadc;
|
25
|
-
cursor: pointer;
|
26
|
-
}
|
27
|
-
|
28
|
-
&.inverse{
|
29
|
-
border-bottom: 1px dashed white;
|
30
|
-
|
31
|
-
&:hover{
|
32
|
-
background-color: #333333;
|
33
|
-
}
|
34
|
-
}
|
35
|
-
|
36
|
-
}
|
37
|
-
|
38
|
-
/*blockquote {
|
39
|
-
border-left: 4px solid deepskyblue;
|
40
|
-
margin-left: -19px;
|
41
|
-
padding-left: 15px;
|
42
|
-
margin-right: 0px;
|
43
|
-
}*/
|
44
|
-
|
45
|
-
span.no-overflow {
|
46
|
-
overflow: hidden;
|
47
|
-
display: block;
|
48
|
-
height: 100%;
|
49
|
-
width: 100%;
|
50
|
-
}
|
51
|
-
|
52
|
-
/* Used by the ui bubble to stop wrapping */
|
53
|
-
.lengthen {
|
54
|
-
display: block;
|
55
|
-
width: 300px;
|
56
|
-
height: 100%;
|
57
|
-
}
|
58
|
-
|
59
|
-
.useicons {
|
60
|
-
-webkit-font-smoothing: antialiased;
|
61
|
-
font-size: 20px !important;
|
62
|
-
font-family: 'icomoon' !important;
|
63
|
-
}
|
64
|
-
|
65
|
-
/*.ui {
|
66
|
-
position: fixed;
|
67
|
-
padding: 20px;
|
68
|
-
width: 65px;
|
69
|
-
bottom: 0px;
|
70
|
-
left: 0px;
|
71
|
-
top: 0px;
|
72
|
-
}
|
73
|
-
|
74
|
-
.ui:hover button {
|
75
|
-
opacity: 0.4;
|
76
|
-
}
|
77
|
-
|
78
|
-
.ui button:hover {
|
79
|
-
opacity: 1;
|
80
|
-
}*/
|
81
|
-
|
82
|
-
.text-options button {
|
83
|
-
|
84
|
-
-webkit-transition: opacity 400ms;
|
85
|
-
-moz-transition: opacity 400ms;
|
86
|
-
-ms-transition: opacity 400ms;
|
87
|
-
-o-transition: opacity 400ms;
|
88
|
-
transition: opacity 400ms;
|
89
|
-
|
90
|
-
font-family: inherit;
|
91
|
-
background: none;
|
92
|
-
cursor: pointer;
|
93
|
-
font-size: 25px;
|
94
|
-
color: inherit;
|
95
|
-
opacity: 0.1;
|
96
|
-
padding: 0px;
|
97
|
-
height: 32px;
|
98
|
-
width: 25px;
|
99
|
-
border: 0px;
|
100
|
-
}
|
101
|
-
|
102
|
-
/*.quote {
|
103
|
-
line-height: 60px !important;
|
104
|
-
font-size: 49px !important;
|
105
|
-
}*/
|
106
|
-
|
107
|
-
/*********************************************
|
108
|
-
* UI BUBBLE
|
109
|
-
*********************************************/
|
110
|
-
|
111
|
-
.text-options {
|
112
|
-
|
113
|
-
-webkit-transition: opacity 250ms, margin 250ms;
|
114
|
-
-moz-transition: opacity 250ms, margin 250ms;
|
115
|
-
-ms-transition: opacity 250ms, margin 250ms;
|
116
|
-
-o-transition: opacity 250ms, margin 250ms;
|
117
|
-
transition: opacity 250ms, margin 250ms;
|
118
|
-
*, *:before, *:after{
|
119
|
-
box-sizing: content-box;
|
120
|
-
-webkit-box-sizing: content-box;
|
121
|
-
}
|
122
|
-
position: absolute;
|
123
|
-
left: -999px;
|
124
|
-
top: -999px;
|
125
|
-
color: #fff;
|
126
|
-
height: 0px;
|
127
|
-
width: 0px;
|
128
|
-
z-index: 5;
|
129
|
-
margin-top: 5px;
|
130
|
-
opacity: 0;
|
131
|
-
|
132
|
-
&.fade {
|
133
|
-
opacity: 0;
|
134
|
-
margin-top: -5px;
|
135
|
-
}
|
136
|
-
|
137
|
-
&.active {
|
138
|
-
opacity: 1;
|
139
|
-
margin-top: 0px;
|
140
|
-
}
|
141
|
-
}
|
142
|
-
|
143
|
-
|
144
|
-
.text-options .options {
|
145
|
-
background-color: rgba(0,0,0,0.9);
|
146
|
-
position: absolute;
|
147
|
-
border-radius: 5px;
|
148
|
-
margin-left: -48px;
|
149
|
-
margin-top: -46px;
|
150
|
-
z-index: 1000;
|
151
|
-
padding: 5px 4px 5px 5px;
|
152
|
-
width: 96px;
|
153
|
-
height: 40px;
|
154
|
-
|
155
|
-
-moz-box-sizing: border-box;
|
156
|
-
box-sizing: border-box;
|
157
|
-
|
158
|
-
-webkit-transition: all 300ms ease-in-out;
|
159
|
-
-moz-transition: all 300ms ease-in-out;
|
160
|
-
-ms-transition: all 300ms ease-in-out;
|
161
|
-
-o-transition: all 300ms ease-in-out;
|
162
|
-
transition: all 300ms ease-in-out;
|
163
|
-
|
164
|
-
|
165
|
-
&.url-mode {
|
166
|
-
width: 275px;
|
167
|
-
margin-left: -137px;
|
168
|
-
|
169
|
-
.bold, .options.url-mode .italic, .options.url-mode .quote {
|
170
|
-
width: 0px;
|
171
|
-
overflow: hidden;
|
172
|
-
margin-right: 0px;
|
173
|
-
opacity: 0;
|
174
|
-
}
|
175
|
-
|
176
|
-
input{
|
177
|
-
border-left: 2px solid transparent;
|
178
|
-
padding-right: 5px;
|
179
|
-
padding-left: 5px;
|
180
|
-
width: 236px;
|
181
|
-
}
|
182
|
-
}
|
183
|
-
|
184
|
-
.italic {
|
185
|
-
font-style: italic;
|
186
|
-
}
|
187
|
-
.bold, .italic{
|
188
|
-
line-height:normal;
|
189
|
-
}
|
190
|
-
|
191
|
-
button {
|
192
|
-
-webkit-transition: all 250ms ease-in-out;
|
193
|
-
-moz-transition: all 250ms ease-in-out;
|
194
|
-
-ms-transition: all 250ms ease-in-out;
|
195
|
-
-o-transition: all 250ms ease-in-out;
|
196
|
-
transition: all 250ms ease-in-out;
|
197
|
-
|
198
|
-
float: left;
|
199
|
-
width: 28px;
|
200
|
-
opacity: 0.7;
|
201
|
-
height: 30px;
|
202
|
-
border-radius: 3px;
|
203
|
-
margin-right: 1px;
|
204
|
-
font-family: 'Lora', serif;
|
205
|
-
|
206
|
-
&.active {
|
207
|
-
background-color: rgba(255,255,255,0.4);
|
208
|
-
opacity: 1;
|
209
|
-
}
|
210
|
-
|
211
|
-
&:hover {
|
212
|
-
opacity: 0.95;
|
213
|
-
}
|
214
|
-
}
|
215
|
-
|
216
|
-
input {
|
217
|
-
-webkit-transition: all 300ms ease-in-out;
|
218
|
-
-moz-transition: all 300ms ease-in-out;
|
219
|
-
-ms-transition: all 300ms ease-in-out;
|
220
|
-
-o-transition: all 300ms ease-in-out;
|
221
|
-
transition: all 300ms ease-in-out;
|
222
|
-
|
223
|
-
border-radius: 3px;
|
224
|
-
overflow: hidden;
|
225
|
-
outline: 0px;
|
226
|
-
height: 30px;
|
227
|
-
padding: 0px;
|
228
|
-
margin: 0px;
|
229
|
-
border: 0px;
|
230
|
-
float: left;
|
231
|
-
width: 0px;
|
232
|
-
}
|
233
|
-
|
234
|
-
&:before {
|
235
|
-
content: "";
|
236
|
-
border-top: 5px solid rgba(0,0,0,0.9);
|
237
|
-
border-bottom: 5px solid transparent;
|
238
|
-
border-right: 5px solid transparent;
|
239
|
-
border-left: 5px solid transparent;
|
240
|
-
position: absolute;
|
241
|
-
margin-left: -5px;
|
242
|
-
bottom: -15px;
|
243
|
-
height: 5px;
|
244
|
-
width: 0px;
|
245
|
-
left: 50%;
|
246
|
-
}
|
247
|
-
}
|
248
|
-
|
249
|
-
.url {
|
250
|
-
-webkit-font-smoothing: antialiased;
|
251
|
-
}
|
@@ -1,60 +0,0 @@
|
|
1
|
-
@font-face {
|
2
|
-
font-family: 'icomoon';
|
3
|
-
src:font-url('icomoon.eot');
|
4
|
-
src:font-url('icomoon.eot?#iefix') format('embedded-opentype'),
|
5
|
-
font-url('icomoon.woff') format('woff'),
|
6
|
-
font-url('icomoon.ttf') format('truetype'),
|
7
|
-
font-url('icomoon.svg#icomoon') format('svg');
|
8
|
-
font-weight: normal;
|
9
|
-
font-style: normal;
|
10
|
-
}
|
11
|
-
|
12
|
-
/* Use the following CSS code if you want to use data attributes for inserting your icons */
|
13
|
-
[data-icon]:before {
|
14
|
-
font-family: 'icomoon';
|
15
|
-
content: attr(data-icon);
|
16
|
-
speak: none;
|
17
|
-
font-weight: normal;
|
18
|
-
font-variant: normal;
|
19
|
-
text-transform: none;
|
20
|
-
line-height: 1;
|
21
|
-
-webkit-font-smoothing: antialiased;
|
22
|
-
}
|
23
|
-
|
24
|
-
/* Use the following CSS code if you want to have a class per icon */
|
25
|
-
/*
|
26
|
-
Instead of a list of all class selectors,
|
27
|
-
you can use the generic selector below, but it's slower:
|
28
|
-
[class*="icon-"] {
|
29
|
-
*/
|
30
|
-
.icon-expand, .icon-target, .icon-contrast, .icon-floppy, .icon-contract, .icon-link, .icon-download-alt {
|
31
|
-
font-family: 'icomoon';
|
32
|
-
speak: none;
|
33
|
-
font-style: normal;
|
34
|
-
font-weight: normal;
|
35
|
-
font-variant: normal;
|
36
|
-
text-transform: none;
|
37
|
-
line-height: 1;
|
38
|
-
-webkit-font-smoothing: antialiased;
|
39
|
-
}
|
40
|
-
.icon-expand:before {
|
41
|
-
content: "\e000";
|
42
|
-
}
|
43
|
-
.icon-target:before {
|
44
|
-
content: "\e001";
|
45
|
-
}
|
46
|
-
.icon-contrast:before {
|
47
|
-
content: "\e002";
|
48
|
-
}
|
49
|
-
.icon-floppy:before {
|
50
|
-
content: "\e003";
|
51
|
-
}
|
52
|
-
.icon-contract:before {
|
53
|
-
content: "\e004";
|
54
|
-
}
|
55
|
-
.icon-link:before {
|
56
|
-
content: "\e005";
|
57
|
-
}
|
58
|
-
.icon-download-alt:before {
|
59
|
-
content: "\e006";
|
60
|
-
}
|
@@ -1,8 +0,0 @@
|
|
1
|
-
/*
|
2
|
-
* This is a manifest file that'll automatically include all the stylesheets available in this directory
|
3
|
-
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
|
4
|
-
* the top of the compiled file, but it's generally better to create a new file per style scope.
|
5
|
-
*= require_self
|
6
|
-
*= require phrasing
|
7
|
-
*= require_tree .
|
8
|
-
*/
|