From 2d3549ee28fac963b495f7776f077bb2dc289160 Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Wed, 3 Nov 2021 12:39:47 +0100
Subject: [PATCH] visgraph: give more space to graph in twig content

---
 .../Resources/public/vuejs/VisGraph/App.vue      |  3 ++-
 .../views/Household/relationship.html.twig       | 16 ++++++++++++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue
index a544583f1..3844e903d 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue
@@ -1,7 +1,8 @@
 <template>
 
-   <!-- TEST appelle la fonction sans passer par le callback de vis-network -->
+   <!-- TEST appelle la fonction sans passer par le callback de vis-network
    <button class="btn btn-sm btn-create" @click="addRelationshipModal({ from: 'person_1617', to: 'person_1614' })">add link</button>
+   -->
    <!--// <=== InternalError: too much recursion -->
 
    <div id="visgraph"></div>
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Household/relationship.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Household/relationship.html.twig
index c6d7330fa..56fcce85c 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/Household/relationship.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/Household/relationship.html.twig
@@ -2,12 +2,24 @@
 
 {% block title 'household.Relationship'|trans %}
 
-{% block content %}
-    <h1>{{ block('title') }}</h1>
+{#
+     Give more space to graph:
+     * use parent twig block (layout_wvm_content)
+     * hide title (d-none)
+     * apply negative margin-top
+#}
+{% block layout_wvm_content %}
+<div class="row justify-content-center">
+
+    <div class="col-md-10 col-xxl d-none">
+        <h1>{{ block('title') }}</h1>
+    </div>
 
     <div id="relationship-graph"
+        style="margin-top: -3rem"
         data-persons="{{ persons|e('html_attr') }}">
     </div>
+</div>
 {% endblock %}
 
 {% block block_post_menu %}