Commit acaae92c89633904fb84933cab8fc139d8d1f45c

Authored by Melissa Wen
1 parent 34f023c1
Exists in master and in 79 other branches add_sisp_to_chef, add_super_archives_plugin, api_for_colab, automates_core_packing, backup_not_prod, changes_in_buttons_on_content_panel, colab_automated_login, colab_spb_plugin_recipe, colab_widgets_settings, design_validation, dev_env_minimal, disable_email_dev, fix_breadcrumbs_position, fix_categories_software_link, fix_edit_institution, fix_edit_software_with_another_license, fix_get_license_info, fix_gitlab_assets_permission, fix_list_style_inside_article, fix_list_style_on_folder_elements, fix_members_pagination, fix_merge_request_url, fix_models_translations, fix_no_license, fix_software_api, fix_software_block_migration, fix_software_communities_translations, fix_software_communities_unit_test, fix_style_create_institution_admin_panel, fix_superarchives_imports, fix_sym_links_noosfero, focus_search_field_theme, gov-user-refactoring, gov-user-refactoring-rails4, header_fix, institution_modal_on_rating, kalibro-conf-refactoring, kalibro-processor-package, lxc_settings, margin_fix, mezuro_cookbook, prezento, refactor_download_block, refactor_software_communities, refactor_software_for_sisp, register_page, release-process, release-process-v2, remove-unused-images, remove_broken_theme, remove_secondary_email_from_user, remove_sisp_buttons, removing_super_archives_email, review_message, scope2method, signals_user_noosfero, sisp_catalog_header, sisp_colab_config, sisp_dev, sisp_dev_master, sisp_simple_version, software_as_organization, software_catalog_style_fix, software_communities_html_refactor, software_infos_api, spb_minimal_env, spb_to_rails4, spec_refactor, stable-4.1, stable-4.2, stable-4.x, temp_soft_comm_refactoring, theme_header, theme_javascript_refactory, thread_dropdown, thread_page, update_search_by_categories, update_software_api, update_softwares_boxes

Adding software internal pages style

css/article-page.css 0 → 100644
... ... @@ -0,0 +1,92 @@
  1 +/*** General Definitions ***/
  2 +#content .main-block #article-header h1.title{
  3 + margin-bottom: 10px;
  4 + padding: 0px 0px 10px 0px;
  5 + color: #172738;
  6 + border-bottom: 1px solid #D3D6DE;
  7 + font-family: Arial, open_sansbold, Helvetica, sans-serif;
  8 + font-size: 34px;
  9 + font-variant: normal;
  10 + font-weight: bold;
  11 + line-height: 37px;
  12 + text-transform: capitalize;
  13 +}
  14 +
  15 +#content .main-block #article-header .publishing-info span{
  16 + font-size: 12px;
  17 + color: #172738;
  18 + font-family: Arial;
  19 +}
  20 +
  21 +#content .main-block .article-body {
  22 + font-family: Arial ;
  23 + font-size: 15px;
  24 + line-height: 21px;
  25 +}
  26 +
  27 +/* For software internal pages */
  28 +
  29 +#content .main-block .article-body h2 {
  30 + margin-bottom: 20px;
  31 + font-family: Arial;
  32 + font-size: 16px;
  33 + font-weight: bold;
  34 + line-height: 21px;
  35 +}
  36 +
  37 +#content .main-block .article-body h3 {
  38 + margin-bottom: 20px;
  39 + font-size: 15px;
  40 + line-height: 21px;
  41 + font-weight: bold;
  42 + font-family: Arial;
  43 +}
  44 +
  45 +#content .main-block .article-body p{
  46 + margin-bottom: 22px;
  47 + font-family: arial;
  48 +}
  49 +
  50 +#content .main-block .article-body .zoomable-image,
  51 +#content .main-block .article-body img {
  52 + display: block;
  53 +}
  54 +
  55 +#content .main-block .article-body hr {
  56 + height: 0;
  57 + margin: 30px 0;
  58 + border: 0;
  59 + border-top: 1px solid rgba(0, 0, 0, 0.1);
  60 + border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  61 +}
  62 +
  63 +#content .main-block .article-body #article-actions:last-child{
  64 + padding-top: 10px;
  65 + border-top: 4px solid #2C4B6B;
  66 +}
  67 +
  68 +/*** Categories ***/
  69 +
  70 +#content .main-block #article-cat h4 {
  71 + float: left;
  72 + margin: 13px 10px 10px 0;
  73 + min-height: 0px;
  74 + font-family: Arial;
  75 + font-size: 1.3em;
  76 + font-weight: 300;
  77 + text-decoration: initial;
  78 +}
  79 +
  80 +#content .main-block #article-cat a{
  81 + float: left;
  82 + margin: 10px 10px 10px 0;
  83 + padding: 3px 10px;
  84 + color: #3E67B1;
  85 + background-color: #ECEDF1;
  86 + border: 1px solid #D3D6DE;
  87 + border-radius: 3px;
  88 + font-size: 12px;
  89 + text-decoration: initial;
  90 +}
  91 +
  92 +/*** end of categories ***/
