From ed3a2fc8aeb2e5eb2b99925c9a2613f091355083 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Apr 2020 20:47:55 -0400 Subject: those weren't the modals she's looking for... --- src/scss/flash-card.scss | 38 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 src/scss/flash-card.scss (limited to 'src/scss/flash-card.scss') diff --git a/src/scss/flash-card.scss b/src/scss/flash-card.scss new file mode 100644 index 0000000..5ba4ce9 --- /dev/null +++ b/src/scss/flash-card.scss @@ -0,0 +1,38 @@ +.flash-card { + background-color: transparent; + width: 100%; + height: 200px; + perspective: 1000px; +} + +.flash-card-inner { + position: relative; + width: 100%; + height: 100%; + text-align: center; + transition: transform 0.5s; + transform-style: preserve-3d; +} + +.flash-card:hover .flash-card-inner { + transform: rotateY(180deg); +} + +.flash-card-front, +.flash-card-back { + position: absolute; + width: 100%; + height: 100%; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} + +.flash-card-front { + border-radius: $box-radius; + line-height: 150px; +} + +.flash-card-back { + border-radius: $box-radius; + transform: rotateY(180deg); +} -- cgit v1.2.3