{% extends 'configure_campaign.html.twig' %}


{% block stylesheets %}
	{{ parent() }}
	<style>
		
		h2
		{
			text-align:center;
		}
		
		#form_layout
		{
			display:flex;
			flex-direction:column;
			align-items: center;
		}
		
		form
		{
			display:flex;
			flex-direction:column;
			width:50%;
			
		}
		
		form div
		{
			margin-left:3%;
			margin-bottom:3%;
			margin-top:3%;
		}
		
		form div input
		{
		    height:40px;
    		font-size:20px;
    		background-color:white;
    		box-shadow: -2px 0px 10px 5px rgba(0, 0, 0,1.5) inset;
    		width:100%;
    	}
		
		form textarea
		{
			width:100%;
			min-height:300px;
		}
		
		form button
		{
			height:40px;
    	    width:180px;
    	    background-color:#EDCF40;
    	    font-size:0.9em;
    	    border-radius:15px 15px 15px 15px;
    	    border-color:none;	
    	    box-shadow: -2px 0px 10px 5px rgba(0, 0, 0,1.5);
		}
		
		#delete
		{
			width:180px;
			
		}
		
		#delete button
		{
			height:40px;
    	    width:180px;
    	    background-color:red;
    	    font-size:0.9em;
    	    border-radius:15px 15px 15px 15px;
    	    border-color:none;	
    	    box-shadow: -2px 0px 10px 5px rgba(0, 0, 0,1.5);
    	    margin-right:20%;
		}
		
		#exception
		{
			height:30px;
			font-size:20px;
			border:solid 4px red;
			border-radius:15px 15px 15px 15px;
		}
	
	</style>
	
{% endblock %}	



{% block breadcrumb %}
	<a href="{{ path('homepage') }}">accueil</a> > <a href="{{ path('dashboard') }}">tableau de bord</a> 
	> <a href="{{ path('campaigns') }}">mes campagnes</a> > <a href="">ma campagne</a> 
	> <a href="">personnaliser la campagne</a> > <a>editer un element</a>
{% endblock %}
      

{% block component_configure_campaign %}
	
	<h2>
    	{{ title }}
    </h2>
	
	<div id="form_layout">	
		{% set path_delete="prophecy_delete_#{delete}" %}
	
	<a href="{{ path(path_delete, {'component': element.id, 'role': 'member', 'id': campaign.id}) }}" id="delete"><button>supprimer</button></a>
	
		{{ form(form) }} 
		
			{% for message in app.flashes('message') %}
    		    <div id="exception">{{ message }}</div>
       		{% endfor %}
		
	</div>	
	
		
	
	
{% endblock %}