diff --git a/src/app/booking/booking.page.scss b/src/app/booking/booking.page.scss index ee222cf..5266bef 100644 --- a/src/app/booking/booking.page.scss +++ b/src/app/booking/booking.page.scss @@ -170,4 +170,79 @@ ion-slides { font-size: 0.9rem; line-height: 1.5; } -} \ No newline at end of file +} + +// figure { +// margin: 0; +// display: block; +// width: 100%; +// height: 100%; +// transition: filter 0.3s; +// border: 0px; +// padding: 0; +// border-radius: 7px; +// overflow: hidden; + +// -webkit-perspective: 1200px; +// -moz-perspective: 1200px; +// -ms-perspective: 1200px; +// perspective: 1200px; + +// &.active { +// img { +// &:nth-child(1) { +// animation: sideViewOut 0.3s forwards; +// } + +// &:nth-child(2) { +// animation: topViewIn 0.3s forwards; +// animation-delay: 0.1s; +// } +// } +// } + +// img { +// height: 80%; +// object-fit: contain; +// display: block; +// width: 80%; +// margin: 0 auto; +// position: absolute; +// left: 10%; +// top: 0; + +// -webkit-transform-style: preserve-3d; +// -moz-transform-style: preserve-3d; +// -ms-transform-style: preserve-3d; +// transform-style: preserve-3d; +// transform-origin: 50px 0; + +// &:nth-child(2) { +// transform: translateY(50%)rotateX(90deg); +// opacity: 0; +// } +// } +// } + +// @keyframes sideViewOut { +// 0% { +// transform: translateY(0%)rotateX(0deg); +// } +// 100% { +// transform: translateY(50%)rotateX(-90deg); +// width: 80%; +// height: 50%; +// opacity: 0; +// } +// } + +// @keyframes topViewIn { +// 0% { +// transform: translateY(50%)rotateX(90deg); +// opacity: 0; +// } +// 100% { +// transform: translateY(0%)rotateX(0deg); +// opacity: 1; +// } +// } \ No newline at end of file