Download as
Browse Code »

Commit e980497c70510e789a0aa3b6e1b240a985fce01a

Authored by Dylan Guedes
1 parent 0e741a07
Exists in software_communities_html_refactor

Refactor of the software_new_page for the plugin software_communities. 

Enhancement of the steps style for new_software page.
Fixes span tags, adjust html and css classes of new_software page

Signed-off-by: Dylan Guedes <djmgguedes@gmail.com>
Signed-off-by: Hebert Douglas <hebertdougl@gmail.com>
Showing 8 changed files with 209 additions and 75 deletions   Show diff stats
src/noosfero-spb/noosfero-spb-theme/css/edition-pages.css
  Diff comments   View file @e980497
... ... @@ -275,15 +275,17 @@
275 275 color: #585858;
276 276 }
277 277  
  278 +.action-software_communities_plugin_myprofile-new_software #content .main-block form textarea{
  279 + border-radius: 4px;
  280 + font-size: 15px;
  281 + font-family: arial, helvetica;
  282 + padding: 10px;
  283 +}
  284 +
278 285 .action-software_communities_plugin_myprofile-new_software #content .formfield input{
279 286 background: none #FFFFFF;
280   - border: 1px solid #DDDDDD;
281   - color: #585858;
282   - font-size: 16px;
283   - width: 76%;
284   - word-wrap: break-word;
285   - border-radius: 4px;
286 287 }
  288 +
287 289 .action-software_communities_plugin_myprofile-new_software #content .main-content form label.formlabel.mandatory{
288 290 font-size: 14px;
289 291 margin-bottom: 5px;
... ... @@ -317,20 +319,15 @@
317 319 }
318 320  
319 321 .action-software_communities_plugin_myprofile-new_software #software-name-field span #community-identifier{
320   - width: auto;
  322 + width: 500px;
321 323 }
322 324  
323 325 .action-software_communities_plugin_myprofile-new_software #content #software-hostname {
324   - line-height: 22px;
325   - padding: 0px;
326   - color: #4A4A4A;
327   - font-size: 20px;
328   - text-transform: lowercase;
329   - border-spacing: 20px;
  326 + position: absolute;
  327 + font-size: 15px;
330 328 }
331 329  
332 330 .action-software_communities_plugin_myprofile-new_software #content .main-block form #profile_change_picture {
333   - padding: 0 15px 15px 15px;
334 331 border: 1px dotted #ddd;
335 332 margin-top: 10px;
336 333 }
... ... @@ -464,7 +461,6 @@ font-size: 10px;
464 461 font-weight: 500;
465 462 }
466 463  
467   -
468 464 .action-contact-new .formfield textarea{
469 465 background: none #FFFFFF;
470 466 border: 1px solid #DDDDDD;
... ... @@ -503,7 +499,6 @@ font-size: 10px;
503 499 display: none;
504 500 }
505 501  
506   -
507 502 .action-tasks-index select{
508 503 background: none;
509 504 border: 1px solid #D3D6DE;
... ... @@ -512,6 +507,7 @@ font-size: 10px;
512 507 margin: 0px 0px 0px 10px;
513 508 font-size: 14px;
514 509 }
  510 +
515 511 .action-tasks-index #content .main-block form input[type="text"] {
516 512 display: block;
517 513 height: 19px;
... ... @@ -544,7 +540,18 @@ font-size: 10px;
544 540 line-height: 20px;
545 541 position: absolute;
546 542 }
  543 +
547 544 .action-tasks-index .task_decisions label{
548 545 margin: 2px 0px 2px 30px;
549 546 line-height: 22px;
550 547 }
  548 +
  549 +#content .new-software-form .button-bar .button.with-text.icon-save.submit{
  550 + background: #3E67B1;
  551 + color: #FFF;
  552 +}
  553 +
  554 +#content .new-software-form .button-bar .button.with-text.icon-save.submit:hover{
  555 + background: #FFF;
  556 + color: #3E67B1;
  557 +}
... ...
src/noosfero-spb/noosfero-spb-theme/css/software-pages.css
  Diff comments   View file @e980497
