Home Explore Help
Sign In
sangfroid
/
films-symfony-4-2
1
0
Fork 0
Files Issues 2 Pull Requests 0 Wiki
Browse Source

retour en grille bootstrap

François Drouhard 3 years ago
parent
661accb2a1
commit
cebebe8441
12 changed files with 101 additions and 109 deletions
Split View Show Diff Stats
  1. 2 2
      assets/styles/app.scss
  2. 19 28
      templates/base.html.twig
  3. 1 1
      templates/genre/modifier.html.twig
  4. 12 2
      templates/navbar.html.twig
  5. 2 2
      templates/profil/monprofil.html.twig
  6. 1 1
      templates/realisateur/modifier.html.twig
  7. 3 3
      templates/security/login.html.twig
  8. 3 3
      templates/security/login.html.twig.save
  9. 2 2
      templates/security/register.html.twig
  10. 9 9
      templates/videotheque/form.html.twig
  11. 24 33
      templates/videotheque/liste.html.twig
  12. 23 23
      templates/videotheque/voirfilm.html.twig

+ 2 - 2
assets/styles/app.scss
View File 

@@ -1,4 +1,4 @@
 
-$enable-grid-classes: false;
 
-$enable-cssgrid: true;
 
+$enable-grid-classes: true;
 
+$enable-cssgrid: false;
 
 
 @import "~bootstrap/scss/bootstrap";

+ 19 - 28
templates/base.html.twig
View File 

@@ -9,36 +9,27 @@
 
         <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
 
     </head>
 
     <body style="padding-top:5rem;padding-bottom:4rem;">
 
-		{% include 'flashbag.html.twig' %}
 
-		{% include 'navbar.html.twig' %}
 
-
 
-		<header>
 
-			{% include 'modal.html.twig' %}
 
-		</header>
 
-
 
-		<nav class="navbar">
 
-			<div class="nav-item">
 
-				<h1>{% block titre %}{% endblock %}</h1>
 
-			</div>
 
-			<div class="container-xxl d-flex align-items-md-center">
 
-				<form class="me-auto" action="{{ path('search_recherche') }}">
 
-					<div class="input-group">
 
-						<input class="form-control mr-sm-2" name="q" type="text" placeholder="Rechercher" aria-label="Rechercher">
 
-						<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Go</button>
 
+		<div class="container">
 
+			<header>
 
+				{% include 'flashbag.html.twig' %}
 
+				{% include 'navbar.html.twig' %}
 
+				{% include 'modal.html.twig' %}
 
+				<nav class="navbar">
 
+					<div class="nav-item">
 
+						<h1>{% block titre %}{% endblock %}</h1>
 
 					</div>
 
-				</form>
 
-			</div>
 
-		</nav>
 
-
 
-		
-			
-		<main role="main">
 
-			{% block body %}{% endblock %}
 
-		</main>
 
+					
+				</nav>
 
+			</header>			
+				
+			<main role="main">
 
+				{% block body %}{% endblock %}
 
+			</main>
 
 
-		<footer class="footer">
 
-			{% include 'footer.html.twig' %}
 
-		</footer>
 
+			<footer class="footer">
 
+				{% include 'footer.html.twig' %}
 
+			</footer>
 
+		</div>
 
 
 
 		{{ encore_entry_script_tags('app') }}

+ 1 - 1
templates/genre/modifier.html.twig
View File 

@@ -4,7 +4,7 @@
 
 {% block titre %}Genre - Modifier{% endblock %}
 
 
 {% block body %}
 
-	<div class="grid">
 
+	<div class="row">
 
 		<div class="col">
 
 			{{  form_start(form) }}
 
 			{{ form_rest(form) }}

+ 12 - 2
templates/navbar.html.twig
View File 

@@ -1,4 +1,4 @@
 
-<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
 
+<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
 
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
 
     <span class="navbar-toggler-icon"></span>
 
     </button>
 
@@ -48,8 +48,18 @@
 
             {%  endif %}
 
         </ul>
 
         {% endif %}
 
-        
         <ul class="navbar-nav">
 
+            <li class="nav-item">
 
+                <form class="me-auto" action="{{ path('search_recherche') }}">
 
+                    <div class="input-group">
 
+                        <input class="form-control mr-sm-2" name="q" type="text" placeholder="Rechercher" aria-label="Rechercher">
 
+                        <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Go</button>
 
+                    </div>
 
+                </form>
 
+            </li>
 
+        </ul>
 
+        <ul class="navbar-nav">
 
