responsivewebframework
Version:
Jalasoft Foundation Front End Framework ========================================
72 lines (64 loc) • 1.65 kB
text/less
[class = "container-img"] {
border: 1px @card-background-color solid;
width: @card-width;
height: @card-height;
border-radius: @card-border-radius;
background-color: @card-background-color;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
margin: 1px;
transition: background-size 200ms ease-in;
-moz-transition: background-size 200ms ease-in;
-web-kit-transition: background-size 200ms ease-in
}
[class = "border-gray"]{
border: 1px #DEDEDE solid;
width: @card-width;
height: @card-height;
border-radius: @card-border-radius-gray;
display: table-cell;
vertical-align: middle;
overflow: hidden;
text-align: center;
margin: 1px 16px;
}
[class = "container-card"]{
background-color: transparent;
height: @container-card-height;
margin: 5px;
float: left;
display: table;
color: @container-card-color;
width: @container-card-width;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
[class = "container-card"]:hover {
color: @link-color;
cursor: default;
-webkit-transition: color 200ms;
-moz-transition: color 200ms;
-o-transition: color 200ms;
-ms-transition:color 200ms;
transition: color 200ms;
}
[class = "container-img"]:hover {
background-size: 150% 150%;
}
.containerinformation {
height: @containerinformation-height;
display: table-cell;
vertical-align: middle;
padding-left: @containerinformation-padding-left;
}
.card-data {
font-family: @font-family-rounded-Regular;
font-size: 12px;
}
.card-name {
font-family: @font-family-rounded-Light;
font-size: 16px;
}