... ... @@ -751,3 +751,125 @@
751 751 font-weight: 800;
752 752 padding-top: 30px;
753 753 }
  754 +
  755 +/* software_communites new software page refactor */
  756 +.new-software-form .optional-box{
  757 + margin-bottom: 20px;
  758 +}
  759 +
  760 +.new-software-form div#errorExplanation{
  761 + margin-left: 0px;
  762 + color: #FF0366;
  763 +}
  764 +
  765 +.new-software-form div#errorExplanation ul li{
  766 + list-style-type: disc;
  767 + list-style-position: inside;
  768 + margin-bottom: 5px;
  769 + font-size: 13px;
  770 +}
  771 +
  772 +.new-software-form div#errorExplanation h2{
  773 + color: #000;
  774 + padding: 0px;
  775 + font-size: 16px;
  776 + background: none;
  777 + text-align: left;
  778 +}
  779 +
  780 +.new-software-form .step-explanation span{
  781 + font-size: 14px;
  782 +}
  783 +
  784 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .highlight-error[type="text"],
  785 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .highlight-error{
  786 + border: 1px solid #FF0366;
  787 + box-shadow: none;
  788 +}
  789 +
  790 +.action-software_communities_plugin_myprofile-new_software #content .main-block form #software_info_finality{
  791 + width: 490px;
  792 +}
  793 +
  794 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .obrigatory-field .highlight-error[type="text"],
  795 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .optional-field input[type="text"],
  796 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .obrigatory-field input[type="text"]{
  797 + width: 500px;
  798 +}
  799 +
  800 +.action-software_communities_plugin_myprofile-new_software .new-software-form #software-name-field #community-identifier{
  801 + width: 291px;
  802 + padding-left: 215px;
  803 +}
  804 +
  805 +.new-software-form .optional-field label.formlabel,
  806 +.new-software-form .optional-box label {
  807 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
  808 + font-size: 14px;
  809 + color: #231f20;
  810 +}
  811 +
  812 +.new-software-form #content .main-block form .optional-box #profile_change_picture.software-label-box{
  813 + width: 470px;
  814 + border-radius: 4px;
  815 +}
  816 +
  817 +.action-software_communities_plugin_myprofile-new_software #content .main-block form #profile_change_picture{
  818 + border: none;
  819 +}
  820 +
  821 +.new-software-form .formfieldline{
  822 + padding: 0px;
  823 +}
  824 +
  825 +.new-software-form #community_image_builder_uploaded_data{
  826 + border: none;
  827 +}
  828 +
  829 +.new-software-form #community_image_builder_label{
  830 + display: none !important;
  831 +}
  832 +
  833 +.new-software-form .formfield input{
  834 + text-indent: 0px;
  835 + padding: 0px;
  836 + font-size: 14px;
  837 +}
  838 +
  839 +/* end of software_communites new software page refactor */
  840 +
  841 +/* software_steps */
  842 +.software-step-info{
  843 + padding-bottom: 30px;
  844 + display: block;
  845 +}
  846 +
  847 +.software-step-info ul li{
  848 + float: left;
  849 + margin-right: 30px;
  850 + border-right: 1px solid #eee;
  851 + padding-right: 30px;
  852 + font-size: 14px;
  853 +}
  854 +
  855 +.software-step-info ul li:last-child{
  856 + border: none;
  857 +}
  858 +
  859 +.software-step-info ul li .current-step{
  860 + background: #FF0366;
  861 +}
  862 +
  863 +.software-step-info ul li span{
  864 + display: inline-block;
  865 + height: 24px;
  866 + width: 24px;
  867 + border-radius: 50%;
  868 + color: #fff;
  869 + text-align: center;
  870 + margin-right: 6px;
  871 + background: #333;
  872 + padding: 1px 0 0 0;
  873 + font-weight: 700;
  874 +}
  875 +/* end of software_steps */
... ...
src/noosfero-spb/software_communities/public/style.css
  Diff comments   View file @e980497
... ... @@ -82,11 +82,8 @@
82 82 background: url(../../../designs/themes/base/imgs/arrow-right-p.png) 100% 50% no-repeat;
83 83 }
84 84  
85   -/*FIX-ME: necessary while there is
86   -* not a defined theme style for the
87   -* forms */
88   -.improve_input_size {
89   - width: 315px !important;
  85 +#software-info-repository-link{
  86 + width: 315px;
90 87 }
91 88  
92 89 .software-block {
... ... @@ -141,3 +138,13 @@
141 138 }
142 139  
143 140 /* end of profile_design download block */
  141 +
  142 +/* new_software page */
  143 +.new-software-form .obrigatory-field {
  144 + margin-bottom: 20px;
  145 +}
  146 +
  147 +.new-software-form .optional-field {
  148 + margin-bottom: 20px;
  149 +}
  150 +/* end of new_software page */
