diff options
| author | Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> | 2025-03-04 04:32:50 -0500 |
|---|---|---|
| committer | Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> | 2025-03-04 04:32:50 -0500 |
| commit | 95abdada5a275fc258fa72781f7f3c40c0b306ea (patch) | |
| tree | 6d729cebe0937ae81108005de9895b5398d1f475 /src/client/views/collections/CollectionCarouselView.scss | |
| parent | 0a8f3739cf5c30852f18751a4c05d81e0dabe928 (diff) | |
| parent | 215ad40efa2e343e290d18bffbc55884829f1a0d (diff) | |
Merge branch 'master' of https://github.com/brown-dash/Dash-Web into Merge
Diffstat (limited to 'src/client/views/collections/CollectionCarouselView.scss')
| -rw-r--r-- | src/client/views/collections/CollectionCarouselView.scss | 42 |
1 files changed, 14 insertions, 28 deletions
diff --git a/src/client/views/collections/CollectionCarouselView.scss b/src/client/views/collections/CollectionCarouselView.scss index 01b20d6d3..544b3e262 100644 --- a/src/client/views/collections/CollectionCarouselView.scss +++ b/src/client/views/collections/CollectionCarouselView.scss @@ -1,5 +1,8 @@ .collectionCarouselView-outer { height: 100%; + position: relative; + overflow: hidden; + display: flex; .collectionCarouselView-caption { height: 50; display: inline-block; @@ -10,15 +13,11 @@ display: inline-block; width: 100%; user-select: none; + position: absolute; + top: 0; + left: 0; } } -.collectionCarouselView-addFlashcards { - justify-content: center; - align-items: center; - height: 100%; - z-index: -1; - pointer-events: none; -} .collectionCarouselView-recentlyMissed { color: red; z-index: 999; @@ -28,15 +27,11 @@ pointer-events: none; } .carouselView-back, -.carouselView-fwd, -.carouselView-star, -.carouselView-remove, -.carouselView-check { +.carouselView-fwd { position: absolute; display: flex; - top: 42.5%; width: 30; - height: 15%; + height: 30; align-items: center; border-radius: 5px; justify-content: center; @@ -47,24 +42,15 @@ } } .carouselView-fwd { - right: 20; + top: calc(50% - 15px); + right: 0; + transform-origin: right top; } .carouselView-back { - left: 20; -} -.carouselView-star { - top: 0; - right: 20; -} -.carouselView-remove { - top: 80%; - left: 52%; -} -.carouselView-check { - top: 80%; - right: 52%; + top: calc(50% - 15px); + left: 0; + transform-origin: top left; } - .carouselView-back:hover, .carouselView-fwd:hover { background: lightgray; |