+        
             <li class="nav-item">
 
                 <a href="#" class="nav-link" data-bs-toggle="modal" data-bs-target="#modalWindow"><i class="fa fa-info-circle fa-lg text-light nav-link" aria-hidden="true"></i></a>
 
             <li>

+ 2 - 2
templates/profil/monprofil.html.twig
View File 

@@ -5,8 +5,8 @@
 
 
 {% block body %}
 
     <div class="container">
 
-        <div class="grid">
 
-            <div class="g-col-4">
 
+        <div class="row">
 
+            <div class="col-4">
 
     {{ form(form) }}
 
     <a href="{{ path('videotheque_liste') }}" class="btn btn-link" role="button">Retour à l'accueil</a>
 
             </div>

+ 1 - 1
templates/realisateur/modifier.html.twig
View File 

@@ -4,7 +4,7 @@
 
 {% block titre %}Réalisateurs - Modifier{% endblock %}
 
 
 {% block body %}
 
-	<div class="grid">
 
+	<div class="row">
 
 		<div class="col">
 
 			{{  form_start(form) }}
 
 			{{ form_rest(form) }}

+ 3 - 3
templates/security/login.html.twig
View File 

@@ -5,8 +5,8 @@
 
 
 {% block body %}
 
     <div class="container">
 
-        <div class="grid">
 
-            <div class="g-col-md-4">
 
+        <div class="row">
 
+            <div class="col-md-4">
 
                 <form method="post">
 
                     {% if error %}
 
                         <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
 
@@ -39,7 +39,7 @@
 
                 </form>
 
             </div>
 
         </div>
 
-        <div class="grid">
 
+        <div class="row">
 
             <div class="hr">
 
                 <p>Pas de compte ? <a href="{{ path('security_register') }}">S'enregistrer</a></p>
 
                 <p>Mot de passe oublié ? <a href="{{ path('security_envoyertoken') }}">Récupérer mot de passe</a></p>

+ 3 - 3
templates/security/login.html.twig.save
View File 

