star-rating.css 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. /*!
  2. * bootstrap-star-rating v4.0.2
  3. * http://plugins.krajee.com/star-rating
  4. *
  5. * Author: Kartik Visweswaran
  6. * Copyright: 2013 - 2017, Kartik Visweswaran, Krajee.com
  7. *
  8. * Licensed under the BSD 3-Clause
  9. * https://github.com/kartik-v/bootstrap-star-rating/blob/master/LICENSE.md
  10. */
  11. .rating-loading {
  12. width: 25px;
  13. height: 25px;
  14. font-size: 0;
  15. color: #fff;
  16. background: transparent url('../img/loading.gif') top left no-repeat;
  17. border: none;
  18. }
  19. /*
  20. * Stars & Input
  21. */
  22. .rating-container .rating-stars {
  23. position: relative;
  24. cursor: pointer;
  25. vertical-align: middle;
  26. display: inline-block;
  27. overflow: hidden;
  28. white-space: nowrap;
  29. }
  30. .rating-container .rating-input {
  31. position: absolute;
  32. cursor: pointer;
  33. width: 100%;
  34. height: 1px;
  35. bottom: 0;
  36. left: 0;
  37. font-size: 1px;
  38. border: none;
  39. background: none;
  40. padding: 0;
  41. margin: 0;
  42. }
  43. .rating-disabled .rating-input, .rating-disabled .rating-stars {
  44. cursor: not-allowed;
  45. }
  46. .rating-container .star {
  47. display: inline-block;
  48. margin: 0 3px;
  49. text-align: center;
  50. }
  51. .rating-container .empty-stars {
  52. color: #aaa;
  53. }
  54. .rating-container .filled-stars {
  55. position: absolute;
  56. left: 0;
  57. top: 0;
  58. margin: auto;
  59. color: #fde16d;
  60. white-space: nowrap;
  61. overflow: hidden;
  62. -webkit-text-stroke: 1px #777;
  63. text-shadow: 1px 1px #999;
  64. }
  65. .rating-rtl {
  66. float: right;
  67. }
  68. .rating-animate .filled-stars {
  69. transition: width 0.25s ease;
  70. -o-transition: width 0.25s ease;
  71. -moz-transition: width 0.25s ease;
  72. -webkit-transition: width 0.25s ease;
  73. }
  74. .rating-rtl .filled-stars {
  75. left: auto;
  76. right: 0;
  77. -moz-transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
  78. -webkit-transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
  79. -o-transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
  80. transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
  81. }
  82. .rating-rtl.is-star .filled-stars {
  83. right: 0.06em;
  84. }
  85. .rating-rtl.is-heart .empty-stars {
  86. margin-right: 0.07em;
  87. }
  88. /**
  89. * Sizes
  90. */
  91. .rating-xl {
  92. font-size: 4.89em;
  93. }
  94. .rating-lg {
  95. font-size: 3.91em;
  96. }
  97. .rating-md {
  98. font-size: 3.13em;
  99. }
  100. .rating-sm {
  101. font-size: 2.5em;
  102. }
  103. .rating-xs {
  104. font-size: 2em;
  105. }
  106. .rating-xl {
  107. font-size: 4.89em;
  108. }
  109. /**
  110. * Clear
  111. */
  112. .rating-container .clear-rating {
  113. color: #aaa;
  114. cursor: not-allowed;
  115. display: inline-block;
  116. vertical-align: middle;
  117. font-size: 60%;
  118. }
  119. .clear-rating-active {
  120. cursor: pointer !important;
  121. }
  122. .clear-rating-active:hover {
  123. color: #843534;
  124. }
  125. .rating-container .clear-rating {
  126. padding-right: 5px;
  127. }
  128. /**
  129. * Caption
  130. */
  131. .rating-container .caption {
  132. color: #999;
  133. display: inline-block;
  134. vertical-align: middle;
  135. font-size: 60%;
  136. margin-top: -0.6em;
  137. }
  138. .rating-container .caption {
  139. margin-left: 5px;
  140. margin-right: 0;
  141. }
  142. .rating-rtl .caption {
  143. margin-right: 5px;
  144. margin-left: 0;
  145. }
  146. /**
  147. * Print
  148. */
  149. @media print {
  150. .rating-container .clear-rating {
  151. display: none;
  152. }
  153. }