tolk 4.3.0 → 5.0.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 16e13f007c1439906c3231b8f392450bb0a5537b6ef7b9f04b6ecc33475131b2
4
- data.tar.gz: 90014d2dde967571b20d112584ff2bb5b69e4e75f0ba45eff8e24cbe9746e461
3
+ metadata.gz: 8b8cd3042672cf5c333aa051cc3aefc160fcf56141075f0a56c204b7f088e6b4
4
+ data.tar.gz: b98780220c87582a624f584905db23c96c5a08f1fe6f0fee45ceba7ac96ec6f6
5
5
  SHA512:
6
- metadata.gz: f66f126b8023ed812ee3f1a5e8a28a9f7392a77b7cf6af9b5a58b2e1e3e87081a1eef484939833424acdb18e2bf0992d8214be56fbb199f8f536b259cd966704
7
- data.tar.gz: 66d9c79259a92f84cdbcea223142ebce7ae445ceb350119c751a6e9070ea1610baf3e5d611b9b8d0d3fcb4207a61975a9553545edda2169edf9f0effd1531aeb
6
+ metadata.gz: f96399cba1ab5fe4925f52d086defbd26eb4280fd89d1600cf9731f25103c8f5ce893b79857269dfa8521d00d5b627d38ed11169e0ac267bd031f4d90b5f940e
7
+ data.tar.gz: 202ef9c6ce0612f6502aed0e6f80a032b18e6e9199e0a833128d571d80d0f95ff3d783a5169c0302e9029e592aba6745746bdb62432e042888603b20019e635c
@@ -0,0 +1,490 @@
1
+ /**
2
+ * Defaults
3
+ **/
4
+ *,
5
+ *:before,
6
+ *:after {
7
+ box-sizing: border-box;
8
+ }
9
+
10
+ strong {
11
+ font-weight: bold;
12
+ }
13
+
14
+ em {
15
+ font-style: italic;
16
+ }
17
+
18
+ a {
19
+ color: #888;
20
+ }
21
+
22
+ a:hover {
23
+ color: #000;
24
+ }
25
+
26
+ /**
27
+ * Variables
28
+ **/
29
+ :root {
30
+ --primary-color-h: 192.8;
31
+ --primary-color-s: 63%;
32
+ --primary-color-l: 49.8%;
33
+ --primary-color-hsl: var(--primary-color-h), var(--primary-color-s),
34
+ var(--primary-color-l);
35
+ --primary-color: hsl(var(--primary-color-hsl));
36
+ --primary-color-dark-2: hsl(
37
+ var(--primary-color-h),
38
+ var(--primary-color-s),
39
+ calc(var(--primary-color-l) * 0.9)
40
+ );
41
+ --primary-color-dark-4: hsl(
42
+ var(--primary-color-h),
43
+ var(--primary-color-s),
44
+ calc(var(--primary-color-l) * 0.9)
45
+ );
46
+ --primary-color-dark-8: hsl(
47
+ var(--primary-color-h),
48
+ var(--primary-color-s),
49
+ calc(var(--primary-color-l) * 0.9)
50
+ );
51
+ --font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
52
+ Roboto, Arial, sans-serif;
53
+ }
54
+
55
+ /**
56
+ * Some generic components
57
+ **/
58
+ .btn {
59
+ font-family: var(--font-family);
60
+ display: inline-block;
61
+ padding: 0.25em 0.5em;
62
+ border-radius: 2px;
63
+ border: none;
64
+ background-image: linear-gradient(
65
+ var(--primary-color),
66
+ var(--primary-color-dark-4)
67
+ );
68
+ color: #fff;
69
+ font-size: 1em;
70
+ cursor: pointer;
71
+ }
72
+ .btn:hover,
73
+ .btn:focus {
74
+ background-image: linear-gradient(
75
+ var(--primary-color-dark-2),
76
+ var(--primary-color-dark-8)
77
+ );
78
+ }
79
+ .btn:focus {
80
+ box-shadow: 0 0 0 3px
81
+ hsla(
82
+ var(--primary-color-h),
83
+ var(--primary-color-s),
84
+ var(--primary-color-l),
85
+ 0.5
86
+ );
87
+ }
88
+ .btn.btn--large {
89
+ font-size: 1.25em;
90
+ padding: 0.5em 0.75em;
91
+ }
92
+
93
+ select,
94
+ input {
95
+ font-family: var(--font-family);
96
+ font-size: 1em;
97
+ }
98
+
99
+ input[type="text"],
100
+ textarea {
101
+ font-family: var(--font-family);
102
+ font-size: 1em;
103
+ padding: 0.2em 0.25em;
104
+ border-radius: 2px;
105
+ border: 1px solid #ccc;
106
+ border-top: 1px solid #bbb;
107
+ }
108
+ input[type="text"]:focus,
109
+ textarea:focus {
110
+ box-shadow: 0 0 0 2px
111
+ hsla(
112
+ var(--primary-color-h),
113
+ var(--primary-color-s),
114
+ var(--primary-color-l),
115
+ 0.5
116
+ );
117
+ }
118
+
119
+ textarea {
120
+ line-height: 1.4em;
121
+ }
122
+
123
+ /**
124
+ * Base layout
125
+ **/
126
+ body {
127
+ font-family: var(--font-family);
128
+ background: #e9e9e9;
129
+ color: #333;
130
+ margin: 0;
131
+ padding: 0;
132
+ font-size: 14px;
133
+ line-height: 1.5em;
134
+ text-align: left;
135
+ }
136
+
137
+ .container {
138
+ background: #fff;
139
+ margin: 1rem;
140
+ border-radius: 3px;
141
+ overflow: hidden;
142
+ box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);
143
+ }
144
+
145
+ /**
146
+ * Header
147
+ **/
148
+ header {
149
+ background: #111;
150
+ color: #999;
151
+ padding: 1rem 1.5rem;
152
+ display: flex;
153
+ justify-content: space-between;
154
+ align-items: center;
155
+ }
156
+ header h1 {
157
+ font-size: 1.5em;
158
+ }
159
+ header a {
160
+ color: var(--primary-color);
161
+ text-decoration: none;
162
+ }
163
+ header a:hover,
164
+ header a:focus {
165
+ color: var(--primary-color);
166
+ text-decoration: underline;
167
+ }
168
+ header a:first-child {
169
+ font-weight: bold;
170
+ }
171
+
172
+ /**
173
+ * Navigation
174
+ **/
175
+ nav {
176
+ background: #333;
177
+ display: flex;
178
+ }
179
+ nav a {
180
+ color: #ccc;
181
+ padding: 1rem 1.5rem;
182
+ text-decoration: none;
183
+ }
184
+ nav a:hover,
185
+ nav a:focus {
186
+ background: #222;
187
+ color: #fff;
188
+ }
189
+ nav a.current {
190
+ background: var(--primary-color);
191
+ color: #fff;
192
+ }
193
+ nav .nav__badge {
194
+ background-color: rgba(0, 0, 0, 0.3);
195
+ padding: 0.25em 0.6em;
196
+ border-radius: 1em;
197
+ font-size: 0.75em;
198
+ color: #fff;
199
+ margin-left: 0.25em;
200
+ }
201
+
202
+ /**
203
+ * Page title
204
+ **/
205
+ h2 {
206
+ padding: 1rem 1.5rem;
207
+ font-size: 18px;
208
+ background-color: #f9f9f9;
209
+ color: var(--primary-color);
210
+ border-bottom: 1px solid #eee;
211
+ }
212
+ h2 small {
213
+ font-size: 0.75em;
214
+ color: #999;
215
+ }
216
+
217
+ /**
218
+ * Notice
219
+ **/
220
+ .notice {
221
+ background: #ffc;
222
+ color: #666600;
223
+ font-size: 1em;
224
+ padding: 1rem 1.5rem;
225
+ border-bottom: 1px solid #ffff66;
226
+ }
227
+ .notice a {
228
+ color: #666600;
229
+ }
230
+ .notice a:hover,
231
+ .notice a:focus {
232
+ color: #333300;
233
+ }
234
+
235
+ /**
236
+ * Search form
237
+ **/
238
+ .search {
239
+ padding: 1rem 1.5rem;
240
+ background-color: #f9f9f9;
241
+ border-bottom: 1px solid #eee;
242
+ line-height: 2em;
243
+ }
244
+
245
+ /**
246
+ * Empty state & blankslate
247
+ **/
248
+ .empty-state {
249
+ padding: 3rem 1.5rem;
250
+ text-align: center;
251
+ }
252
+ .empty-state svg {
253
+ max-height: 200px;
254
+ margin: 2em 0;
255
+ }
256
+ .empty-state .empty-state__msg {
257
+ font-size: 1.25em;
258
+ color: #aaa;
259
+ }
260
+ .empty-state form {
261
+ margin-top: 1em;
262
+ }
263
+
264
+ /**
265
+ * Locales list (locales index)
266
+ **/
267
+ ul.locales-list {
268
+ display: grid;
269
+ padding: 1.5rem 1.5rem;
270
+ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
271
+ grid-column-gap: 1em;
272
+ grid-row-gap: 1em;
273
+ }
274
+ ul.locales-list a {
275
+ text-decoration: none;
276
+ color: #2fadcf;
277
+ padding: 1.5em 1em;
278
+ height: 100%;
279
+ display: block;
280
+ text-align: center;
281
+ border: 1px solid #eee;
282
+ border-radius: 2px;
283
+ }
284
+ ul.locales-list a span {
285
+ font-size: 1.15em;
286
+ }
287
+ ul.locales-list a em.missing_translations,
288
+ ul.locales-list a em.updated_translations {
289
+ font-style: normal;
290
+ background: #ff3860;
291
+ color: #fff;
292
+ font-size: 9px;
293
+ padding: 0.25em 0.6em;
294
+ border-radius: 1em;
295
+ line-height: 1em;
296
+ vertical-align: top;
297
+ }
298
+ ul.locales-list a em.updated_translations {
299
+ background: #ffe857;
300
+ color: rgba(0, 0, 0, 0.7);
301
+ }
302
+ ul.locales-list a:hover,
303
+ ul.locales-list a:focus {
304
+ background-color: #f9f9f9;
305
+ }
306
+ ul.locales-list a:hover span,
307
+ ul.locales-list a:focus span {
308
+ text-decoration: underline;
309
+ }
310
+ ul.locales-list form {
311
+ border: 1px dashed
312
+ hsla(
313
+ var(--primary-color-h),
314
+ var(--primary-color-s),
315
+ var(--primary-color-l),
316
+ 0.5
317
+ );
318
+ background-color: hsla(
319
+ var(--primary-color-h),
320
+ var(--primary-color-s),
321
+ var(--primary-color-l),
322
+ 0.025
323
+ );
324
+ height: 100%;
325
+ display: grid;
326
+ justify-items: center;
327
+ align-items: center;
328
+ padding: 1.5em 1em;
329
+ }
330
+
331
+ /**
332
+ * Translations form
333
+ **/
334
+ div.translations table {
335
+ width: 100%;
336
+ text-align: left;
337
+ }
338
+
339
+ div.translations td,
340
+ div.translations th {
341
+ padding: 1rem 1.5rem;
342
+ vertical-align: top;
343
+ width: 50%;
344
+ }
345
+
346
+ div.translations td {
347
+ color: #222;
348
+ }
349
+
350
+ div.translations th {
351
+ font-weight: bold;
352
+ text-transform: uppercase;
353
+ color: #aaa;
354
+ border-bottom: 1px solid #ddd;
355
+ padding: 1.5rem 1.5rem 0.25rem 1.5rem;
356
+ }
357
+
358
+ div.translations th.actions,
359
+ div.translations td.actions {
360
+ width: 50px;
361
+ text-align: center;
362
+ padding: 12px 0.5rem;
363
+ }
364
+
365
+ div.translations tbody tr:nth-child(2n) td {
366
+ background-color: #fbfbfb;
367
+ }
368
+
369
+ div.translations tbody tr.active td:first-child {
370
+ box-shadow: 3px 0px 0px -1px var(--primary-color) inset;
371
+ }
372
+
373
+ div.translations textarea.locale {
374
+ width: 100%;
375
+ min-height: 42px;
376
+ }
377
+
378
+ div.translations .updated,
379
+ div.translations .previous {
380
+ color: #999;
381
+ border-left: 1px solid #ccc;
382
+ margin-bottom: 1.5em;
383
+ padding: 0 0 0 0.75em;
384
+ }
385
+ div.translations .updated .key,
386
+ div.translations .previous .key {
387
+ margin: 0 0 0.5em 0;
388
+ line-height: 13px;
389
+ }
390
+ div.translations .updated .key em,
391
+ div.translations .previous .key em {
392
+ color: #999;
393
+ text-transform: uppercase;
394
+ font-size: 9px;
395
+ font-style: normal;
396
+ margin-bottom: 0.5em;
397
+ border: 1px solid #ccc;
398
+ padding: 2px;
399
+ border-radius: 2px;
400
+ }
401
+
402
+ div.translations .updated {
403
+ color: #222;
404
+ border-color: orange;
405
+ }
406
+ div.translations .updated .key em {
407
+ color: orange;
408
+ border-color: orange;
409
+ }
410
+
411
+ div.translations .translation-key {
412
+ color: #aaa;
413
+ font-size: 10px;
414
+ display: block;
415
+ }
416
+
417
+ div.translations .original textarea {
418
+ display: none;
419
+ }
420
+
421
+ div.translations .original .interpolation,
422
+ div.translations .original .carriage_return,
423
+ div.translations .original .boolean {
424
+ color: var(--primary-color);
425
+ font-family: Courier, monospace;
426
+ font-weight: bold;
427
+ cursor: help;
428
+ }
429
+
430
+ div.translations .original .carriage_return:before {
431
+ content: "¶";
432
+ }
433
+
434
+ div.translations .actions a {
435
+ font-weight: bold;
436
+ text-decoration: none;
437
+ }
438
+
439
+ div.translations .actions .warning {
440
+ font-weight: bold;
441
+ font-size: 1.35em;
442
+ color: orange;
443
+ padding: 2px 4px;
444
+ display: none;
445
+ cursor: help;
446
+ }
447
+
448
+ div.translations .highlight {
449
+ background-color: yellow;
450
+ }
451
+
452
+ div.translations .table_submit {
453
+ background: #f5f5f5;
454
+ border-top: 1px solid #e0e0e0;
455
+ padding: 1.5rem;
456
+ display: flex;
457
+ justify-content: space-between;
458
+ align-items: center;
459
+ }
460
+
461
+ /**
462
+ * Pagination
463
+ **/
464
+ .pagination {
465
+ color: #777;
466
+ background: #f5f5f5;
467
+ }
468
+ .pagination a,
469
+ .pagination span,
470
+ .pagination em {
471
+ font-style: normal;
472
+ padding: 0.25em 0.75em;
473
+ text-decoration: none;
474
+ border: 1px solid #ddd;
475
+ border-radius: 2px;
476
+ display: inline-block;
477
+ background-color: #fff;
478
+ }
479
+ .pagination a.disabled,
480
+ .pagination span.disabled,
481
+ .pagination em.disabled {
482
+ opacity: 0.5;
483
+ }
484
+ .pagination a:hover,
485
+ .pagination a:focus,
486
+ .pagination em.current {
487
+ background-color: var(--primary-color);
488
+ border-color: var(--primary-color);
489
+ color: #fff;
490
+ }
data/lib/tolk/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Tolk
2
- VERSION = "4.3.0"
2
+ VERSION = "5.0.0"
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: tolk
3
3
  version: !ruby/object:Gem::Version
