Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
94 lines (92 sloc) 1.48 KB
@import "../../styles/base.scss";
.card{
margin:0;
padding:0;
color:black;
border:2px solid black;
display:flex;
flex-direction: row;
flex-wrap: wrap;
&:hover{
cursor: pointer;
border-color:$blue;
.heading,.description{color:$blue;}
.image {background: $blue;border-color: $blue;}
.skills{color:$blue;}
}
}
.alt{
background: white;
}
.image{
position: relative;
display:inline-block;
margin:0;
padding:0;
background:black;
padding-top:56.25%;
width:100%;
overflow: hidden;
border-bottom: 2px solid black;
transition:all 500ms;
}
.image img{
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
@extend .image--style-grayscale;
}
.caption{
display:inline-block;
margin:0;
padding: 0 1rem 1rem;
}
.disguise{
position: relative;
overflow: hidden;
&:before{
position: absolute;
bottom:0;
left:0;
right:0;
height:24px;
content:"";
box-shadow: inset 0px -20px 15px -5px #fff;
z-index:1;
}
}
.truncate{
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.heading{
@extend .truncate;
@extend .type--subtitle1;
-webkit-line-clamp: 2;
height: 64px;
}
.description{
@extend .disguise;
@extend .type--body1;
-webkit-line-clamp: 4;
height:72px;
}
.skills{
margin:0 0 12px;
padding:0;
@extend .type--body1;
height:72px;
color:#999;
}
a{
color:$blue;
>*{color:$blue;}
svg{
position: relative;
top:-1px;
}
}
You can’t perform that action at this time.