From df9f2d7356272b242e47bf1831d1d9bba8a88ab2 Mon Sep 17 00:00:00 2001
From: Sebastien Curt <sebastien.curt@tetras-libre.fr>
Date: Wed, 27 Apr 2022 10:11:36 +0200
Subject: [PATCH] enhance capsule list UI for better view of preview links
---
assets/styles/app.scss | 1 +
templates/capsule/index.html.twig | 18 ++++++++++++++----
translations/messages.en.yaml | 2 ++
translations/messages.fr.yaml | 2 ++
4 files changed, 19 insertions(+), 4 deletions(-)
diff --git a/assets/styles/app.scss b/assets/styles/app.scss
index bd5c684..67aed76 100644
--- a/assets/styles/app.scss
+++ b/assets/styles/app.scss
@@ -100,6 +100,7 @@ $orange-button-bt: #FA772E;
text-decoration: none;
text-transform: uppercase;
font-size: 18px;
+ color: $link-color;
}
.remove-link {
diff --git a/templates/capsule/index.html.twig b/templates/capsule/index.html.twig
index 1442cfc..f73129b 100644
--- a/templates/capsule/index.html.twig
+++ b/templates/capsule/index.html.twig
@@ -50,9 +50,9 @@
<div class="capsule-item pb-4 col-12 col-sm-11 col-md-10 col-xxl-8">
<div class="d-flex flex-column flex-md-row justify-content-center align-items-center mt-sm-4">
<div class="list-item">
- <a href="{{ path('preview_capsule', { 'path': capsule.getLinkPath() } ) }}" class="capsule-title">
+ <div class="capsule-title">
{{ capsule.getName() }}
- </a>
+ </div>
</div>
<div class="list-item text-capitalize">
{{ 'capsule.by'|trans }}
@@ -71,8 +71,16 @@
{% endif %}
</div>
- <div class="d-flex flex-column justify-content-center m-2 pe-2">
- <i class="fa-thin fa-gears"></i>
+ <div class="d-flex flex-column justify-content-center m-2 pe-2">
+ <div class="list-item text-nowrap">
+ <a href="{{ path('preview_capsule', { 'path': capsule.getLinkPath() }) }}"
+ class="links text-decoration-none"
+ target="_blank">
+ <i class="fas fa-eye m-2"></i>
+ {{ 'capsule.preview.link'|trans }}
+ </a>
+ </div>
+
<div class="list-item text-nowrap">
<a href="{{ path('edit_capsule_editors', {'capsule_id': capsule.getId()}) }}"
@@ -123,6 +131,8 @@
{{ 'capsule.edit.link'|trans }}
</button>
</a>
+
+
</div>
</div>
</div>
diff --git a/translations/messages.en.yaml b/translations/messages.en.yaml
index 5f8c70a..bc361dc 100644
--- a/translations/messages.en.yaml
+++ b/translations/messages.en.yaml
@@ -92,6 +92,8 @@ capsule:
text: Do you really want to delete the capsule %capsule_name%?
success: Capsule capsule_name was deleted successfully
error: You don't have the permission to delete this capsule
+ preview:
+ link: Preview
project:
already_exists: Project capsule_name already exists so the capsule could not be created
diff --git a/translations/messages.fr.yaml b/translations/messages.fr.yaml
index e1dfd74..1df2832 100644
--- a/translations/messages.fr.yaml
+++ b/translations/messages.fr.yaml
@@ -91,6 +91,8 @@ capsule:
text: Souhaitez-vous vraiment supprimer la capsule %capsule_name% ?
success: La capsule capsule_name a bien été supprimée
error: Vous n'avez pas les droits nécessaires pour supprimer cette capsule
+ preview:
+ link: Visualiser
project:
already_exists: Le projet capsule_name existe déjà. La capsule n'a pas pu être créée
--
GitLab