test du coverflow page d'acceuil

SRC/public/css/coverflow.css

@@ -0,0 +1,95 @@
+.coverflow
+{
+	padding: 2%;
+}
+
+.coverflow ul
+{
+	width: 90%;
+    padding: 0;
+    perspective: 500px;
+    -webkit-perspective : 500px;
+    -moz-perspective : 500px;
+}
+
+.coverflow ul li{
+	padding-top : 4%;
+    display: inline-block;
+    width: 180px;
+    height: 280px;
+    background: orangered;
+    margin-right: -60px;
+    transform: rotateY(45deg);
+    -webkit-transform :rotateY(45deg);
+    -moz-transform :rotateY(45deg);
+    position: relative;
+    z-index: 50;
+}
+
+/* l'element actif element */
+.coverflow ul li:nth-child(1)
+{
+	  display: inline-block;
+     width: 220px;
+    height: 320px;
+    background: orangered;
+    -webkit-transform :rotateY(0deg) scale(1.2);
+    -moz-transform :rotateY(0deg) scale(1.2);
+    transform: rotateY(0deg) scale(1.2);
+    
+    z-index: 55;
+}
+
+/* z-index du premier et dernier element (derrière) */
+.coverflow ul li:first-child,
+.coverflow ul li:last-child{
+
+    z-index: 45;
+}
+
+/* les elements qui suivent l'element central */
+.coverflow ul li:nth-child(1) ~  li
+{
+  display: inline-block;
+    width: 180px;
+    height: 280px;
+    background: orangered;
+    transform: rotateY(-45deg);
+    -webkit-transform :rotateY(-45deg);
+    -moz-transform :rotateY(-45deg);
+}
+
+.coverflow ul li:hover,
+.coverflow ul li:nth-child(1) ~ li:hover /* element survole */
+{
+    display: inline-block;
+     width: 220px;
+    height: 320px;
+    background: black;
+    transform: rotateY(0deg) scale(1.2);
+    -webkit-transform: rotateY(0deg) scale(1.2);
+    -moz-transform: rotateY(0deg) scale(1.2);
+    
+    z-index: 60;
+}
+
+.coverflow ul li:hover ~  li
+{   
+    transform: rotateY(-45deg);
+    -webkit-transform :rotateY(-45deg);
+    -moz-transform :rotateY(-45deg);
+}
+
+/* les elements non survoles, lors du survol du parent */
+.coverflow ul:hover li:not(:hover){
+    transform: rotateY(45deg);
+    -moz-transform: rotateY(45deg);
+    -webkit-transform: rotateY(45deg);
+}
+
+/* les elements qui suivent l'element survole */
+.coverflow ul:hover li:hover ~ li{
+    transform: rotateY(-45deg);
+    -moz-transform: rotateY(-45deg);
+    -webkit-transform: rotateY(-45deg);
+}

SRC/public/css/home.css

@@ -6,6 +6,21 @@ body {
   background-size:cover;
 }
 
+.back_home
+{
+	background: white;
+	width  : 10%;
+	padding : 1%;
+	border-radius: 8px;
+	border: 1px solid silver;
+}
+
+.back_home img
+{
+	width: 40%;
+	height: 40%;
+}
+
 .imgSearch /* image de la loupe */
 {
 	height: 25px;

SRC/public/css/referent.css

@@ -41,6 +41,16 @@ background: linear-gradient(to bottom, #a7cfdf 0%,#23538a 100%); /* W3C */
 	width : 25%;
 }
 
+.tablethead
+{
+	color: white;
+}
+
+.chosen-select /* les select */
+{
+	width : 20%;
+}
+
 .listg legend
 {
 	color: white;
@@ -114,11 +124,6 @@ background: linear-gradient(to bottom, #a7cfdf 0%,#23538a 100%); /* W3C */
 	width: 20px;
 }
 
-.control-label
-{
-
-}
-
 
 /* ----------------------------  switch checkbox ---------------------------------*/