Collapse by default optionnal parameters

css/app/create_poll.css

@@ -1,3 +1,31 @@
 .form-horizontal .radio label {
     width: 100%;
 }
+
+.optionnal-parameters:hover, .optionnal-parameters:focus {
+    text-decoration: none;
+}
+
+.optionnal-parameters:active, .optionnal-parameters:focus {
+    outline: none;
+}
+
+.optionnal-parameters .caret, .optionnal-parameters.collapsed .caret.caret-up {
+    display: none;
+}
+
+.optionnal-parameters .caret.caret-up, .optionnal-parameters.collapsed .caret {
+    display: inline-block;
+}
+
+.caret.caret-up  {
+    border-bottom: 4px dashed;
+    border-top: 0 none;
+    content: "";
+}
+
+@media (max-width: 767px) {
+    #optionnal {
+        margin-top: 15px;
+    }
+}

tpl/create_poll.tpl

@@ -101,6 +101,28 @@
                     </div>
                 {/if}
 
+                {* Optionnal parameters *}
+                <div class="col-sm-offset-3 col-sm-1 hidden-xs">
+                    <p class="lead">
+                        <i class="glyphicon glyphicon-cog" aria-hidden="true"></i>
+                    </p>
+                </div>
+                <div class="col-sm-8 col-xs-12">
+                    <span class="lead visible-xs-inline">
+                        <i class="glyphicon glyphicon-cog" aria-hidden="true"></i>
+                    </span>
+                    <a class="optionnal-parameters collapsed lead" role="button" data-toggle="collapse" href="#optionnal" aria-expanded="false" aria-controls="optionnal">
+                        Paramètres optionnels
+                        <i class="caret" aria-hidden="true"></i>
+                        <i class="caret caret-up" aria-hidden="true"></i>
+                    </a>
+
+                </div>
+                <div class="clearfix"></div>
+
+
+                <div class="collapse" id="optionnal">
+
                     {* Poll identifier *}
 
                     <div class="form-group {$errors['customized_url']['class']}">
@@ -264,6 +286,7 @@
                             </div>
                         </div>
                     </div>
+                </div>
 
                 <p class="text-right">
                     <input type="hidden" name="type" value="$poll_type"/>