Commit 7c019a7130c4f3b4c10157a2169a6db7909d9022

Authored by AntonioTerceiro
1 parent 8a6c0f8a

ActionItem18: more work to adjust comatose to our application



git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@386 3f533792-8f58-4932-b0fe-aaf55b0a4547
public/designs/templates/default/stylesheets/style.css
... ... @@ -42,9 +42,10 @@ height: 135px;
42 42  
43 43 #boxes {
44 44 position: relative;
45   - width: 800px;
  45 + width: 760px;
46 46 left: 50%;
47 47 margin-left: -400px;
  48 + padding: 1em;
48 49 }
49 50  
50 51 #box_3 {
... ... @@ -135,3 +136,34 @@ height: 135px;
135 136 color: #ffffff;
136 137 }
137 138  
  139 +div#notice {
  140 + z-index: 10000;
  141 + position: absolute;
  142 + top: 100px;
  143 + left: 50%;
  144 + margin-left: -200px;
  145 + width: 400px;
  146 + border: 1px solid black;
  147 + background: #efefef;
  148 + padding: 0.5em;
  149 +}
  150 +
  151 +div#notice .button {
  152 + text-align: center;
  153 + margin-top: 1em;
  154 + margin-bottom: 0.25em;
  155 +}
  156 +
  157 +div#notice .button a {
  158 + border: 1px solid gray;
  159 + background: #ddd;
  160 + color: black;
  161 + padding: 4px;
  162 + padding-left: 28px;
  163 + background-image: url(../../../icons/default/cancel.png);
  164 + background-position: top left;
  165 + background-repeat: no-repeat;
  166 +}
  167 +div#notice .button a:hover {
  168 + background-color: #ffd;
  169 +}
