A tumblelog CMS built on AJAX, PHP and MySQL.

style.css 10KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. /* ===========================
  2. gelato CMS - A PHP based tumblelog CMS
  3. development version
  4. http://www.gelatocms.com/
  5. gelato CMS is a free software licensed under the GPL 2.0
  6. Copyright (C) 2007 by Pedro Santana <pecesama at gmail dot com>
  7. =========================== */
  8. /************ BASICS *************/
  9. div, p, ul, ol, li, h1, h2, h3, h4, h5, h6, h7,form, span, pre, a{margin:0; padding:0;}
  10. h1, h2, h3, h4, h5, h6, h7{ font-weight:normal;}
  11. a, a:link, a:visited, a:active{ color:#000000; text-decoration:none; outline:none;}
  12. a:hover{ text-decoration:underline; color:#000000; outline:none;}
  13. .inslnl a{ text-decoration:underline; }
  14. acronym{ border-bottom: 1px dotted #666; cursor:help;}
  15. fieldset{ border:none; margin:0; padding:0;}
  16. .gelato{color:#006699; font-weight:bold; font-family:'Trebuchet Ms', Verdad, Tahoma;}
  17. .option{ color:#666666; font-style:italic; font-size:0.9em}
  18. /*********** LAYOUT *************/
  19. body{ background: #e0e0e0; text-align:center; font-family:"Trebuchet Ms", Verdana, Tahoma; font-size:1em;}
  20. #cont{ width:600px; margin:30px auto 20px auto; text-align:left; border: 1px solid #999;}
  21. #head{ background: #fff url(images/head_bg.png) bottom center no-repeat; position: relative; padding:10px 0 20px 20px; height:73px;}
  22. h1 a{ display:block; height:77px; width:161px; background:#fff url(images/gelato-logo.png) top left no-repeat; text-indent:-9999px; overflow:hidden;}
  23. #nav{ position:absolute; right:1px; font-size:0.75em; line-height:normal; margin:0; padding:0 20px 0 0; list-style:none;bottom:34px;}
  24. #nav li{ margin:0; padding:0; text-align:right;}
  25. #nav li a:link, #nav li a:visited, #nav li a:active, #nav li a:focus{ color:#777; text-decoration: none;}
  26. #nav li a:hover{ text-decoration:underline;}
  27. #main{ background: #fff url(images/main_bg.png) top left repeat-y; text-align:left; padding:0 0 40px 0;}
  28. h2{ font-size:1.56em; margin:4px; text-indent:20px;}
  29. h3{font-size:1.12em; margin:4px; color:#333333; text-indent:20px;}
  30. .box{ background:#fff url(images/bg-box.png) center top repeat-y; width:600px;}
  31. .footer-box{background:#fff url(images/bg-foot-box.png) center top no-repeat;}
  32. .box h3{float:left; color:#444444; font-weight:bold; padding:5px 10px 0 0;}
  33. .menu{ background:transparent url(images/bg-top-box.png) top center no-repeat; height:40px; width:570px; list-style-type:none; padding-right:30px;}
  34. .menu li{ display:inline;}
  35. .menu li.selected a{background: transparent url(images/bg-top-box-hover.png) left top repeat-x; text-decoration:underline;}
  36. .menu li a{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:0.7em; display:block; float:right; height:28px; padding:12px 3px 0 3px;}
  37. .menu li a:hover{ background: transparent url(images/bg-top-box-hover.png) left top repeat-x; text-decoration:underline;}
  38. .menu li a img{border:none; vertical-align:bottom;}
  39. .manage li a{ padding:14px 6px 0 6px;}
  40. /* New post menu and form*/
  41. div.newpost{background:none;}
  42. div.newpost h3{color:#444; margin:10px 0 0 10px;}
  43. #post_types{ background: transparent url(images/new_post_nav.png) top center no-repeat; height:51px; position: relative; margin-bottom:20px;}
  44. #head_nav{ background: transparent url(images/head_nav.png) top center no-repeat; height:66px; width:80px; position:absolute; top:-7px; display:none;}
  45. #head_nav_sel{ display:none; background: transparent url(images/head_nav.png) bottom center no-repeat;height:66px; width:80px;}
  46. #post_types ul{ background:none; position: absolute; padding:5px 0 0 0;}
  47. #post_types ul li{}
  48. #post_types ul li.selected a{ background:none;}
  49. #post_types ul li a{ text-align: center; padding:0px 9px; height:auto;}
  50. #post_types ul li a:hover{ background:none;}
  51. #post_types ul li a img{ display: block;}
  52. #context_help{ display:block; margin:0; padding:5px; position: absolute; border: 1px solid #222; background-color: #444; color:#fff; font-size: 12px;}
  53. form.newpost{ width:500px; margin:20px auto 0 auto; padding:0;}
  54. form.newpost ul{ list-style-type:none; margin:20px 0 10px 0; padding:0;}
  55. form.newpost li{ margin:4px 0; padding:0; position:relative;}
  56. form.newpost li.select{ margin:6px 0;}
  57. form.newpost label{}
  58. form.newpost input{ margin-bottom:10px;}
  59. form.newpost input.txt{ background: #fff url(images/grad-small.png) top left repeat-x; border:1px solid #999; width:490px; padding:5px;}
  60. form.newpost input.btn{ }
  61. form.newpost input.check{ vertical-align:middle;}
  62. form.newpost textarea{background: #fff url(images/grad-big.png) top left repeat-x; height:190px; border:1px solid #999; width:490px; padding:5px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:0.8em;}
  63. form.newpost select{ position:absolute; right:10px; top:1px;}
  64. html > body form.newpost select{min-width:100px;}
  65. legend.install{font: normal 16.5px/17px georgia, "times new roman", serif; border: 1px solid #ddd; margin-top: 0px; padding:5px; margin-bottom: 0; color: #c60; margin-bottom: 5px; background-color:#fff;}
  66. fieldset.install{border:1px solid #dfdfdf; padding:10px;}
  67. fieldset.install input.txt{width:468px;}
  68. .tabla{ margin:15px 15px; }
  69. .entry{ background-color:#efefef; border:1px solid #ccc; margin:20px auto; width:550px;}
  70. .info{ border-bottom:1px solid #aaa; position:relative; display:block; padding:4px 10px; height:20px; }
  71. .info p{font-size:0.8em; color:#297aab; display:inline;}
  72. .compact{ float:right; margin:-2px 0 0 0; padding:0;}
  73. .compact img{ border:0px; }
  74. .compact a { color:#297aab; font-size:0.8em; }
  75. .compact a:link { color:#297aab; font-size:0.8em; }
  76. .compact a:visited { color:#297aab; font-size:0.8em; }
  77. .compact a:active { color:#297aab; font-size:0.8em; }
  78. .compact a:hover { color:#297aab; font-size:0.8em; }
  79. .post{ padding:10px;}
  80. .post h4{ font-style:italic; font-weight:bold; }
  81. .post p{ font-size:0.9em; text-indent:20px;}
  82. .post img{}
  83. .post blockqoute{}
  84. .post .video{}
  85. .post .audio{}
  86. #foot { border-top:1px solid #999999; color:#000000; font-size:10px; padding:5px 10px; text-align:center;}
  87. #footer a { color: #000; }
  88. #div-process { top:0px; padding-left: 22px; font: normal 14.5px/17px georgia, "times new roman", serif; background: url('../../images/proceso.gif') no-repeat 0% 10%; float: right; height: 20px; width: 150px; border: 1px solid #000066; background-color:#FFFFCC; color:#011940; }
  89. a.linkFrm, a.linkFrm:link, a.linkFrm:visited, a.linkFrm:active{ color:#297aab; text-decoration:none; outline:none;}
  90. a.linkFrm:hover{ text-decoration:underline; color:#297aab; outline:none;}
  91. .bookmarklet {
  92. font-weight:bold; padding: 1px 2px;
  93. border: 2px solid #888;
  94. background-color: #eee; text-decoration:none;
  95. }
  96. .bookmarklet:hover {
  97. background-color: #6FA6EA; text-decoration:none;
  98. }
  99. /* Feeds */
  100. #feedlist{}
  101. #feedlist ul{ list-style-type:none;}
  102. #feedlist li{ border-bottom:1px solid #999; font-size:12px; padding:2px 4px 2px 4px; margin:0 2px 0 2px;}
  103. #feedlist li span{ font-weight:bold;}
  104. #feedlist li.feederror{ background-color:#FFCCCC;}
  105. #feedlist li.feederror span{ color:#CC0000;}
  106. #feedlist li a img{border:none; padding:0 2px 2px 2px; vertical-align:middle;}
  107. /* User messages */
  108. .error { width:80%; background: #FFF7F2 url('../../images/error.png') 15px center no-repeat; border-top: 2px solid #CC0000; border-bottom: 2px solid #CC0000; margin: 0 auto; padding: 5px 20px 5px 45px; }
  109. .exito { width:80%; background: #F4FBF5 url('../../images/information.png') 15px center no-repeat; border-top: 2px solid #006600; border-bottom: 2px solid #006600; margin: 0 auto; padding: 5px 20px 5px 45px; }
  110. .information { width:80%; background: #FFF6BF url('../../images/icon_info.gif') 15px center no-repeat; border-top: 2px solid #FFD324; border-bottom: 2px solid #FFD324; margin: 0 auto;padding: 5px 20px 5px 45px; }
  111. #update { text-align:center; font-size: 10px; color: #000; }
  112. #update a { color: #000; text-decoration:underline; }
  113. #update a:visited { color: #000; text-decoration:underline; }
  114. #update a:active { color: #000; text-decoration:underline; }
  115. #update a:hover { color: #F00; text-decoration:underline; }
  116. /* Pagination */
  117. div.pagination { text-align:center; padding:3px; margin:3px; }
  118. div.pagination a { padding: 2px 5px 2px 5px; margin-right: 2px; border: 1px solid #ddd; text-decoration: none; color: #aaa; }
  119. div.pagination a:hover, div.pagination a:active { padding: 2px 5px 2px 5px; margin-right: 2px; border: 1px solid #a0a0a0; }
  120. div.pagination span.current { padding: 2px 5px 2px 5px; margin-right: 2px; border: 1px solid #e0e0e0; font-weight: bold; background-color: #f0f0f0; color: #aaa; }
  121. div.pagination span.disabled { padding: 2px 5px 2px 5px; margin-right: 2px; border: 1px solid #f3f3f3; color: #ccc; }
  122. /* Conversation Post */
  123. div.conversation ul { list-style-type: none; margin: 0px; padding: 0px 0px 0px 1px; border-left: solid 5px #555; }
  124. div.conversation ul li { font-size: 12px; padding: 4px 0px 4px 8px; color: #000; margin-bottom: 1px; }
  125. div.conversation ul li span.label { font-weight: bold; }
  126. div.conversation ul li.odd { background-color: #f4f4f4; }
  127. div.conversation ul li.even { background-color: #e8e8e8; }
  128. /* Tables design */
  129. #admin-table {background-color:#F3F5F7; margin:0 auto; width:95%; text-align:left; font-size:12px; border:1px solid #EAECEE;}
  130. #admin-table thead tr th, #admin-table tfoot tr th {background-color:#BDD3E7; padding:6px;}
  131. #admin-table thead tr .header {background-image: url(images/bg.gif); background-repeat: no-repeat; background-position: center right; cursor: pointer;}
  132. #admin-table tbody td {color:#3D3D3D; padding:6px; background-color:#FFF; background: url(images/td_back.gif) repeat-x; vertical-align:top;}
  133. #admin-table a {color: #3A4856; text-decoration: none; border-bottom: 1px solid #C6C8CB; }
  134. #admin-table tbody a:visited {color: #777; text-decoration: none; }
  135. #admin-table tbody a:hover {color: #000; text-decoration: none; }
  136. /*#admin-table tbody tr.odd td {background-color:#F0F0F6;}*/
  137. #admin-table tbody tr:hover {background: #EAECEE; color: #111; }
  138. #admin-table thead tr .headerSortUp {background-image: url(images/asc.gif);}
  139. #admin-table thead tr .headerSortDown {background-image: url(images/desc.gif);}
  140. #admin-table thead tr .headerSortDown, #admin-table thead tr .headerSortUp {background-color:#8dbdd8;}
  141. /* validation */
  142. form.newpost input.validate_span {border:1px solid #ca3402; float:none;}
  143. form.newpost span.validate_span {color:#ca3402; padding-left:10px; border:0; float:right;}