Commit 6f1ddaea69c5fd0057d96308017409184344f3f6
1 parent
e5caad05
Exists in
staging
and in
42 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,6 +15,8 @@ | ||
15 | <%= file_manager_button(_('Pending tasks'), 'icons-app/todo.png', :controller => 'tasks', :action => 'index') %> | 15 | <%= file_manager_button(_('Pending tasks'), 'icons-app/todo.png', :controller => 'tasks', :action => 'index') %> |
16 | 16 | ||
17 | <%= file_manager_button(_('Edit sideboxes'), 'icons-app/design-editor.png', :controller => 'profile_design', :action => 'index') %> | 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 | <%= file_manager_button(_('Edit Header and Footer'), 'icons-app/header-and-footer.png', :controller => 'profile_editor', :action => 'header_footer') %> | 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 @@ | @@ -0,0 +1 @@ | ||
1 | +<%= javascript_include_tag 'codepress/codepress.js' %> |
@@ -0,0 +1,63 @@ | @@ -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,7 +120,7 @@ CodePress.run = function() { | ||
120 | s = document.getElementsByTagName('script'); | 120 | s = document.getElementsByTagName('script'); |
121 | for(var i=0,n=s.length;i<n;i++) { | 121 | for(var i=0,n=s.length;i<n;i++) { |
122 | if(s[i].src.match('codepress.js')) { | 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 | t = document.getElementsByTagName('textarea'); | 126 | t = document.getElementsByTagName('textarea'); |
@@ -0,0 +1,115 @@ | @@ -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 | +} |