forked from ofrohn/d3-celestial
-
Notifications
You must be signed in to change notification settings - Fork 0
/
celestial.css
99 lines (89 loc) · 6.26 KB
/
celestial.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
/* Copyright 2015-16 Olaf Frohn https://github.com/ofrohn, see LICENSE */
body { background:#fff; }
#celestial-map { width: 100%; height: auto; margin: 0; padding: 0; display: inline-block; position: relative; }
canvas { display: inline-block; position:absolute; z-index:0; cursor:hand; cursor:grab; cursor:-moz-grab; cursor:-webkit-grab; }
canvas:active { cursor:move; cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }
footer { text-align:center; color:#666; font:10pt/1 'Arial Unicode MS', Arial, Helvetica, sans-serif; }
footer a { text-decoration:none; color:#99f; }
/* Form */
#celestial-form { font:12pt/1 'Arial Unicode MS', Arial, Helvetica, sans-serif; display: inline-block; position: relative; }
#error { position:absolute; min-width:100px; height:auto; padding: 2px 4px; color:#f00; background:#fff; border:2px solid #f00; border-radius:3px; font-weight:normal; display:block; top:-9999px; left:-9999px; opacity:0; transition:opacity 1s linear; }
#celestial-form .col { border-top: 1px dotted #000; padding: 4px 6px; margin:0 0 4px; }
/* What parts to show */
#celestial-form #general,
#celestial-form #location,
#celestial-form #stars,
#celestial-form #dsos,
#celestial-form #constellations,
#celestial-form #lines,
#celestial-form #other { display: block }
#celestial-form input { vertical-align: 0px; }
#celestial-form input[type='number'] { width:48px; height:18px; text-align:right; padding:0; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { height: auto; }
#celestial-form #centerx, #celestial-form #centery, #celestial-form #centerz,
#celestial-form #lat, #celestial-form #lon { width:64px; margin-top:4px; }
#celestial-form input[type='text'] { width:194px; height:18px; text-align:left; padding-left:2px; }
#celestial-form input[type='checkbox'] { vertical-align: -2px; }
#celestial-form input[type='color'] { width:48px; vertical-align: -3px; height:22px; background:#fff; }
#celestial-form #datepick { position:relative; display:inline-block; _vertical-align:-8px; top:7px; left:-31px; width:28px; height:24px; border:0px none; border-left:1px solid #ccc; background-color: #f7f7f7; background-image: url('images/dtpick.png'); background-position: -45px 1px; cursor:default; }
#celestial-form #datepick.active { background-position: -69px 1px; }
#celestial-form #datetime { cursor:default; }
#celestial-form input#now { position:relative; left:-24px; }
#celestial-form #constellation { }
#celestial-form #constellation option { color:#000; }
#celestial-form #constellation option[value=''] { color:#ccc; }
#celestial-form input[type='button'] { width:64px; padding-bottom:1px; margin-top:4px; float:right; background: #f7f7f7; }
#celestial-form input#fullwidth { width:108px; }
#celestial-form input#width { margin-left:2px; }
#celestial-form input#now,
#celestial-form input#here { width:48px; margin-left:2px; float:none; }
#celestial-form input[type='button']:hover,
#celestial-form #datepick:hover { background-color:#eee; }
#celestial-form input[type='text']:disabled,
#celestial-form input[type='number']:disabled,
#celestial-form input[type='color']:disabled { border: 1px solid #ccc; background:#eee }
#celestial-form input[type='text'],
#celestial-form input[type='number'],
#celestial-form input[type='color'],
#celestial-form select,
#celestial-form input#now,
#celestial-form input#here,
#celestial-form input#show,
#celestial-form input#fullwidth { border: 1px solid #000; border-radius:3px; height:24px; }
#celestial-form label { margin:0 4px 0 8px; }
#celestial-form label.header { font-weight:bold; }
#celestial-form input + span { margin:0 4px 0 2px; }
#celestial-form label:first-child,
#celestial-form br + label { margin-left:0; }
/* Zoom controls */
#celestial-zoomin,
#celestial-zoomout { width:32px; height:32px; left:8px; top:12px; background: rgba(255,255,255,0.5); border:1px solid #000; border-radius:3px; position:absolute; font: normal bold 24px/1 Consolas, Courier, 'Courier New', monospace; cursor:pointer; }
#celestial-zoomout { top: 48px; }
#celestial-zoomin:hover,
#celestial-zoomout:hover { background: rgba(255,255,255,0.7); }
#celestial-zoomin:disabled,
#celestial-zoomout:disabled { background: rgba(255,255,255,0.0); border:1px solid rgba(153,153,153,0.7); color:rgba(153,153,153,0.7); cursor:default; }
#celestial-date { position:absolute; top:-9999px; width:193px; text-align:center; border:1px solid #000; background:#fff; opacity:0; transition:.6s ease-in opacity; font: 13px/1 sans-serif; }
#celestial-date input, #celestial-date select { font:inherit; }
#celestial-date #yr, #celestial-date #mon { margin: 2px 3px; vertical-align:middle; }
#celestial-date #left, #celestial-date #right { display:inline-block; width:12px; height:24px; margin:0; vertical-align:-8px; cursor:pointer; background-image: url('images/dtpick.png'); }
#celestial-form #day-left, #celestial-form #day-right { display:inline-block; float:none; width:12px; height:24px; margin:0; padding:0; vertical-align:0px; cursor:pointer; border: 0 none; background-color:transparent; background-image: url('images/dtpick.png'); }
#celestial-form #day-right { position:relative; left:-30px; }
#celestial-date #left, #celestial-form #day-left { background-position: -8px 0px; }
#celestial-date #right, #celestial-form #day-right { background-position: -30px 0px; }
#celestial-date #hr, #celestial-date #min, #celestial-date #sec { margin: 0 0 2px 0; width:34px; }
#celestial-date #hr { border-right: 0px none; border-radius: 3px 0 0 3px; }
#celestial-date #min { border-right: 0px none; border-left: 0px none; border-radius: 0; }
#celestial-date #sec { border-left: 0px none; border-radius: 0 3px 3px 0; }
#celestial-date #tz { margin: 0 0 2px 4px; }
#celestial-date #cal { display:inline-block; width:182px; margin:0 4px; }
#celestial-date .date { display:inline-block; width:19px; height:14px; border:1px solid #fff; color:#000; font-weight: bold; text-align:right; vertical-align:middle; padding:2px 4px 2px 0; cursor:pointer; }
#celestial-date .grey { color:#ccc; }
#celestial-date .weekday { color:#999; fomt-sixe:11px; }
#celestial-date .weekend { color:#f00; }
#celestial-date .selected { border:1px solid #000; border-radius:3px; }
#celestial-date .today { background:#ff0; }
@media print {
#celestial-zoomin, #celestial-zoomout, #celestial-form { display: none; }
}