OLD | NEW |
| (Empty) |
1 @import "bootstrap-compass"; | |
2 @import "bootstrap-variables"; | |
3 @import "bootstrap"; | |
4 | |
5 $sidebar-width: 200px; | |
6 $content-background: white; | |
7 $sidebar-background: #eee; | |
8 | |
9 html, body { | |
10 min-height: 100%; | |
11 } | |
12 | |
13 #wrapper { | |
14 padding-top: 50px; | |
15 position: absolute; | |
16 top: 0; | |
17 bottom: 0; | |
18 left: 0; | |
19 right: 0; | |
20 } | |
21 | |
22 #lower-wrapper { | |
23 min-height: 100%; | |
24 position: relative; | |
25 } | |
26 | |
27 #content { | |
28 height: 100%; | |
29 padding: 1em; | |
30 | |
31 margin-left: $sidebar-width; | |
32 background: $content-background; | |
33 } | |
34 | |
35 #sidebar { | |
36 position: absolute; | |
37 top: 0px; | |
38 left: 0px; | |
39 width: $sidebar-width; | |
40 background: $sidebar-background; | |
41 height: 100%; | |
42 | |
43 padding: 5px; | |
44 | |
45 .panel-heading { | |
46 padding: 3px 5px; | |
47 | |
48 .panel-title { | |
49 font-size: 12px; | |
50 font-weight: 200; | |
51 } | |
52 } | |
53 } | |
54 | |
55 .navbar { | |
56 margin-top: -50px; | |
57 } | |
58 | |
59 img { | |
60 box-shadow: 2px 2px 5px gray; | |
61 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQC
AAAAAA6mKC9AAAAAXNSR0IArs4c6QAAAAJiS0dEAP+Hj8y/AAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAB
3RJTUUH3gUBEi4DGRAQYgAAAB1JREFUGNNjfMoAAVJQmokBDdBHgPE/lPFsYN0BABdaAwN6tehMAAAAA
ElFTkSuQmCC"); | |
62 } | |
63 | |
64 h1 { | |
65 font-size: 18px; | |
66 } | |
67 | |
68 h2 { | |
69 font-size: 16px; | |
70 } | |
71 | |
72 .waiting, .waiting * { | |
73 cursor: wait; | |
74 } | |
75 | |
76 .iframe textarea { | |
77 resize: none; | |
78 } | |
79 | |
80 template { | |
81 display: none; | |
82 } | |
83 | |
84 code { | |
85 color: green; | |
86 } | |
87 | |
88 code { | |
89 padding: 0; | |
90 } | |
91 | |
92 .tries { | |
93 margin: 1em; | |
94 float: left; | |
95 } | |
96 | |
97 #tryHistory { | |
98 position: absolute; | |
99 top: 3em; | |
100 right: 10px; | |
101 width: 75px; | |
102 | |
103 .tries { | |
104 float: none; | |
105 } | |
106 } | |
107 | |
108 #chooseList { | |
109 display: flex; | |
110 flex-flow: row wrap; | |
111 } | |
112 | |
113 .action-buttons { | |
114 padding: 10px 0; | |
115 } | |
116 | |
117 .show { | |
118 display: block !important; | |
119 } | |
120 | |
121 .image-wrapper { | |
122 display: none; | |
123 } | |
124 | |
125 #chooseSource { | |
126 display: none; | |
127 } | |
128 | |
129 #selectedSource { | |
130 display: none; | |
131 } | |
132 | |
133 #sourceCode { | |
134 display: none; | |
135 margin-top: 10px; | |
136 } | |
137 | |
138 #gitInfo { | |
139 font-size: 70%; | |
140 } | |
141 | |
142 #output-wrapper { | |
143 display: none; | |
144 } | |
145 | |
146 .compile-error { | |
147 cursor: pointer; | |
148 } | |
149 | |
150 /* CodeMirror customization */ | |
151 | |
152 .CodeMirror .error { | |
153 background: #f88; | |
154 } | |
155 | |
156 .CodeMirror-lines, | |
157 .CodeMirror-scroll | |
158 { | |
159 background-color: #eee; | |
160 } | |
161 | |
162 .CodeMirror { | |
163 border: solid gray 1px; | |
164 height: auto; | |
165 } | |
166 | |
167 /* Make the code editor automatically resize */ | |
168 | |
169 .CodeMirror-scroll { | |
170 overflow-y: hidden; | |
171 overflow-x: auto; | |
172 } | |
173 | |
174 /* Twitter Bootstrap customization */ | |
175 | |
176 .navbar { | |
177 border: none; | |
178 } | |
179 | |
180 .navbar-brand { | |
181 padding: 0; | |
182 | |
183 img { | |
184 height: 50px; | |
185 box-shadow: none; | |
186 background: none; | |
187 } | |
188 } | |
OLD | NEW |