openaire-assets/library-css/card.css

87 lines
1.9 KiB
CSS

.uk-card .uk-grid-divider>:not(.uk-first-column)::before {
border-left: 1px solid currentColor;
opacity: 0.2;
}
.uk-card .uk-grid-divider.uk-grid-stack>.uk-grid-margin::before {
border-top: 1px solid currentColor;
opacity: 0.2;
}
.uk-card .uk-button.action, .uk-card .uk-icon-button.action {
background: #FFFFFF;
box-shadow: 0 3px 6px #00000029;
font-family: "Roboto", sans-serif;
border: none;
color: #4D4D4D;
text-transform: none;
line-height: 19px;
font-size: 14px;
}
.uk-card .uk-button.action {
border-radius: 40px;
padding: 12px 20px;
width: 100%;
}
.uk-card .uk-button.action.uk-width-auto {
width: auto;
}
.uk-card .uk-button.action:disabled, .uk-card .uk-icon-button.action:disabled {
opacity: 0.5;
}
.uk-card .uk-button.action:hover:not(:disabled), .uk-card .uk-icon-button.action:hover:not(:disabled) {
box-shadow: 0 3px 6px rgba(71, 135, 230, 0.5);
}
/* --- Flip Card --- */
.uk-card.uk-card-flip {
background-color: transparent;
height: 430px;
perspective: 1000px;
}
/* This container is needed to position the front and back side */
.uk-card-flip-inner {
position: relative;
width: 100%;
height: 100%;
transition: transform 1s;
transform-style: preserve-3d;
}
/* Do an horizontal flip when you move the mouse over the flip box container */
.uk-card.uk-card-flip.uk-active .uk-card-flip-inner {
transform: rotateY(-180deg);
}
/* Position the front and back side */
.uk-card.uk-card-flip .front, .uk-card.uk-card-flip .back {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden; /* Safari */
backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.uk-card.uk-card-flip .front {
background-color: white;
}
/* Style the back side */
.uk-card.uk-card-flip .back {
background-color: white;
transform: rotateY(180deg);
}
.uk-card.disabled {
box-shadow: none;
cursor: not-allowed;
}