Advertisement
Guest User

MAL Layout

a guest
Jan 30th, 2015
203
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.87 KB | None | 0 0
  1. @import "http://dl.dropbox.com/u/78340470/Icon%20Style%20Menu%20Bar/IconStyleCSSFixed.css";
  2.  
  3. /*
  4. MAIN BACKGROUND COLOR AND IMAGE
  5. By default, there's no image in this part of the code. Its just a background color- silver.
  6. (the default image of Black Rock Shooter is in the next code #inlineContent)
  7. Change the color to what you want or add an image for a backdrop here.
  8.  
  9. For more info or questions on this code:
  10. http://myanimelist.net/forum/?topicid=412787
  11. */
  12. body {
  13. background: url(none) silver;
  14. }
  15.  
  16. /*
  17. SECOND BACKGROUND (with render)
  18. The background behind the list but in front of the main background.
  19. By default, for its own image it has the render of Black Rock Shooter (girl).
  20. You can change her with another render or even background image here!
  21. Make sure you leave the width as large as the image's width.
  22. The positioning of the background can be controlled with the % numbers after the background url,
  23. but you may need to exapnd the width for more positioning options.
  24. All the other codes should be left alone.
  25. */
  26. #inlineContent {
  27. background: url("http://www.zerochan.net/1513239") center no-repeat;
  28. background-size: contain;
  29. display: inline-block !important;
  30. height: 100% !important;
  31. left: 0px !important;
  32. margin: auto !important;
  33. position: fixed !important;
  34. right: 0 !important;
  35. top: 0 !important;
  36. width: 100% !important;
  37. z-index: -1 !important;}
  38.  
  39. /*
  40. TITLE
  41. The List header which by default says My Anime List
  42. can be changed out here.
  43. */
  44.  
  45. #list_surround {
  46. background: url("http://i44.tinypic.com/15s9esp.jpg") no-repeat scroll 50% 1px transparent;
  47. font-size: 81.25%;
  48. line-height: 1;
  49. margin: 0 auto;
  50. padding-bottom: 10px;
  51. padding-top: 227px;
  52. width: 920px;
  53. }
  54.  
  55.  
  56.  
  57. /*
  58. FONT
  59. Font used across the whole list.
  60. */
  61. body {
  62. font-family: arial;
  63. }
  64.  
  65.  
  66. /*
  67. LINK COLOR
  68. */
  69. a {
  70. -moz-transition: all 0.25s ease-in-out 0s;
  71. -webkit-transition: all 0.25s ease-in-out 0s;
  72. -o-transition: all 0.25s ease-in-out 0s;
  73. transition: all 0.25s ease-in-out 0s;
  74. color: #EEEEEE;
  75. text-decoration: none;
  76. text-shadow: none;
  77. }
  78. a:hover {
  79. color: #3F1786;
  80. text-shadow: 0 1px rgba(255, 255, 255, 0.15);
  81. }
  82.  
  83.  
  84.  
  85. /* CATEGORY LINKS */
  86. .status_not_selected, .status_selected {
  87. border: 0 none !important;
  88. height: auto !important;
  89. padding: 0 8px;
  90. text-align: center !important;
  91. width: 16.667% !important;
  92. }
  93. .status_not_selected a, .status_selected a {
  94. background-color: rgba(64, 60, 90, 0.6);
  95. border-color: rgba(48, 44, 64, 0.5);
  96. border-radius: 2px 2px 2px 2px;
  97. border-style: solid;
  98. border-width: 1px;
  99. color: #FFFFFF;
  100. display: block !important;
  101. font-weight: bold;
  102. padding: 8px;
  103. text-shadow: 0 1px rgba(0, 0, 0, 0.1);
  104. }
  105. .status_selected a {
  106. background-color: rgba(180, 32, 48, 0.6);
  107. border-color: rgba(164, 16, 32, 0.5);
  108. }
  109. .status_not_selected a:hover {
  110. background-color: #403C5A;
  111. border-color: #201C3A;
  112. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  113. text-shadow: 0 1px rgba(0, 0, 0, 0.3);
  114. }
  115. .status_selected a:hover {
  116. background-color: #B42030;
  117. border-color: rgba(148, 0, 24, 0.5);
  118. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  119. text-shadow: 0 1px rgba(0, 0, 0, 0.3);
  120. }
  121.  
  122.  
  123.  
  124. /* TABLE HEADER */
  125. .table_header {
  126. background-color: rgba(65, 35, 95, 0.6);
  127. }
  128. .table_header:first-of-type {
  129. border-radius: 3px 0 0 0;
  130. }
  131. .table_header:nth-of-type(2) {
  132. text-align: left;
  133. }
  134. .table_header:last-of-type {
  135. border-radius: 0 3px 0 0;
  136. }
  137.  
  138.  
  139.  
  140. /* TABLE ROWS COLOR */
  141. .td1 {
  142. -moz-transition: all 0.25s ease-in-out 0s;
  143. -webkit-transition: all 0.25s ease-in-out 0s;
  144. -o-transition: all 0.25s ease-in-out 0s;
  145. transition: all 0.25s ease-in-out 0s;
  146. background-color: rgba(136, 147, 169, 0.6);
  147. }
  148. .td2 {
  149. -moz-transition: all 0.25s ease-in-out 0s;
  150. -webkit-transition: all 0.25s ease-in-out 0s;
  151. -o-transition: all 0.25s ease-in-out 0s;
  152. transition: all 0.25s ease-in-out 0s;
  153. background-color: rgba(151, 164, 183, 0.6);
  154. }
  155.  
  156.  
  157.  
  158. /* TABLE ROWS HOVER */
  159. tr:hover [class^="td"] {
  160. background-color: rgba(72, 64, 87, 0.6);
  161. }
  162. .td1:nth-of-type(2), .td2:nth-of-type(2) {
  163. text-align: left;
  164. }
  165.  
  166.  
  167.  
  168. /* ROW FONT SIZE TRANSITION (FIREFOX ONLY) */
  169. noindex:-moz-any-link, tr:hover td.td1, tr:hover td.td2 {
  170. font-size: 15px;
  171. }
  172.  
  173.  
  174.  
  175. /* LIST SETTINGS */
  176. .table_header, .td1, .td2, .status_selected, .status_not_selected, .category_totals {
  177. border: 0;
  178. padding: 4px;
  179. text-align: center;
  180. vertical-align: middle;
  181. }
  182. .table_header, .td1, .td2, .category_totals {
  183. line-height: 30px;
  184. }
  185. .borderRBL{
  186. line-height: normal !important;
  187. }
  188. [cellspacing="0"] {
  189. line-height: 17px;
  190. }
  191. table[class^="header_"] + table{
  192. border-collapse: separate !important;
  193. }
  194.  
  195.  
  196.  
  197. /* CATEGORY TOTALS */
  198. .category_totals {
  199. -moz-transition: all 0.25s ease-in-out 0s;
  200. -webkit-transition: all 0.25s ease-in-out 0s;
  201. -o-transition: all 0.25s ease-in-out 0s;
  202. transition: all 0.25s ease-in-out 0s;
  203. background-color: rgba(72, 64, 87, 0);
  204. border-radius: 0 0 3px 3px;
  205. color: rgba(51, 51, 51, 0);
  206. text-align: center;
  207. }
  208. .category_totals:hover {
  209. background-color: rgba(72, 64, 87, 0.6);
  210. color: #EEEEEE;
  211. }
  212.  
  213.  
  214.  
  215. /* HEADER TEXT AND DIMENSIONS */
  216. [class^="header_"] * {
  217. font-size: 19px;
  218. height: 60px;
  219. line-height: 24px;
  220. padding-bottom: 4px;
  221. text-align: right;
  222. vertical-align: bottom;
  223. }
  224. .header_title {
  225. border-radius: 4px 4px 4px 4px;
  226. display: inline-block;
  227. font-style: italic;
  228. height: auto;
  229. padding: 0 8px 0 0;
  230. text-shadow: 0 1px 1px rgba(255, 255, 255, 0.15);
  231. }
  232.  
  233.  
  234.  
  235. /* BOTTOM OF LIST */
  236. #grand_totals {
  237. background-color: rgba(72, 64, 87, 0.6);
  238. border: 0 none;
  239. border-radius: 3px 3px 3px 3px;
  240. color: #EEEEEE;
  241. line-height: 20px;
  242. min-height: 20px;
  243. padding: 8px;
  244. text-align: center;
  245. vertical-align: middle;
  246. }
  247. #copyright {
  248. background-color: rgba(180, 32, 48, 0.6);
  249. border-radius: 3px 3px 3px 3px;
  250. color: #EEEEEE;
  251. line-height: 17px;
  252. margin-top: 10px;
  253. padding: 8px;
  254. text-align: center;
  255. }
  256. #copyright:after {
  257. content: " CSS by Kyouhansha. Edits by Shishio-kun and Veriti. Google 'Shishio's Custom Lists' for more designs and info.";
  258. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement