You are here

panopoly-widgets-spotlight.css in Panopoly Widgets 7

CSS styles for Spotlight widget.

File

panopoly-widgets-spotlight.css
View source
  1. /**
  2. * @file
  3. * CSS styles for Spotlight widget.
  4. */
  5. /**
  6. * Spotlight Widget - General Components
  7. */
  8. .pane-bundle-spotlight {
  9. font-size: 1em;
  10. }
  11. .pane-bundle-spotlight {
  12. font-size: 1em;
  13. }
  14. .pane-bundle-spotlight input,
  15. .pane-bundle-spotlight select,
  16. .pane-bundle-spotlight textarea,
  17. .pane-bundle-spotlight button {
  18. font-size: 1em;
  19. }
  20. .pane-bundle-spotlight .panopoly-spotlight-widget-wrapper {
  21. border: 0px solid #aaaaaa;
  22. background: transparent 50% 50% repeat-x;
  23. color: #222222;
  24. }
  25. .pane-bundle-spotlight .panopoly-spotlight-widget-wrapper a {
  26. color: #222222;
  27. }
  28. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper ul {
  29. border: 0px solid #aaaaaa;
  30. background: transparent 50% 50% repeat-x;
  31. color: #222222;
  32. font-weight: bold;
  33. }
  34. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper a {
  35. color: #222222;
  36. }
  37. /**
  38. * Spotlight Widget - Function Buttons
  39. */
  40. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper {
  41. display: none;
  42. z-index: 1;
  43. position: absolute;
  44. top: 0.7em;
  45. right: 0.7em;
  46. }
  47. .pane-bundle-spotlight .panopoly-spotlight-function-buttons {
  48. display: inline-block;
  49. padding: 0;
  50. vertical-align: top;
  51. }
  52. .pane-bundle-spotlight .panopoly-spotlight-function-buttons a {
  53. display: inline-block;
  54. line-height: 25px;
  55. color: #FFFFFF;
  56. padding: 0px 10px;
  57. background: none;
  58. background-color: #000;
  59. opacity: .75;
  60. border: 1px solid #000000 !important;
  61. border-top-left-radius: 0px;
  62. border-top-right-radius: 0px;
  63. }
  64. /**
  65. * Spotlight Widget - Tabs Styles.
  66. */
  67. .pane-bundle-spotlight .panopoly-spotlight-widget-wrapper {
  68. position: relative;
  69. padding: 0em;
  70. zoom: 1;
  71. }
  72. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper ul {
  73. display: inline-block;
  74. margin: 0;
  75. padding: 0;
  76. vertical-align: top;
  77. font: bold 13px/25px 'Open Sans', 'Lucida Sans', 'Lucida Grande', verdana sans-serif;
  78. }
  79. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li {
  80. list-style: none;
  81. float: left;
  82. position: relative;
  83. top: 0px;
  84. margin: 0 .2em 1px 0;
  85. border-bottom: 1px solid #AAAAAA !important;
  86. padding: 0;
  87. white-space: nowrap;
  88. }
  89. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li a {
  90. float: left;
  91. padding: 0px 10px;
  92. text-decoration: none;
  93. font-weight: normal;
  94. }
  95. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li.active {
  96. margin-bottom: 0;
  97. padding-bottom: 0px;
  98. }
  99. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li.active a {
  100. cursor: text;
  101. }
  102. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li a {
  103. cursor: pointer;
  104. }
  105. .pane-bundle-spotlight .panopoly-spotlight {
  106. display: block;
  107. border-width: 0;
  108. padding: 0em;
  109. background: none;
  110. min-height: 10em;
  111. }
  112. /**
  113. * Spotlight Widget - Specific Overrides and Styles
  114. */
  115. .pane-bundle-spotlight .panopoly-spotlight-wrapper ul {
  116. /*position: absolute; right: .7em; top: .7em;*/
  117. }
  118. .pane-bundle-spotlight .panopoly-spotlight-wrapper {
  119. position: absolute;
  120. left: 0px;
  121. bottom: 0px;
  122. display: inline-block;
  123. max-width: 85%;
  124. max-height: 75%;
  125. overflow: hidden;
  126. }
  127. .pane-bundle-spotlight .panopoly-spotlight-wrapper h2 {
  128. margin: 0;
  129. }
  130. .pane-bundle-spotlight .panopoly-spotlight-wrapper h2 a {
  131. text-decoration: none;
  132. color: #FFFFFF;
  133. }
  134. .pane-bundle-spotlight .panopoly-spotlight-wrapper p {
  135. font-size: .8em;
  136. margin: 0;
  137. line-height: 1.2;
  138. margin-top: 5px;
  139. }
  140. .pane-bundle-spotlight .panopoly-spotlight-label {
  141. box-sizing: content-box;
  142. max-height: 2.9em;
  143. line-height: 1.5;
  144. overflow: hidden;
  145. padding: .3em .7em;
  146. margin: 0 50px 0 0;
  147. background-color: #FFF;
  148. opacity: .75;
  149. }
  150. .pane-bundle-spotlight .panopoly-spotlight-info {
  151. padding: .7em;
  152. background-color: #000000;
  153. color: #FFFFFF;
  154. opacity: .75;
  155. }
  156. .pane-bundle-spotlight .panopoly-spotlight-info p {
  157. max-height: 2.4em;
  158. overflow: hidden;
  159. }
  160. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li {
  161. background: none;
  162. background-color: #000;
  163. opacity: .75;
  164. border: 1px solid #000000 !important;
  165. border-top-left-radius: 0px;
  166. border-top-right-radius: 0px;
  167. }
  168. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li a {
  169. color: #FFFFFF;
  170. }
  171. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li.active {
  172. background-color: #FFFFFF;
  173. }
  174. .pane-bundle-spotlight .panopoly-spotlight-buttons-wrapper li.active a {
  175. color: #000000;
  176. }
  177. .pane-bundle-spotlight .panopoly-spotlight {
  178. position: relative;
  179. }
  180. .pane-bundle-spotlight .panopoly-spotlight .panopoly-image-full {
  181. border: 0;
  182. }