... ...
css/general-article-pages.css
css/main-content.css
... ... @@ -11,21 +11,21 @@
11 11  
12 12 /*** Block Title ***/
13 13 #content .block-outer .block-title {
  14 + padding: 5px 8px 18px 7px;
  15 + margin: 0px 0px 2px 0px;
14 16 background: #eee;
15   - font-size: 12px;
16   - text-align: left;
17 17 border-bottom: none;
18   - padding: 5px 8px 18px 7px;
19   - text-transform: uppercase;
  18 + font-size: 12px;
20 19 font-family: "open_sansbold", Arial, Helvetica, sans-serif;
21 20 font-variant: normal;
22   - margin: 0px 0px 2px 0px;
  21 + text-transform: uppercase;
  22 + text-align: left;
  23 + font-weight: 300;
23 24 }
24 25  
25 26 #content .box-1 .block-title {
26   - font-size: 18px;
27   - text-transform: none;
28   - font-family: "open_sansregular", Arial, Helvetica, sans-serif;
29   - padding: 5px 8px 20px 10px;
  27 + padding: 5px 8px 20px 10px;
  28 + font-size: 18px;
  29 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
  30 + text-transform: none;
30 31 }
31   -
... ...
css/software-pages.css
... ... @@ -193,3 +193,215 @@
193 193 }
194 194  
195 195 /*** end of Software Homepage ***/
  196 +
  197 +/*** Categories and Tags block ***/
  198 +
  199 +#content .box-1 .categories-and-tags-block {
  200 + border-top: 4px solid #4562b1;
  201 +}
  202 +
  203 +#content .box-1 .categories-and-tags-block .block-title {
  204 + background: none;
  205 + margin-top: 14px;
  206 + float: left;
  207 + font-size: 11px;
  208 +}
  209 +
  210 +#content .box-1 .categories-and-tags-block .block-title:last-child {
  211 + border-top: 1px solid #8b949b;
  212 + border-bottom: 1px solid #8b949b;
  213 +}
  214 +
  215 +#content .box-1 .categories-and-tags-block .category_cloud {
  216 + margin: 12px auto 10px 0px;
  217 + float: left;
  218 +}
  219 +
  220 +#content .box-1 .categories-and-tags-block .category_cloud a {
  221 + padding: 3px 6px;
  222 + margin: 10px 3px;
  223 + line-height: 28px;
  224 + background-color: #e9e8ed;
  225 + border: 1px solid #e9e8ed;
  226 + border-radius: 8px;
  227 + font-size: 11px;
  228 +}
  229 +
  230 +#content .box-1 .categories-and-tags-block .category_cloud a:hover {
  231 + background: #3a70d1;
  232 + color: white;
  233 + border-color: #3a70d1;
  234 +}
  235 +
  236 +#content .box-1 .categories-and-tags-block .category_cloud a:link {
  237 + text-decoration: none;
  238 +}
  239 +
  240 +/*** end of categories and tags block ***/
  241 +
  242 +/*** Right bar ***/
  243 +
  244 +/* Link-list block */
  245 +#content .box-3 .block-title {
  246 + background: #eee;
  247 + color: #4562b1;
  248 + border-top: 4px solid #4562b1;
  249 + line-height: 15px;
  250 +}
  251 +
  252 +#content .box-3 .link-list-block li {
  253 + margin: 0;
  254 + padding: 0;
  255 + border-bottom: 1px solid #ddd;
  256 + border-top: none;
  257 +}
  258 +
  259 +#content .box-3 .link-list-block li a {
  260 + width: auto;
  261 + padding: 6px 5px 8px 18px;
  262 + background-color: #fff;
  263 + background-position: 0px 50%;
  264 + color: #2C66CE;
  265 + border-right: none;
  266 + border-top: 0px solid #64946E;
  267 + border-radius: 0 0 0 0;
  268 + font-weight: normal;
  269 + font-size: 14px;
  270 + line-height: 17px;
  271 +}
  272 +
  273 +#content .box-3 .link-list-block h3.empty + ul {
  274 + border-top: 1px solid #ddd;
  275 +}
  276 +
  277 +#content .box-3 .link-list-block li a.link-this-page,
  278 +#content .box-3 .link-list-block li a.link-this-page:hover {
  279 + border-right: none;
  280 +}
  281 +
  282 +#content .box-3 .link-list-block li a:hover {
  283 + background-color: #FFFFFF;
  284 + color: #000;
  285 +}
  286 +
  287 +#content .box-3 .link-list-block li a.link-this-page {
  288 + width: auto;
  289 + margin-left: 0px;
  290 + background-color: #ffffff;
  291 + font-weight: bold;
  292 +}
  293 +
  294 +/* Repository block */
  295 +.box-3 #bt_repositorio,
  296 +.box-3 #bt_repositorio:active,
  297 +.box-3 #bt_repositorio:visited{
  298 + display: block;
  299 + position: relative;
  300 + padding: 12px 10px;
  301 + background: #EAEBEE;
  302 + border-radius: 4px;
  303 + font-size: 12px;
  304 + font-family: open_sansbold, Arial, Helvetica, sans-serif;
  305 + font-weight: bold;
  306 + text-transform: uppercase;
  307 +}
  308 +
  309 +.box-3 #bt_repositorio::after{
  310 + content: url('../images/right-arrow.png');
  311 + position: absolute;
  312 + width: 18px;
  313 + right: 10px;
  314 + padding: 4px 0px 4px 2px;
  315 + margin-top: -2px;
  316 + background: #2C66CE;
  317 + color: #FFF;
  318 + border-radius: 4px;
  319 + font-size: 16px;
  320 + line-height: 20px;
  321 + text-align: center;
  322 +}
  323 +
  324 +.box-3 #content #bt_repositorio:hover{
  325 + color: #FFF;
  326 + background: #2C66CE;
  327 + text-decoration: none;
  328 +}
  329 +/*** end of right bar ***/
  330 +
  331 +/*** Software internal pages ***/
  332 +
  333 +/* FAQ page */
  334 +
  335 +#content .main-block .article-body ul.etapas-publicacao {
  336 + margin-bottom: 20px;
  337 +}
  338 +
  339 +#content .main-block .article-body ul.etapas-publicacao li {
  340 + margin-bottom: 10px;
  341 + list-style: none;
  342 + list-style-position: inside;
  343 +}
  344 +
  345 +#content .main-block .article-body ul.etapas-publicacao li strong {
  346 + padding: 2px 8px;
  347 + margin-right: 6px;
  348 + background: #333;
  349 + color: #fff;
  350 + float: left;
  351 + border-radius: 50%;
  352 +}
  353 +
  354 +#content .main-block .article-body .etapas-publicacao-2{
  355 + font-weight: bold;
  356 +}
  357 +
  358 +/* Tutorial page */
  359 +
  360 +#content .main-block .article-body p strong {
  361 + font-size: 16px;
  362 +}
  363 +
  364 +/* Manual page */
  365 +
  366 +#content .main-block #article .folder-content .item-info {
  367 + padding: 30px 20px 32px 0px;
  368 + border-top: 1px solid #ccc;
  369 +}
  370 +
  371 +#content .main-block #article .folder-content .folder-item:last-child .item-info{
  372 + border-bottom: 1px solid #ccc;
  373 +}
  374 +
  375 +#content .main-block #article .folder-content .item-icon {
  376 + display: block;
  377 + float: left;
  378 + margin: 2px 0px auto auto;
  379 + padding: 45px 40px 4px 10px;
  380 + background: #2C66CE url("../images/download-mini_icon.png") center center no-repeat;
  381 + border: 1px solid #2C66CE;
  382 + border-radius: 4px;
  383 +}
  384 +
  385 +#content .main-block #article .folder-content .item-icon a{
  386 + display: none;
  387 +}
  388 +
  389 +
  390 +#content .main-block #article .folder-content .item-description{
  391 + padding-left: 0px;
  392 + margin-left: 65px;
  393 +}
  394 +
  395 +#content .main-block #article .folder-content .item-description a{
  396 + color: #172938;
  397 + font-size: 18px;
  398 + font-family: Arial;
  399 + font-weight: 700;
  400 +}
  401 +
  402 +#content .main-block #article .folder-content .item-date{
  403 + padding-left: 0px;
  404 + margin-left: 65px;
  405 +}
  406 +
  407 +/*** end fo software internal pages ***/
