API tools faq
paste
Advertisement
luhans

Playground

luhans
Apr 5th, 2014
2,936
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.53 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. <!--PLAYGROUND/HKTHEMES-->
  5. <head> <!-- DEFAULT VARIABLES -->
  6. <title>{Title}</title>
  7. <meta name="color:background" content="#fafafa" />
  8. <meta name="color:text" content="#443b3b" />
  9. <meta name="color:link" content="#555252" />
  10. <meta name="color:desc" content="#ffffff" />
  11. <meta name="color:Top Links" content="#fafafa" />
  12. <meta name="color:top background" content="#1f1f1f" />
  13. <meta name="color:entries" content="#FFFFFC"/>
  14. <meta name="color:sidebar" content="#FFFFFC" />
  15. <meta name="color:ask" content="#FFFFFC" />
  16. <meta name="color:title" content="#FFFFFC" />
  17. <meta name="image:sidebar" content="http://static.tumblr.com/643ba232dd5080730980c5568182976b/rzl30kg/Jojn3l5ms/tumblr_static_ih.gif"/>
  18. <meta name="text:Title Text" content="YOU ARE MY WONDERLAND.">
  19. <meta name="text:link one url" content="http://">
  20. <meta name="text:link one name" content="link one">
  21. <meta name="text:link two url" content="http://">
  22. <meta name="text:link two name" content="link two">
  23. <meta name="text:link three url" content="http://">
  24. <meta name="text:link three name" content="link three">
  25. <meta name="text:link four url" content="http://">
  26. <meta name="text:link four name" content="link four">
  27. <meta name="if:About Title" content="1"/>
  28. <meta name="if:Extra Title" content="1"/>
  29. <meta name="if:Links Title" content="1"/>
  30. <meta name="if:Extra Table" content="1"/>
  31. <meta name="text:Extra Table Title" content="Extra">
  32. <meta name="text:Extra Table Content" content="Optional">
  33.  
  34. <link rel="shortcut icon" href="{Favicon}">
  35. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  36. <link rel="shortcut icon" href="{Favicon}">
  37. <title>{Title}</title>
  38. <link rel="shortcut icon" href="{Favicon}">
  39. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  40.  
  41. {block:Description}
  42. <meta name="description" content="{MetaDescription}" />
  43. {/block:Description}
  44.  
  45. <link href='http://fonts.googleapis.com/css?family=Roboto:400,300' rel='stylesheet' type='text/css'>
  46. <link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
  47. <style type="text/css">
  48.  
  49. @font-face{
  50. font-family: WebSymbolsRegular;
  51. src: url('http://static.tumblr.com/rzl30kg/t0Qmbgn5o/websymbols-regular-webfont.eot') format('eot')
  52. url('http://static.tumblr.com/rzl30kg/G3wmbgn77/websymbols-regular-webfont.woff') format('woff'),
  53. url('http://static.tumblr.com/rzl30kg/fQpmbgn8a/websymbols-regular-webfont.ttf') format('truetype'),
  54. url('http://static.tumblr.com/rzl30kg/dinmbgn8q/websymbols-regular-webfont.svg') format('svg');
  55. }
  56.  
  57. body{
  58. background:{color:Background};
  59. background-image:url('');
  60. background-repeat:repeat;
  61. background-attachment:fixed;
  62. background-position:bottom right;
  63. line-height:110%;
  64. font-family: arial, sans-serif;
  65. font-size: 11px;
  66. letter-spacing: px;
  67. color:{color:text};
  68. height: 100%;
  69.  
  70. }
  71.  
  72. a:link, a:visited, a:active{
  73. color:{color:link};
  74. outline: none;
  75. -moz-outline-style: none;
  76. text-decoration:none;
  77. }
  78.  
  79. a img{
  80. border:none;
  81. }
  82.  
  83. blockquote{
  84. padding:0px;
  85. padding-left:5px;
  86. margin:5px;
  87. border-left:1px dotted #288992;
  88. }
  89.  
  90. blockquote img{
  91. display:block;
  92. }
  93.  
  94. blockquote p{
  95. padding:0px;
  96. margin:0px;
  97. }
  98.  
  99. blockquote blockquote{
  100. position:relative;
  101. left:-5px;
  102. margin-top:0px;
  103. margin-right:0px;
  104. padding-right:0px;
  105. }
  106.  
  107. ul.chat, .chat ol, .chat li {
  108. list-style:none;
  109. margin:0px;
  110. padding:0px;
  111. }
  112.  
  113. #container{
  114. margin-left:420px;
  115. height:100%;
  116. font-size:8px;
  117. font-family:roboto;
  118. letter-spacing:1px;
  119. width: 250px;
  120. margin-top:80px;
  121. position:fixed;
  122. background:transparent;
  123. padding:10px;
  124. }
  125.  
  126.  
  127. #entry {
  128. width:400px;
  129. padding: 30px;
  130. margin-bottom:15px;
  131. display: block;
  132. background:{color:entries};;
  133.  
  134. }
  135.  
  136. #post{
  137. margin-left: 710px;
  138. width:550px;
  139. background-color:#;
  140. Margin-top:77px;
  141. }
  142.  
  143.  
  144. #desc {
  145. width:210px;
  146. text-align:justify;
  147. font-family: arial, sans-serif;
  148. font-size: 11px;
  149. letter-spacing: 0px;
  150. padding:20px;
  151. background-color:{color:desc};
  152. line-height:20px;}
  153.  
  154.  
  155. b {font-weight: bold;color : {color:text}; }
  156. i, em {font-weight:italic;color: {color:text};}
  157. u {font-weight:none; color: {color:underline};}
  158.  
  159.  
  160.  
  161. .asker {
  162. width: 390px;
  163. background-color: {color:ask};
  164. padding: 35px;
  165. margin-left:-30px;
  166. margin-top:-30px;
  167. font-size: 11px;
  168. font-weight: bold;
  169. text-transform: uppercase;
  170. line-height: 11px; }
  171.  
  172. .asker img{
  173. float: left;
  174. padding: 0px 5px 0px 0px;}
  175.  
  176. .asker a{
  177. font-size: 11px;
  178. font-weight: bold;
  179. color:{color:link};
  180. line-height: 11px;
  181. padding: 0;
  182. margin: 0;}
  183.  
  184. .question {
  185. font-size: 10px;
  186. font-weight: normal;
  187. color:{color:text};
  188. padding:20px
  189. overflow:hidden;
  190. text-transform: none;}
  191.  
  192. .answer {
  193. padding-left: 4px;
  194. padding-right: 4px;
  195. padding-top: 4px;}
  196.  
  197. .answer img {
  198. max-width: 370px;}
  199.  
  200. #acont{
  201. z-index:2;
  202. display:block;
  203. width: 100px;
  204. height:100px;
  205. background-color:#ffffff;
  206. opacity:0.7;
  207. position:absolute;
  208. }
  209.  
  210. #acont:hover{
  211. -webkit-transition: all 0.2s ease-in-out;
  212. -moz-transition: all 0.2s ease-in-out;
  213. -o-transition: all 0.2s ease-in-out;
  214. transition: all 0.2s ease-in-out;
  215. opacity:0.6;}
  216.  
  217. #audioplayer{
  218. width:20px;
  219. height:20px;
  220. overflow:hidden;
  221. margin: 38px 0px 0px 35px;
  222. background-color:transparent;}
  223.  
  224. .atext {
  225. font-family:;
  226. font-size: 8px;
  227. line-height: 7px;
  228. letter-spacing: 2px;
  229. color: {color:text}!important;
  230. margin-top:-5px;
  231. margin-left: 101px;
  232. text-transform:;
  233. height:18px;
  234. text-decoration: none;
  235. display: block;
  236. padding: 25px 5px 41px 6px;
  237. width:280px;
  238. text-align:center;}
  239.  
  240. .atext:hover {
  241. color:{color:links};
  242. background-color:{color:entries};
  243. -webkit-transition: opacity 0.7s linear;
  244. opacity: 0.9s;
  245. -webkit-transition: all 0.6s ease-out;
  246. -moz-transition: all 0.6s ease-out;
  247. transition: all 0.6s ease-out;
  248. }
  249.  
  250. .audio{
  251. position:absolute;
  252. width:40px;
  253. height:40px;}
  254.  
  255. .aimg{
  256. width:100px;
  257. height:100px;
  258. position:absolute;}
  259.  
  260. .aimg img{
  261. float:left;
  262. opacity:0.6;
  263. width:100px;
  264. }
  265.  
  266. #pagina a:link{
  267. background-color: {color:desc};
  268. padding:5px;}
  269.  
  270. #pagina a:visited {
  271. padding:5px;}
  272.  
  273. #pagina a:active {
  274. color: #fff;}
  275.  
  276. #pagina:hover{
  277. background:;}
  278.  
  279.  
  280. #header{
  281. margin-left:-8px;
  282. background: {color:top background};
  283. color: white;
  284. margin-top:-10px;
  285. position: fixed;
  286. font-family: Droid Sans;
  287. font-size: 18px;
  288. z-index:1000;
  289. padding: 10px;
  290. height:50px;
  291. width:100%;
  292. }
  293.  
  294. .table{
  295. width:605px;
  296. margin-left:740px;
  297. margin-top:-40px;}
  298.  
  299. .bmenu{
  300. padding: 0px;
  301. margin: 0 0 0px 0;
  302. position: relative;
  303. }
  304. .bmenu li{
  305. font-size: 10px;
  306. width:100px;
  307. margin-left:2px;
  308. display: inline-block;
  309. }
  310. .bmenu li a{
  311. font-size:10px;
  312. text-transform: uppercase;
  313. color:{color:Top Links};
  314. padding: 8px 10px 8px 10px;
  315. letter-spacing:0px;
  316. font-family: roboto;
  317. background:{color:top background};
  318. -webkit-transition: all 0.2s linear;
  319. -moz-transition: all 0.2s linear;
  320. -o-transition: all 0.2s linear;
  321. -ms-transition: all 0.2s linear;
  322. transition: all 0.2s linear;
  323. }
  324. .bmenu li a:hover{
  325. color:{color:Text};
  326. background:{color:background};
  327. -webkit-transition: all 0.2s linear;
  328. -moz-transition: all 0.2s linear;
  329. -o-transition: all 0.2s linear;
  330. -ms-transition: all 0.2s linear;
  331. transition: all 0.2s linear;
  332. }
  333. }
  334. #topbar{
  335. width:752px;
  336. margin-left:450px;
  337. padding: 10px 25px 15px 25px;
  338. background-color:#000000;
  339. }
  340. .toptitle{
  341. margin-left:450px;}
  342.  
  343. .lable{
  344. width:230px;
  345. Position:fixed;
  346. margin-left:450px;
  347. margin-top:150px;
  348. }
  349.  
  350.  
  351. #infobox {
  352. text-align:right;
  353. letter-spacing:px;
  354. margin-left:px;
  355. overflow:hidden;
  356. padding:5px;
  357. margin-top:-5px;
  358. width:455px;
  359. background-color: ;
  360. }
  361.  
  362. .tags a{
  363. text-align:center;
  364. text-transform:uppercase;
  365. letter-spacing:px;
  366. font-size:8px;
  367. letter-spacing:px;
  368. font-family:roboto;
  369. display:;
  370. margin-left:2px;
  371. margin-top:1px;
  372. background-color:{color:taglinks};}
  373.  
  374. .tags a:hover{
  375. text-decoration:underline;}
  376.  
  377. .tags img{
  378. margin-top:20px;
  379. float:left;
  380. margin-left: 5px;}
  381. .tagsymbol{
  382. font-family:'WebSymbolsRegular';
  383. color:{color:font};
  384. line-height:8px;
  385. font-size:9px;}
  386. .quotesymbol{
  387. font-family: arial bold;
  388. margin-top:18px;
  389. font-size:60px;
  390. opacity:.3;
  391. color: {color:link};
  392. position: absolute;
  393. }
  394. .nav a {
  395. background-color:{color:desc};
  396. font-family: 'roboto', sans-serif;
  397. font-size: 8px;
  398. letter-spacing:0px;
  399. line-height: 7px;
  400. color: {color:link}!important;
  401. margin-left:1px;
  402. margin-bottom: 1px;
  403. text-transform:uppercase;
  404. text-decoration: none;
  405. display: inline-block;
  406. padding:20px 20px 20px 10px;
  407. width:93px;
  408. text-align:center;}
  409.  
  410. .nav a:hover {
  411. color:{color:link};
  412. background-color:{color:background};
  413. -webkit-transition: opacity 0.7s linear;
  414. opacity: 0.7s;
  415. -webkit-transition: all 0.6s ease-out;
  416. -moz-transition: all 0.6s ease-out;
  417. transition: all 0.6s ease-out;
  418. }
  419. </style>
  420. </head>
  421. <body>
  422.  
  423.  
  424. <div id="header">
  425. <div style="margin-left:500px">
  426. <font style="FONT-WEIGHT: normal; COLOR: {color:title}; font:normal 25px 'Roboto', serif; text-transform:uppercase; letter-spacing:0px;">{title}</font><br>
  427. <font style="FONT-WEIGHT: normal; FONT-SIZE: 7px; COLOR: 000000; text-transform:uppercase;LINE-HEIGHT: 9px; FONT-FAMILY: arial; LETTER-SPACING: 2px">&mdash; {text:Title Text}</font></div>
  428.  
  429. <div class="table">
  430. <p><ul class="bmenu">
  431. <li><a href="/">index</a></li>
  432. <li><a href="/ask">message</a></li>
  433. <li><a href="/archive">archive</a></li>
  434. <li><a href="http://hkthemes.tumblr.com">theme</a></li>
  435.  
  436.  
  437. </ul></p></div> </div>
  438.  
  439. <div id="container">
  440. {block:IfAboutTitle}<br><br>
  441. <span style="float:right;">ABOUT</span>
  442. {/block:IfAboutTitle}<br><br>
  443.  
  444. <div id="desc">
  445. <img src="{image:sidebar}" width="210px"><br>
  446. {description}
  447. </div>
  448.  
  449. {block:IfExtraTable}
  450. {block:IfExtraTitle}
  451. <br><br>
  452. <span style="float:right;">{text:Extra Table Title}</span><br><br>{/block:IfExtraTitle}
  453.  
  454. <div id="desc">
  455. {text:Extra Table Content}<br>
  456. </div>
  457. {/block:IfExtraTable}
  458.  
  459. {block:IfLinksTitle}<br><br><span style="float:right;">LINKS</span>{/block:IfLinksTitle}<br><br>
  460.  
  461. <div class="nav">
  462. <a href="{text:link one url}">{text:link one name}</a><a href="{text:link two url}">{text:link two name}</a><a href="{text:link three url}">{text:link three name}</a><a href="{text:link four url}">{text:link four name}</a>
  463. </div>
  464.  
  465.  
  466. <br>
  467. <div id="pagina"><center>
  468. {block:Pagination}
  469. {block:PreviousPage}
  470. <a href="{PreviousPage}">←</a>
  471. {/block:PreviousPage}
  472.  
  473. {block:JumpPagination length="5"}
  474. {block:CurrentPage}
  475. <span class="current_page">{PageNumber}</span>
  476. {/block:CurrentPage}
  477.  
  478. {block:JumpPage}
  479. <a class="jump_page" href="{URL}">{PageNumber}</a>
  480. {/block:JumpPage}
  481. {/block:JumpPagination}
  482.  
  483. {block:NextPage}
  484. <a href="{NextPage}">→</a>
  485. {/block:NextPage}
  486. {block:Pagination} </center>
  487. </div>
  488.  
  489.  
  490.  
  491. </div>
  492.  
  493. <br>
  494.  
  495.  
  496.  
  497. <div id="post">
  498. {block:Posts}
  499.  
  500. <div id="entries">
  501.  
  502.  
  503. <div id="infobox">
  504. <font style="text-align:right; FONT-WEIGHT: normal; COLOR: {color:title}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">
  505. {block:Date}<a href="{Permalink}">({ShortDayOfWeek}){ShortMonth}{MonthNumberWithZero}, {Year}</a>{/block:Date}</b></font>
  506. <span style="margin-left:-10px;"><font style="text-align:right; FONT-WEIGHT: normal; FONT-SIZE: 7px; COLOR: 000000; text-transform:uppercase;LINE-HEIGHT: 9px; FONT-FAMILY: arial; LETTER-SPACING: 1px">{block:NoteCount}<br> with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{block:RebloggedFrom}&mdash; via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}{block:ContentSource} (&copy; <a href="{SourceURL}">{SourceLink}</a>){/block:ContentSource}<br>
  507. {block:HasTags}<span class="tagsymbol">,</span> {block:Tags}<span class="tags"><a href="{TagURL}" title="{Tag}">{Tag}</a> </span></a>{/block:Tags}{/block:HasTags}
  508. </font></span>
  509.  
  510. </div>
  511.  
  512. <!-- Text -->
  513. {block:Text}
  514. <div id="entry">
  515. {block:Title}<font style="text-align:right; FONT-WEIGHT: normal; COLOR: {color:title}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">{Title}</font>{/block:Title}
  516. <br>
  517. {Body}
  518. </div>
  519. {/block:Text}
  520.  
  521. <!-- Photo -->
  522. {block:Photo}
  523. <div id="entry">
  524. {LinkOpenTag}
  525. <img src="{PhotoURL-400}" alt="{PhotoAlt}">
  526. {LinkCloseTag}
  527. {block:Caption}<p>{Caption}</p>{/block:Caption}
  528. </div>
  529. {/block:Photo}
  530.  
  531. <!-- Photoset -->
  532. {block:Photoset}
  533. <div id="entry">
  534. {Photoset-400}
  535. {block:Caption}<p>{Caption}</p>{/block:Caption}
  536. </div>
  537. {/block:Photoset}
  538.  
  539.  
  540. <!-- Quote -->
  541. {block:Quote}
  542. <div id="entry">
  543. <div class="quotesymbol">“</div>
  544. <div style="border-left:1px solid #F1F1F1; margin-left:37px; padding:9px;"><span class="quote"><font style="text-align:right; FONT-WEIGHT: normal; COLOR: {color:links}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">{quote}</font><br>
  545. {block:Source}— <FONT style="FONT-WEIGHT: normal; FONT-SIZE: 5pt; TEXT-TRANSFORM: uppercase; COLOR: {color:link}; font-style:; LINE-HEIGHT: 8pt; LETTER-SPACING: 3pt; text-transform:;">{Source}</font>{/block:Source}
  546. </div>
  547. </div>
  548. {/block:Quote}
  549.  
  550. <!-- Link -->
  551. {block:Link}
  552. <div id="entry">
  553. <a href="{URL}" target="_blank"><font style="text-align:justify; FONT-WEIGHT: normal; COLOR: {color:links}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">{Name}</font></a>
  554. {block:Description}<p>{Description}</p>{/block:Description}
  555. </div>
  556. {/block:Link}
  557.  
  558. <!-- Chat -->
  559. {block:Chat}
  560. <div id="entry">
  561. {block:Title}<font style="text-align:justify; FONT-WEIGHT: normal; COLOR: {color:links}; font:normal 15px 'Roboto', serif; text-transform:uppercase; letter-spacing:5px;">{title}</font>{/block:Title}
  562. {block:Lines}
  563. {block:Label}{Label}{/block:Label} {Line}</br>
  564. {/block:Lines}
  565. </div>
  566. {/block:Chat}
  567.  
  568. {block:Audio}
  569. <div id="entry">
  570. <div class="audio"><div id="acont"><div id="audioplayer">{AudioPlayerWhite}</div></div>
  571. <div class="aimg"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="aimg"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  572. <div class="atext"><font style="FONT-WEIGHT: normal; margin-top:-50px; COLOR: {color:text}; font:bold 20px arial;font-style:; letter-spacing:-1px; padding:10px;">{block:TrackName}{TrackName}{/block:TrackName}</font><br>
  573. <FONT style="FONT-WEIGHT: normal; FONT-SIZE: 5pt; TEXT-TRANSFORM: uppercase; COLOR: {color:link}; font-style:; LINE-HEIGHT: 8pt; LETTER-SPACING: 1pt; text-transform:;">{block:Artist}{Artist}{/block:Artist} ♫ {block:PlayCount}{PlayCountWithLabel}{/block:PlayCount}</font></div>
  574. <br><br>
  575. {block:Caption}{Caption}{/block:Caption}
  576. </div>
  577. {/block:Audio}
  578.  
  579.  
  580. <!-- Video -->
  581. {block:Video}
  582. <div id="entry">
  583. {Video-400}
  584. {block:Caption}{Caption}{/block:Caption}
  585. </div>
  586. {/block:Video}
  587.  
  588. <!-- Message -->
  589. {block:Answer}
  590. <div id="entry">
  591. <div class="asker"><img src="{AskerPortraitURL-24}">{Asker} asked:
  592. <div class="question">{Question}</div></div>
  593. <div class="answer">{Answer}</div>
  594. </div>
  595. {/block:Answer}
  596.  
  597.  
  598. <!-- Permalink page -->
  599. {block:PermalinkPage}
  600.  
  601. {block:PostNotes}
  602. {PostNotes}
  603. {/block:PostNotes}
  604.  
  605. {/block:PermalinkPage}
  606.  
  607. <!-- Other -->
  608. {block:ContentSource}
  609. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  610. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  611. {/block:SourceLogo}
  612. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  613. {/block:ContentSource}
  614.  
  615. </div>
  616.  
  617. {/block:Posts}
  618.  
  619. </div>
  620. <!-- END POSTS -->
  621. </body>
  622. </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!