... ...
src/noosfero-spb/software_communities/views/comments_extra_fields.html.erb
  Diff comments   View file @e980497
1   -<div class="comments-display-fields">
  1 +<div class="comments-display-fields">
2 2 <span id="comments-additional-information">
3 3 <%= _("Additional informations") %>
4 4 </span>
... ...
src/noosfero-spb/software_communities/views/profile_editor/_first_edit_software_community_extras.html.erb
  Diff comments   View file @e980497
1 1 <div class="software-step-info">
2   - <div class= <%= class_step_one %> >
3   - <h3><%= _("Step 1 - Software Creation")%></h3>
4   - </div>
5   -
6   - <div class= <%= class_step_two %> >
7   - <h3><%= _("Step 2 - Community Settings")%></h3>
8   - </div>
  2 + <ul>
  3 + <li><span class= <%= class_step_one %> >1</span><%= _("Software Creation") %></li>
  4 + <li><span class= <%= class_step_two %> >2</span><%= _("Community Settings") %></li>
  5 + </ul>
9 6 </div>
... ...
src/noosfero-spb/software_communities/views/profile_editor/edit_software_community.html.erb
  Diff comments   View file @e980497
1 1  
2   -<%= render :partial => 'first_edit_software_community_extras', :locals => {:class_step_one => "another-step", :class_step_two => "current-step"} if @first_edit %>
  2 +<%= render :partial => 'profile_editor/first_edit_software_community_extras', :locals => {:class_step_one => "another-step", :class_step_two => "current-step"} if @first_edit %>
3 3  
4 4 <h1><%= _('Configure Software Community') %></h1>
5 5  
... ...
src/noosfero-spb/software_communities/views/software_communities_plugin_myprofile/_license_info_fields.html.erb
  Diff comments   View file @e980497
1   -<%= text_field_tag "license_info[version]", license_version, :id=>"license_info_version", :class=>"license_info_version", :placeholder=>_('Autocomplete field, type some license') %>
  1 +<%= text_field_tag "license_info[version]", license_version, :id=>"license_info_version", :class=>"license_info_version #{@error_software_license}", :placeholder=>_('Autocomplete field, type some license') %>
2 2 <%= hidden_field_tag "license[license_infos_id]", license_id, :id=>"license_info_id", :class=>"license_info_id", :data => {:label=>license_version} %>
3 3  
4 4 <a id = "version_link" href="#" target="_BLANK" class="hide-field"><%= _("Read license") %></a>
... ...
src/noosfero-spb/software_communities/views/software_communities_plugin_myprofile/new_software.html.erb
  Diff comments   View file @e980497
... ... @@ -5,10 +5,10 @@
5 5 <h1><%= _('Creating new software') %></h1>
6 6  
7 7 <div class='step-explanation'>
8   - <spam>
  8 + <span>