... ...
style.css
... ... @@ -6,14 +6,18 @@
6 6 @import url(css/footer.css);
7 7 @import url(css/left-bar.css);
8 8 @import url(css/home-page.css);
  9 +@import url(css/software-pages.css);
  10 +@import url(css/software-catalog-page.css);
9 11 @import url(css/main-content.css);
10   -@import url(css/general-article-pages.css);
  12 +@import url(css/article-page.css);
  13 +/*
11 14 @import url(css/community-pages.css);
12 15 @import url(css/software-pages.css);
13 16 @import url(css/software-catalog-page.css);
14 17 @import url(css/news-page.css);
15 18 @import url(css/use-report.css);
16 19 @import url(css/tooltips.css);
  20 +*/
17 21  
18 22 @import url(font-awesome.min.css);
19 23 /*@import url(http://fonts.googleapis.com/css?family=Open+Sans);*/
... ... @@ -97,7 +101,7 @@ body {
97 101 list-style:none;
98 102 }
99 103  
100   -* h1,h2,h3,h4,h5,h6,pre,code {
  104 +* h1,h2,h3,h4,h5,h6 {
101 105 color:inherit;
102 106 font-family: arial;
103 107 font-weight: 700;
... ... @@ -120,7 +124,7 @@ body {
120 124 line-height: 21px;
121 125 }
122 126  
123   -* h4,h5,h6,pre,code{
  127 +* h4,h5,h6 {
124 128 font-size: 16px;
125 129 line-height: 21px;
126 130 }
... ...
theme.js
... ... @@ -121,10 +121,10 @@ $('#link-buscar').click(function(e) {
121 121 function insert_notice_div(){
122 122 var notice = $('.display-content-block').find('li');
123 123 notice.each(function(){
124   - var $set = $(this).children();
  124 + var $set = $(this).children();
125 125 for(var i=1, len = $set.length; i < len; i+=5){
126 126 $set.slice(i, i+5).wrapAll('<div class="notice-item"/>');
127   - }
  127 + }
128 128 for(var i=2, len = $set.length; i < len; i+=3){
129 129 $set.slice(i, i+3).wrapAll('<div class="notice-info"/>');
130 130 }
... ... @@ -134,10 +134,97 @@ $(&#39;#link-buscar&#39;).click(function(e) {
134 134  
135 135 }
136 136  
  137 + /* Finds all uploaded files from manuals page and sets its names on the right format */
  138 + function set_uploaded_files_names() {
  139 + try {
  140 + var article = document.getElementById('article');
  141 + var folderList = article.getElementsByClassName('folder-content')[0];
  142 + var folderItens = folderList.getElementsByClassName('item-description');
  143 +
  144 + for(var i = 0; i < folderItens.length; i++) {
  145 + split_file_extension(folderItens[i].getElementsByTagName('a')[0]);
  146 + }
  147 + } catch(e) {
  148 +
  149 + }
  150 + }
  151 +
  152 + /* Splits a file name from its extension. Example: example.pdf becomes example - PDF */
  153 + function split_file_extension(element) {
  154 + var tokens = element.innerHTML.split('.');
  155 + if(tokens.length == 2) {
  156 + var fileName = tokens[0];
  157 + var fileExtension = tokens[1].toUpperCase();
  158 + element.innerHTML = fileName + " - " + fileExtension;
  159 + }
  160 + }
  161 +
  162 + function set_tooltip_content() {
  163 + $('.star-tooltip').html("?");
  164 + }
  165 +
  166 + function set_arrow_direction() {
  167 + var additional_data_bar = $('#comments-additional-information');
  168 + var arrow = $('.comments-arrow-down');
  169 + var state = 0;
  170 +
  171 + additional_data_bar.on('click', function() {
  172 + if(state === 0) {
  173 + arrow.attr('class', "comments-arrow-up")
  174 + state = 1;
  175 + } else {
  176 + state = 0;
  177 + arrow.attr('class', "comments-arrow-down");
  178 + }
  179 + });
  180 + }
  181 +
  182 + function set_use_report_content() {
  183 + $('.make-report-block .make-report-container .button-bar a span').html('avaliar o software');
  184 + $('.make-report-block .make-report-container .make-report-message').html('Relate sua experiência ou do órgão/empresa com relação ao software.');
  185 + $('.ratings-list .see-more a.icon-arrow-right-p').html('veja todos os relatos');
  186 + $('.main-content .star-rate-data .star-rate-form .star-comment-container .button-bar input').attr('value', 'enviar relato');
  187 + $('.main-content .star-rate-data .star-rate-form .star-rate-text').html('Avalie o software');
  188 + $('.main-content .star-rate-data .star-rate-form .star-comment-container .formlabel').html('Depoimento sobre o software');
  189 + $('.star-rate-form .star-comment-container .comments-display-fields span#comments-additional-information').html('Dados adicionais (órgãos e empresas)');
  190 + $('.star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments label').html('Nome do órgão ou empresa');
  191 + $('.star-rate-form .star-comment-container .comments-software-extra-fields .comments-software-people-benefited label').html('Número de beneficiados');
  192 + $('.star-rate-form .star-comment-container .comments-software-extra-fields .comments-software-saved-values label').html('Recursos economizados');
  193 + }
  194 +
  195 + function add_top_tooltips(){
  196 + $('#content span[title]').attr("data-toggle","tooltip");
  197 +
  198 + $('[data-toggle="tooltip"]').tooltip({
  199 + position: {
  200 + my: "center bottom-13",
  201 + at: "center top"
  202 + },
  203 + tooltipClass: "ui-tooltip-top"
  204 + });
  205 + }
  206 +
  207 + function add_bottom_tooltips(){
  208 + $('#content span[title]').attr("data-toggle","tooltip");
  209 +
  210 + $('[data-toggle="tooltip"]').tooltip({
  211 + position: {
  212 + my: "center top+13",
  213 + at: "center bottom"
  214 + },
  215 + tooltipClass: "ui-tooltip-bottom"
  216 + });
  217 + }
  218 +
137 219 $(document).ready(function(){
  220 + add_top_tooltips();
138 221 set_events();
139 222 move_article_buttons();
140 223 add_link_to_article_div();
141 224 insert_notice_div();
  225 + set_uploaded_files_names();
  226 + set_tooltip_content();
  227 + set_arrow_direction();
  228 + set_use_report_content();
142 229 });
143 230 })(jQuery);
... ...