index.css 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376
  1. @import url("../static/css/bootstrap.min.css");
  2. .wrapper.wp-notes {
  3. width:auto;
  4. background: transparent;
  5. }
  6. .panel-title a.x-tooltip {
  7. font-size: 12px;
  8. color: #48b;
  9. margin-left: 10px;
  10. }
  11. .panel-title a.x-tooltip.x-newnote {
  12. color:#f00;
  13. }
  14. .panel-title a.x-tooltip:hover {
  15. text-decoration: underline;
  16. }
  17. .x-toolbox {
  18. margin-left: 50px;
  19. }
  20. .x-toolbox .x-line {
  21. font-size: 12px;
  22. margin-left: 10px;
  23. color: #bbb;
  24. }
  25. .x-wrapper {
  26. position: relative;
  27. color: #666;
  28. }
  29. .x-wrapper .x-sidebar {
  30. position: absolute;
  31. left: 0;
  32. top:0;
  33. width: 300px;
  34. bottom: 0;
  35. background: #fefefe;
  36. border-right: 1px solid #ddd;
  37. }
  38. .x-wrapper #main {
  39. margin-left:300px;
  40. padding: 20px;
  41. min-height: 500px;
  42. }
  43. .x-sidebar .x-tools {
  44. background: #f1f1f1;
  45. padding: 2px 10px;
  46. text-align: right;
  47. border-bottom: 1px solid #ccc;
  48. }
  49. .x-sidebar .x-tools a{
  50. color:#48b;
  51. font-size: 12px;
  52. }
  53. .x-sidebar ul {
  54. margin: 0;
  55. padding: 0;
  56. list-style: none;
  57. }
  58. .x-sidebar ul li {
  59. padding: 5px 10px;
  60. background-color: #fff;
  61. border-bottom: 1px solid #eee;
  62. cursor: default;
  63. font-size: 14px;
  64. overflow: hidden;
  65. text-overflow:ellipsis;
  66. white-space: nowrap;
  67. position: relative;
  68. }
  69. .x-sidebar ul li.x-selected:after {
  70. content: '\2714';
  71. position: absolute;
  72. right: 10px;
  73. }
  74. .x-sidebar ul li:hover {
  75. background: #f5f5f5;
  76. color: #48b;
  77. }
  78. #folders li>i {
  79. margin-left: 5px;
  80. color:#bbb;
  81. }
  82. #folders li a {
  83. font-size: 12px;
  84. float: right;
  85. margin-right: 20px;
  86. margin-top: 2px;
  87. color: #203996;
  88. cursor: pointer;
  89. display: none;
  90. }
  91. #folders li:hover a {
  92. display: inline-block;
  93. }
  94. .x-btn-min {
  95. font-size: 12px;
  96. padding: 2px;
  97. color: #444;
  98. }
  99. .x-btn-min:hover {
  100. color:#000;
  101. }
  102. /* common styles start */
  103. h1{font-size:1.6em;}
  104. h2{font-size:1em;}
  105. a,a:visited{color:#fff;outline:none !important;text-decoration:none;}
  106. a img,a:visited img{border:none;}
  107. textarea{overflow:auto;}
  108. .left{float:left;}
  109. .right{float:right;}
  110. .clear{clear:both;}
  111. /* common styles end */
  112. body{background:#f9f9f9;color:#fff;padding:0;}
  113. h1{float:left; margin-right:30px; line-height:20px;color:#f6f6f6;text-shadow: 1px 1px 5px #fff;filter: dropshadow(color=#fff, offx=1, offy=1);}
  114. .topsection{border-right:1px solid #999;height:40px;padding:0 10px;width:auto;display:inline;}
  115. .topsection img{margin-top:7px;float:left;margin-right:3px;}
  116. .topsection a{float:left;display:inline;}
  117. #head{
  118. position:absolute;
  119. margin:0 auto;
  120. width:800px;
  121. height:43px;
  122. top:20px;
  123. left:50px;
  124. padding:10px;
  125. right:30px;
  126. background-color: transparent;
  127. background-color: rgba(255, 255, 255, 0.3); /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
  128. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4CFFFFFF,endColorstr=#4CFFFFFF); /* IE6�IE9 */
  129. zoom: 1;
  130. -moz-border-radius:10px;
  131. -webkit-border-radius:10px;
  132. border-radius:10px;
  133. margin-bottom:100px;
  134. }
  135. #twitter, #donate{float:right;margin-top:7px;margin-left:5px;}
  136. #head p{
  137. clear:both;
  138. width:200px;
  139. }
  140. footer{
  141. margin:auto;
  142. width:300px;
  143. position:relative;
  144. bottom:10px;
  145. left:5%;
  146. }
  147. .note_common, .bignote, .editinfo{
  148. padding:20px 10px 32px 10px;
  149. color:#000;
  150. float:left;
  151. margin:20px;
  152. margin-top:10px;
  153. position:relative;
  154. cursor:pointer;
  155. border: 3px solid white;
  156. -webkit-box-shadow: 0 2px 10px 1px rgba(0,0,0,.2);
  157. -moz-box-shadow: 0 2px 10px 1px rgba(0,0,0,.2);
  158. box-shadow: 0 2px 10px 1px rgba(0,0,0,.2);
  159. /* page effect end */
  160. -moz-box-shadow: -7px 10px rgba(0,0,0,0.3);
  161. -webkit-box-shadow: -7px 10px rgba(0,0,0,0.3);
  162. box-shadow: -7px 10px rgba(0,0,0,0.07);
  163. }
  164. .note_common h2{
  165. text-align:center;
  166. margin-top:0;
  167. padding-top:0;
  168. }
  169. .note_common p{
  170. font-size:0.9em;
  171. overflow:auto;
  172. overflow-x:hidden;
  173. line-height:18px;
  174. text-align:left;
  175. }
  176. .inset{
  177. -moz-box-shadow:inset 0 0 10px #cccccc;
  178. -webkit-box-shadow:inset 0 0 10px #cccccc;
  179. box-shadow:inset 0 0 10px #cccccc;
  180. background:#f8f7f7;
  181. color:#333;
  182. padding:5px;
  183. font-size:0.9em;
  184. border:1px solid #e7e7e7;
  185. }
  186. input:focus,textarea:focus,select:focus{border:1px solid #fafafa;-webkit-box-shadow:0 0 6px #000;-moz-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;}
  187. .tip{
  188. background:#fff;
  189. font-size:13px;
  190. padding-left:25px;
  191. padding-top:3px;
  192. vertical-align:middle;
  193. }
  194. .icons-footer .ficon{
  195. margin-left:10px;
  196. position:absolute;
  197. bottom:-15px;
  198. }
  199. /* for sticky note background oolors */
  200. .stickynote0,
  201. .stickynote1,
  202. .stickynote2,
  203. .stickynote3,
  204. .stickynote4,
  205. .stickynote5,
  206. .stickynote6,
  207. .stickynote7,
  208. .stickynote8,
  209. .stickynote9{
  210. background-image: -webkit-linear-gradient(top, #fbf7cd, #fbef85);
  211. }
  212. /* tooltip */
  213. .tooltip
  214. {
  215. position: relative;
  216. display: inline-block;
  217. }
  218. .tooltip span
  219. {
  220. visibility: hidden;
  221. position: absolute;
  222. bottom: -15px;
  223. left: 50%;
  224. z-index: 99999;
  225. width: 150px;
  226. font-size:13px;
  227. margin-left: -80px;
  228. color:#000;
  229. padding: 5px;
  230. border: 2px solid #ccc;
  231. opacity: .9;
  232. background-color: #ddd;
  233. background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  234. background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  235. background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  236. background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  237. background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  238. -moz-border-radius: 5px;
  239. -webkit-border-radius: 5px;
  240. border-radius: 5px;
  241. -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  242. -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  243. box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  244. }
  245. .tooltip:hover
  246. {
  247. border: 0; /* IE6 fix */
  248. }
  249. .tooltip:hover span
  250. {
  251. visibility: visible;
  252. }
  253. .tooltip span:after
  254. {
  255. content: "";
  256. position: absolute;
  257. z-index: 1000;
  258. top: -10px;
  259. left: 50%;
  260. margin-left: -8px;
  261. border-bottom: 8px solid #59add4;
  262. border-left: 8px solid transparent;
  263. border-right: 8px solid transparent;
  264. border-top: 0;
  265. }
  266. .tooltip span:before
  267. {
  268. border-top-color: #ccc;
  269. bottom: -8px;
  270. }
  271. /* Yellow */
  272. .yellow-tooltip span
  273. {
  274. border-color: #e1ca82;
  275. background-color: #ffeaa6;
  276. }
  277. .yellow-tooltip span:after
  278. {
  279. border-top-color: #ffeaa6;
  280. }
  281. .yellow-tooltip span:before
  282. {
  283. border-top-color: #e1ca82;
  284. }
  285. /* Navy */
  286. .navy-tooltip span
  287. {
  288. color: #fff;
  289. text-shadow: 0 1px 0 #000;
  290. border-color: #161a1f;
  291. background-color: #1e2227;
  292. }
  293. .navy-tooltip span:after
  294. {
  295. border-top-color: #1e2227;
  296. }
  297. .navy-tooltip span:before
  298. {
  299. border-top-color: #161a1f;
  300. }
  301. /* Blue */
  302. .blue-tooltip span
  303. {
  304. border-color: #59add4;
  305. background-color: #61bde7;
  306. }
  307. .blue-tooltip span:after
  308. {
  309. border-top-color: #61bde7;
  310. }
  311. .blue-tooltip span:before
  312. {
  313. border-top-color: #59add4;
  314. }
  315. select.form-control.fedit {
  316. width: 230px;
  317. display: inline-block;
  318. margin-left: 20px;
  319. height: 30px;
  320. font-size: 12px;
  321. box-shadow: inset 0 0 10px #cccccc;
  322. background: #f8f7f7;
  323. }
  324. .timeago {
  325. margin-bottom: 10px;
  326. }