lungo.theme.default.css 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. /**
  2. *
  3. * /$$
  4. * | $$
  5. * | $$ /$$ /$$ /$$$$$$$ /$$$$$$ /$$$$$$
  6. * | $$ | $$ | $$| $$__ $$ /$$__ $$ /$$__ $$
  7. * | $$ | $$ | $$| $$ \ $$| $$ \ $$| $$ \ $$
  8. * | $$ | $$ | $$| $$ | $$| $$ | $$| $$ | $$
  9. * | $$$$$$$$| $$$$$$/| $$ | $$| $$$$$$$| $$$$$$/
  10. * |________/ \______/ |__/ |__/ \____ $$ \______/
  11. * /$$ \ $$
  12. * | $$$$$$/
  13. * \______/
  14. *
  15. * @copyright 2011 TapQuo Inc (c)
  16. * @license http://www.github.com/tapquo/lungo/blob/master/LICENSE.txt
  17. * @version 1.0.3
  18. * @link https://github.com/TapQuo/Lungo.js
  19. *
  20. * Stylesheet
  21. *
  22. * @namespace LUNGO.Theme
  23. * @class Default
  24. *
  25. * @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
  26. */
  27. /* @group layout */
  28. .app {
  29. font-size: 13px;
  30. background: #000;
  31. }
  32. article {
  33. background: #fff;
  34. }
  35. /* @group <header> & <footer> */
  36. header {
  37. background: #019d5e -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #019d5e), color-stop(1, #006b41));
  38. -webkit-border-radius: 6px 6px 0 0;
  39. -moz-border-radius: 6px 6px 0 0;
  40. border-radius: 6px 6px 0 0;
  41. -webkit-background-clip: padding-box;
  42. -moz-background-clip: padding;
  43. background-clip: padding-box;
  44. -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.4), inset 0px -1px rgba(0, 0, 0, 0.5);
  45. }
  46. footer {
  47. background: #2c2c2d -webkit-gradient(linear, left top, left bottom, color-stop(0.25, #2c2c2d), color-stop(1, #1c1d1d));
  48. -webkit-box-shadow: inset 0px 1px rgba(0, 0, 0, 0.5), 0px -1px 2px rgba(0, 0, 0, 0.4);
  49. }
  50. .title {
  51. color: #fff;
  52. text-shadow: rgba(0, 0, 0, 0.5) 0 -1px 0px;
  53. }
  54. /* @end */
  55. /* @group <nav> */
  56. nav a {
  57. color: rgba(0, 0, 0, 0.5);
  58. text-shadow: rgba(255, 255, 255, 0.35) 0 1px 1px;
  59. }
  60. header:not(.toolbar) nav a, footer:not(.toolbar) nav a {
  61. line-height: 38px;
  62. }
  63. nav a.current {
  64. color: #fff;
  65. text-shadow: 0px 1px 0px #000 !important;
  66. }
  67. .toolbar a.current {
  68. background: rgba(255, 255, 255, 0.15);
  69. }
  70. /* @end */
  71. /* @group <aside> */
  72. aside {
  73. background: #252525;
  74. -webkit-box-shadow: inset -1px 0px 0px #000000, inset -4px 0px 8px rgba(0, 0, 0, 0.5);
  75. }
  76. aside a {
  77. color: #fff !important;
  78. text-shadow: 0px 1px 0px #000 !important;
  79. border-bottom: 1px inset rgba(0, 0, 0, 0.3);
  80. border-top: 1px inset rgba(255, 255, 255, 0.1);
  81. }
  82. aside a.current {
  83. background: rgba(255, 255, 255, 0.1);
  84. }
  85. aside a .icon {
  86. opacity: 0.5;
  87. }
  88. /* @end */
  89. /* @group .list */
  90. .list {
  91. background: #c5c5c5;
  92. }
  93. .list li:not(.info) {
  94. background: #fff;
  95. border-bottom: 1px inset #c3c4c6;
  96. color: #333;
  97. }
  98. .list li.toolbar {
  99. border-bottom-color: rgba(0, 0, 0, 0.2);
  100. }
  101. .list li:not(.toolbar) a {
  102. color: #333;
  103. text-shadow: #fff 0px 1px 1px;
  104. -webkit-tap-highlight-color: #242525;
  105. }
  106. .list strong {
  107. color: #2343be;
  108. }
  109. .list small {
  110. opacity: 0.75;
  111. }
  112. .list .bubble {
  113. border: 1px solid rgba(0, 0, 0, 0.15);
  114. -webkit-border-radius: 2px;
  115. -moz-border-radius: 2px;
  116. border-radius: 2px;
  117. -webkit-background-clip: padding-box;
  118. -moz-background-clip: padding;
  119. background-clip: padding-box;
  120. color: #fff;
  121. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
  122. }
  123. .list .button {
  124. color: #fff;
  125. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
  126. }
  127. .list .arrow:before {
  128. color: #a9a9a9;
  129. }
  130. /* @group .anchor */
  131. .list li.anchor {
  132. background: #f4f4f4;
  133. color: #222;
  134. }
  135. /* @end */
  136. /* @group .anchor */
  137. .list li.search {
  138. border: none;
  139. -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.1), inset 0px -1px 0px rgba(0, 0, 0, 0.25);
  140. }
  141. /* @end */
  142. /* @group .info */
  143. .list li.info {
  144. border: none;
  145. -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.1), inset 0px -1px 0px rgba(0, 0, 0, 0.25);
  146. background: #cbcbcb;
  147. }
  148. .list .info strong {
  149. color: #333;
  150. }
  151. .list .info.contrast strong {
  152. color: #fff;
  153. }
  154. /* @end */
  155. /* @end */
  156. .list .contrast {
  157. background: #2c2c2d -webkit-gradient(linear, left top, left bottom, color-stop(0.25, #2c2c2d), color-stop(1, #1c1d1d)) !important;
  158. text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.25);
  159. color: #fff;
  160. }
  161. .list .highlight {
  162. background: #499dc4 -webkit-gradient(linear, left top, left bottom, color-stop(0, #499dc4), color-stop(1, #0e8eb6)) !important;
  163. }
  164. /* @end */
  165. /* @group widgets */
  166. /* @group <section>.splash */
  167. .splash article {
  168. background: #2c2c2d -webkit-gradient(linear, left top, left bottom, color-stop(0.25, #2c2c2d), color-stop(1, #1c1d1d)) !important;
  169. color: #fff;
  170. text-shadow: rgba(0, 0, 0, 0.5) 0 1px 1px;
  171. }
  172. /* @end */
  173. /* @group <inputs> */
  174. input, textarea, select {
  175. border: 1px solid #ccc;
  176. -webkit-border-radius: 2px;
  177. -moz-border-radius: 2px;
  178. border-radius: 2px;
  179. -webkit-background-clip: padding-box;
  180. -moz-background-clip: padding;
  181. background-clip: padding-box;
  182. background: #ffffff -webkit-gradient(linear, left top, left bottom, color-stop(0, #dddddd), color-stop(0.15, #ffffff));
  183. }
  184. input:focus, textarea:focus, select:focus {
  185. border: 1px solid #058cf5;
  186. -webkit-box-shadow: 0 0 4px 1px #058cf5;
  187. -moz-box-shadow: 0 0 4px 1px #058cf5;
  188. box-shadow: 0 0 4px 1px #058cf5;
  189. background: #e8fefe;
  190. }
  191. .select:after {
  192. background: #ccc;
  193. color: white;
  194. -webkit-border-radius: 0 2px 2px 0;
  195. -moz-border-radius: 0 2px 2px 0;
  196. border-radius: 0 2px 2px 0;
  197. -webkit-background-clip: padding-box;
  198. -moz-background-clip: padding;
  199. background-clip: padding-box;
  200. }
  201. /* @end */
  202. /* @end */