From 5c0a10699a8ac0de80f14f07fa58dba5b8438449 Mon Sep 17 00:00:00 2001 From: decabeza Date: Mon, 26 Feb 2018 18:37:30 +0100 Subject: [PATCH] Refactors documents partials and reorganices css --- app/assets/stylesheets/layout.scss | 79 ++++++++++------------- app/assets/stylesheets/participation.scss | 12 +--- app/views/documents/_document.html.erb | 44 ++++++------- app/views/documents/_documents.html.erb | 16 ++--- config/locales/en/documents.yml | 5 +- config/locales/es/documents.yml | 5 +- 6 files changed, 68 insertions(+), 93 deletions(-) diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index cebd8c8eb..499a64e49 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -89,6 +89,10 @@ a { &.warning:hover { color: #000; } + + &.medium { + font-size: $small-font-size; + } } .button.hollow { @@ -2310,61 +2314,48 @@ table { // 20. Documents // ------------- -.documents-list { +.documents { - table { - border: 0; + h2 { + font-size: rem-calc(24); + + span { + color: #4f4f4f; + font-weight: normal; + } } - td { + ul li { + padding-top: $line-height / 2; + + &:not(:first-child) { + border-top: 1px solid $highlight; + } + } + + .document-link { + background: $highlight-soft; + border: 2px solid $highlight; + border-radius: rem-calc(5); + display: block; + margin: $line-height / 2 0; + padding: 0 $line-height / 2; position: relative; - @include breakpoint(small) { - float: left; - width: 100%; - } - - @include breakpoint(medium) { - float: none; - } - a { - width: 100%; + word-wrap: break-word; } - &:first-child { - padding-left: $line-height * 1.5; - - @include breakpoint(small) { - width: 100%; - } - - @include breakpoint(medium) { - width: 70%; - } - - @include breakpoint(large) { - width: 80%; - } - } - - &:first-child::before { + .icon-document { color: #007bb7; - content: 'G'; - font-family: "icons" !important; + display: inline-block; font-size: rem-calc(24); - left: rem-calc(6); - position: absolute; - top: 0; - - @include breakpoint(small) { - padding-top: rem-calc(12); - } - - @include breakpoint(medium) { - padding-top: rem-calc(22); - } + line-height: $line-height; + vertical-align: middle; + } + p { + margin-bottom: 0; } } } diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss index aa1259bb3..a26b4a5a7 100644 --- a/app/assets/stylesheets/participation.scss +++ b/app/assets/stylesheets/participation.scss @@ -457,7 +457,6 @@ line-height: rem-calc(30); } - .document-link, .video-link { background: $highlight-soft; border: 1px solid $highlight; @@ -470,21 +469,14 @@ word-wrap: break-word; } - [class^="icon-"] { + .icon-video { + color: #cc181e; display: inline-block; font-size: rem-calc(24); line-height: $line-height; vertical-align: middle; } - .icon-document { - color: #007bb7; - } - - .icon-video { - color: #cc181e; - } - p { margin-bottom: 0; } diff --git a/app/views/documents/_document.html.erb b/app/views/documents/_document.html.erb index 47e894aeb..bf549e92b 100644 --- a/app/views/documents/_document.html.erb +++ b/app/views/documents/_document.html.erb @@ -1,24 +1,20 @@ - - - - - - - - -
- <%= document.title %> - - <%= link_to t('documents.buttons.download_document'), - document.attachment.url, - target: "_blank", - rel: "nofollow", - class: 'button hollow' %> - - <% if can?(:destroy, document) %> - <%= link_to t('documents.buttons.destroy_document'), - document_path(document, from: request.url), method: :delete, - data: { confirm: t('documents.actions.destroy.confirm') }, - class: 'button hollow alert' %> - <% end %> -
+
  • + <%= link_to t("documents.buttons.download_document"), + document.attachment.url, target: "_blank", + rel: "nofollow", class: "button hollow medium float-right" %> + + <%= document.title %> +
    + + <%= document.humanized_content_type %> |  + <%= number_to_human_size(document.attachment_file_size, precision: 2) %> + + + <% if can?(:destroy, document) %> +
    + <%= link_to t("documents.buttons.destroy_document"), + document_path(document, from: request.url), method: :delete, + data: { confirm: t("documents.actions.destroy.confirm") }, + class: "delete" %> + <% end %> +
    • diff --git a/app/views/documents/_documents.html.erb b/app/views/documents/_documents.html.erb index 4387817d6..5963127df 100644 --- a/app/views/documents/_documents.html.erb +++ b/app/views/documents/_documents.html.erb @@ -1,11 +1,9 @@ -
    -
    - <% if documents.any? %> +
    +

    <%= t("documents.title") %> (<%= documents.count %>)

    + + <% if documents.any? %> +
      <%= render partial: "documents/document", collection: documents %> - <% else %> -
      - <%= t('documents.no_documents') %> -
      - <% end %> -
    + + <% end %>
    diff --git a/config/locales/en/documents.yml b/config/locales/en/documents.yml index 7db70b25a..4cd868d40 100644 --- a/config/locales/en/documents.yml +++ b/config/locales/en/documents.yml @@ -1,7 +1,6 @@ en: documents: - tab: Documents - no_documents: Don't have uploaded documents + title: Documents max_documents_allowed_reached_html: You have reached the maximum number of documents allowed! You have to delete one before you can upload another. form: title: Documents @@ -17,7 +16,7 @@ en: confirm: Are you sure you want to delete the document? This action cannot be undone! buttons: download_document: Download file - destroy_document: Destroy + destroy_document: Destroy document errors: messages: in_between: must be in between %{min} and %{max} diff --git a/config/locales/es/documents.yml b/config/locales/es/documents.yml index 0e57897e6..3e2c0e3bd 100644 --- a/config/locales/es/documents.yml +++ b/config/locales/es/documents.yml @@ -1,7 +1,6 @@ es: documents: - tab: Documentos - no_documents: No hay documentos subidos + title: Documentos max_documents_allowed_reached_html: '¡Has alcanzado el número máximo de documentos permitidos! Tienes que eliminar uno antes de poder subir otro.' form: title: Documentos @@ -17,7 +16,7 @@ es: confirm: '¿Está seguro de que desea eliminar el documento? Esta acción no se puede deshacer!' buttons: download_document: Descargar archivo - destroy_document: Eliminar + destroy_document: Eliminar documento errors: messages: in_between: debe estar entre %{min} y %{max}