graphiql-rails 1.4.0 → 1.4.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,5 +1,5 @@
1
1
  /*
2
- = require ./graphiql-0.8.0
2
+ = require ./graphiql-0.8.1
3
3
  */
4
4
 
5
5
  html, body, #graphiql-container {
@@ -1,8 +1,10 @@
1
1
  .graphiql-container {
2
2
  color: #141823;
3
- display: -webkit-flex;
3
+ display: -webkit-box;
4
4
  display: -ms-flexbox;
5
- -webkit-flex-direction: row;
5
+ display: flex;
6
+ -webkit-box-orient: horizontal;
7
+ -webkit-box-direction: normal;
6
8
  -ms-flex-direction: row;
7
9
  flex-direction: row;
8
10
  font-family:
@@ -26,13 +28,14 @@
26
28
  }
27
29
 
28
30
  .graphiql-container .editorWrap {
29
- display: -webkit-flex;
30
- display: -ms-flexbox;
31
+ display: -webkit-box;
31
32
  display: -ms-flexbox;
32
- -webkit-flex-direction: column;
33
+ display: flex;
34
+ -webkit-box-orient: vertical;
35
+ -webkit-box-direction: normal;
33
36
  -ms-flex-direction: column;
34
37
  flex-direction: column;
35
- -webkit-flex: 1;
38
+ -webkit-box-flex: 1;
36
39
  -ms-flex: 1;
37
40
  flex: 1;
38
41
  }
@@ -47,32 +50,37 @@
47
50
  }
48
51
 
49
52
  .graphiql-container .topBarWrap {
50
- display: -webkit-flex;
53
+ display: -webkit-box;
51
54
  display: -ms-flexbox;
52
- -webkit-flex-direction: row;
55
+ display: flex;
56
+ -webkit-box-orient: horizontal;
57
+ -webkit-box-direction: normal;
53
58
  -ms-flex-direction: row;
54
59
  flex-direction: row;
55
60
  }
56
61
 
