From cc3b2840e1467d792ea23a9209ec483adc6e0d59 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?fran=C3=A7ois=20GUILLEM?= <francois.guillem@rte-france.com>
Date: Fri, 16 Jun 2017 15:39:24 +0200
Subject: [PATCH] Fix some css problems

---
 R/mwUI_controls.R                            |  9 ++++++++-
 inst/manipulate_widget/manipulate_widget.css | 14 ++++++++------
 newUI/index.html                             | 11 ++++++++++-
 newUI/manipulate_widget.css                  | 11 ++++++++---
 4 files changed, 34 insertions(+), 11 deletions(-)

diff --git a/R/mwUI_controls.R b/R/mwUI_controls.R
index 8ee1b2d..d16861f 100644
--- a/R/mwUI_controls.R
+++ b/R/mwUI_controls.R
@@ -32,7 +32,14 @@ mwControlsUI <- function(controlList) {
             style = "cursor: pointer;",
             "data-toggle"="collapse",
             "data-target"=paste0("#panel-body-", id),
-            label
+            tags$table(
+              tags$tbody(
+                tags$tr(
+                  tags$td(class = "arrow"),
+                  tags$td(label)
+                )
+              )
+            )
           ),
           tags$div(
             class="panel-body collapse",
diff --git a/inst/manipulate_widget/manipulate_widget.css b/inst/manipulate_widget/manipulate_widget.css
index e59cded..9f65ff5 100644
--- a/inst/manipulate_widget/manipulate_widget.css
+++ b/inst/manipulate_widget/manipulate_widget.css
@@ -194,6 +194,7 @@ html, body {
   display:none;
   border-right:solid 1px #4e9cff;
   padding:10px;
+  overflow: auto;
 }
 
 .mw-chartarea {
@@ -230,7 +231,12 @@ html, body {
   background-color: #f0f0f0;
 }
 
-.panel-default>.panel-heading::before {
+.panel-heading .arrow {
+  width: 22px;
+  text-align: center;
+}
+
+.panel-heading .arrow::before {
   font-family: FontAwesome;
   font-size: 20px;
   content: "\f0d7";
@@ -239,10 +245,6 @@ html, body {
   vertical-align: middle;
 }
 
-.panel-default>.panel-heading.collapsed::before {
+.panel-heading.collapsed .arrow::before {
   content: "\f0da";
 }
-
-.panel-body {
-  padding: 5px;
-}
diff --git a/newUI/index.html b/newUI/index.html
index 84d9e12..a33dcfc 100644
--- a/newUI/index.html
+++ b/newUI/index.html
@@ -79,7 +79,16 @@
           <div>
             <div data-display-if="input.group2_visible">
               <div class="panel panel-default">
-                <div class="panel-heading collapsed" style="cursor: pointer;" data-toggle="collapse" data-target="#panel-body-group2">group</div>
+                <div class="panel-heading collapsed" style="cursor: pointer;" data-toggle="collapse" data-target="#panel-body-group2">
+                  <table>
+                    <tbody>
+                      <tr>
+                        <td class="arrow"></td>
+                        <td>Group bla bla bla bla bal</td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </div>
                 <div class="panel-body collapse" id="panel-body-group2">
                   <div>
                     <div data-display-if="input.x12_visible">
diff --git a/newUI/manipulate_widget.css b/newUI/manipulate_widget.css
index 6c70e50..22879dd 100644
--- a/newUI/manipulate_widget.css
+++ b/newUI/manipulate_widget.css
@@ -222,11 +222,12 @@ html, body {
   background-color: #f0f0f0;
 }
 
-.panel-default>.panel-heading.collapsed::before {
-  content: "\f0da";
+.panel-heading .arrow {
+  width: 22px;
+  text-align: center;
 }
 
-.panel-default>.panel-heading::before {
+.panel-heading .arrow::before {
   font-family: FontAwesome;
   font-size: 20px;
   content: "\f0d7";
@@ -234,3 +235,7 @@ html, body {
   padding-right: 10px;
   vertical-align: middle;
 }
+
+.panel-heading.collapsed .arrow::before {
+  content: "\f0da";
+}