4
- version: 4.3.0
4
+ version: 5.0.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - David Heinemeier Hansson
@@ -12,7 +12,7 @@ authors:
12
12
  autorequire:
13
13
  bindir: bin
14
14
  cert_chain: []
15
- date: 2022-04-06 00:00:00.000000000 Z
15
+ date: 2023-01-13 00:00:00.000000000 Z
16
16
  dependencies:
17
17
  - !ruby/object:Gem::Dependency
18
18
  name: rails
@@ -20,14 +20,14 @@ dependencies:
20
20
  requirements:
21
21
  - - ">="
22
22
  - !ruby/object:Gem::Version
23
- version: '5.0'
23
+ version: '6.0'
24
24
  type: :runtime
25
25
  prerelease: false
26
26
  version_requirements: !ruby/object:Gem::Requirement
27
27
  requirements:
28
28
  - - ">="
29
29
  - !ruby/object:Gem::Version
30
- version: '5.0'
30
+ version: '6.0'
31
31
  - !ruby/object:Gem::Dependency
32
32
  name: sprockets-rails
33
33
  requirement: !ruby/object:Gem::Requirement
@@ -56,20 +56,6 @@ dependencies:
56
56
  - - ">="
57
57
  - !ruby/object:Gem::Version
58
58
  version: 0.8.6
