The original lightbox script, finally on github. http://lokeshdhakar.com/projects/lightbox2/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

118 lines
1.9KB

  1. @import "compass/css3"
  2. @import "compass/utilities/general/clearfix"
  3. @import "variables"
  4. #lightboxOverlay
  5. position: absolute
  6. top: 0
  7. left: 0
  8. z-index: 9999
  9. background-color: #000
  10. +opacity(0.85)
  11. display: none
  12. #lightbox
  13. position: absolute
  14. left: 0
  15. width: 100%
  16. z-index: 10000
  17. text-align: center
  18. line-height: 0
  19. font-family: 'lucida grande', tahoma, verdana, arial, sans-serif
  20. font-weight: normal
  21. img
  22. width: auto
  23. height: auto
  24. a img
  25. border: none
  26. .lb-outerContainer
  27. position: relative
  28. background-color: #fff
  29. +pie-clearfix
  30. width: 250px
  31. height: 250px
  32. margin: 0 auto
  33. +border-radius($radius)
  34. .lb-container
  35. padding: 10px
  36. .lb-loader
  37. position: absolute
  38. top: 40%
  39. left: 0%
  40. height: 25%
  41. width: 100%
  42. text-align: center
  43. line-height: 0
  44. .lb-nav
  45. position: absolute
  46. top: 0
  47. left: 0
  48. height: 100%
  49. width: 100%
  50. z-index: 10
  51. .lb-container > .nav
  52. left: 0
  53. .lb-nav a
  54. outline: none
  55. .lb-prev, .lb-next
  56. width: 49%
  57. height: 100%
  58. background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7")
  59. /* Trick IE into showing hover
  60. display: block
  61. .lb-prev
  62. left: 0
  63. float: left
  64. .lb-next
  65. right: 0
  66. float: right
  67. .lb-prev
  68. &:hover
  69. background: url(../images/prev.png) left 48% no-repeat
  70. .lb-next
  71. &:hover
  72. background: url(../images/next.png) right 48% no-repeat
  73. .lb-dataContainer
  74. margin: 0 auto
  75. padding-top: 5px
  76. +pie-clearfix
  77. width: 100%
  78. +border-bottom-radius($radius)
  79. .lb-data
  80. padding: 0 10px
  81. color: #bbb
  82. .lb-details
  83. width: 85%
  84. float: left
  85. text-align: left
  86. line-height: 1.1em
  87. .lb-caption
  88. font-size: 13px
  89. font-weight: bold
  90. line-height: 1em
  91. .lb-number
  92. display: block
  93. clear: left
  94. padding-bottom: 1.0em
  95. font-size: 11px
  96. .lb-close
  97. width: 35px
  98. float: right
  99. padding-bottom: 0.7em
  100. outline: none
  101. &:hover
  102. cursor: pointer