... ...
public/javascripts/comatose_admin.js
... ... @@ -66,15 +66,15 @@ var ComatoseList = {
66 66 }
67 67 },
68 68  
69   - toggle_reorder: function(node, anc, id) {
  69 + toggle_reorder: function(node, anc, id, reorder_text, finished_text) {
70 70 if( $(node).hasClassName('do-reorder') ) {
71 71 $(node).removeClassName( 'do-reorder' );
72 72 $(anc).removeClassName('reordering');
73   - $(anc).innerHTML = "reorder children";
  73 + $(anc).innerHTML = reorder_text;
74 74 } else {
75 75 $(node).addClassName( 'do-reorder' );
76 76 $(anc).addClassName('reordering');
77   - $(anc).innerHTML = "finished reordering";
  77 + $(anc).innerHTML = finished_text;
78 78 // Make sure the children are visible...
79 79 ComatoseList.expand_node(id);
80 80 }
... ... @@ -149,8 +149,8 @@ var ComatoseEditForm = {
149 149 this.last_title = slug.value;
150 150 },
151 151 // Todo: Make the meta fields remember their visibility?
152   - toggle_extra_fields : function(anchor) {
153   - if(anchor.innerHTML == "More...") {
  152 + toggle_extra_fields : function(anchor, more_label, less_label) {
  153 + if(anchor.innerHTML == more_label) {
154 154 Show.these(
155 155 'slug_row',
156 156 'keywords_row',
... ... @@ -158,7 +158,7 @@ var ComatoseEditForm = {
158 158 'filter_row',
159 159 'created_row'
160 160 );
161   - anchor.innerHTML = 'Less...';
  161 + anchor.innerHTML = less_label;
162 162 } else {
163 163 Hide.these(
164 164 'slug_row',
... ... @@ -167,15 +167,15 @@ var ComatoseEditForm = {
167 167 'filter_row',
168 168 'created_row'
169 169 );
170   - anchor.innerHTML = 'More...';
  170 + anchor.innerHTML = more_label;
171 171 }
172 172 },
173 173 // Uses server to create preview of content...
174   - preview_content : function(preview_url) {
  174 + preview_content : function(preview_url, preview_label) {
175 175 $('preview-area').show();
176 176 var params = Form.serialize(document.forms[0]);
177 177 if( params != this.last_preview ) {
178   - $('preview-panel').innerHTML = "<span style='color:blue;'>Loading Preview...</span>";
  178 + $('preview-panel').innerHTML = "<span style='color:blue;'>" + preview_label + "</span>";
179 179 new Ajax.Updater(
180 180 'preview-panel',
181 181 preview_url,
... ... @@ -184,11 +184,11 @@ var ComatoseEditForm = {
184 184 }
185 185 this.last_preview = params;
186 186 },
187   - cancel : function(url) {
  187 + cancel : function(url, cancel_warning) {
188 188 var current_data = Form.serialize(document.forms[0]);
189 189 var data_changed = (this.default_data != current_data)
190 190 if(data_changed) {
191   - if( confirm('Changes detected. You will lose all the updates you have made if you proceed...') ) {
  191 + if( confirm(cancel_warning) ) {
192 192 location.href = url;
193 193 }
194 194 } else {
... ...
public/stylesheets/comatose_admin.css
1 1  
2   -/* Page Listing */
3   -#content .tree-controller {
4   - border: 0px;
5   - cursor: pointer;
6   -}
7   -#content .page-list.root {
8   - clear: both;
9   - list-style: none;
10   - margin: 0px;
11   - padding: 0px;
12   - margin-top: 10px;
13   -}
14   -#content .page-list.collapsed {
  2 +/************************************
  3 + * listing stuff
  4 + ************************************/
  5 +#content .handle, #content .do-reorder UL LI .handle {
15 6 display: none;
16 7 }
17   -#content .page-list {
18   - /* background: white; */
19   - clear: both;
20   - list-style: none;
21   - border-left: none;
22   - margin: 0px;
23   - padding: 0px;
24   - padding-left: 15px;
25   - margin-top: 2px;
26   -}
27   -#content .page-list LI {
28   - clear: both;
29   - padding: 0px;
30   - margin: 5px 0px;
31   - padding-top: 2px;
32   - padding-right: 0px;
33   - padding-left: 2px;
34   -}
35   -#content .page-list .commands {
36   - font-size: 90%;
37   - padding-left: 5px;
38   -}
39   -#content .page-list .commands A {
40   - /* color: gray; */
41   -}
42   -#content .page-list .commands A.add-page:hover {
43   - /* color: blue; */
44   -}
45   -#content .page-list .commands A.reorder-children:hover {
46   -/* color: black; */
47   -}
48   -#content .page-list .commands A.delete-page:hover {
49   -/* color: white; */
  8 +#content .do-reorder LI .handle {
  9 + display: inline;
  10 + background: gray;
  11 + color: white;
  12 + padding: 1px 3px;
  13 + cursor: move;
50 14 }
51   -#content .page-list .commands A.reordering {
52   -/* background: navy; */
53   -/* color: white; */
  15 +
  16 +ul.page-list li {
  17 + list-style: none;
54 18 }
55   -#content .page-list .commands A.reordering:hover {
56   -/* color: white; */
  19 +
  20 +ul.page-list li table,
  21 +ul.page-list li td {
  22 + border: none;
  23 + padding: 3px;
57 24 }
58   -#content .page-list A.page {
59   - text-decoration: none;
60   -/* color: black; */
61   - margin-left: 3px;
62   - display: block;
  25 +
  26 +ul.page-list a.page {
  27 + font-weight: bold;
63 28 }
64   -#content .page-list A.page:hover {
65   - /*color: blue;*/
66   - background: white url(../images/comatose/title-hover-bg.gif) top left repeat-y;
  29 +
  30 +ul.page-list a:visited, ul.page-list a:link {
  31 + color: #000;
67 32 }
68   -#content .handle, #content .do-reorder UL LI .handle {
69   - display: none;
  33 +
  34 +ul.page-list a:hover {
  35 + background: #aa9;
70 36 }
71 37  
72 38 #content .page-list .hover {
73   -/* background: #F1F0DB; */
  39 + background: #F1F0DB;
  40 +}
  41 +
  42 +#content .page-list .commands A.delete-page:hover {
  43 + color: white;
  44 + background: black;
74 45 }
75 46 #content .page-list .hover-delete {
76 47 background: red;
77   -/* color: #FF8E90; */
  48 + color: #FF8E90;
78 49 }
79 50 #content .page-list .hover-delete A,
80 51 #content .page-list .hover-delete .commands A {
81   -/* color: #FF8E90; */
  52 + color: #FF8E90;
