| Current Path : /home/h/a/p/happyrenas/old/devis-huissier.fr/old/sass/components/content/isotope/ |
Linux webd005.cluster105.gra.hosting.ovh.net 5.15.206-ovh-vps-grsec-zfs-classid #1 SMP Fri May 15 02:41:25 UTC 2026 x86_64 |
| Current File : /home/h/a/p/happyrenas/old/devis-huissier.fr/old/sass/components/content/isotope/_grid-1.scss |
// ISOTOP GRID
.c-content-isotope-grid{
.c-content-isotope-item{
height:auto;
position: relative;
overflow: hidden;
>.c-content-isotope-image-container{
position: relative;
overflow: hidden;
.c-content-isotope-image{
width:100%;
height: auto;
@include transition(all .3s ease-in-out);
}
>.c-content-isotope-overlay{
position: absolute;
width: 100%;
height: 100%;
padding:30px;
background-color: rgba(0,0,0,0.7);
top:0;
left:0;
opacity: 0;
@include transition(all .3s ease-in-out);
>.c-content-isotope-overlay-content{
text-align: center;
>.c-content-isotope-overlay-title{
margin-top:0;
font-size:18px;
font-weight: 600;
}
>.c-content-isotope-overlay-desc{
font-size:14px;
}
>.c-content-isotope-overlay-price{
font-size:28px;
}
}
}
&:hover{
>.c-content-isotope-overlay{
opacity: 1;
}
}
}
}
&.c-opt-1{
margin:-10px;
.c-content-isotope-item{
width:25%;
padding:10px;
&.c-item-size-double{
width:50%;
}
.c-content-isotope-image-container{
padding:7px;
background-color: rgba(0,0,0,0.1);
>.c-content-isotope-overlay{
width:auto;
height:auto;
left:7px;
right:7px;
top:auto;
bottom:-100%;
}
&:hover{
>.c-content-isotope-overlay{
bottom:7px;
}
}
}
}
}
&.c-opt-2{
margin:-10px;
.c-content-isotope-item{
width:25%;
padding:10px;
&.c-item-size-double{
width:50%;
}
.c-content-isotope-image-container{
padding:7px;
background-color: rgba(0,0,0,0.1);
.c-content-isotope-overlay-content{
width: 80%;
position: absolute;
top:50%;
left:50%;
transform:translateY(-50%) translateX(-50%);
}
}
}
}
&.c-opt-3{
margin:-10px;
.c-content-isotope-item{
width:25%;
padding:10px;
&.c-item-size-double{
width:50%;
}
.c-content-isotope-image-container{
padding:7px;
background-color: #fff;
border:1px solid #ccc;
width:100%;
.c-content-isotope-overlay-content{
width: 80%;
position: absolute;
top:50%;
left:50%;
transform:translateY(-50%) translateX(-50%);
>.c-content-isotope-overlay-btn{
margin: 10px 0 0 0;
&:first-child{
margin-top:0;
}
}
}
&:hover{
box-shadow: 0px 0px 15px #000;
}
}
}
}
}
@media (max-width: $screen-sm-max){ // 991px
.c-content-isotope-grid{
&.c-opt-1,
&.c-opt-2,
&.c-opt-3{
.c-content-isotope-item{
width:50%;
&.c-item-size-double{
width:100%;
}
}
}
}
}
@media (max-width: $screen-xs-min){ // 480px;
.c-content-isotope-grid{
&.c-opt-1,
&.c-opt-2,
&.c-opt-3{
.c-content-isotope-item{
width:100%;
}
}
}
}