Revision 60865
Added by Konstantinos Triantafyllou almost 3 years ago
modules/uoa-services-library/trunk/ng-openaire-library/src/assets/library-css/card.scss | ||
---|---|---|
36 | 36 |
.uk-card .uk-button.action:hover:not(:disabled), .uk-card .uk-icon-button.action:hover:not(:disabled) { |
37 | 37 |
box-shadow: 0 3px 6px rgba(71, 135, 230, 0.5); |
38 | 38 |
} |
39 |
|
|
40 |
/* --- Flip Card --- */ |
|
41 |
.uk-card.uk-card-flip { |
|
42 |
background-color: transparent; |
|
43 |
height: 420px; |
|
44 |
perspective: 1000px; |
|
45 |
} |
|
46 |
|
|
47 |
/* This container is needed to position the front and back side */ |
|
48 |
.uk-card-flip-inner { |
|
49 |
position: relative; |
|
50 |
width: 100%; |
|
51 |
height: 100%; |
|
52 |
transition: transform 1s; |
|
53 |
transform-style: preserve-3d; |
|
54 |
} |
|
55 |
|
|
56 |
/* Do an horizontal flip when you move the mouse over the flip box container */ |
|
57 |
.uk-card.uk-card-flip.uk-active .uk-card-flip-inner { |
|
58 |
transform: rotateY(-180deg); |
|
59 |
} |
|
60 |
|
|
61 |
/* Position the front and back side */ |
|
62 |
.uk-card.uk-card-flip .front, .uk-card.uk-card-flip .back { |
|
63 |
position: absolute; |
|
64 |
width: 100%; |
|
65 |
height: 100%; |
|
66 |
-webkit-backface-visibility: hidden; /* Safari */ |
|
67 |
backface-visibility: hidden; |
|
68 |
} |
|
69 |
.uk-card.uk-card-flip .front { |
|
70 |
background-color: white; |
|
71 |
} |
|
72 |
|
|
73 |
/* Style the back side */ |
|
74 |
.uk-card.uk-card-flip .back { |
|
75 |
background-color: white; |
|
76 |
transform: rotateY(180deg); |
|
77 |
} |
modules/uoa-services-library/trunk/ng-openaire-library/src/assets/library-css/portal.scss | ||
---|---|---|
55 | 55 |
|
56 | 56 |
/* Link */ |
57 | 57 |
.portal-link { |
58 |
color: var(--portal-main-color) !important;
|
|
58 |
color: var(--portal-main-color); |
|
59 | 59 |
} |
60 | 60 |
|
61 |
.portal-link:hover { |
|
61 |
.portal-link:hover:not(.uk-icon-link), .portal-link:active:not(.uk-icon-link), .portal-link:focus:not(.uk-icon-link) {
|
|
62 | 62 |
text-decoration: underline !important; |
63 | 63 |
} |
64 | 64 |
|
65 |
.portal-link.uk-icon-link:hover, .portal-link.uk-icon-link:active, .portal-link.uk-icon-link:focus { |
|
66 |
color: var(--portal-dark-color); |
|
67 |
} |
|
68 |
|
|
65 | 69 |
/* Icon */ |
66 | 70 |
.portal-icon svg > * { |
67 | 71 |
fill: var(--portal-main-color); |
Also available in: Unified diff
[Library | Assets]: Add flip card css