#Added Zoom Image and Some CSS Correction

Test
Lucio Vignotto 2020-07-09 18:20:57 +02:00
parent 440c27ca32
commit f750c6a2eb
1 changed files with 22 additions and 8 deletions

View File

@ -25,6 +25,7 @@
padding: 20px 35px;
}
.card-comments{
border-left: 5px solid #1B98E0;
background: hsla(347, 89%, 61%, 1);
background: linear-gradient(90deg, hsla(347, 89%, 61%, 1) 0%, hsla(242, 42%, 40%, 1) 100%);
background: -moz-linear-gradient(90deg, hsla(347, 89%, 61%, 1) 0%, hsla(242, 42%, 40%, 1) 100%);
@ -107,6 +108,17 @@
height: 100%;
width: 300px;
}
.table-hover tbody tr:hover {
background: transparent;
}
.zoom{
transition: transform 0.5s;
}
.zoom:hover {
-ms-transform: scale(1.5); /* IE 9 */
-webkit-transform: scale(1.5); /* Safari 3-8 */
transform: scale(1.5);
}
@media (max-width: 1920px){
body {
background-size: auto;
@ -128,7 +140,7 @@
</div>
</div> <!-- FINE ROW -->
<div class="row no-gutters mt-3">
<div class="col-lg-8 px-3">
<div class="col-lg-8 pl-2 pr-3">
<div class="card-header card-comments">
<h3 class="text-center">FILM PREFERITI</h3>
</div>
@ -208,20 +220,22 @@
Profilo Offline
</div>
<div class="card personalprofile">
<div class="card-comments">
<h3 class="text-center">ULTIMI COMMENTI</h3>
</div>
<table class="table table-hover">
<tbody>
<tr class="row no-gutters">
<tr class="row no-gutters zoom">
<th class="pr-0 pl-1"><a target="_blank"><img src="https://image.tmdb.org/t/p/w1280/e1nWfnnCVqxS2LeTO3dwGyAsG2V.jpg" class="img-fluid lastimagecomments" alt=""></a></th>
<td class="mt-2"><a target="_blank"><p class="pfont text-center">STAR WARS THE CLONE WARS</p></a><p class="text-center commentsmedia">Bellissimo! Lo guardavo sempre con mia sorella! :)</p></td>
<td class="mt-2"><a target="_blank"><p class="pfont text-center">STAR WARS THE CLONE WARS</p></a><p class="text-center commentsmedia pfont">Bellissimo! Lo guardavo sempre con mia sorella! :)</p></td>
</tr>
<tr class="row no-gutters">
<tr class="row no-gutters zoom">
<th class="pr-0 pl-1"><a target="_blank"><img src="https://image.tmdb.org/t/p/w1280/AfdZXqqlFsPUEfi6kWWWthxw7Nz.jpg" class="img-fluid lastimagecomments" alt=""></a></th>
<td class="mt-2"><a target="_blank"><p class="pfont text-center">THE SHIELD</p></a><p class="text-center commentsmedia">Bellissima serie TV! TOP</p></td>
<td class="mt-2"><a target="_blank"><p class="pfont text-center">THE SHIELD</p></a><p class="text-center commentsmedia pfont">Bellissima serie TV! TOP</p></td>
</tr>
<tr class="row no-gutters">
<tr class="row no-gutters zoom">
<th class="pr-0 pl-1"><a target="_blank"><img src="https://image.tmdb.org/t/p/w1280/oB4H3x4jO6vn3v8wjRDXpo4d9yp.jpg" class="img-fluid lastimagecomments" alt=""></a></th>
<td class="mt-2"><a target="_blank"><p class="pfont text-center">ADAM KADMOND</p></a><p class="text-center commentsmedia">Film strepitoso! Consiglio a tutti di guardarlo! :)</p></td>
<td class="mt-2"><a target="_blank"><p class="pfont text-center">ADAM KADMOND</p></a><p class="text-center commentsmedia pfont">Film strepitoso! Consiglio a tutti di guardarlo! :)</p></td>
</tr>
</tbody>
</table>