59
- - !ruby/object:Gem::Dependency
60
- name: sassc
61
- requirement: !ruby/object:Gem::Requirement
62
- requirements:
63
- - - ">="
64
- - !ruby/object:Gem::Version
65
- version: '0'
66
- type: :runtime
67
- prerelease: false
68
- version_requirements: !ruby/object:Gem::Requirement
69
- requirements:
70
- - - ">="
71
- - !ruby/object:Gem::Version
72
- version: '0'
73
59
  - !ruby/object:Gem::Dependency
74
60
  name: sqlite3
75
61
  requirement: !ruby/object:Gem::Requirement
@@ -190,7 +176,7 @@ files:
190
176
  - app/assets/javascripts/tolk/libraries.js
191
177
  - app/assets/stylesheets/tolk/application.css
192
178
  - app/assets/stylesheets/tolk/reset.css
193
- - app/assets/stylesheets/tolk/screen.scss
179
+ - app/assets/stylesheets/tolk/screen.css
194
180
  - app/controllers/tolk/application_controller.rb
195
181
  - app/controllers/tolk/locales_controller.rb
196
182
  - app/controllers/tolk/searches_controller.rb
@@ -246,7 +232,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
246
232
  - !ruby/object:Gem::Version
247
233
  version: '0'
248
234
  requirements: []
