API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jun 19th, 2018
81
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.34 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. [ Family Page 02 / Blogroll 04 ] Meikyo
  8. by yukoki/s-ekki
  9.  
  10. 1. Light/Heavy CSS editting is allowed.
  11. 2. Do not use as base code.
  12. 3. Do not remove credit.
  13. 4. Do not claim page as your own.
  14.  
  15. --------------------------------------------------------------------------
  16. Please look out for notes throughout the code
  17. to help you in customizing the page!!
  18. --------------------------------------------------------------------------
  19.  
  20. -->
  21.  
  22. <title>{title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  23. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  24. <link rel="shortcut icon" href="{Favicon}" />
  25.  
  26. <style type="text/css">
  27.  
  28. ::-webkit-scrollbar { width: 2px; }
  29. ::-webkit-scrollbar-track-piece { background-color: transparent; }
  30. /** scroll bar background **/
  31. ::-webkit-scrollbar-thumb:vertical {
  32. width: 2px;
  33. background-color: #555; /** scroll bar colour **/
  34. }
  35.  
  36. body {
  37. background-color: #000;/** background colour**/
  38. word-wrap: break-word;
  39. }
  40.  
  41. #cover {
  42. background-color: #000;/**background colour**/
  43. background-image: url(https://78.media.tumblr.com/f260bfb41a44d9025c067bf7a484122c/tumblr_ov5bd4ywR91wwi2owo1_540.png);/**background img**/
  44. width: 100%;
  45. height: 120px;
  46. position: fixed;
  47. top: 0;
  48. left: 0;
  49. }
  50.  
  51. a { text-decoration:none; }
  52.  
  53.  
  54. /***************************** tool tip ********************************/
  55.  
  56. #s-m-t-tooltip {
  57. padding: 2px 5px 3px 5px;
  58. margin: 22px 14px 7px 10px;
  59. background-color: #333; /** tool tip background **/
  60. color: #bbb; /** tool tip text colour **/
  61. font-family: Calibri; /** tool tip font **/
  62. font-style: normal;
  63. font-size: 13px; /** tool tip font size **/
  64. letter-spacing: 1px;
  65. text-transform: uppercase;
  66. z-index: 999;
  67. }
  68.  
  69. #top {width: 100%;top: 0;left: 0;position: fixed;}
  70.  
  71.  
  72. /****************************** topbar *********************************/
  73.  
  74. #main {
  75. width: 500px;
  76. height: 130px;
  77. background-color: #0a0e17; /** top bar background **/
  78. }
  79.  
  80. .userpic {
  81. border-right: 1px solid #0b243c; /** top bar divider **/
  82. width: 100px;
  83. height: 100px;
  84. float: left;
  85. margin: 15px;
  86. padding-right: 15px;
  87. overflow: auto;
  88. }
  89. .infotitle {
  90. color: #bbbbbb; /** title text colour **/
  91. font-family: courier new;
  92. font-size: 20px;
  93. text-transform: uppercase;
  94. letter-spacing: 1px;
  95. font-style: italic;
  96. float: left;
  97. line-height: 6px;
  98. margin-top: 60px;
  99. margin-bottom: 8px;
  100. padding-left: 10px;
  101. text-align: left;
  102. width: 340px;
  103. }
  104. .sq1, .sq2, .sq3 {
  105. width: 4px;
  106. height: 4px;
  107. float: left;
  108. margin-right: 10px;
  109. }
  110. .sq1 { border: 1px solid #98b9e5; } /** title square 1 **/
  111. .sq2 { border: 1px solid #72c3d1; } /** title square 2 **/
  112. .sq3 { margin-right: 15px; border: 1px solid #84bcc8; } /** title square 3 **/
  113.  
  114. .info {
  115. color: #888888; /** info text colour **/
  116. width: 370px;
  117. height: 40px;
  118. float: left;
  119. text-align: left;
  120. font-family: calibri;
  121. font-size: 10px;
  122. overflow: auto;
  123. }
  124.  
  125. #navigate {
  126. position: fixed;
  127. top: 122px;
  128. width: 505px;
  129. }
  130. .navlink {
  131. width: 77.5px;
  132. margin-right: 2px;
  133. float: left;
  134. background-color: #0b243c; /** nav links background **/
  135. color: #fff; /** nav links text **/
  136. font-family: calibri;
  137. font-size: 10px;
  138. text-align: center;
  139. text-transform: uppercase;
  140. letter-spacing: 2px;
  141. padding: 2px 2px 4px 2px;
  142. transition: 0.6s;
  143. -moz-transition: 0.6s;
  144. -webkit-transition: 0.6s;
  145. -o-transition: 0.6s;
  146. }
  147. .navlink:hover {
  148. background-color: #333; /** nav links hover background **/
  149. color: #aaa; /** nav links hover text **/
  150. }
  151.  
  152.  
  153. /***************************** content *********************************/
  154.  
  155. #content {
  156. margin-top: 145px;
  157. width: 520px;
  158. height: 500px;
  159. }
  160. .nakama {
  161. width: 120px;
  162. height: 120px;
  163. background-color: #0b243c; /** family member border **/
  164. margin: 14px 14px 20px 14px;
  165. padding: 11px;
  166. float: left;
  167. }
  168. .nakamapic {
  169. width: 120px;
  170. height: 120px;
  171. float: left;
  172. }
  173. .nakamatitle {
  174. font-family: courier new;
  175. font-size: 15px;
  176. text-transform: uppercase;
  177. background-color: #0a0e17;
  178. /** [family member title/followed blog url] bg **/
  179. color: #eff7f8; /** [family member title/followed blog url] text **/
  180. font-style: italic;
  181. width: 120px;
  182. margin: 120px 0;
  183. overflow: hidden;
  184. height: 0;
  185. padding: 0;
  186. position: absolute;
  187. transition: 0.6s;
  188. -moz-transition: 0.6s;
  189. -webkit-transition: 0.6s;
  190. -o-transition: 0.6s;
  191. }
  192. .nakama:hover .nakamatitle {
  193. height: 20px;
  194. padding: 1px 0;
  195. margin-top: 100px;
  196. }
  197.  
  198. {CustomCSS}
  199.  
  200. </style>
  201. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  202. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  203. <script>
  204. (function($){
  205. $(document).ready(function(){
  206. $("a[title]").style_my_tooltips({
  207. tip_follows_cursor:true,
  208. tip_delay_time:0,
  209. tip_fade_speed:0,
  210. attribute:"title"
  211. });
  212. });
  213. })(jQuery);
  214. </script>
  215. </head>
  216. <body>
  217.  
  218. <div id="cover"></div>
  219.  
  220. <!--------------------------- top bar html ------------------------------>
  221.  
  222. <center><div id="top"><div id="main">
  223.  
  224.  
  225. <img class="userpic" src="https://78.media.tumblr.com/06400d46457703db9657a4570d435710/tumblr_p91so542jL1wwi2owo1_250.png">
  226. <!-- That icon in the topbar. Replace the image link with your own! -->
  227.  
  228.  
  229. <div class="infotitle">
  230. <span class="sq1"></span><span class="sq2"></span><span class="sq3"></span>
  231. Muses <!-- please pick one!! or give it its own name.-->
  232. </div><!--infotitle-->
  233.  
  234.  
  235. <div class="info">
  236. <!-- write whatever you want here!! ------------------------------------->
  237.  
  238.  
  239. </div><!--info-->
  240.  
  241.  
  242. <!--------------------------- nav links html ----------------------------
  243. A normal link looks like the following:
  244. <a href="/url"><div class="navlink">link title</div></a>
  245. You should follow this format when typing in the link 01 and link 02 portions!! ( don't add more than 2 custom links, or they won't fit )
  246. ------------------------------------------------------------------------>
  247.  
  248. <div id="navigate">
  249. <a href="/"><div class="navlink">back</div></a>
  250. <a href="/ask"><div class="navlink">message</div></a>
  251. <a href="http://tumblr.com/dashboard"><div class="navlink">dashboard</div></a>
  252. <a href="/Tags"><div class="navlink">Tags</div></a>
  253. <a href="/Verses"><div class="navlink">Verses</div></a>
  254. <a href="http://yukoki.tumblr.com"><div class="navlink">credit</div></a>
  255. </div><!--navigate-->
  256.  
  257. </div></div></center><!--top--><!--main-->
  258.  
  259.  
  260.  
  261. <!---------------------------- content html ---------------------------->
  262.  
  263. <center><div id="content">
  264.  
  265. <!------------------------- I M P O R T A N T --------------------------
  266. Okay, so here's the bit which will determine if what you have is a blogroll or a family page --
  267.  
  268. - Blogroll: Delete lines 297 and 306
  269. - Family Page: Delete lines 284 and 291
  270.  
  271. To make a family page:
  272. 01) Follow the above instructions
  273. 02) Lines 284 to 287 make up one block, so copy the whole block (should start from <div clas="nakama"> and end with </div>) and paste it as many times as you need characters
  274. 03) Please note that the image link provided on line 286 for the family member icons is a default one, and I recommend that you change it!
  275. 04) 'title' in line 288 should be replaced with the family member's position in the family
  276. ----------------------------------------------------------------------->
  277.  
  278.  
  279.  
  280. <div class="nakama">
  281. <a title="Stolen Valhalla" href="/Alice">
  282. <img class="nakamapic" src="https://78.media.tumblr.com/bcc6cd6c4f8c6a353591e2cf0615d12f/tumblr_p92wp27S8c1wwi2owo7_r2_250.gif"></a>
  283. <div class="nakamatitle">Alice</div>
  284. </div>
  285.  
  286. <div class="nakama">
  287. <a title="Demon of the Arts" href="/Robert">
  288. <img class="nakamapic" src="https://78.media.tumblr.com/d4ccda200092d1d7ed9f94c5d5014e28/tumblr_p92wp27S8c1wwi2owo3_250.png"></a>
  289. <div class="nakamatitle">Robert</div>
  290. </div>
  291.  
  292. <div class="nakama">
  293. <a title="Demon of Music" href="/Will">
  294. <img class="nakamapic" src="https://78.media.tumblr.com/b47238a525ebc934d04a0775042fe895/tumblr_p92wp27S8c1wwi2owo6_250.png"></a>
  295. <div class="nakamatitle">William</div>
  296. </div>
  297.  
  298. <div class="nakama">
  299. <a title="Archangel of Music" href="/Sandy">
  300. <img class="nakamapic" src="https://78.media.tumblr.com/8129cd0ebc1ba40c02974ec8b6f3e09e/tumblr_p92wp27S8c1wwi2owo4_250.png"></a>
  301. <div class="nakamatitle">Sandy</div>
  302. </div>
  303.  
  304. <div class="nakama">
  305. <a title="Blessed Empathy" href="/Chesed">
  306. <img class="nakamapic" src="https://78.media.tumblr.com/2ade6dcdbfce0476c94d1774e22c8261/tumblr_p92wp27S8c1wwi2owo1_250.png"></a>
  307. <div class="nakamatitle">Chesed</div>
  308. </div>
  309.  
  310. <div class="nakama">
  311. <a title="God of Mischief" href="/Loki">
  312. <img class="nakamapic" src="https://78.media.tumblr.com/f10f7cb3a681ab575ae48a622f6d1477/tumblr_p92wp27S8c1wwi2owo2_250.png"></a>
  313. <div class="nakamatitle">Loki</div>
  314. </div>
  315.  
  316. <div class="nakama">
  317. <a title="Living Weapon" href="/Thanatos">
  318. <img class="nakamapic" src="https://78.media.tumblr.com/80c15573c87b3da6cad8e27b25437670/tumblr_p92wp27S8c1wwi2owo5_250.png"></a>
  319. <div class="nakamatitle">Thanatos</div>
  320. </div>
  321.  
  322.  
  323.  
  324.  
  325. </body>
  326. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!