57
62
  .graphiql-container .topBar {
58
- -webkit-align-items: center;
59
- -ms-align-items: center;
63
+ -webkit-box-align: center;
64
+ -ms-flex-align: center;
60
65
  align-items: center;
61
66
  background: -webkit-linear-gradient(#f7f7f7, #e2e2e2);
62
- background: linear-gradient(#f7f7f7, #e2e2e2);
67
+ background: linear-gradient(#f7f7f7, #e2e2e2);
63
68
  border-bottom: 1px solid #d0d0d0;
64
69
  cursor: default;
65
- display: -webkit-flex;
70
+ display: -webkit-box;
66
71
  display: -ms-flexbox;
67
- height: 34px;
68
- padding: 7px 14px 6px;
69
- -webkit-flex: 1;
70
- -ms-flex: 1;
71
- flex: 1;
72
- -webkit-flex-direction: row;
72
+ display: flex;
73
+ -webkit-box-orient: horizontal;
74
+ -webkit-box-direction: normal;
73
75
  -ms-flex-direction: row;
74
76
  flex-direction: row;
77
+ -webkit-box-flex: 1;
78
+ -ms-flex: 1;
79
+ flex: 1;
80
+ height: 34px;
81
+ padding: 7px 14px 6px;
75
82
  -webkit-user-select: none;
83
+ -moz-user-select: none;
76
84
  -ms-user-select: none;
77
85
  user-select: none;
78
86
  }
@@ -83,7 +91,7 @@
83
91
 
84
92
  .graphiql-container .docExplorerShow {
85
93
  background: -webkit-linear-gradient(#f7f7f7, #e2e2e2);
86
- background: linear-gradient(#f7f7f7, #e2e2e2);
94
+ background: linear-gradient(#f7f7f7, #e2e2e2);
87
95
  border-bottom: 1px solid #d0d0d0;
88
96
  border-left: 1px solid rgba(0, 0, 0, 0.2);
89
97
  border-right: none;
@@ -91,8 +99,8 @@
91
99
  color: #3B5998;
92
100
  cursor: pointer;
93
101
  font-size: 14px;
94
- outline: 0;
95
102
  margin: 0;
103
+ outline: 0;
96
104
  padding: 2px 20px 0 18px;
97
105
  }
98
106
 
@@ -105,44 +113,49 @@
105
113
  margin: 0 3px -1px 0;
106
114
  position: relative;
107
115
  -webkit-transform: rotate(-45deg);
108
- -ms-transform: rotate(-45deg);
109
116
  transform: rotate(-45deg);
110
117
  width: 9px;
111
118
  }
112
119
 
113
120
  .graphiql-container .editorBar {
114
- display: -webkit-flex;
121
+ display: -webkit-box;
115
122
  display: -ms-flexbox;
116
- -webkit-flex: 1;
117
- -ms-flex: 1;
118
- flex: 1;
119
- -webkit-flex-direction: row;
123
+ display: flex;
124
+ -webkit-box-orient: horizontal;
125
+ -webkit-box-direction: normal;
120
126
  -ms-flex-direction: row;
121
127
  flex-direction: row;
128
+ -webkit-box-flex: 1;
129
+ -ms-flex: 1;
130
+ flex: 1;
122
131
  }
123
132
 
124
133
  .graphiql-container .queryWrap {
125
- display: -webkit-flex;
134
+ display: -webkit-box;
126
135
  display: -ms-flexbox;
127
- -webkit-flex: 1;
128
- -ms-flex: 1;
129
- flex: 1;
130
- -webkit-flex-direction: column;
136
+ display: flex;
137
+ -webkit-box-orient: vertical;
138
+ -webkit-box-direction: normal;
131
139
  -ms-flex-direction: column;
132
140
  flex-direction: column;
141
+ -webkit-box-flex: 1;
142
+ -ms-flex: 1;
143
+ flex: 1;
133
144
  }
134
145
 
135
146
  .graphiql-container .resultWrap {
136
147
  border-left: solid 1px #e0e0e0;
137
- display: -webkit-flex;
138
- display: flex;
139
- position: relative;
140
- -webkit-flex: 1;
141
- -ms-flex: 1;
142
- flex: 1;
143
- -webkit-flex-direction: column;
148
+ display: -webkit-box;
149
+ display: -ms-flexbox;
150
+ display: flex;
151
+ -webkit-box-orient: vertical;
152
+ -webkit-box-direction: normal;
144
153
  -ms-flex-direction: column;
145
154
  flex-direction: column;
155
+ -webkit-box-flex: 1;
156
+ -ms-flex: 1;
157
+ flex: 1;
158
+ position: relative;
146
159
  }
147
160
 
148
161
  .graphiql-container .docExplorerWrap {
@@ -170,20 +183,21 @@
170
183
  }
171
184
 
172
185
  .graphiql-container .query-editor {
173
- -webkit-flex: 1;
186
+ -webkit-box-flex: 1;
174
187
  -ms-flex: 1;
175
188
  flex: 1;
176
189
  position: relative;
177
190
  }
178
191
 
179
192
  .graphiql-container .variable-editor {
180
- display: -webkit-flex;
181
- display: -ms-flex;
182
- display: flex;
183
- height: 29px;
184
- -webkit-flex-direction: column;
193
+ display: -webkit-box;
194
+ display: -ms-flexbox;
195
+ display: flex;
196
+ -webkit-box-orient: vertical;
197
+ -webkit-box-direction: normal;
185
198
  -ms-flex-direction: column;
186
199
  flex-direction: column;
200
+ height: 29px;
187
201
  position: relative;
188
202
  }
189
203
 
@@ -199,24 +213,25 @@
199
213
  padding: 6px 0 8px 43px;
200
214
  text-transform: lowercase;
201
215
  -webkit-user-select: none;
216
+ -moz-user-select: none;
202
217
  -ms-user-select: none;
203
218
  user-select: none;
204
219
  }
205
220
 
206
221
  .graphiql-container .codemirrorWrap {
207
- -webkit-flex: 1;
222
+ -webkit-box-flex: 1;
208
223
  -ms-flex: 1;
209
224
  flex: 1;
210
- position: relative;
211
225
  height: 100%;
226
+ position: relative;
212
227
  }
213
228
 
214
229
  .graphiql-container .result-window {
215
- -webkit-flex: 1;
230
+ -webkit-box-flex: 1;
216
231
  -ms-flex: 1;
217
232
  flex: 1;
218
- position: relative;
219
233
  height: 100%;
234
+ position: relative;
220
235
  }
221
236
 
222
237
  .graphiql-container .footer {
@@ -256,11 +271,11 @@
256
271
  .graphiql-container .toolbar-button {
257
272
  background: #fdfdfd;
258
273
  background: -webkit-linear-gradient(#fbfbfb, #f8f8f8);
259
- background: linear-gradient(#fbfbfb, #f8f8f8);
260
- border-width: 0.5px;
261
- border-style: solid;
274
+ background: linear-gradient(#fbfbfb, #f8f8f8);
262
275
  border-color: #d3d3d3 #d0d0d0 #bababa;
263
276
  border-radius: 4px;
277
+ border-style: solid;
278
+ border-width: 0.5px;
264
279
  box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.13), inset 0 1px #fff;
265
280
  color: #444;
266
281
  cursor: pointer;
@@ -272,7 +287,7 @@
272
287
 
273
288
  .graphiql-container .toolbar-button:active {
274
289
  background: -webkit-linear-gradient(#ececec, #d8d8d8);
275
- background: linear-gradient(#ececec, #d8d8d8);
290
+ background: linear-gradient(#ececec, #d8d8d8);
276
291
  border-color: #cacaca #c9c9c9 #b0b0b0;
277
292
  box-shadow:
278
293
  0 1px 0 #fff,
@@ -282,21 +297,21 @@
282
297
 
283
298
  .graphiql-container .toolbar-button.error {
284
299
  background: -webkit-linear-gradient(#fdf3f3, #e6d6d7);
285
- background: linear-gradient(#fdf3f3, #e6d6d7);
300
+ background: linear-gradient(#fdf3f3, #e6d6d7);
286
301
  color: #b00;
287
302
  }
288
303
 
289
304
  .graphiql-container .execute-button-wrap {
290
- position: relative;
291
- margin: 0 14px 0 28px;
292
305
  height: 34px;
306
+ margin: 0 14px 0 28px;
307
+ position: relative;
293
308
  }
294
309
 
295
310
  .graphiql-container .execute-button {
296
311
  background: -webkit-linear-gradient(#fdfdfd, #d2d3d6);
297
- background: linear-gradient(#fdfdfd, #d2d3d6);
298
- border: 1px solid rgba(0,0,0,0.25);
312
+ background: linear-gradient(#fdfdfd, #d2d3d6);
299
313
  border-radius: 17px;
314
+ border: 1px solid rgba(0,0,0,0.25);
300
315
  box-shadow: 0 1px 0 #fff;
301
316
  cursor: pointer;
302
317
  fill: #444;
@@ -312,7 +327,7 @@
312
327
 
313
328
  .graphiql-container .execute-button:active {
314
329
  background: -webkit-linear-gradient(#e6e6e6, #c0c0c0);
315
- background: linear-gradient(#e6e6e6, #c0c0c0);
330
+ background: linear-gradient(#e6e6e6, #c0c0c0);
316
331
  box-shadow:
317
332
  0 1px 0 #fff,
318
333
  inset 0 0 2px rgba(0, 0, 0, 0.3),
@@ -337,10 +352,10 @@
337
352
  }
338
353
 
339
354
  .graphiql-container .execute-options li {
340
- padding: 2px 30px 4px 10px;
355
+ cursor: pointer;
341
356
  list-style: none;
342
357
  min-width: 100px;
343
- cursor: pointer;
358
+ padding: 2px 30px 4px 10px;
344
359
  }
345
360
 
346
361
  .graphiql-container .execute-options li.selected {
@@ -349,8 +364,7 @@
349
364
  }
350
365
 
351
366
  .graphiql-container .CodeMirror-scroll {
352
- -webkit-overflow-scrolling: touch;
353
- -ms-overflow-scrolling: touch;
367
+ overflow-scrolling: touch;
354
368
  }
355
369
 
356
370
  .graphiql-container .CodeMirror {
@@ -374,15 +388,14 @@
374
388
  }
375
389
 
376
390
  .CodeMirror-hint-information .content {
377
- -webkit-box-orient: vertical;
378
- -ms-box-orient: vertical;
379
- box-orient: vertical;
391
+ box-orient: vertical;
380
392
  color: #141823;
381
393
  display: -webkit-box;
394
+ display: -ms-flexbox;
395
+ display: flex;
382
396
  font-family: system, -apple-system, 'San Francisco', '.SFNSDisplay-Regular', 'Segoe UI', Segoe, 'Segoe WP', 'Helvetica Neue', helvetica, 'Lucida Grande', arial, sans-serif;
383
397
  font-size: 13px;
384
- -webkit-line-clamp: 3;
385
- line-clamp: 3;
398
+ line-clamp: 3;
386
399
  line-height: 16px;
387
400
  max-height: 48px;
388
401
  overflow: hidden;
@@ -406,12 +419,8 @@
406
419
 
407
420
  .autoInsertedLeaf.cm-property {
408
421
  -webkit-animation-duration: 6s;
409
- -moz-animation-duration: 6s;
410
- -ms-animation-duration: 6s;
411
422
  animation-duration: 6s;
412
423
  -webkit-animation-name: insertionFade;
413
- -moz-animation-name: insertionFade;
414
- -ms-animation-name: insertionFade;
415
424
  animation-name: insertionFade;
416
425
  border-bottom: 2px solid rgba(255, 255, 255, 0);
417
426
  border-radius: 2px;
@@ -419,18 +428,6 @@
419
428
  padding: 2px 4px 1px;
420
429
  }
421
430
 
422
- @-moz-keyframes insertionFade {
423
- from, to {
424
- background: rgba(255, 255, 255, 0);
425
- border-color: rgba(255, 255, 255, 0);
426
- }
427
-
428
- 15%, 85% {
429
- background: #fbffc9;
430
- border-color: #f0f3c0;
431
- }
432
- }
433
-
434
431
  @-webkit-keyframes insertionFade {
435
432
  from, to {
436
433
  background: rgba(255, 255, 255, 0);
@@ -457,8 +454,8 @@
457
454
 
458
455
  div.CodeMirror-lint-tooltip {
459
456
  background-color: white;
460
- border: 0;
461
457
  border-radius: 2px;
458
+ border: 0;
462
459
  color: #141823;
463
460
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
464
461
  font-family:
@@ -479,10 +476,7 @@ div.CodeMirror-lint-tooltip {
479
476
  opacity: 0;
480
477
  padding: 6px 10px;
481
478
  -webkit-transition: opacity 0.15s;
482
- -moz-transition: opacity 0.15s;
483
- -ms-transition: opacity 0.15s;
484
- -o-transition: opacity 0.15s;
485
- transition: opacity 0.15s;
479
+ transition: opacity 0.15s;
486
480
  }
487
481
 
488
482
  div.CodeMirror-lint-message-error, div.CodeMirror-lint-message-warning {
@@ -495,9 +489,7 @@ div.CodeMirror-lint-message-error, div.CodeMirror-lint-message-warning {
495
489
  border-radius: 4px;
496
490
  background: #08f;
497
491
  background: -webkit-linear-gradient(#43A8FF, #0F83E8);
498
- background: -moz-linear-gradient(#43A8FF, #0F83E8);
499
- background: -ms-linear-gradient(#43A8FF, #0F83E8);
500
- background: linear-gradient(#43A8FF, #0F83E8);
492
+ background: linear-gradient(#43A8FF, #0F83E8);
501
493
  box-shadow:
502
494
  0 1px 1px rgba(0, 0, 0, 0.2),
503
495
  inset 0 0 0 1px rgba(0, 0, 0, 0.1);
@@ -592,9 +584,9 @@ div.CodeMirror-lint-message-error, div.CodeMirror-lint-message-warning {
592
584
 
593
585
  .CodeMirror {
594
586
  /* Set height, width, borders, and global font properties here */
587
+ color: black;
595
588
  font-family: monospace;
596
589
  height: 300px;
597
- color: black;
598
590
  }
599
591
 
600
592
  /* PADDING */
@@ -619,10 +611,10 @@ div.CodeMirror-lint-message-error, div.CodeMirror-lint-message-warning {
619
611
  }
620
612
  .CodeMirror-linenumbers {}
621
613
  .CodeMirror-linenumber {
622
- padding: 0 3px 0 5px;
614
+ color: #999;
623
615
  min-width: 20px;
616
+ padding: 0 3px 0 5px;
624
617
  text-align: right;
625
- color: #999;
626
618
  white-space: nowrap;
627
619
  }
628
620
 
@@ -639,26 +631,19 @@ div.CodeMirror-lint-message-error, div.CodeMirror-lint-message-warning {
639
631
  border-left: 1px solid silver;
640
632
  }
641
633
  .CodeMirror.cm-fat-cursor div.CodeMirror-cursor {
642
- width: auto;
643
- border: 0;
644
634
  background: #7e7;
635
+ border: 0;
636
+ width: auto;
645
637
  }
646
638
  .CodeMirror.cm-fat-cursor div.CodeMirror-cursors {
647
639
  z-index: 1;
648
640
  }
649
641
 
650
642
  .cm-animate-fat-cursor {
651
- width: auto;
652
- border: 0;
653
643
  -webkit-animation: blink 1.06s steps(1) infinite;
654
- -moz-animation: blink 1.06s steps(1) infinite;
655
- -ms-animation: blink 1.06s steps(1) infinite;
656
- animation: blink 1.06s steps(1) infinite;
657
- }
658
- @-moz-keyframes blink {
659
- 0% { background: #7e7; }
660
- 50% { background: none; }
661
- 100% { background: #7e7; }
644
+ animation: blink 1.06s steps(1) infinite;
645
+ border: 0;
646
+ width: auto;
662
647
  }
663
648
  @-webkit-keyframes blink {
664
649
  0% { background: #7e7; }
@@ -732,43 +717,43 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
732
717
  the editor. You probably shouldn't touch them. */
733
718
 
734
719
  .CodeMirror {
735
- position: relative;
736
- overflow: hidden;
737
720
  background: white;
721
+ overflow: hidden;
722
+ position: relative;
738
723
  }
739
724
 
740
725
  .CodeMirror-scroll {
741
- overflow: scroll !important; /* Things will break if this is overridden */
726
+ height: 100%;
742
727
  /* 30px is the magic margin used to hide the element's real scrollbars */
743
728
  /* See overflow: hidden in .CodeMirror */
744
729
  margin-bottom: -30px; margin-right: -30px;
745
- padding-bottom: 30px;
746
- height: 100%;
747
730
  outline: none; /* Prevent dragging from highlighting the element */
731
+ overflow: scroll !important; /* Things will break if this is overridden */
732
+ padding-bottom: 30px;
748
733
  position: relative;
749
734
  }
750
735
  .CodeMirror-sizer {
751
- position: relative;
752
736
  border-right: 30px solid transparent;
737
+ position: relative;
753
738
  }
754
739
 
755
740
  /* The fake, visible scrollbars. Used to force redraw during scrolling
756
741
  before actual scrolling happens, thus preventing shaking and
757
742
  flickering artifacts. */
758
743
  .CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
744
+ display: none;
759
745
  position: absolute;
760
746
  z-index: 6;
761
- display: none;
762
747
  }
763
748
  .CodeMirror-vscrollbar {
764
- right: 0; top: 0;
765
749
  overflow-x: hidden;
766
750
  overflow-y: scroll;
751
+ right: 0; top: 0;
767
752
  }
768
753
  .CodeMirror-hscrollbar {
769
754
  bottom: 0; left: 0;
770
- overflow-y: hidden;
771
755
  overflow-x: scroll;
756
+ overflow-y: hidden;
772
757
  }
773
758
  .CodeMirror-scrollbar-filler {
774
759
  right: 0; bottom: 0;
@@ -778,25 +763,25 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
778
763
  }
779
764
 
780
765
  .CodeMirror-gutters {
781
- position: absolute; left: 0; top: 0;
782
766
  min-height: 100%;
767
+ position: absolute; left: 0; top: 0;
783
768
  z-index: 3;
784
769
  }
785
770
  .CodeMirror-gutter {
786
- white-space: normal;
787
- height: 100%;
788
771
  display: inline-block;
789
- vertical-align: top;
772
+ height: 100%;
790
773
  margin-bottom: -30px;
774
+ vertical-align: top;
775
+ white-space: normal;
791
776
  /* Hack to make IE7 behave */
792
777
  *zoom:1;
793
778
  *display:inline;
794
779
  }
795
780
  .CodeMirror-gutter-wrapper {
796
- position: absolute;
797
- z-index: 4;
798
781
  background: none !important;
799
782
  border: none !important;
783
+ position: absolute;
784
+ z-index: 4;
800
785
  }
801
786
  .CodeMirror-gutter-background {
802
787
  position: absolute;
@@ -804,15 +789,15 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
804
789
  z-index: 4;
805
790
  }
806
791
  .CodeMirror-gutter-elt {
807
- position: absolute;
808
792
  cursor: default;
793
+ position: absolute;
809
794
  z-index: 4;
810
795
  }
811
796
  .CodeMirror-gutter-wrapper {
812
797
  -webkit-user-select: none;
813
- -moz-user-select: none;
814
- -ms-user-select: none;
815
- user-select: none;
798
+ -moz-user-select: none;
799
+ -ms-user-select: none;
800
+ user-select: none;
816
801
  }
817
802
 
818
803
  .CodeMirror-lines {
@@ -820,23 +805,23 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
820
805
  min-height: 1px; /* prevents collapsing before first draw */
821
806
  }
822
807
  .CodeMirror pre {
808
+ -webkit-tap-highlight-color: transparent;
823
809
  /* Reset some styles that the rest of the page might have set */
824
- -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
825
- border-width: 0;
826
810
  background: transparent;
811
+ border-radius: 0;
812
+ border-width: 0;
813
+ color: inherit;
827
814
  font-family: inherit;
828
815
  font-size: inherit;
816
+ -webkit-font-variant-ligatures: none;
817
+ font-variant-ligatures: none;
818
+ line-height: inherit;
829
819
  margin: 0;
820
+ overflow: visible;
821
+ position: relative;
830
822
  white-space: pre;
831
823
  word-wrap: normal;
832
- line-height: inherit;
833
- color: inherit;
834
824
  z-index: 2;
835
- position: relative;
836
- overflow: visible;
837
- -webkit-tap-highlight-color: transparent;
838
- -webkit-font-variant-ligatures: none;
839
- font-variant-ligatures: none;
840
825
  }
841
826
  .CodeMirror-wrap pre {
842
827
  word-wrap: break-word;
@@ -851,9 +836,9 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
851
836
  }
852
837
 
853
838
  .CodeMirror-linewidget {
839
+ overflow: auto;
854
840
  position: relative;
855
841
  z-index: 2;
856
- overflow: auto;
857
842
  }
858
843
 
859
844
  .CodeMirror-widget {}
@@ -868,24 +853,23 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
868
853
  .CodeMirror-gutter,
869
854
  .CodeMirror-gutters,
870
855
  .CodeMirror-linenumber {
871
- -moz-box-sizing: content-box;
872
856
  box-sizing: content-box;
873
857
  }
874
858
 
875
859
  .CodeMirror-measure {
876
- position: absolute;
877
- width: 100%;
878
860
  height: 0;
879
861
  overflow: hidden;
862
+ position: absolute;
880
863
  visibility: hidden;
864
+ width: 100%;
881
865
  }
882
866
 
883
867
  .CodeMirror-cursor { position: absolute; }
884
868
  .CodeMirror-measure pre { position: static; }
885
869
 
886
870
  div.CodeMirror-cursors {
887
- visibility: hidden;
888
871
  position: relative;
872
+ visibility: hidden;
889
873
  z-index: 3;
890
874
  }
891
875
  div.CodeMirror-dragcursors {
@@ -899,6 +883,7 @@ div.CodeMirror-dragcursors {
899
883
  .CodeMirror-selected { background: #d9d9d9; }
900
884
  .CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
901
885
  .CodeMirror-crosshair { cursor: crosshair; }
886
+ .CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
902
887
  .CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
903
888
  .CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
904
889
 
@@ -927,13 +912,13 @@ div.CodeMirror-dragcursors {
927
912
  span.CodeMirror-selectedtext { background: none; }
928
913
 
929
914
  .CodeMirror-dialog {
930
- position: absolute;
931
- left: 0; right: 0;
932
915
  background: inherit;
933
- z-index: 15;
934
- padding: .1em .8em;
935
- overflow: hidden;
936
916
  color: inherit;
917
+ left: 0; right: 0;
918
+ overflow: hidden;
919
+ padding: .1em .8em;
920
+ position: absolute;
921
+ z-index: 15;
937
922
  }
938
923
 
939
924
  .CodeMirror-dialog-top {
@@ -947,12 +932,12 @@ span.CodeMirror-selectedtext { background: none; }
947
932
  }
948
933
 
949
934
  .CodeMirror-dialog input {
950
- border: 1px solid #d3d6db;
951
- outline: none;
952
935
  background: transparent;
953
- width: 20em;
936
+ border: 1px solid #d3d6db;
954
937
  color: inherit;
955
938
  font-family: monospace;
939
+ outline: none;
940
+ width: 20em;
956
941
  }
957
942
 
958
943
  .CodeMirror-dialog button {
@@ -964,7 +949,7 @@ span.CodeMirror-selectedtext { background: none; }
964
949
 
965
950
  .graphiql-container .doc-explorer-title-bar {
966
951
  cursor: default;
967
- display: -webkit-flex;
952
+ display: -webkit-box;
968
953
  display: -ms-flexbox;
969
954
  display: flex;
970
955
  height: 34px;
@@ -972,19 +957,21 @@ span.CodeMirror-selectedtext { background: none; }
972
957
  padding: 8px 8px 5px;
973
958
  position: relative;
974
959
  -webkit-user-select: none;
960
+ -moz-user-select: none;
961
+ -ms-user-select: none;
975
962
  user-select: none;
976
963
  }
977
964
 
978
965
  .graphiql-container .doc-explorer-title {
979
- padding: 10px 0 10px 10px;
966
+ -webkit-box-flex: 1;
967
+ -ms-flex: 1;
968
+ flex: 1;
980
969
  font-weight: bold;
970
+ overflow-x: hidden;
971
+ padding: 10px 0 10px 10px;
981
972
  text-align: center;
982
973
  text-overflow: ellipsis;
983
974
  white-space: nowrap;
984
- overflow-x: hidden;
985
- -webkit-flex: 1;
986
- -ms-flex: 1;
987
- flex: 1;
988
975
  }
989
976
 
990
977
  .graphiql-container .doc-explorer-back {
@@ -997,6 +984,10 @@ span.CodeMirror-selectedtext { background: none; }
997
984
  white-space: nowrap;
998
985
  }
999
986
 
987
+ .doc-explorer-narrow .doc-explorer-back {
988
+ width: 0;
989
+ }
990
+
1000
991
  .graphiql-container .doc-explorer-back:before {
1001
992
  border-left: 2px solid #3B5998;
1002
993
  border-top: 2px solid #3B5998;
@@ -1005,10 +996,9 @@ span.CodeMirror-selectedtext { background: none; }
1005
996
  height: 9px;
1006
997
  margin: 0 3px -1px 0;
1007
998
  position: relative;
1008
- width: 9px;
1009
999
  -webkit-transform: rotate(-45deg);
1010
- -ms-transform: rotate(-45deg);
1011
1000
  transform: rotate(-45deg);
1001
+ width: 9px;
1012
1002
  }
1013
1003
 
1014
1004
  .graphiql-container .doc-explorer-rhs {
@@ -1061,6 +1051,7 @@ span.CodeMirror-selectedtext { background: none; }
1061
1051
  margin: 0 -15px 10px 0;
1062
1052
  padding: 10px 0;
1063
1053
  -webkit-user-select: none;
1054
+ -moz-user-select: none;
1064
1055
  -ms-user-select: none;
1065
1056
  user-select: none;
1066
1057
  }
@@ -1126,10 +1117,10 @@ span.CodeMirror-selectedtext { background: none; }
1126
1117
  }
1127
1118
  .CodeMirror-foldmarker {
1128
1119
  color: blue;
1129
- text-shadow: #b9f 1px 1px 2px, #b9f -1px -1px 2px, #b9f 1px -1px 2px, #b9f -1px 1px 2px;
1120
+ cursor: pointer;
1130
1121
  font-family: arial;
1131
1122
  line-height: .3;
1132
- cursor: pointer;
1123
+ text-shadow: #b9f 1px 1px 2px, #b9f -1px -1px 2px, #b9f 1px -1px 2px, #b9f -1px 1px 2px;
1133
1124
  }
1134
1125
  .CodeMirror-foldgutter {
1135
1126
  width: .7em;
@@ -1151,24 +1142,21 @@ span.CodeMirror-selectedtext { background: none; }
1151
1142
 
1152
1143
  .CodeMirror-lint-tooltip {
1153
1144
  background-color: infobackground;
1154
- border: 1px solid black;
1155
1145
  border-radius: 4px 4px 4px 4px;
1146
+ border: 1px solid black;
1156
1147
  color: infotext;
1157
1148
  font-family: monospace;
1158
1149
  font-size: 10pt;
1150
+ max-width: 600px;
1151
+ opacity: 0;
1159
1152
  overflow: hidden;
1160
1153
  padding: 2px 5px;
1161
1154
  position: fixed;
1162
- white-space: pre;
1155
+ -webkit-transition: opacity .4s;
1156
+ transition: opacity .4s;
1163
1157
  white-space: pre-wrap;
1158
+ white-space: pre;
1164
1159
  z-index: 100;
1165
- max-width: 600px;
1166
- opacity: 0;
1167
- transition: opacity .4s;
1168
- -moz-transition: opacity .4s;
1169
- -webkit-transition: opacity .4s;
1170
- -o-transition: opacity .4s;
1171
- -ms-transition: opacity .4s;
1172
1160
  }
1173
1161
 
1174
1162
  .CodeMirror-lint-mark-error, .CodeMirror-lint-mark-warning {
@@ -1192,15 +1180,15 @@ span.CodeMirror-selectedtext { background: none; }
1192
1180
  cursor: pointer;
1193
1181
  display: inline-block;
1194
1182
  height: 16px;
1195
- width: 16px;
1196
- vertical-align: middle;
1197
1183
  position: relative;
1184
+ vertical-align: middle;
1185
+ width: 16px;
1198
1186
  }
1199
1187
 
1200
1188
  .CodeMirror-lint-message-error, .CodeMirror-lint-message-warning {
1201
- padding-left: 18px;
1202
1189
  background-position: top left;
1203
1190
  background-repeat: no-repeat;
1191
+ padding-left: 18px;
1204
1192
  }
1205
1193
 
1206
1194
  .CodeMirror-lint-marker-error, .CodeMirror-lint-message-error {
@@ -1213,66 +1201,53 @@ span.CodeMirror-selectedtext { background: none; }
1213
1201
 
1214
1202
  .CodeMirror-lint-marker-multiple {
1215
1203
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAMAAADzjKfhAAAACVBMVEUAAAAAAAC/v7914kyHAAAAAXRSTlMAQObYZgAAACNJREFUeNo1ioEJAAAIwmz/H90iFFSGJgFMe3gaLZ0od+9/AQZ0ADosbYraAAAAAElFTkSuQmCC");
1216
- background-repeat: no-repeat;
1217
1204
  background-position: right bottom;
1205
+ background-repeat: no-repeat;
1218
1206
  width: 100%; height: 100%;
1219
1207
  }
1220
1208
  .graphiql-container .spinner-container {
1209
+ height: 36px;
1210
+ left: 50%;
1221
1211
  position: absolute;
1222
1212
  top: 50%;
1223
- height: 36px;
1213
+ -webkit-transform: translate(-50%, -50%);
1214
+ transform: translate(-50%, -50%);
1224
1215
  width: 36px;
1225
- left: 50%;
1226
- transform: translate(-50%, -50%);
1227
1216
  z-index: 10;
1228
1217
  }
1229
1218
 
1230
1219
  .graphiql-container .spinner {
1231
- vertical-align: middle;
1232
- display: inline-block;
1233
- height: 24px;
1234
- width: 24px;
1235
- position: absolute;
1236
1220
  -webkit-animation: rotation .6s infinite linear;
1237
- -moz-animation: rotation .6s infinite linear;
1238
- -o-animation: rotation .6s infinite linear;
1239
- animation: rotation .6s infinite linear;
1221
+ animation: rotation .6s infinite linear;
1222
+ border-bottom: 6px solid rgba(150, 150, 150, .15);
1240
1223
  border-left: 6px solid rgba(150, 150, 150, .15);
1224
+ border-radius: 100%;
1241
1225
  border-right: 6px solid rgba(150, 150, 150, .15);
1242
- border-bottom: 6px solid rgba(150, 150, 150, .15);
1243
1226
  border-top: 6px solid rgba(150, 150, 150, .8);
1244
- border-radius: 100%;
1227
+ display: inline-block;
1228
+ height: 24px;
1229
+ position: absolute;
1230
+ vertical-align: middle;
1231
+ width: 24px;
1245
1232
  }
1246
1233
 
1247
1234
  @-webkit-keyframes rotation {
1248
- from { -webkit-transform: rotate(0deg); }
1249
- to { -webkit-transform: rotate(359deg); }
1250
- }
1251
-
1252
- @-moz-keyframes rotation {
1253
- from { -moz-transform: rotate(0deg); }
1254
- to { -moz-transform: rotate(359deg); }
1255
- }
1256
-
1257
- @-o-keyframes rotation {
1258
- from { -o-transform: rotate(0deg); }
1259
- to { -o-transform: rotate(359deg); }
1235
+ from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
1236
+ to { -webkit-transform: rotate(359deg); transform: rotate(359deg); }
1260
1237
  }
1261
1238
 
1262
1239
  @keyframes rotation {
1263
- from { transform: rotate(0deg); }
1264
- to { transform: rotate(359deg); }
1240
+ from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
1241
+ to { -webkit-transform: rotate(359deg); transform: rotate(359deg); }
1265
1242
  }
1266
1243
  .CodeMirror-hints {
1267
1244
  background: white;
1268
- -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1269
- -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1270
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1245
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1271
1246
  font-family: 'Consolas', 'Inconsolata', 'Droid Sans Mono', 'Monaco', monospace;
1272
1247
  font-size: 13px;
1273
1248
  list-style: none;
1274
- margin: 0;
1275
1249
  margin-left: -6px;
1250
+ margin: 0;
1276
1251
  max-height: 14.5em;
1277
1252
  overflow-y: auto;
1278
1253
  overflow: hidden;
@@ -1283,20 +1258,16 @@ span.CodeMirror-selectedtext { background: none; }
1283
1258
 
1284
1259
  .CodeMirror-hints-wrapper {
1285
1260
  background: white;
1286
- -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1287
- -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1288
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1261
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
1289
1262
  margin-left: -6px;
1290
1263
  position: absolute;
1291
1264
  z-index: 10;
1292
1265
  }
1293
1266
 
1294
1267
  .CodeMirror-hints-wrapper .CodeMirror-hints {
1295
- -webkit-box-shadow: none;
1296
- -moz-box-shadow: none;
1297
- box-shadow: none;
1298
- position: relative;
1268
+ box-shadow: none;
1299
1269
  margin-left: 0;
1270
+ position: relative;
1300
1271
  z-index: 0;
1301
1272
  }
1302
1273