VCarousel.css 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. .v-carousel {
  2. overflow: hidden;
  3. position: relative;
  4. width: 100%;
  5. }
  6. .v-carousel__controls {
  7. align-items: center;
  8. bottom: 0;
  9. display: flex;
  10. height: 50px;
  11. justify-content: center;
  12. list-style-type: none;
  13. position: absolute;
  14. width: 100%;
  15. z-index: 1;
  16. }
  17. .v-carousel__controls {
  18. background: rgba(var(--v-theme-surface-variant), 0.3);
  19. color: rgb(var(--v-theme-on-surface-variant));
  20. }
  21. .v-carousel__controls > .v-item-group {
  22. flex: 0 1 auto;
  23. }
  24. .v-carousel__controls__item {
  25. margin: 0 8px;
  26. }
  27. .v-carousel__controls__item .v-icon {
  28. opacity: 0.5;
  29. }
  30. .v-carousel__controls__item--active .v-icon {
  31. opacity: 1;
  32. vertical-align: middle;
  33. }
  34. .v-carousel__controls__item:hover {
  35. background: none;
  36. }
  37. .v-carousel__controls__item:hover .v-icon {
  38. opacity: 0.8;
  39. }
  40. .v-carousel__progress {
  41. margin: 0;
  42. position: absolute;
  43. bottom: 0;
  44. left: 0;
  45. right: 0;
  46. }
  47. .v-carousel-item {
  48. display: block;
  49. height: inherit;
  50. text-decoration: none;
  51. }
  52. .v-carousel-item > .v-img {
  53. height: inherit;
  54. }
  55. .v-carousel--hide-delimiter-background .v-carousel__controls {
  56. background: transparent;
  57. }
  58. .v-carousel--vertical-delimiters .v-carousel__controls {
  59. flex-direction: column;
  60. height: 100% !important;
  61. width: 50px;
  62. }