Commit 6f1ddaea69c5fd0057d96308017409184344f3f6
1 parent
e5caad05
Exists in
master
and in
29 other branches
ActionItem122: adding a user interface mockup; will work on actually
making work latter git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@2389 3f533792-8f58-4932-b0fe-aaf55b0a4547
Showing
8 changed files
with
195 additions
and
1 deletions
Show diff stats
app/views/profile_editor/index.rhtml
... | ... | @@ -15,6 +15,8 @@ |
15 | 15 | <%= file_manager_button(_('Pending tasks'), 'icons-app/todo.png', :controller => 'tasks', :action => 'index') %> |
16 | 16 | |
17 | 17 | <%= file_manager_button(_('Edit sideboxes'), 'icons-app/design-editor.png', :controller => 'profile_design', :action => 'index') %> |
18 | + | |
19 | + <%= file_manager_button(_('Edit Appearance'), 'icons-app/design-editor.png', :controller => 'themes', :action => 'index') %> | |
18 | 20 | |
19 | 21 | <%= file_manager_button(_('Edit Header and Footer'), 'icons-app/header-and-footer.png', :controller => 'profile_editor', :action => 'header_footer') %> |
20 | 22 | ... | ... |
... | ... | @@ -0,0 +1 @@ |
1 | +<%= javascript_include_tag 'codepress/codepress.js' %> | ... | ... |
... | ... | @@ -0,0 +1,63 @@ |
1 | +<form> | |
2 | + <%# FIXME %> | |
3 | + <h1 id='theme-name'> | |
4 | + <%= _('Editing theme %s') % text_field_tag('theme_name', 'my theme') %> | |
5 | + <%= icon_button(:save, _('Save'), '#') %> | |
6 | + </h1> | |
7 | +</form> | |
8 | + | |
9 | +<div id='css-files-list'> | |
10 | + <h2><%= _('CSS files') %></h2> | |
11 | + <ul> | |
12 | + <li><a href="">common.css</a></li> | |
13 | + <li><a href="">header.css</a></li> | |
14 | + <li><a href="">footer.css</a></li> | |
15 | + <li><a href="">sideboxes.css</a></li> | |
16 | + <li><a href="">otherstuff1.css</a></li> | |
17 | + <li><a href="">otherstuff1.css</a></li> | |
18 | + <li><a href="">otherstuff1.css</a></li> | |
19 | + <li><a href="">otherstuff2css</a></li> | |
20 | + <li><a href="">otherstuff3.css</a></li> | |
21 | + <li><a href="">otherstuff4.css</a></li> | |
22 | + <li><a href="">otherstuff2css</a></li> | |
23 | + <li><a href="">otherstuff3.css</a></li> | |
24 | + <li><a href="">otherstuff4.css</a></li> | |
25 | + <li><a href="">otherstuff2css</a></li> | |
26 | + <li><a href="">otherstuff3.css</a></li> | |
27 | + <li><a href="">otherstuff4.css</a></li> | |
28 | + </ul> | |
29 | + <% button_bar do %> | |
30 | + <%= button(:add, _('New CSS'), '') %> | |
31 | + <% end %> | |
32 | +</div> | |
33 | + | |
34 | +<div id='image-files-list'> | |
35 | + <h2><%= _('Images') %></h2> | |
36 | + <ul> | |
37 | + <li><img src='/images/icons-app/gtk-cancel.png' /><span>Image 1</span></li> | |
38 | + <li><img src='/images/icons-app/cms.png' /><span>Image_2_a_very_large_filename</span></li> | |
39 | + <li><img src='http://www.ynternet.org/banner/' /><span>a wide image</span></li> | |
40 | + <li><img src='/images/icons-app/enable.png' /><span>Image 3</span></li> | |
41 | + <li><img src='/images/icons-app/gnome-globe.png' /><span>Image 4</span></li> | |
42 | + <li><img src='/images/icons-app/gtk-yes.png' /><span>Image 5</span></li> | |
43 | + <li><img src='/images/icons-app/mail.png' /><span>Image 6</span></li> | |
44 | + </ul> | |
45 | + <% button_bar do %> | |
46 | + <%= button(:add, _('Upload image'), '') %> | |
47 | + <% end %> | |
48 | +</div> | |
49 | + | |
50 | +<form id='css-code'> | |
51 | + <%# FIXME %> | |
52 | + <h2><%= _('CSS code: "%s"') % 'common.css' %></h2> | |
53 | + <textarea name='csscode' id="csscode" class='codepress css'> | |
54 | + body { | |
55 | + background: yellow; | |
56 | + } | |
57 | + </textarea> | |
58 | + <% button_bar do %> | |
59 | + <%= button(:save, _('Save'), '') %> | |
60 | + <% end %> | |
61 | +</form> | |
62 | + | |
63 | +<%= render :file => 'shared/codepress' %> | ... | ... |
public/javascripts/codepress/codepress.js
... | ... | @@ -120,7 +120,7 @@ CodePress.run = function() { |
120 | 120 | s = document.getElementsByTagName('script'); |
121 | 121 | for(var i=0,n=s.length;i<n;i++) { |
122 | 122 | if(s[i].src.match('codepress.js')) { |
123 | - CodePress.path = s[i].src.replace('codepress.js',''); | |
123 | + CodePress.path = s[i].src.replace(/codepress\.js.*$/,''); | |
124 | 124 | } |
125 | 125 | } |
126 | 126 | t = document.getElementsByTagName('textarea'); | ... | ... |
... | ... | @@ -0,0 +1,115 @@ |
1 | +/* common stuff */ | |
2 | +#css-files-list h2, #image-files-list h2 { | |
3 | + margin-top: 0px; | |
4 | +} | |
5 | + | |
6 | +#css-files-list ul, #image-files-list ul, #css-code textarea { | |
7 | + height: 280px; | |
8 | +} | |
9 | + | |
10 | +#css-files-list ul, #image-files-list ul { | |
11 | + overflow: auto; | |
12 | +} | |
13 | + | |
14 | +/* header stuff */ | |
15 | +#theme-name input { | |
16 | + font-size: 18px; | |
17 | + border: 1px solid black; | |
18 | + background: white; | |
19 | + padding: 2px; | |
20 | + font-weight: bold; | |
21 | +} | |
22 | + | |
23 | + | |
24 | +/* files list */ | |
25 | + | |
26 | +#css-files-list { | |
27 | + width: 200px; | |
28 | + float: left; | |
29 | + margin-left: 10px; | |
30 | +} | |
31 | + | |
32 | +#css-files-list ul { | |
33 | + margin: 0px; | |
34 | + padding-left: 0px; | |
35 | + | |
36 | + background: white; | |
37 | + border: 1px solid #bbb; | |
38 | +} | |
39 | + | |
40 | +#css-files-list li { | |
41 | + list-style: none; | |
42 | + margin-bottom: 5px; | |
43 | + border-bottom: 1px solid #bbb; | |
44 | +} | |
45 | + | |
46 | +#css-files-list li a { | |
47 | + display: block; | |
48 | + padding: 1px 5px; | |
49 | +} | |
50 | + | |
51 | +#css-files-list a:hover { | |
52 | + color: red; | |
53 | +} | |
54 | + | |
55 | +/* images list */ | |
56 | + | |
57 | +#image-files-list { | |
58 | + width: 200px; | |
59 | + float: right; | |
60 | + margin-right: 10px; | |
61 | +} | |
62 | + | |
63 | +#image-files-list ul { | |
64 | + background: white; | |
65 | + border: 1px solid #bbb; | |
66 | +} | |
67 | + | |
68 | +#image-files-list ul, #image-files-list li { | |
69 | + padding: 0px; | |
70 | + margin: 0px; | |
71 | + list-style: none; | |
72 | +} | |
73 | + | |
74 | +#image-files-list li { | |
75 | + border-bottom: 1px solid #bbb; | |
76 | + padding: 5px 0px; | |
77 | + text-align: center; | |
78 | +} | |
79 | + | |
80 | +#image-files-list img { | |
81 | + max-width: 98%; | |
82 | + max-height: 40px; | |
83 | +} | |
84 | + | |
85 | +.msie6 #image-files-list img { | |
86 | + width: 50%; | |
87 | + height: 40px; | |
88 | +} | |
89 | + | |
90 | +#image-files-list li span { | |
91 | + display: block; | |
92 | + width: 100%; | |
93 | + overflow: hidden; | |
94 | +} | |
95 | + | |
96 | +/* textbox */ | |
97 | + | |
98 | +#css-code { | |
99 | + margin-left: 220px; | |
100 | + margin-right: 220px; | |
101 | +} | |
102 | + | |
103 | +.msie6 #css-code { | |
104 | + float: left; | |
105 | + margin-left: 20px; | |
106 | + margin-right: 240px; | |
107 | +} | |
108 | + | |
109 | +#css-code textarea { | |
110 | + width: 100%; | |
111 | +} | |
112 | + | |
113 | +.msie6 #css-code textarea { | |
114 | + width: 500px; | |
115 | +} | ... | ... |