From 71b3228310bcc4b00837ae6d5e698f5192af1df8 Mon Sep 17 00:00:00 2001 From: aignatov-bio <47317017+aignatov-bio@users.noreply.github.com> Date: Mon, 13 May 2019 10:45:12 +0200 Subject: [PATCH] Update protocol preview style [SCI-3416] (#1729) * Update protocol appearance --- app/assets/stylesheets/application.scss | 1 + .../my_modules/protocols/index.scss | 41 ++++--- .../stylesheets/protocols/preview_modal.scss | 17 +++ .../stylesheets/protocols/protocol.scss | 12 ++ app/assets/stylesheets/themes/scinote.scss | 12 -- app/views/my_modules/results.html.erb | 12 +- app/views/protocols/_header.html.erb | 10 +- app/views/protocols/_steps.html.erb | 12 +- app/views/protocols/edit.html.erb | 2 + app/views/protocols/index.html.erb | 12 +- .../_protocol_preview_modal_body.html.erb | 112 ++++-------------- app/views/reports/new.html.erb | 12 +- app/views/search/results/_protocols.html.erb | 12 +- app/views/shared/_formulas_libraries.html.erb | 11 ++ app/views/steps/_step.html.erb | 9 +- app/views/steps/attachments/_list.html.erb | 6 +- 16 files changed, 105 insertions(+), 188 deletions(-) create mode 100644 app/assets/stylesheets/protocols/preview_modal.scss create mode 100644 app/assets/stylesheets/protocols/protocol.scss create mode 100644 app/views/shared/_formulas_libraries.html.erb diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index b55c8bded..929c3e5af 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -23,4 +23,5 @@ @import "select2.min"; @import "extend/perfect-scrollbar"; @import "my_modules/protocols/*"; +@import "protocols/*"; @import "hooks/*"; diff --git a/app/assets/stylesheets/my_modules/protocols/index.scss b/app/assets/stylesheets/my_modules/protocols/index.scss index 097ba784f..45f1ebb74 100644 --- a/app/assets/stylesheets/my_modules/protocols/index.scss +++ b/app/assets/stylesheets/my_modules/protocols/index.scss @@ -14,6 +14,28 @@ } } +.protocol-info, +.module-header { + .well { + border: 0; + box-shadow: none; + padding-left: 0; + padding-right: 0; + } + + .badge-icon { + background: transparent; + color: $color-silver; + padding-left: 0; + padding-right: 5px; + + + .well-sm { + margin-bottom: 10px; + margin-left: 0; + } + } +} + .module-header { display: inline-block; position: relative; @@ -46,25 +68,6 @@ } } - .well { - border: 0; - box-shadow: none; - padding-left: 0; - padding-right: 0; - } - - .badge-icon { - background: transparent; - color: $color-silver; - padding-left: 0; - padding-right: 5px; - - + .well-sm { - margin-bottom: 10px; - margin-left: 0; - } - } - .module-description { float: left; width: 100%; diff --git a/app/assets/stylesheets/protocols/preview_modal.scss b/app/assets/stylesheets/protocols/preview_modal.scss new file mode 100644 index 000000000..0ea55b882 --- /dev/null +++ b/app/assets/stylesheets/protocols/preview_modal.scss @@ -0,0 +1,17 @@ +// scss-lint:disable SelectorDepth +// scss-lint:disable NestingDepth + +@import "constants"; +@import "mixins"; + +#protocol-preview-modal .modal-dialog { + .modal-body { + max-height: 75vh; + overflow-y: auto; + width: 100%; + + .ql-editor { + min-height: initial; + } + } +} diff --git a/app/assets/stylesheets/protocols/protocol.scss b/app/assets/stylesheets/protocols/protocol.scss new file mode 100644 index 000000000..fa18dc9f0 --- /dev/null +++ b/app/assets/stylesheets/protocols/protocol.scss @@ -0,0 +1,12 @@ +// scss-lint:disable SelectorDepth +// scss-lint:disable NestingDepth + +@import "constants"; +@import "mixins"; + +.protocol-info { + + .protocol-description { + padding: 0 48px; + } +} diff --git a/app/assets/stylesheets/themes/scinote.scss b/app/assets/stylesheets/themes/scinote.scss index e95907076..9b0c50a4d 100644 --- a/app/assets/stylesheets/themes/scinote.scss +++ b/app/assets/stylesheets/themes/scinote.scss @@ -940,18 +940,6 @@ ul.content-activities { } } -#protocol-preview-modal .modal-dialog { - .modal-body { - max-height: 75vh; - overflow-y: auto; - width: 100%; - - .ql-editor { - min-height: initial; - } - } -} - /* Import protocol/s modal */ #import-protocol-modal .modal-dialog { width: 70%; diff --git a/app/views/my_modules/results.html.erb b/app/views/my_modules/results.html.erb index 611933504..48f2d1b7a 100644 --- a/app/views/my_modules/results.html.erb +++ b/app/views/my_modules/results.html.erb @@ -59,17 +59,7 @@ <%= javascript_include_tag "handsontable.full.min" %> -<%= javascript_include_tag "lodash" %> -<%= javascript_include_tag "numeral" %> -<%= javascript_include_tag "numeric" %> -<%= javascript_include_tag "md5" %> -<%= javascript_include_tag "jstat" %> -<%= javascript_include_tag "formula" %> -<%= javascript_include_tag "parser" %> -<%= javascript_include_tag "ruleJS" %> -<%= javascript_include_tag "handsontable.formula" %> -<%= javascript_include_tag "big.min" %> -<%= stylesheet_link_tag "handsontable.formula" %> +<%= render partial: "shared/formulas_libraries.html.erb" %> <%= javascript_include_tag("canvas-to-blob.min") %> <%= javascript_include_tag "assets/wopi/create_wopi_file" %> diff --git a/app/views/protocols/_header.html.erb b/app/views/protocols/_header.html.erb index 5b6badd47..cf2d8a1c8 100644 --- a/app/views/protocols/_header.html.erb +++ b/app/views/protocols/_header.html.erb @@ -8,7 +8,7 @@ <% end %> -
+
@@ -31,7 +31,7 @@
- +
@@ -39,7 +39,7 @@
-
+
<% if can_manage_protocol_in_repository?(@protocol) %> @@ -61,7 +61,7 @@
-
+
<% if can_manage_protocol_in_repository?(@protocol) %> @@ -83,7 +83,7 @@
-
+
<%= render partial: "protocols/header/description_label.html.erb", locals: {edit_mode: true} %>
diff --git a/app/views/protocols/_steps.html.erb b/app/views/protocols/_steps.html.erb index 7626234c2..96cd7695e 100644 --- a/app/views/protocols/_steps.html.erb +++ b/app/views/protocols/_steps.html.erb @@ -31,17 +31,7 @@ <%= javascript_include_tag "handsontable.full.min" %> -<%= javascript_include_tag "lodash" %> -<%= javascript_include_tag "numeral" %> -<%= javascript_include_tag "numeric" %> -<%= javascript_include_tag "md5" %> -<%= javascript_include_tag "jstat" %> -<%= javascript_include_tag "formula" %> -<%= javascript_include_tag "parser" %> -<%= javascript_include_tag "ruleJS" %> -<%= javascript_include_tag "handsontable.formula" %> -<%= javascript_include_tag "big.min" %> -<%= stylesheet_link_tag "handsontable.formula" %> +<%= render partial: "shared/formulas_libraries.html.erb" %> <%= javascript_include_tag "assets/wopi/create_wopi_file" %> <%= javascript_include_tag "protocols/steps" %> diff --git a/app/views/protocols/edit.html.erb b/app/views/protocols/edit.html.erb index 6c027ce7c..94817db20 100644 --- a/app/views/protocols/edit.html.erb +++ b/app/views/protocols/edit.html.erb @@ -10,3 +10,5 @@
<%= javascript_include_tag "protocols/edit" %> + +<%= render partial: 'assets/wopi/create_wopi_file_modal.html.erb' %> \ No newline at end of file diff --git a/app/views/protocols/index.html.erb b/app/views/protocols/index.html.erb index 6025c823e..dff082c91 100644 --- a/app/views/protocols/index.html.erb +++ b/app/views/protocols/index.html.erb @@ -150,17 +150,7 @@ <%= javascript_include_tag "handsontable.full.min" %> -<%= javascript_include_tag "lodash" %> -<%= javascript_include_tag "numeral" %> -<%= javascript_include_tag "numeric" %> -<%= javascript_include_tag "md5" %> -<%= javascript_include_tag "jstat" %> -<%= javascript_include_tag "formula" %> -<%= javascript_include_tag "parser" %> -<%= javascript_include_tag "ruleJS" %> -<%= javascript_include_tag "handsontable.formula" %> -<%= javascript_include_tag "big.min" %> -<%= stylesheet_link_tag "handsontable.formula" %> +<%= render partial: "shared/formulas_libraries.html.erb" %> <%= stylesheet_link_tag 'datatables' %> <%= javascript_include_tag "assets/wopi/create_wopi_file" %> diff --git a/app/views/protocols/index/_protocol_preview_modal_body.html.erb b/app/views/protocols/index/_protocol_preview_modal_body.html.erb index 67b946578..e0654ad22 100644 --- a/app/views/protocols/index/_protocol_preview_modal_body.html.erb +++ b/app/views/protocols/index/_protocol_preview_modal_body.html.erb @@ -1,4 +1,4 @@ -
+
@@ -21,7 +21,7 @@
- +
@@ -29,7 +29,7 @@
-
+
@@ -39,7 +39,7 @@
-
+
@@ -49,12 +49,8 @@
-
-
- -
+
- <%= render partial: "protocols/header/description_label.html.erb", locals: {edit_mode: false} %>
@@ -68,88 +64,22 @@
<% protocol.steps.order(:position).each do |step| %> -
"> -
- <%= step.position_plus_one %> -
-
-
- <%= step.name %> | - <%= t("protocols.steps.published_on", timestamp: l(step.created_at, format: :full), user: h(step.user.full_name)).html_safe %> -
-
-
-
-
- <% if sanitize_input(step.description).blank? %> - <%= t("protocols.steps.no_description") %> - <% else %> -
- <%= sanitize_input(step.tinymce_render(:description), ['img']) %> -
- <% end %> -
-
-
- <% unless step.tables.blank? then %> -
-
- <% step.tables.each do |table| %> - <%= table.name %> -
- <%= hidden_field(table, :contents, value: table.contents_utf_8, class: "hot-contents") %> -
-
- <% end %> -
- <% end %> - - <% assets = ordered_assets(step) %> - <% unless assets.blank? then %> -
-
- <%= t("protocols.steps.files") %> -
    - <% assets.each do |asset| %> -
  • - <%= render partial: "shared/asset_link", locals: { asset: asset, display_image_tag: true }, formats: :html %> -
    • - <% end %> -
-
- <% end %> - - <% unless step.checklists.blank? then %> -
- <% step.checklists.asc.each do |checklist| %> - <%= checklist.name %> - <% if checklist.checklist_items.empty? %> -
- <%= t("protocols.steps.empty_checklist") %> -
- <% else %> - <% ordered_checklist_items(checklist).each do |checklist_item| %> -
- -
- <% end %> - <% end %> - <% end %> -
- <% end %> - -
-
-
-
-
+ <%= render partial: "steps/step.html.erb", locals: { step: step, preview: true } %> <% end %>
+ +<%= javascript_include_tag "handsontable.full.min" %> +<%= javascript_include_tag "lodash" %> +<%= javascript_include_tag "numeral" %> +<%= javascript_include_tag "numeric" %> +<%= javascript_include_tag "md5" %> +<%= javascript_include_tag "jstat" %> +<%= javascript_include_tag "formula" %> +<%= javascript_include_tag "parser" %> +<%= javascript_include_tag "ruleJS" %> +<%= javascript_include_tag "handsontable.formula" %> +<%= javascript_include_tag "big.min" %> +<%= stylesheet_link_tag "handsontable.formula" %> + +<%= javascript_include_tag "protocols/steps" %> diff --git a/app/views/reports/new.html.erb b/app/views/reports/new.html.erb index 6a15272ce..17584deef 100644 --- a/app/views/reports/new.html.erb +++ b/app/views/reports/new.html.erb @@ -83,17 +83,7 @@ <%= javascript_include_tag "handsontable.full.min" %> -<%= javascript_include_tag "lodash" %> -<%= javascript_include_tag "numeral" %> -<%= javascript_include_tag "numeric" %> -<%= javascript_include_tag "md5" %> -<%= javascript_include_tag "jstat" %> -<%= javascript_include_tag "formula" %> -<%= javascript_include_tag "parser" %> -<%= javascript_include_tag "ruleJS" %> -<%= javascript_include_tag "handsontable.formula" %> -<%= javascript_include_tag "big.min" %> -<%= stylesheet_link_tag "handsontable.formula" %> +<%= render partial: "shared/formulas_libraries.html.erb" %> <%= javascript_include_tag("reports/new") %> <%= javascript_include_tag 'reports/save_pdf_to_inventory' %> diff --git a/app/views/search/results/_protocols.html.erb b/app/views/search/results/_protocols.html.erb index 9b1d68728..d2dd9521d 100644 --- a/app/views/search/results/_protocols.html.erb +++ b/app/views/search/results/_protocols.html.erb @@ -125,17 +125,7 @@ <%= javascript_include_tag "handsontable.full.min" %> -<%= javascript_include_tag "lodash" %> -<%= javascript_include_tag "numeral" %> -<%= javascript_include_tag "numeric" %> -<%= javascript_include_tag "md5" %> -<%= javascript_include_tag "jstat" %> -<%= javascript_include_tag "formula" %> -<%= javascript_include_tag "parser" %> -<%= javascript_include_tag "ruleJS" %> -<%= javascript_include_tag "handsontable.formula" %> -<%= javascript_include_tag "big.min" %> -<%= stylesheet_link_tag "handsontable.formula" %> +<%= render partial: "shared/formulas_libraries.html.erb" %> <%= stylesheet_link_tag 'datatables' %> <%= javascript_include_tag "protocols/index" %> diff --git a/app/views/shared/_formulas_libraries.html.erb b/app/views/shared/_formulas_libraries.html.erb new file mode 100644 index 000000000..9b59fe6cf --- /dev/null +++ b/app/views/shared/_formulas_libraries.html.erb @@ -0,0 +1,11 @@ +<%= javascript_include_tag "lodash" %> +<%= javascript_include_tag "numeral" %> +<%= javascript_include_tag "numeric" %> +<%= javascript_include_tag "md5" %> +<%= javascript_include_tag "jstat" %> +<%= javascript_include_tag "formula" %> +<%= javascript_include_tag "parser" %> +<%= javascript_include_tag "ruleJS" %> +<%= javascript_include_tag "handsontable.formula" %> +<%= javascript_include_tag "big.min" %> +<%= stylesheet_link_tag "handsontable.formula" %> \ No newline at end of file diff --git a/app/views/steps/_step.html.erb b/app/views/steps/_step.html.erb index db17bb396..bff3d4b61 100644 --- a/app/views/steps/_step.html.erb +++ b/app/views/steps/_step.html.erb @@ -1,8 +1,9 @@ +<% preview = (defined?(preview) ? preview : false) %>
">
- <% if can_complete_or_checkbox_step?(@protocol) %> + <% if can_complete_or_checkbox_step?(@protocol) && !(preview) %> <% if step.completed? %>
<% end %> - <% if can_manage_protocol_in_module?(@protocol) || - can_manage_protocol_in_repository?(@protocol) %> + <% if (can_manage_protocol_in_module?(@protocol) || + can_manage_protocol_in_repository?(@protocol)) && !(preview) %> <% end %> - <%= render partial: 'steps/attachments/list.html.erb', locals: { step: step } %> + <%= render partial: 'steps/attachments/list.html.erb', locals: { step: step, preview: preview } %> <% unless step.checklists.blank? then %>
diff --git a/app/views/steps/attachments/_list.html.erb b/app/views/steps/attachments/_list.html.erb index f33fafa59..d7b2e7ce7 100644 --- a/app/views/steps/attachments/_list.html.erb +++ b/app/views/steps/attachments/_list.html.erb @@ -11,8 +11,10 @@
- <%= render partial: '/assets/wopi/create_wopi_file_button.html.erb', - locals: { element_id: step.id, element_type: 'Step' } %> + <% if !(preview) %> + <%= render partial: '/assets/wopi/create_wopi_file_button.html.erb', + locals: { element_id: step.id, element_type: 'Step' } %> + <% end %>