Restyled project images
This commit is contained in:
parent
df78d39217
commit
73591633ba
1 changed files with 49 additions and 30 deletions
|
@ -41,11 +41,12 @@
|
|||
background-size: cover;
|
||||
.container {
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
margin-top: 27px;
|
||||
margin-bottom: 35px;
|
||||
font-size: 16px;
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 30px;
|
||||
color: white;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
@ -68,29 +69,6 @@
|
|||
|
||||
/* @group project-images */
|
||||
.project-image {
|
||||
@media screen and (max-width: @screen-xs-max) {
|
||||
.wrapper,
|
||||
.wrapper .project {
|
||||
height: 275px;
|
||||
width: 275px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
.wrapper,
|
||||
.wrapper .project {
|
||||
height: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: @screen-md-min) {
|
||||
.wrapper,
|
||||
.wrapper .project {
|
||||
height: 280px;
|
||||
width: 280px;
|
||||
}
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
color: white;
|
||||
margin: 0 auto;
|
||||
|
@ -113,19 +91,60 @@
|
|||
background-image: url(http://www.recommendedagencies.com/images/logos/dabapps-logo-1432733278.jpg);
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-xs-max) {
|
||||
&, & .project {
|
||||
height: 240px;
|
||||
width: 240px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
&, & .project {
|
||||
height: 210px;
|
||||
width: 210px;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: @screen-md-min) {
|
||||
&, & .project {
|
||||
height: 280px;
|
||||
width: 280px;
|
||||
}
|
||||
}
|
||||
|
||||
& .project {
|
||||
padding: 15px;
|
||||
padding-top: 20%;
|
||||
padding: 10%;
|
||||
.transition(~"opacity 0.5s ease-in");
|
||||
opacity: 0;
|
||||
background-color: rgba(0,0,0,0.6);
|
||||
text-align: center;
|
||||
|
||||
p, a.btn {
|
||||
font-size: 12px;
|
||||
@media screen and (max-width: @screen-xs-max) {
|
||||
p, a.btn {
|
||||
font-size: 15px;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 33px;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
font-size: 23px;
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
p, a.btn {
|
||||
font-size: 16px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 27px;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: @screen-md-min) {
|
||||
padding: 13%;
|
||||
p, a.btn {
|
||||
font-size: 17px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 38px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue