Move Sone creation to its own template.
[Sone.git] / src / main / resources / static / css / sone.css
1 /* Sone Main CSS File */
2
3 /* first, override some fproxy rules. */
4 #sone .post .reply div,#sone .post .time,#sone .post .delete,#sone .post .show-reply-form
5         {
6         font-size: inherit;
7 }
8
9 #sone form {
10         margin: 0px;
11 }
12
13 /* now for the real stuff. */
14
15 #sone {
16         width: 55em;
17         margin: auto;
18 }
19
20 #sone .hidden {
21         display: none;
22 }
23
24 #sone a, #sone a:link, #sone a:visited {
25         color: rgb(28, 131, 191);
26         font-size: inherit;
27         text-decoration: none;
28 }
29
30 #sone a:active, #sone a:hover {
31         color: rgb(255, 172, 0);
32 }
33
34 #sone #profile {
35         height: 80px;
36         margin-bottom: 1ex;
37 }
38
39 #sone .profile-link {
40         font-weight: bold;
41         color: rgb(28, 131, 191);
42 }
43
44 #sone #profile.online .picture {
45         position: absolute;
46         background-image: url("../images/sone.png");
47         width: 80px;
48         height: 80px;
49 }
50
51 #sone #profile.offline .picture {
52         position: absolute;
53         background-image: url("../images/sone-offline.png");
54         width: 80px;
55         height: 80px;
56 }
57
58 #sone #profile.offline .edit-profile-link, #sone #profile.offline .profile-link {
59         display: none;
60 }
61
62 #sone #profile .edit-profile-link {
63         font-size: 85%;
64 }
65
66 #sone #home-sone {
67         margin-left: 80px;
68         padding-left: 1ex;
69 }
70
71 #sone .nice-name {
72         font-weight: bold;
73 }
74
75 #sone #main {
76         padding: 1em;
77 }
78
79 #sone .post {
80         padding: 1ex 0px;
81         border-bottom: solid 1px #ccc;
82 }
83
84 #sone .post:last-child {
85         padding: 1ex 0px;
86         border-bottom: none;
87 }
88
89 #sone .post .author {
90         display: inline;
91         font-weight: bold;
92 }
93
94 #sone .post .text {
95         display: inline;
96         white-space: pre-wrap;
97 }
98
99 #sone .post .status-line {
100         clear: both;
101         margin-top: 0.5ex;
102         font-size: 85%;
103 }
104
105 #sone .post .time {
106         display: inline;
107         color: #666;
108 }
109
110 #sone .post .delete {
111         display: inline;
112 }
113
114 #sone .post .delete button {
115         font: inherit;
116         border: 0px;
117         background: none;
118         padding: 0px;
119         color: rgb(28, 131, 191);
120 }
121
122 #sone .post .delete button:hover {
123         font: inherit;
124         border: 0px;
125         background: none;
126         padding: 0px;
127         color: rgb(255, 172, 0);
128         cursor: pointer;
129 }
130
131 #sone .post .delete:before {
132         content: ' ‧ ';
133 }
134
135 #sone .post .replies {
136         clear: both;
137         padding-top: 0.2ex;
138 }
139
140 #sone .post .reply {
141         clear: both;
142         background-color: #f0f0ff;
143         font-size: 85%;
144         margin: 1ex 0px;
145         padding: 1ex;
146 }
147
148 #sone .post .reply .time {
149         float: none;
150         display: inline;
151         color: #666;
152         font-size: inherit;
153 }
154
155 #sone .post .show-reply-form {
156         display: inline;
157 }
158
159 #sone .post .show-reply-form span {
160         color: rgb(28, 131, 191);
161         cursor: pointer;
162         font: inherit;
163 }
164
165 #sone .post .show-reply-form span:hover {
166         color: rgb(255, 172, 0);
167 }
168
169 #sone .post .show-reply-form:before {
170         content: ' ‧ ';
171 }
172
173 #sone .post .reply .status-line .delete {
174         float: none;
175         display: inline;
176 }
177
178 #sone .post .reply .status-line .delete:before {
179         content: ' · ';
180 }
181
182 #sone .post .create-reply {
183         clear: both;
184         background-color: #f0f0ff;
185         padding: 0.5ex;
186 }
187
188 #sone .post .create-reply.light button {
189         display: none;
190 }
191
192 #sone .sone {
193         clear: both;
194         background-color: #f0f0ff;
195         border: 1px solid #ccc;
196         margin-bottom: 0.5ex;
197         padding: 0.5ex;
198 }
199
200 #sone .sone .profile-link {
201         display: block;
202 }
203
204 #sone .sone .short-request-uri {
205         clear: both;
206         float: right;
207 }
208
209 #sone .sone .unknown-marker, #sone .sone .download-marker, #sone .sone .insert-marker, #sone .sone .idle-marker, #sone .sone .modified-marker {
210         display: none;
211 }
212
213 #sone .sone.unknown .unknown-marker, #sone .sone.idle .idle-marker, #sone .sone.downloading .download-marker, #sone .sone.inserting .insert-marker, #sone .sone.modified .modified-marker {
214         display: inline;
215         float: right;
216         border: solid 1px #ccc;
217         border-right: none;
218         border-top: none;
219         padding: 0 0.5ex;
220         position: relative;
221         right: -0.5ex;
222         top: -0.5ex
223 }
224
225 #sone .sone .last-update {
226         float: right;
227         display: inline;
228 }
229
230 #sone .sone .modified-marker, #sone .sone .unknown-marker {
231         color: red;
232         font-weight: bold;
233 }
234
235 #sone .sone form {
236         display: inline;
237         border: solid 1px #ccc;
238         border-left: none;
239         border-bottom: none;
240         padding: 0 0.5ex;
241         position: relative;
242         left: -0.5ex;
243         bottom: -0.5ex
244 }
245
246 #sone .sone form.block button, #sone .sone form.unblock button, #sone .sone form.follow button, #sone .sone form.unfollow button {
247         display: inline;
248         color: rgb(28, 131, 191);
249         background: none;
250         border: none;
251         font: inherit;
252         padding: 0px;
253 }
254
255 #sone .sone form.block button:hover, #sone .sone form.unblock button:hover, #sone .sone form.follow button:hover, #sone .sone form.unfollow button:hover {
256         display: inline;
257         color: rgb(255, 172, 0);
258 }
259
260 #sone .sone .spacer {
261         display: inline;
262 }
263
264 #sone #create-sone {
265         
266 }
267
268 #sone #tail .import-key {
269         margin-top: 1em;
270         border-top: solid 1px #ccc;
271         padding-top: 1em;
272         text-align: center;
273         font-size: 85%;
274         color: #888;
275 }
276
277
278 #sone h1 {
279         font-family: inherit;
280         font-size: 200%;
281         font-weight: bold;
282 }
283
284 #sone .error label {
285         color: red;
286         font-weight: bold;
287 }
288
289 #sone input.status-input.default, input.reply-input.default {
290         color: #888;
291 }
292
293 #sone input[type=text].key {
294         width: 130ex;;
295         font-size: 75%;
296 }