82 53 }
83 54 #content .page-list .hover-delete A.page {
84   -/* color: white; */
  55 + color: white;
85 56 border-bottom: 0px;
86 57 }
87 58 #content .page-list .hover-delete UL LI A.page {
88   -/* color: red; */
  59 + color: red;
89 60 border-bottom: 0px;
90 61 }
91 62  
92   -#content .do-reorder LI .handle {
93   - display: inline;
94   -/* background: gray; */
95   -/* color: white; */
96   - padding: 1px 3px;
97   - cursor: move;
98   -}
99   -
100   -#content .page-list .do-reorder .commands A {
101   - display: none;
102   -}
103   -
104   -/* Page Form */
105   -#content .page-form {
106   - margin-top: 10px;
107   -}
108   -#content .page-form LABEL {
109   - font-weight: bold;
110   -/* color: #555; */
111   -}
112   -#content .page-form .meta-info LABEL {
113   -/* color: #999 !important; */
  63 +/***********************************
  64 + * from stuff
  65 + ***********************************/
  66 +div.comatose_field {
114 67 }
115   -#content .page-form .label {
116   - padding-top: 5px;
117   - width: 75px;
118   - text-align: right;
119   - padding-right: 10px;
120   -}
121   -#content .page-form .label.body {
122   - vertical-align: top;
123   - padding-top: 10px;
124   -}
125   -#content .page-form .field {
126   - padding-top: 5px;
127   -}
128   -#content .page-form .field-help {
129   -/* color: gray; */
130   -}
131   -#content .page-form #page_title {
  68 +div.comatose_field label {
  69 + display: block;
132 70 font-weight: bold;
133 71 }
134   -#content .page-form #page_slug {
135   -/* color: gray; */
136   -}
137   -#content .page-form #page_body {
138   - font-family: monospace;
139   -}
140 72  
141   -#content #button-group {
142   - padding: 10px;
143   - text-align: right;
144   -/* background-color: #EAEAEA; */
145   - margin-top: 10px;
146   -}
147   -#content #button-group .last-update {
148   - float: left;
149   -/* color: gray; */
150   - padding-top: 4px;
151   - font-weight: bold;
152   -}
153   -#content #button-group .last-update LABEL {
154   - font-weight: normal;
155   -}
156   -#content #button-group .last-update A {
157   -/* color: gray; */
158   -}
159   -#content #button-group A {
160   -/* color: maroon; */
  73 +div.comatose_field textarea {
  74 + width: 90%;
161 75 }
162   -#content #button-group A:hover {
163   -/* color: red; */
  76 +div.comatose_field textarea,
  77 +div.comatose_field input,
  78 +div.comatose_field select {
  79 + border: 1px solid gray;
164 80 }
165 81  
166   -#content #preview-area {
167   - margin-top: 10px;
168   -}
169   -#content #preview-area FIELDSET {
170   -/* border: 1px solid silver; */
171   -}
172   -#content #preview-area LEGEND {
173   - font-size: 125%;
174   -}
175   -#content #preview-area .preview-body {
176   - padding: 10px;
177   -}
178   -#content #preview-area .preview-note {
179   -/* background: #FFFFD9; */
180   - padding: 15px;
181   -}
182   -#content #preview-area .commands {
183   - text-align: right;
184   -/* color: gray; */
185   -}
186   -#content #preview-area .commands A {
187   -/* color: gray; */
188   -}
189   -#content #preview-area .commands A:hover {
190   -/* color: black; */
191   -}
192   -#content .revisions {
193   - padding: 10px;
194   - width: 49%;
195   -}
196   -#content .current-content {
197   -}
198   -#content .older-content {
199   -/* background: #E9E9E9; */
200   - float: right;
201   -}
  82 +/****************************************
  83 + * revisions page stuff
  84 + ****************************************/
