Commit 3a816daff4c0998707a84d58a99ed7ca7376a19c

Authored by Daniela Feitosa
2 parents dad15f18 fd4ed249

Merge branch 'software_communities_html_refactor' into 'master'

Software communities html refactor

Melhora as classes do arquivo views/comments_extra_fields.html.erb do plugin software_communities, e corrige o highlight (ao invés de dar highlight no bloco, o highlight só aparece no field).

Tem a ver com a issue #706 em partes.

See merge request !177
src/noosfero-spb/noosfero-spb-theme/css/edition-pages.css
... ... @@ -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,16 @@
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;
  328 + padding: 5px 10px;
330 329 }
331 330  
332 331 .action-software_communities_plugin_myprofile-new_software #content .main-block form #profile_change_picture {
333   - padding: 0 15px 15px 15px;
334 332 border: 1px dotted #ddd;
335 333 margin-top: 10px;
336 334 }
... ... @@ -464,7 +462,6 @@ font-size: 10px;
464 462 font-weight: 500;
465 463 }
466 464  
467   -
468 465 .action-contact-new .formfield textarea{
469 466 background: none #FFFFFF;
470 467 border: 1px solid #DDDDDD;
... ... @@ -503,7 +500,6 @@ font-size: 10px;
503 500 display: none;
504 501 }
505 502  
506   -
507 503 .action-tasks-index select{
508 504 background: none;
509 505 border: 1px solid #D3D6DE;
... ... @@ -512,6 +508,7 @@ font-size: 10px;
512 508 margin: 0px 0px 0px 10px;
513 509 font-size: 14px;
514 510 }
  511 +
515 512 .action-tasks-index #content .main-block form input[type="text"] {
516 513 display: block;
517 514 height: 19px;
... ... @@ -544,7 +541,18 @@ font-size: 10px;
544 541 line-height: 20px;
545 542 position: absolute;
546 543 }
  544 +
547 545 .action-tasks-index .task_decisions label{
548 546 margin: 2px 0px 2px 30px;
549 547 line-height: 22px;
550 548 }
  549 +
  550 +#content .new-software-form .button-bar .button.with-text.icon-save.submit{
  551 + background: #3E67B1;
  552 + color: #FFF;
  553 +}
  554 +
  555 +#content .new-software-form .button-bar .button.with-text.icon-save.submit:hover{
  556 + background: #FFF;
  557 + color: #3E67B1;
  558 +}
... ...
src/noosfero-spb/noosfero-spb-theme/css/software-pages.css
... ... @@ -760,3 +760,125 @@
760 760 font-weight: 800;
761 761 padding-top: 30px;
762 762 }
  763 +
  764 +/* software_communites new software page refactor */
  765 +.new-software-form .optional-box{
  766 + margin-bottom: 20px;
  767 +}
  768 +
  769 +.new-software-form div#errorExplanation{
  770 + margin-left: 0px;
  771 + color: #FF0366;
  772 +}
  773 +
  774 +.new-software-form div#errorExplanation ul li{
  775 + list-style-type: disc;
  776 + list-style-position: inside;
  777 + margin-bottom: 5px;
  778 + font-size: 13px;
  779 +}
  780 +
  781 +.new-software-form div#errorExplanation h2{
  782 + color: #000;
  783 + padding: 0px;
  784 + font-size: 16px;
  785 + background: none;
  786 + text-align: left;
  787 +}
  788 +
  789 +.new-software-form .step-explanation span{
  790 + font-size: 14px;
  791 +}
  792 +
  793 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .highlight-error[type="text"],
  794 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .highlight-error{
  795 + border: 1px solid #FF0366;
  796 + box-shadow: none;
  797 +}
  798 +
  799 +.action-software_communities_plugin_myprofile-new_software #content .main-block form #software_info_finality{
  800 + width: 490px;
  801 +}
  802 +
  803 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .obrigatory-field .highlight-error[type="text"],
  804 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .optional-field input[type="text"],
  805 +.action-software_communities_plugin_myprofile-new_software #content .main-block form .obrigatory-field input[type="text"]{
  806 + width: 500px;
  807 +}
  808 +
  809 +.action-software_communities_plugin_myprofile-new_software .new-software-form #software-name-field #community-identifier{
  810 + width: 277px;
  811 + padding-left: 228px;
  812 +}
  813 +
  814 +.new-software-form .optional-field label.formlabel,
  815 +.new-software-form .optional-box label {
  816 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
  817 + font-size: 14px;
  818 + color: #231f20;
  819 +}
  820 +
  821 +.new-software-form #content .main-block form .optional-box #profile_change_picture.software-label-box{
  822 + width: 470px;
  823 + border-radius: 4px;
  824 +}
  825 +
  826 +.action-software_communities_plugin_myprofile-new_software #content .main-block form #profile_change_picture{
  827 + border: none;
  828 +}
  829 +
  830 +.new-software-form .formfieldline{
  831 + padding: 0px;
  832 +}
  833 +
  834 +.new-software-form #community_image_builder_uploaded_data{
  835 + border: none;
  836 +}
  837 +
  838 +.new-software-form #community_image_builder_label{
  839 + display: none !important;
  840 +}
  841 +
  842 +.new-software-form .formfield input{
  843 + text-indent: 0px;
  844 + padding: 0px;
  845 + font-size: 14px;
  846 +}
  847 +
  848 +/* end of software_communites new software page refactor */
  849 +
  850 +/* software_steps */
  851 +.software-step-info{
  852 + padding-bottom: 30px;
  853 + display: block;
  854 +}
  855 +
  856 +.software-step-info ul li{
  857 + float: left;
  858 + margin-right: 30px;
  859 + border-right: 1px solid #eee;
  860 + padding-right: 30px;
  861 + font-size: 14px;
  862 +}
  863 +
  864 +.software-step-info ul li:last-child{
  865 + border: none;
  866 +}
  867 +
  868 +.software-step-info ul li .current-step{
  869 + background: #FF0366;
  870 +}
  871 +
  872 +.software-step-info ul li span{
  873 + display: inline-block;
  874 + height: 24px;
  875 + width: 24px;
  876 + border-radius: 50%;
  877 + color: #fff;
  878 + text-align: center;
  879 + margin-right: 6px;
  880 + background: #333;
  881 + padding: 1px 0 0 0;
  882 + font-weight: 700;
  883 +}
  884 +/* end of software_steps */
... ...
src/noosfero-spb/software_communities/public/style.css
... ... @@ -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
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
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
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
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
... ... @@ -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   - <span id='software-hostname'><%= environment.default_hostname %>/</span>
49   - <%= required text_field(:community, :identifier, :size => 30, :maxlength => 100, :id => 'community-identifier') %>
  44 + <span id='software-hostname'><%= top_url %>/</span>
  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  
... ...