9 9 <%= _('Enter the basic information about the software.<br>
10 10 You can add the details after you create it.') %>
11   - </spam>
  11 + </span>
12 12 </div>
13 13  
14 14 <% if environment.enabled?('admin_must_approve_new_communities') %>
... ... @@ -16,80 +16,81 @@
16 16 <%= _("Note that the creation of communities in this environment is restricted. Your request to create this new community will be sent to %{environment} administrators and will be approved or rejected according to their methods and criteria.") % { :environment => environment.name }%>
17 17 </div>
18 18 <%end %>
  19 +<div class="new-software-form">
19 20  
20   -<% unless @errors.blank? %>
21   -<div class="errorExplanation" id="errorExplanation">
22   - <h2> <%= _("Can`t create new software: %s errors") % @errors.length %> </h2>
23   - <ul>
24   - <% @errors.each do |error| %>
25   - <li> <%= error %> </li>
26   - <% end %>
27   - </ul>
28   -</div>
29   -<% end %>
30   -
31   -<div>
32 21 <%= labelled_form_for :community, :html => { :multipart => true } do |f| %>
33 22  
34 23 <%= required_fields_message %>
35 24  
36   - <div class= <%= @error_community_name %> >
  25 + <% unless @errors.blank? %>
  26 + <div class="errorExplanation" id="errorExplanation">
  27 + <h2> <%= _("Can`t create new software: %s errors") % @errors.length %> </h2>
  28 + <ul>
  29 + <% @errors.each do |error| %>
  30 + <li> <%= error %> </li>
  31 + <% end %>
  32 + </ul>
  33 + </div>
  34 + <% end %>
  35 +
  36 + <div class="obrigatory-field">
37 37 <%= label("name", _('Name'), {:class => 'formlabel mandatory'}) %>
38   - <%= required text_field(:community, :name, :size => 30, :maxlength => 100, :id => 'community_name_id') %>
  38 + <%= required text_field(:community, :name, :size => 30, :maxlength => 100, :id => 'community_name_id', :class => @error_community_name) %>
39 39 </div>
40 40  
41   - <br>
42   - <br>
43   -
44   - <div class= <%= @error_software_domain %> >
  41 + <div class="obrigatory-field">
45 42 <%= label("domain", _('Domain'), {:class => "formlabel mandatory"}) %>
46 43 <div id='software-name-field' class='formfield'>
47   -
48 44 <span id='software-hostname'><%= environment.default_hostname %>/</span>
49   - <%= required text_field(:community, :identifier, :size => 30, :maxlength => 100, :id => 'community-identifier') %>
  45 + <%= required text_field(:community, :identifier, :size => 30, :maxlength => 100, :class => @error_software_domain, :id => 'community-identifier') %>
50 46 </div>
51 47 </div>
52 48  
53   - <div class= <%= @error_software_finality %> >
  49 + <div class="obrigatory-field">
54 50 <%= fields_for @software_info do |swf| %>
55 51 <div id="finality" class="formfield type-text">
56 52 <%= swf.label("finality" ,_("Finality"), :class=>"formlabel mandatory") %>
57   - <%= required swf.text_area(:finality, :placeholder => _("What is the software for?"), :maxlength => 120) %>
  53 + <%= required swf.text_area(:finality, :placeholder => _("What is the software for?"), :maxlength => 120, :class => @error_software_finality) %>
58 54 </div>
59 55 <% end %>
60 56 </div>
61 57  
62   - <div id="profile_change_picture_title" class="formlabel">
63   - <label>
64   - <%= _('Software Logo') %>
65   - </label>
66   - </div>
67   - <div id="profile_change_picture">
  58 + <div class="optional-box">
  59 + <div id="profile_change_picture_title" class="formlabel software-label">
  60 + <label>
  61 + <%= _('Software Logo') %>
  62 + </label>
  63 + </div>
  64 + <div id="profile_change_picture" class="software-label-box">
68 65 <%= f.fields_for :image_builder, @community.image do |i| %>
69   - <%= file_field_or_thumbnail(_('Image:'), @community.image, i) %><%= _("Max size: %s (.jpg, .gif, .png)")% Image.max_size.to_humanreadable %>
  66 + <%= file_field_or_thumbnail(_('Image:'), @community.image, i) %>
  67 + <%= _("Max size: %s (.jpg, .gif, .png)")% Image.max_size.to_humanreadable %>
70 68 <% end %>
  69 + </div>
71 70 </div>
72 71  
73   - <div class= <%= @error_software_license %> >
  72 + <div class="obrigatory-field">
74 73 <div id="profile_change_picture_title" class="formlabel formfieldline">
75 74 <label class="formlabel mandatory">
76 75 <%= _("License Version: ") %>
77 76 </label>
78   - <%= render :partial => "license_info_fields", :locals => {
79   - :license_version => "",
80   - :license_id => "",
81   - :another_version=>"",
82   - :another_link=>""
83   - } %>
  77 + <%= render :partial => "license_info_fields", :locals => {
  78 + :license_version => "",
  79 + :license_id => "",
  80 + :another_version=>"",
  81 + :another_link=>""
  82 + } %>
84 83 </div>
85 84 </div>
86 85  
87   - <%= fields_for @software_info do |swf| %>
88   - <div class="formfieldline formfield type-text">
89   - <%= swf.label "repository_url", _("Link to Repository: "), :class => "formlabel"%>
90   - <%= swf.text_field :repository_link, :class => "improve_input_size", :id => "software-info-repository-link" %>
91   - </div>
92   - <% end %>
  86 + <div class="optional-field">
  87 + <%= fields_for @software_info do |swf| %>
  88 + <div class="formfieldline formfield type-text">
  89 + <%= swf.label "repository_url", _("Link to Repository: "), :class => "formlabel" %>
  90 + <%= swf.text_field :repository_link, :class => "improve_input_size", :id => "software-info-repository-link" %>
  91 + </div>
  92 + <% end %>
  93 + </div>
93 94  
94 95 <%= hidden_field_tag('back_to', @back_to) %>
95 96  
... ...