202 85  
203   -#content .revisions label {
204   - display: block;
205   -/* color: #000; */
206   -}
207   -#content .revisions label span {
208   -/* color: #999; */
209   - font-weight: normal !important;
210   -}
211   -#content .revisions .title {
212   - font-weight: bold;
213   - margin-top: 5px;
214   -}
215   -#content .revisions .header {
216   - font-size: 110%;
217   - vertical-align: middle;
218   - font-weight: bold;
219   -}
220   -#content .revisions .header-actions {
  86 +.older-content {
221 87 float: right;
222   - font-size: 90%;
223   - font-weight: normal;
224   -/* color: #999; */
225   -}
226   -#content .revisions .meta {
227   - margin-bottom: 15px;
228   -}
229   -#content .revisions .footer {
230   - margin-top: 25px !important;
231   - text-align: center !important;
232   -}
233   -#content #go-btn {
234   - display: none;
235 88 }
236   -/* Errors */
237   -#errorExplanation {
238   - border: 1px solid red;
239   -/* background: #FFEAEB; */
240   - padding: 10px;
241   - margin-top: 10px;
242   -}
243   -#errorExplanation h2 {
244   - margin: 0px;
245   - padding: 0px;
246   -/* color: maroon; */
247   -}
248   -#errorExplanation p {
249   - margin: 0px;
250   - padding: 0px;
251   - padding-top: 5px;
252   - padding-left: 15px;
253   -}
254   -#errorExplanation ul {
255   - margin: 0px;
256   - padding: 0px;
257   - padding-left: 35px;
258   -}
259   -#errorExplanation li {
260   - margin: 0px;
261   - padding: 0px;
262   - padding-top: 5px;
  89 +.current-content {
  90 + float: left;
263 91 }
264 92  
265   -/* Footer Area*/
266   -/*
267   -#footer {
268   - border-top: 4px solid #AAA;
269   - text-align: center;
270   - font-size: 90%;
271   - color: #AAA;
272   - padding-top: 5px;
273   - padding-bottom: 5px;
  93 +.revisions {
  94 + width: 47%;
  95 + border: 1px solid gray;
  96 + padding: 0.25em;
274 97 }
275   -#footer A {
276   - color: #AAA;
277   - text-decoration: none;
  98 +
  99 +.revisions .header {
278 100 font-weight: bold;
  101 + border-bottom: 1px solid black;
  102 + margin-bottom: 10px;
  103 + height: 40px;
279 104 }
280   -#footer A:hover {
281   - color: #333;
282   - text-decoration: underline;
283   -}
284   -*/
285   -
286   -/* Modifiers */
287 105  
288   -/* When JavaScript is Turned Off... We need to adjust some things... */
289   -.noscript #more-options,
290   -.noscript #preview-area,
291   -.noscript #preview-btn,
292   -.noscript .tree-controller {
293   - display: none;
294   -}
295   -.noscript .page-list.collapsed {
296   - display: block !important;
297   -}
298   -.noscript .delete-page:hover {
299   - color: red !important;
300   -}
301   -.noscript #content .page-form #page_title,
302   -.noscript #content .page-form #page_slug,
303   -.noscript #content .page-form #page_parent,
304   -.noscript #content .page-form #page_keywords,
305   -.noscript #content .page-form #page_body {
306   - width: 100% !important;
307   -}
308   -.noscript #content .revisions #go-btn {
309   - display: inline;
  106 +.revisions .meta {
  107 + border-bottom: 1px solid black;
  108 + margin-bottom: 10px;
310 109 }
311 110  
312   -ul.page-list li table,
313   -ul.page-list li td {
314   - border: none;
  111 +.revisions .footer {
  112 + border-top: 1px solid black;
  113 + margin-top: 10px;
  114 + padding: 0.25em;
315 115 }
316 116  
317   -div.comatose_field label {
318   - display: block;
  117 +.revisions .meta label span {
319 118 font-weight: bold;
320 119 }
321 120  
322   -div.comatose_field textarea {
323   - width: 100%;
324   -}
325   -div.comatose_field textarea,
326   -div.comatose_field input,
327   -div.comatose_field select {
328   - border: 1px solid gray;
  121 +.revisions .meta label {
  122 + font-weight: normal;
  123 + display: block;
329 124 }
... ...