|
|
|
@ -40,6 +40,11 @@ |
|
|
|
|
border-radius: 8px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.front{ |
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.front .card { |
|
|
|
|
background: url("images/pile-bg.png") center no-repeat, url("images/mark.png") center no-repeat; |
|
|
|
|
} |
|
|
|
@ -125,6 +130,7 @@ |
|
|
|
|
} |
|
|
|
|
.card .picture > div img { |
|
|
|
|
max-width: 100%; |
|
|
|
|
max-height: 100%; |
|
|
|
|
vertical-align: middle; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -159,10 +165,10 @@ |
|
|
|
|
margin-top: -35px; |
|
|
|
|
display: none; |
|
|
|
|
color: #FFF; |
|
|
|
|
} |
|
|
|
|
} /*here!!!!!!!!!*/ |
|
|
|
|
|
|
|
|
|
.onEdit .card-container .actions { |
|
|
|
|
display: block; |
|
|
|
|
display: none; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.actions button[role="flip"] { |
|
|
|
@ -177,7 +183,7 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.card-container { |
|
|
|
|
-webkit-perspective: 600px; |
|
|
|
|
/*-webkit-perspective: 600px;*/ |
|
|
|
|
position: relative; |
|
|
|
|
width: 180px; |
|
|
|
|
height: 180px; |
|
|
|
@ -191,20 +197,20 @@ |
|
|
|
|
position: relative; |
|
|
|
|
width:100%; |
|
|
|
|
height: 100%; |
|
|
|
|
overflow: hidden; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.cards > div { |
|
|
|
|
position: absolute; |
|
|
|
|
float: left; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.csstransforms3d .cards > div { |
|
|
|
|
-webkit-transform-style: preserve-3d; |
|
|
|
|
-webkit-transition: all .5s ease-in-out; |
|
|
|
|
-webkit-backface-visibility: hidden; |
|
|
|
|
/*-webkit-backface-visibility: hidden;*/ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.csstransforms3d .cards > div:first-child { |
|
|
|
|
-webkit-transform: rotateY( 0deg ); |
|
|
|
|
/*-webkit-transform: rotateY( 0deg );*/ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.no-csstransforms3d .cards > div:first-child { |
|
|
|
@ -212,7 +218,7 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.csstransforms3d .cards > div:last-child { |
|
|
|
|
-webkit-transform: rotateY( -180deg ); |
|
|
|
|
/* -webkit-transform: rotateY( -180deg );*/ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.no-csstransforms3d .cards > div:last-child { |
|
|
|
@ -220,7 +226,10 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.csstransforms3d .cards.flip > div:first-child { |
|
|
|
|
-webkit-transform: rotateY( 180deg ); |
|
|
|
|
height: 0; |
|
|
|
|
-webkit-transition-property: height; |
|
|
|
|
-webkit-transition-duration: 0.5s; |
|
|
|
|
/*transition-timing-function: ease;*/ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.no-csstransforms3d .cards.flip > div:first-child { |
|
|
|
@ -228,7 +237,8 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.csstransforms3d .cards.flip > div:last-child { |
|
|
|
|
-webkit-transform: rotateY( 0deg ); |
|
|
|
|
/*-webkit-transform: rotateY( 0deg );*/ |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.no-csstransforms3d .cards.flip > div:last-child { |
|
|
|
|