Skip to content

Commit f29cade

Browse files
author
Rabelle Rouser
committed
updated css file to fix bug with reduced browser scale
1 parent c01fb8d commit f29cade

File tree

1 file changed

+370
-1
lines changed

1 file changed

+370
-1
lines changed

‎_assets/literallycanvas.css‎

Lines changed: 370 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,370 @@
1-
.literally .button-style-1{border:2px solid transparent;border-radius:3px}.literally .button-style-1{text-decoration:none;cursor:pointer}.literally .button-style-1.selected:not(.disabled){background-color:#a1d9fe}.literally .button-style-1:hover:not(.disabled){border-color:#a1d9fe}.literally .button-style-1.disabled{cursor:default;opacity:0.3}.literally.toolbar-at-top .lc-drawing{bottom:0;top:31px}.literally.toolbar-at-top .lc-options{top:0;border-bottom:1px solid #555}.literally.toolbar-at-bottom .lc-drawing{bottom:31px;top:0}.literally.toolbar-at-bottom .lc-options{bottom:0;border-top:1px solid #555}.literally.toolbar-hidden .lc-drawing{left:0;right:0;bottom:0;top:0}.literally.toolbar-hidden .lc-options,.literally.toolbar-hidden .lc-picker{display:none}.literally{position:relative;background-color:#ddd;min-height:400px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-ms-touch-action:none;user-select:none}.literally,.literally *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.literally>*{position:absolute}.literally .lc-picker{top:0;left:0;bottom:0;width:61px;background-color:#e6e6e6}.literally .lc-drawing{right:0;left:0;bottom:0;left:0}.literally .lc-drawing>*{position:absolute;top:0;right:0;bottom:0;left:0}.literally .lc-drawing.with-gui{right:0;left:61px;cursor:default}.literally .lc-drawing.with-gui .polygon-toolbar{top:auto;height:31px}.literally .lc-drawing.with-gui .polygon-toolbar .polygon-toolbar-button{float:left}.literally .lc-drawing.with-gui .text-tool-input:focus{outline:none}.literally .lc-picker{z-index:1001;border-right:1px solid #555}.literally .lc-picker .toolbar-button{width:26px;height:26px;line-height:26px;margin:2px;padding:0;cursor:pointer;text-align:center;border:2px solid transparent;border-radius:3px}.literally .lc-picker .toolbar-button{text-decoration:none;cursor:pointer}.literally .lc-picker .toolbar-button.selected:not(.disabled){background-color:#a1d9fe}.literally .lc-picker .toolbar-button:hover:not(.disabled){border-color:#a1d9fe}.literally .lc-picker .toolbar-button.disabled{cursor:default;opacity:0.3}.literally .lc-picker .thin-button{cursor:pointer;float:left;position:relative}.literally .lc-picker .fat-button{clear:both;width:56px}.literally .lc-picker .lc-pick-tool,.literally .lc-picker .lc-undo,.literally .lc-picker .lc-redo,.literally .lc-picker .lc-zoom-in,.literally .lc-picker .lc-zoom-out{background-size:100% auto;background-repeat:no-repeat;background-position:center center}.literally .color-well{font-size:10px;float:left;width:60px}.literally .color-well.open{background-color:#a1d9fe}.literally .color-well-color-container{border:2px solid transparent;border-radius:3px;border:1px solid #aaa;position:relative;width:28px;height:28px;margin:1px auto;overflow:visible}.literally .color-well-color-container{text-decoration:none;cursor:pointer}.literally .color-well-color-container.selected:not(.disabled){background-color:#a1d9fe}.literally .color-well-color-container:hover:not(.disabled){border-color:#a1d9fe}.literally .color-well-color-container.disabled{cursor:default;opacity:0.3}.literally .color-well-color-container .color-well-checker{position:absolute;width:50%;height:50%;background-color:black}.literally .color-well-color-container .color-well-checker-top-left{border-top-left-radius:3px}.literally .color-well-color-container .color-well-checker-bottom-right{border-bottom-right-radius:3px}.literally .color-well-color-container .color-well-color{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3px}.literally .color-picker-popup{position:absolute;z-index:1;background-color:white;border:1px solid #555;left:60px;bottom:31px}.literally .color-picker-popup .color-row{clear:both}.literally .color-picker-popup .color-row .color-cell{cursor:pointer;width:20px;height:20px;line-height:20px;float:left}.literally .color-picker-popup .color-row .color-cell:hover,.literally .color-picker-popup .color-row .color-cell.selected{border:1px solid #555;line-height:18px}.literally .color-picker-popup .color-row .color-cell.transparent-cell{width:100%}.literally .horz-toolbar{height:31px;background-color:#e6e6e6}.literally .horz-toolbar .label{line-height:30px;margin:0 0.25em 0 0.25em;font-size:12px}.literally .horz-toolbar span{line-height:30px;margin:0 0.25em 0 0.25em;font-size:12px;float:left}.literally .horz-toolbar .square-toolbar-button{border:2px solid transparent;border-radius:3px;margin:1px;border:1px solid #aaa;width:28px;height:28px;float:left;position:relative}.literally .horz-toolbar .square-toolbar-button{text-decoration:none;cursor:pointer}.literally .horz-toolbar .square-toolbar-button.selected:not(.disabled){background-color:#a1d9fe}.literally .horz-toolbar .square-toolbar-button:hover:not(.disabled){border-color:#a1d9fe}.literally .horz-toolbar .square-toolbar-button.disabled{cursor:default;opacity:0.3}.literally .horz-toolbar .square-toolbar-button img{max-width:100%;max-height:100%}.literally .horz-toolbar .square-toolbar-button label{position:absolute;top:0;right:0;bottom:0;left:0;line-height:26px;margin:auto;float:none;text-align:center}.literally .polygon-toolbar{position:absolute;border-top:1px solid #555;border-bottom:1px solid #555;width:100%}.literally.toolbar-at-bottom .polygon-toolbar{top:-100%}.literally.toolbar-at-top .polygon-toolbar{top:100%}.literally .lc-options{z-index:1;right:0;left:61px}.literally .lc-options .lc-font-settings{height:30px;line-height:31px;padding-left:4px;background-color:#f5f5f5}.literally .lc-options .lc-font-settings input{margin:0 0.5em 0 0}.literally .lc-options .lc-font-settings input[type=checkbox]{margin:0 0.5em 0 0.5em}
1+
.literally .button-style-1 {
2+
border: 2px solid transparent;
3+
border-radius: 3px
4+
}
5+
6+
.literally .button-style-1 {
7+
text-decoration: none;
8+
cursor: pointer
9+
}
10+
11+
.literally .button-style-1.selected:not(.disabled) {
12+
background-color: #a1d9fe
13+
}
14+
15+
.literally .button-style-1:hover:not(.disabled) {
16+
border-color: #a1d9fe
17+
}
18+
19+
.literally .button-style-1.disabled {
20+
cursor: default;
21+
opacity: 0.3
22+
}
23+
24+
.literally.toolbar-at-top .lc-drawing {
25+
bottom: 0;
26+
top: 31px
27+
}
28+
29+
.literally.toolbar-at-top .lc-options {
30+
top: 0;
31+
border-bottom: 1px solid #555
32+
}
33+
34+
.literally.toolbar-at-bottom .lc-drawing {
35+
bottom: 31px;
36+
top: 0
37+
}
38+
39+
.literally.toolbar-at-bottom .lc-options {
40+
bottom: 0;
41+
border-top: 1px solid #555
42+
}
43+
44+
.literally.toolbar-hidden .lc-drawing {
45+
left: 0;
46+
right: 0;
47+
bottom: 0;
48+
top: 0
49+
}
50+
51+
.literally.toolbar-hidden .lc-options,
52+
.literally.toolbar-hidden .lc-picker {
53+
display: none
54+
}
55+
56+
.literally {
57+
position: relative;
58+
background-color: #ddd;
59+
min-height: 400px;
60+
-webkit-touch-callout: none;
61+
-webkit-user-select: none;
62+
-khtml-user-select: none;
63+
-moz-user-select: none;
64+
-ms-user-select: none;
65+
-ms-touch-action: none;
66+
user-select: none
67+
}
68+
69+
.literally,
70+
.literally * {
71+
-moz-box-sizing: border-box;
72+
-webkit-box-sizing: border-box;
73+
box-sizing: border-box
74+
}
75+
76+
.literally>* {
77+
position: absolute
78+
}
79+
80+
.literally .lc-picker {
81+
top: 0;
82+
left: 0;
83+
bottom: 0;
84+
width: 65px;
85+
background-color: #e6e6e6
86+
}
87+
88+
.literally .lc-drawing {
89+
right: 0;
90+
left: 0;
91+
bottom: 0;
92+
left: 0
93+
}
94+
95+
.literally .lc-drawing>* {
96+
position: absolute;
97+
top: 0;
98+
right: 0;
99+
bottom: 0;
100+
left: 0
101+
}
102+
103+
.literally .lc-drawing.with-gui {
104+
right: 0;
105+
left: 65px;
106+
cursor: default
107+
}
108+
109+
.literally .lc-drawing.with-gui .polygon-toolbar {
110+
top: auto;
111+
height: 31px
112+
}
113+
114+
.literally .lc-drawing.with-gui .polygon-toolbar .polygon-toolbar-button {
115+
float: left
116+
}
117+
118+
.literally .lc-drawing.with-gui .text-tool-input:focus {
119+
outline: none
120+
}
121+
122+
.literally .lc-picker {
123+
z-index: 1001;
124+
border-right: 1px solid #555
125+
}
126+
127+
.literally .lc-picker .toolbar-button {
128+
width: 26px;
129+
height: 26px;
130+
line-height: 26px;
131+
margin: 2px;
132+
padding: 0;
133+
cursor: pointer;
134+
text-align: center;
135+
border: 2px solid transparent;
136+
border-radius: 3px
137+
}
138+
139+
.literally .lc-picker .toolbar-button {
140+
text-decoration: none;
141+
cursor: pointer
142+
}
143+
144+
.literally .lc-picker .toolbar-button.selected:not(.disabled) {
145+
background-color: #a1d9fe
146+
}
147+
148+
.literally .lc-picker .toolbar-button:hover:not(.disabled) {
149+
border-color: #a1d9fe
150+
}
151+
152+
.literally .lc-picker .toolbar-button.disabled {
153+
cursor: default;
154+
opacity: 0.3
155+
}
156+
157+
.literally .lc-picker .thin-button {
158+
cursor: pointer;
159+
float: left;
160+
position: relative
161+
}
162+
163+
.literally .lc-picker .fat-button {
164+
clear: both;
165+
width: 56px
166+
}
167+
168+
.literally .lc-picker .lc-pick-tool,
169+
.literally .lc-picker .lc-undo,
170+
.literally .lc-picker .lc-redo,
171+
.literally .lc-picker .lc-zoom-in,
172+
.literally .lc-picker .lc-zoom-out {
173+
background-size: 100% auto;
174+
background-repeat: no-repeat;
175+
background-position: center center
176+
}
177+
178+
.literally .color-well {
179+
font-size: 10px;
180+
float: left;
181+
width: 60px
182+
}
183+
184+
.literally .color-well.open {
185+
background-color: #a1d9fe
186+
}
187+
188+
.literally .color-well-color-container {
189+
border: 2px solid transparent;
190+
border-radius: 3px;
191+
border: 1px solid #aaa;
192+
position: relative;
193+
width: 28px;
194+
height: 28px;
195+
margin: 1px auto;
196+
overflow: visible
197+
}
198+
199+
.literally .color-well-color-container {
200+
text-decoration: none;
201+
cursor: pointer
202+
}
203+
204+
.literally .color-well-color-container.selected:not(.disabled) {
205+
background-color: #a1d9fe
206+
}
207+
208+
.literally .color-well-color-container:hover:not(.disabled) {
209+
border-color: #a1d9fe
210+
}
211+
212+
.literally .color-well-color-container.disabled {
213+
cursor: default;
214+
opacity: 0.3
215+
}
216+
217+
.literally .color-well-color-container .color-well-checker {
218+
position: absolute;
219+
width: 50%;
220+
height: 50%;
221+
background-color: black
222+
}
223+
224+
.literally .color-well-color-container .color-well-checker-top-left {
225+
border-top-left-radius: 3px
226+
}
227+
228+
.literally .color-well-color-container .color-well-checker-bottom-right {
229+
border-bottom-right-radius: 3px
230+
}
231+
232+
.literally .color-well-color-container .color-well-color {
233+
position: absolute;
234+
top: 0;
235+
right: 0;
236+
bottom: 0;
237+
left: 0;
238+
border-radius: 3px
239+
}
240+
241+
.literally .color-picker-popup {
242+
position: absolute;
243+
z-index: 1;
244+
background-color: white;
245+
border: 1px solid #555;
246+
left: 60px;
247+
bottom: 31px
248+
}
249+
250+
.literally .color-picker-popup .color-row {
251+
clear: both
252+
}
253+
254+
.literally .color-picker-popup .color-row .color-cell {
255+
cursor: pointer;
256+
width: 20px;
257+
height: 20px;
258+
line-height: 20px;
259+
float: left
260+
}
261+
262+
.literally .color-picker-popup .color-row .color-cell:hover,
263+
.literally .color-picker-popup .color-row .color-cell.selected {
264+
border: 1px solid #555;
265+
line-height: 18px
266+
}
267+
268+
.literally .color-picker-popup .color-row .color-cell.transparent-cell {
269+
width: 100%
270+
}
271+
272+
.literally .horz-toolbar {
273+
height: 31px;
274+
background-color: #e6e6e6
275+
}
276+
277+
.literally .horz-toolbar .label {
278+
line-height: 30px;
279+
margin: 0 0.25em 0 0.25em;
280+
font-size: 12px
281+
}
282+
283+
.literally .horz-toolbar span {
284+
line-height: 30px;
285+
margin: 0 0.25em 0 0.25em;
286+
font-size: 12px;
287+
float: left
288+
}
289+
290+
.literally .horz-toolbar .square-toolbar-button {
291+
border: 2px solid transparent;
292+
border-radius: 3px;
293+
margin: 1px;
294+
border: 1px solid #aaa;
295+
width: 28px;
296+
height: 28px;
297+
float: left;
298+
position: relative
299+
}
300+
301+
.literally .horz-toolbar .square-toolbar-button {
302+
text-decoration: none;
303+
cursor: pointer
304+
}
305+
306+
.literally .horz-toolbar .square-toolbar-button.selected:not(.disabled) {
307+
background-color: #a1d9fe
308+
}
309+
310+
.literally .horz-toolbar .square-toolbar-button:hover:not(.disabled) {
311+
border-color: #a1d9fe
312+
}
313+
314+
.literally .horz-toolbar .square-toolbar-button.disabled {
315+
cursor: default;
316+
opacity: 0.3
317+
}
318+
319+
.literally .horz-toolbar .square-toolbar-button img {
320+
max-width: 100%;
321+
max-height: 100%
322+
}
323+
324+
.literally .horz-toolbar .square-toolbar-button label {
325+
position: absolute;
326+
top: 0;
327+
right: 0;
328+
bottom: 0;
329+
left: 0;
330+
line-height: 26px;
331+
margin: auto;
332+
float: none;
333+
text-align: center
334+
}
335+
336+
.literally .polygon-toolbar {
337+
position: absolute;
338+
border-top: 1px solid #555;
339+
border-bottom: 1px solid #555;
340+
width: 100%
341+
}
342+
343+
.literally.toolbar-at-bottom .polygon-toolbar {
344+
top: -100%
345+
}
346+
347+
.literally.toolbar-at-top .polygon-toolbar {
348+
top: 100%
349+
}
350+
351+
.literally .lc-options {
352+
z-index: 1;
353+
right: 0;
354+
left: 65px
355+
}
356+
357+
.literally .lc-options .lc-font-settings {
358+
height: 30px;
359+
line-height: 31px;
360+
padding-left: 4px;
361+
background-color: #f5f5f5
362+
}
363+
364+
.literally .lc-options .lc-font-settings input {
365+
margin: 0 0.5em 0 0
366+
}
367+
368+
.literally .lc-options .lc-font-settings input[type=checkbox] {
369+
margin: 0 0.5em 0 0.5em
370+
}

0 commit comments

Comments
 (0)