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

{% block stylesheets %}
	{{ parent() }}
	
	<style>
	
	#button_zone
	{
		margin: 2% 0% 1% 2%;
		height:auto;
		width:auto;
	}
	
	
	#new_message
	{
		margin-left:2%;
	}
	
	
	#new_message button
	{
		height:40px;
    	width:180px;
    	background-color:#56ed0a;
    	color:black;
    	font-weight:bold;
    	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);*/
    	box-shadow: -2px 0px 10px 5px rgba(17, 80, 30,1.5) ;
	}
	
	/*
	#new_message button
    {
    	height:auto;
    	width:140px;
    	background-color:#EDCF40;
    	font-size:0.9em;
    	border-radius:15px 15px 15px 15px;
    	border-color:none;	
    }
    */
    
    
    .widget_thread
    {
    	display:flex;
    	flex-direction:row;
    	border:solid 1px;
    	margin:1% 1% 1% 2%;
    	height:auto;
    	width:auto;
    	background-color:white;
    }
    
    #first
    {
    	flex:3;
    	margin:5px;
    }
    
    #first div a:visited,   #first div a
    {
    	text-decoration: none;
    	color:blue;
    }
    
    #second
    {
    	flex:1;
    	text-align:right;
    	margin:5px;
    	color:black;
    }
    
    #second div a:visited,   #second div a
    {
    	text-decoration:none;
    	color:blue;
    }
    
    
    #delete a button
    {
		height:20px;
    	width:90px;
    	background-color:red;
    	color:black;
    	font-weight:bold;
    	font-size:0.9em;
    	border-radius:15px 15px 15px 15px;
    	border-color:black;	

    }
    
	</style>
	
{% endblock %}



{% block breadcrumb %}
<a href="{{ path('homepage') }}">accueil</a> > <a href="{{ path('dashboard') }}">tableau de bord</a> > <a>mes messages</a>
{% endblock %}
   
      

{% block member_content %}
<h1>mes messages</h1>

<div id="messages_layout">

	<div class="container_line" id="button_zone">
	 		<a href="{{ path('new_message') }}" id="new_message" ><button  class="btn-connexion">nouveau message</button></a>
	</div>
	
		{% if threads|length > 0  %}
		    {% for thread in threads %}
		    	<a href="{{ path('message_response', {'id': thread.id}) }}">
    		    	<div class="widget_thread">
    		    		<div id="first">
    			    		<div><a href="{{ path('message_response', {'id': thread.id}) }}">participants : {{thread.sender.username}} et {{thread.receiver.username}}</a></div>
    			    		<div><a href="{{ path('message_response', {'id': thread.id}) }}">sujet : {{ thread.purpose }}</a></div>
    		    		</div>
    		    		<div id="second">
    		    			<div>messages : {{ thread.messages }}</div>
    		    			<div id="delete"><a href={{ path('delete_message', {'id': thread.id}) }}><button>supprimer</button></a></div>
    		    		</div>
    		    	</div>
		    	</a>
		    		
		    		
		    	
				
		    {% endfor %}
		    
		    
		{% else %}
			<div>
				<p>vous n'avez aucun message</p>
			</div>
		{% endif %}	
</div>	
{% endblock %}