249
- rubygems_version: 3.3.10
235
+ rubygems_version: 3.4.3
250
236
  signing_key:
251
237
  specification_version: 4
252
238
  summary: Rails engine providing web interface for managing i18n yaml files
@@ -1,432 +0,0 @@
1
- /**
2
- * Defaults
3
- **/
4
-
5
- *, *:before, *:after {
6
- -webkit-box-sizing: border-box;
7
- -moz-box-sizing: border-box;
8
- box-sizing: border-box;
9
- }
10
-
11
- strong {font-weight: bold;}
12
- em {font-style: italic;}
13
- a {color: #888;}
14
- a:hover {color: #000;}
15
-
16
- /**
17
- * Variables
18
- **/
19
- $primary_color: #2fadcf;
20
- $font_family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
21
-
22
- /**
23
- * Some generic components
24
- **/
25
- .btn{
26
- font-family: $font_family;
27
- display: inline-block;
28
-
29
- padding: .25em .5em;
30
- border-radius: 2px;
31
-
32
- border: none;
33
- background-image: linear-gradient($primary_color, darken($primary_color, 4%));
34
- color: #fff;
35
- font-size: 1em;
36
-
37
- cursor: pointer;
38
- &:hover,
39
- &:focus{
40
- background-image: linear-gradient(darken($primary_color, 2%), darken($primary_color, 8%));
41
- }
42
- &:focus{
43
- box-shadow: 0 0 0 3px rgba($primary_color, .5);
44
- }
45
-
46
- &.btn--large{
47
- font-size: 1.25em;
48
- padding: .5em .75em;
49
- }
50
- }
51
-
52
- select, input{
53
- font-family: $font_family;
54
- font-size: 1em;
55
- }
56
- input[type='text'],
57
- textarea{
58
- font-family: $font_family;
59
- font-size: 1em;
60
- padding: .2em .25em;
61
- border-radius: 2px;
62
- border: 1px solid #ccc;
63
- border-top: 1px solid #bbb;
64
- &:focus{
65
- box-shadow: 0 0 0 2px rgba($primary_color, .5);
66
- }
67
- }
68
- textarea{
69
- line-height: 1.4em;
70
- }
71
-
72
- /**
73
- * Base layout
74
- **/
75
- body {
76
- font-family: $font_family;
77
- background: #e9e9e9;
78
- color: #333;
79
- margin: 0;
80
- padding: 0;
81
- font-size: 14px;
82
- line-height: 1.5em;
83
- text-align: left;
84
- }
85
-
86
- .container {
87
- background: #fff;
88
- margin: 1rem;
89
- border-radius: 3px;
90
- overflow: hidden;
91
- box-shadow: 0 3px 3px rgba(#000, .1);
92
- }
93
-
94
- /**
95
- * Header
96
- **/
97
- header{
98
- background: #111;
99
- color: #999;
100
- padding: 1rem 1.5rem;
101
-
102
- display: flex;
103
- justify-content: space-between;
104
- align-items: center;
105
-
106
- h1{
107
- font-size: 1.5em;
108
- }
109
- a{
110
- color: $primary_color;
111
- text-decoration: none;
112
- &:hover,
113
- &:focus{
114
- color: $primary_color;
115
- text-decoration: underline;
116
- }
117
- &:first-child{
118
- font-weight: bold;
119
- }
120
- }
121
- }
122
-
123
- /**
124
- * Navigation
125
- **/
126
- nav{
127
- background: #333;
128
- display: flex;
129
- a{
130
- color: #ccc;
131
- padding: 1rem 1.5rem;
132
- text-decoration: none;
133
- &:hover,
134
- &:focus{
135
- background: #222;
136
- color: #fff;
137
- }
138
- &.current{
139
- background: $primary_color;
140
- color: #fff;
141
- }
142
- }
143
- .nav__badge{
144
- background-color: rgba(#000, .3);
145
- padding: .25em .6em;
146
- border-radius: 1em;
147
- font-size: .75em;
148
- color: #fff;
149
- margin-left: .25em;
150
- }
151
- }
152
-
153
- /**
154
- * Page title
155
- **/
156
- h2{
157
- padding: 1rem 1.5rem;
158
- font-size: 18px;
159
- background-color: #f9f9f9;
160
- color: $primary_color;
161
- border-bottom: 1px solid #eee;
162
- small{
163
- font-size: .75em;
164
- color: #999;
165
- }
166
- }
167
-
168
- /**
169
- * Notice
170
- **/
171
- .notice {
172
- background: #ffc;
173
- color: darken(#ffc, 70%);
174
- font-size: 1em;
175
- padding: 1rem 1.5rem;
176
- border-bottom: 1px solid darken(#ffc, 30%);
177
- a{
178
- color: darken(#ffc, 70%);
179
- &:hover,
180
- &:focus{
181
- color: darken(#ffc, 90%);
182
- }
183
- }
184
- }
185
-
186
- /**
187
- * Search form
188
- **/
189
- .search{
190
- padding: 1rem 1.5rem;
191
- background-color: #f9f9f9;
192
- border-bottom: 1px solid #eee;
193
- line-height: 2em;
194
- }
195
-
196
-
197
- /**
198
- * Empty state & blankslate
199
- **/
200
- .empty-state{
201
- padding: 3rem 1.5rem;
202
- text-align: center;
203
- svg{
204
- max-height: 200px;
205
- margin: 2em 0;
206
- }
207
- .empty-state__msg{
208
- font-size: 1.25em;
209
- color: #aaa;
210
- }
211
- form{
212
- margin-top: 1em;
213
- }
214
- }
215
-
216
-
217
- /**
218
- * Locales list (locales index)
219
- **/
220
- ul.locales-list{
221
- display: grid;
222
- padding: 1.5rem 1.5rem;
223
- grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
224
- grid-column-gap: 1em;
225
- grid-row-gap: 1em;
226
-
227
- a{
228
- text-decoration: none;
229
- color: #2fadcf;
230
- padding: 1.5em 1em;
231
-
232
- height: 100%;
233
- display: block;
234
- text-align: center;
235
-
236
- border: 1px solid #eee;
237
- border-radius: 2px;
238
- span{
239
- font-size: 1.15em;
240
- }
241
- em.missing_translations,
242
- em.updated_translations{
243
- font-style: normal;
244
- background: #ff3860;
245
- color: #fff;
246
- font-size: 9px;
247
- padding: .25em .6em;
248
- border-radius: 1em;
249
- line-height: 1em;
250
- vertical-align: top;
251
- }
252
- em.updated_translations{
253
- background: #ffe857;
254
- color: rgba(#000,.7);
255
- }
256
- &:hover,
257
- &:focus{
258
- background-color: #f9f9f9;
259
- span{
260
- text-decoration: underline;
261
- }
262
- }
263
- }
264
-
265
- form{
266
- border: 1px dashed rgba($primary_color, .5);
267
- background-color: rgba($primary_color, .025);
268
- height: 100%;
269
- display: grid;
270
- justify-items: center;
271
- align-items: center;
272
- padding: 1.5em 1em;
273
- }
274
- }
275
-
276
- /**
277
- * Translations form
278
- **/
279
- div.translations {
280
- table {
281
- width: 100%;
282
- text-align: left;
283
- }
284
-
285
- td, th{
286
- padding: 1rem 1.5rem;
287
- vertical-align: top;
288
- width: 50%;
289
- }
290
- td{
291
- color: #222;
292
- }
293
- th{
294
- font-weight: bold;
295
- text-transform: uppercase;
296
- color: #aaa;
297
- border-bottom: 1px solid #ddd;
298
- padding: 1.5rem 1.5rem .25rem 1.5rem;
299
- }
300
-
301
- th.actions,
302
- td.actions{
303
- width: 50px;
304
- text-align: center;
305
- padding: 12px .5rem;
306
- }
307
-
308
- tbody tr:nth-child(2n) td{
309
- background-color: #fbfbfb;
310
- }
311
-
312
- tbody tr.active td:first-child{
313
- box-shadow: 3px 0px 0px -1px $primary_color inset;
314
- }
315
-
316
- textarea.locale {
317
- width: 100%;
318
- min-height: 42px;
319
- }
320
-
321
- .updated,
322
- .previous{
323
- color: #999;
324
- border-left: 1px solid #ccc;
325
- margin-bottom: 1.5em;
326
- padding: 0 0 0 .75em;
327
- .key{
328
- margin: 0 0 .5em 0;
329
- line-height: 13px;
330
- em{
331
- color: #999;
332
- text-transform: uppercase;
333
- font-size: 9px;
334
- font-style: normal;
335
- margin-bottom: .5em;
336
- border: 1px solid #ccc;
337
- padding: 2px;
338
- border-radius: 2px;
339
- }
340
- }
341
- }
342
- .updated{
343
- color: #222;
344
- border-color: orange;
345
- .key {
346
- em{
347
- color: orange;
348
- border-color: orange;
349
- }
350
- }
351
- }
352
-
353
- .translation-key{
354
- color: #aaa;
355
- font-size: 10px;
356
- display: block;
357
- }
358
-
359
- .original{
360
- textarea{
361
- display: none;
362
- }
363
-
364
- .interpolation,
365
- .carriage_return,
366
- .boolean{
367
- color: $primary_color;
368
- font-family: Courier, monospace;
369
- font-weight: bold;
370
- cursor: help;
371
- }
372
- .carriage_return:before{
373
- content: "¶";
374
- }
375
- }
376
-
377
- .actions a{
378
- font-weight: bold;
379
- text-decoration: none;
380
- }
381
-
382
- .actions .warning{
383
- font-weight: bold;
384
- font-size: 1.35em;
385
- color: orange;
386
- padding: 2px 4px;
387
- display: none;
388
- cursor: help;
389
- }
390
-
391
- .highlight{
392
- background-color: yellow;
393
- }
394
-
395
- .table_submit{
396
- background: #f5f5f5;
397
- border-top: 1px solid #e0e0e0 ;
398
- padding: 1.5rem;
399
- display: flex;
400
- justify-content: space-between;
401
- align-items: center;
402
- }
403
- }
404
-
405
- /**
406
- * Pagination
407
- **/
408
- .pagination {
409
- color: #777;
410
- background: #f5f5f5;
411
-
412
- a, span, em{
413
- font-style: normal;
414
- padding: .25em .75em;
415
- text-decoration: none;
416
- border: 1px solid #ddd;
417
- border-radius: 2px;
418
- display: inline-block;
419
- background-color: #fff;
420
- &.disabled {
421
- opacity: .5;
422
- }
423
- }
424
-
425
- a:hover,
426
- a:focus,
427
- em.current {
428
- background-color: $primary_color;
429
- border-color: $primary_color;
430
- color: #fff;
431
- }
432
- }