@@ -12,8 +12,8 @@
 
 
     {# Le formulaire, avec URL de soumission vers la route « login_check » comme on l'a vu #}
 
     <div class="container">
 
-        <div class="grid">
 
-            <div class="g-col-md-4">
 
+        <div class="row">
 
+            <div class="col-md-4">
 
                 <form method="post">
 
                     <div class="form-group">
 
                         <label for="username">Login</label>
 
@@ -30,7 +30,7 @@
 
                 </form>
 
             </div>
 
         </div>
 
-        <div class="grid">
 
+        <div class="row">
 
             <div class="">
 
                 <p>Pas de compte ? <a href="{{ path('security_register') }}">S'enregistrer</a></p>
 
                 <p>Mot de passe oublié ? <a href="{{ path('security_envoyertoken') }}">Récupérer mot de passe</a></p>

+ 2 - 2
templates/security/register.html.twig
View File 

@@ -5,8 +5,8 @@
 
 
 {% block body %}
 
     <div class="container">
 
-        <div class="grid">
 
-            <div class="g-col-4">
 
+        <div class="row">
 
+            <div class="col-4">
 
                 {{ form(form) }}
 
             </div>
 
         </div>

+ 9 - 9
templates/videotheque/form.html.twig
View File 

@@ -1,10 +1,10 @@
 
     {{ form_start(form, {'attr': {'class': ''}}) }}
 
     <div class="container-fluid">
 
-        <div class="grid">
 
-            <div class="g-col-3">
 
+        <div class="row">
 
+            <div class="col-md">
 
                 {% form_theme form 'bootstrap_5_horizontal_layout.html.twig' %}
 
 
-                <div class="form-group grid">
 
+                <div class="form-group">
 
                     {{ form_row(form.titre) }}
 
                     {{ form_row(form.annee) }}
 
                     {{ form_row(form.lien) }}
 
@@ -17,31 +17,31 @@
 
                     
                 </div>
 
             </div>
 
-            <div class="col">
 
+            <div class="col-md">
 
                 <div class="card">
 
                     <div class="card-header">
 
                         {{ form_label(form.genres, 'Genres') }}
 
                     </div>
 
                     <div class="card-body">
 
-                        <a href="#" id="add_genre" class="btn btn-link add-another-collection-widget" data-path="{{ path('videotheque_ajax_genres') }}" data-list-selector="#genre-fields-list">Ajouter un genre</a>
 
+                        <button id="add_genre" class="btn btn-link add-another-collection-widget" data-path="{{ path('videotheque_ajax_genres') }}" data-list-selector="#genre-fields-list">Ajouter un genre</button>
 
                         <ul id="genre-fields-list"
 
-                            data-prototype='<div id="App_film_genres___name__" class="input-group"><input type="text" id="App_film_genres___name___name" name="App_film[genres][__name__][name]" required="required" /></div>'
 
+                            data-prototype="{{ form_widget(form.genres.vars.prototype)|e }}"
 
                             data-widget-tags="{{ '<li class="list-group-item"></li>'|e }}"
 
                             data-widget-counter="{{ form.children|length }}">
 
                             {% for genreField in form.genres %}
 
                             <li class="list-group-item">
 
-                                {{ form_errors(genreField) }}
 
                                 {{ form_widget(genreField) }}
 
+                                {{ form_errors(genreField) }}
 
                             </li>
 
                             {% else %}
 
-                                {{ form_errors(form.genres) }}
 
                                 {{ form_widget(form.genres) }}
 
+                                {{ form_errors(form.genres) }}
 
                             {% endfor %}
 
                         </ul>
 
                     </div>
 
                 </div>
 
             </div>
 
-            <div class="col">
 
+            <div class="col-md">
 
                 <div class="card">
 
                     <div class="card-header">
 
                         {{ form_label(form.realisateurs, 'Réalisateurs') }}

+ 24 - 33
templates/videotheque/liste.html.twig
View File 

@@ -9,49 +9,39 @@
 
 {% endblock %}
 
 
 {% block body %}
 
-	<div class="container-xxs">
 
-		<div class="grid">
 
-			<div class="g-col-3">
 
-			{% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
 
-			<p><a class="btn btn-primary" role="button" href="{{ path('videotheque_ajouter') }}"><i class="fa fa-plus-square fa-lg"></i> Ajouter un film</a></p>
 
-			{% endif %}
 
-			</div>
 
-			<div class="g-col-6">
 
-				{# Des filtres ? #}
 
-				{# Ancien emplacement des recherches #}
 
-			</div>
 
-			<div class="g-col-3 text-right">
 
-				<p>Filtrer par film au dessus de
 
-				<input class="rating"
 
-					data-disabled="false"
 
-					data-show-clear="true"
 
-					data-show-caption="false"
 
-					data-theme="krajee-fa"
 
-					data-toggle="star-filter"
 
-					data-path="#tableFilms"
 
-					min=0
 
-					max=5
 
-					data-step=1
 
-					data-size="sm"
 
-					value="0">
 
-				</p>
 
-			</div>
 
-		</div>
 
+	<div class="row">
 
+		{% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
 
+		<p><a class="btn btn-primary" role="button" href="{{ path('videotheque_ajouter') }}"><i class="fa fa-plus-square fa-lg"></i> Ajouter un film</a></p>
 
+		{% endif %}
 
+		<p>Filtrer par film au dessus de
 
+		<input class="rating"
 
+			data-disabled="false"
 
+			data-show-clear="true"
 
+			data-show-caption="false"
 
+			data-theme="krajee-fa"
 
+			data-toggle="star-filter"
 
+			data-path="#tableFilms"
 
+			min=0
 
+			max=5
 
+			data-step=1
 
+			data-size="sm"
 
+			value="0">
 
+		</p>
 
 	</div>
 
-	<div class="">
 
+	<div class="row">
 
 		<table class="table table-bordered table-hover table-sm align-middle">
 
 			<thead class="">
 
 				<tr>
 
 					{% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
 
-						<th style="width:2em;"></th>
 
-						<th style="width:2em;"></th>
 
+						<th style="width:1em;"></th>
 
+						<th style="width:1em;"></th>
 
 						<th>Ajouté par</th>
 
 					{% endif %}
 
 					<th>Titre</th>
 
 					<th>Genre</th>
 
 					<th>Réalisateur</th>
 
-					<th style="width:8em;">Note moyenne</th>
 
-					<th style="width:4em;">Année</th>
 
+					<th style="width:5em;">Note</th>
 
+					<th style="width:5em;">Année</th>
 
 				</tr>
 
 			</thead>
 
 			<tbody id="tableFilms">
 
@@ -128,6 +118,7 @@
 
 								data-show-clear="false"
 
 								data-show-caption="false"
 
 								data-theme="krajee-fa"
 
+								style="display:none;"
 
 								min=0
 
 								max=5
 
 								data-step=0.5

+ 23 - 23
templates/videotheque/voirfilm.html.twig
View File 

@@ -49,16 +49,16 @@
 
 {% endblock %}
 
 
 {%  block body %}
 
-    <div class="grid">
 
-        <div class="g-col-sm-8">
 
-            <div class="grid">
 
-                <div class="g-col-sm-7">
 
+    <div class="row">
 
+        <div class="col-sm-8">
 
+            <div class="row">
 
+                <div class="col-sm-7">
 
                     <div class="card border-info">
 
                         <div class="card-header">
 
-                            <div class="grid">
 
-                                <h5 class="g-col-10">Fiche technique</h5>
 
+                            <div class="row">
 
+                                <h5 class="col-10">Fiche technique</h5>
 
                                 {% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
 
-                                    <div class="g-col-2">
 
+                                    <div class="col-2">
 
                                         <a data-bs-toggle="tooltip" title="Modifier la fiche du film" href="{{ path('videotheque_modifier', {'id': film.id}) }}"><i class="fa fa-edit fa-lg"></i></a>
 
                                         {% if is_granted('ROLE_ADMIN') %}<a href="{{ path('videotheque_supprimer', {'id': film.id})  }}"><i class="fa fa-trash fa-lg", style="color:Tomato;"></i></a>{% endif %}
 
 
@@ -67,37 +67,37 @@
 
                             </div>
 
                         </div>
 
                         <div class="card-body">
 
-                            <dl class="grid">
 
-                                <dt class="g-col-4">Année</dt>
 
-                                <dd class="g-col-8">{{ film.annee | date('Y') }}</dd>
 
-                                <dt class="g-col-4">Réalisateur(s)</dt>
 
-                                <dd class="g-col-8">
 
+                            <dl class="row">
 
+                                <dt class="col-4">Année</dt>
 
+                                <dd class="col-8">{{ film.annee | date('Y') }}</dd>
 
+                                <dt class="col-4">Réalisateur(s)</dt>
 
+                                <dd class="col-8">
 
                                 {% for realisateur in film.realisateurs %}
 
                                     <a href="{{ path('videotheque_listeparreal', {'id': realisateur.id}) }}"><span class="badge bg-info">{{ realisateur.nomComplet }}</span></a>
 
                                 {% endfor %}
 
                                 </dd>
 
-                                <dt class="g-col-4">Genre</dt>
 
-                                <dd class="g-col-8">
 
+                                <dt class="col-4">Genre</dt>
 
+                                <dd class="col-8">
 
                                 {% for genre in film.genres %}
 
                                     <a href="{{ path('videotheque_listepargenre', {'id': genre.id}) }}"><span class="badge bg-info">{{ genre.name }}</span></a>
 
                                 {% endfor %}
 
                                 </dd>
 
                                 {% if film.lien is not null %}
 
-                                <dt class="g-col-4">Lien</dt>
 
-                                <dd class="g-col-8"><a href="{{ film.lien }}"><i class="fa fa-external-link"></i></a></dd>
 
+                                <dt class="col-4">Lien</dt>
 
+                                <dd class="col-8"><a href="{{ film.lien }}"><i class="fa fa-external-link"></i></a></dd>
 
                             {% endif %}
 
                             </dl>
 
                         </div>
 
                         <div class="card-footer">
 
-                            <dl class="grid">
 
-                                <dt class="g-col-4">Suivi par</dt>
 
-                                <dd class="g-col-8">
 
+                            <dl class="row">
 
+                                <dt class="col-4">Suivi par</dt>
 
+                                <dd class="col-8">
 
                                     {% for user in film.usersWantToView %}
 
                                         <span>{{ user.username }}</span>&nbsp;
 
                                     {% endfor %}
 
                                 </dd>
 
-                                <dt class="g-col-4">Vu par</dt>
 
-                                <dd class="g-col-8">
 
+                                <dt class="col-4">Vu par</dt>
 
+                                <dd class="col-8">
 
                                     {% for user in film.usersWhoSeen %}
 
                                         <span>{{ user.username }}</span>&nbsp;
 
                                     {% endfor %}
 
@@ -122,7 +122,7 @@
 
                     </div>
 
 
                 </div>
 
-                <div class="g-col-sm-5">
 
+                <div class="col-sm-5">
 
                     <div class="card border-info">
 
                         <div class="card-header">
 
                             <h5>Bande Annonce</h5>
 
@@ -140,7 +140,7 @@
 
                 </div>
 
             </div>
 
         </div>
 
-        <div class="g-col-sm-4">
 
+        <div class="col-sm-4">
 
             <div class="card border-info">
 
                 <div class="card-header">
 
                     <h5>Commentaires</h5>