Advertisement
officialdogblog

physical magic

Jun 23rd, 2014
511
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.36 KB | None | 0 0
  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.  
  5. <head>
  6.  
  7. <title>{Title}</title>
  8. <link rel="shortcut icon" href="{PortraitURL-16}" />
  9.  
  10. {block:IfInfiniteScrolling}
  11. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  12. {/block:IfInfiniteScrolling}
  13.  
  14. <meta name="image:Background" content="" />
  15.  
  16. <meta name="color:Background" content="#FFFFFF" />
  17. <meta name="color:Link" content="#0000EF" />
  18.  
  19. <meta name="if:Infinite Scrolling" content="1" />
  20. <meta name="if:Tile Background" content="0" />
  21.  
  22. <meta name="text:Link 1 Title" content="submit" />
  23. <meta name="text:Link 1 URL" content="/submit" />
  24. <meta name="text:Link 2 Title" content="links" />
  25. <meta name="text:Link 2 URL" content="/links" />
  26.  
  27. </head>
  28.  
  29. <style type="text/css">
  30.  
  31. ::-webkit-scrollbar {
  32. width: 0px;
  33. }
  34.  
  35. body {
  36. font-family: arial;
  37. font-size: 13px;
  38. background: {color:Background} url({image:Background}) fixed;
  39. {block:IfNotTileBackground}
  40. background-size: cover;
  41. {/block:IfNotTileBackground}
  42. }
  43.  
  44. body a {
  45. color: {color:Link};
  46. text-transform: uppercase;
  47. text-decoration: none;
  48. -webkit-transition: all 0.3s;
  49. -moz-transition: all 0.3s;
  50. -ms-transition: all 0.3s;
  51. -o-transition: all 0.3s;
  52. transition: all 0.3s;
  53. }
  54.  
  55. body a:hover {
  56. letter-spacing: 1px;
  57. }
  58.  
  59. .torso {
  60. position: fixed;
  61. width: 99999px;
  62. height: 700px;
  63. top: 150px;
  64. padding-left: 100px;
  65. overflow: scroll;
  66. }
  67.  
  68. .organ {
  69. position: relative;
  70. background: rgba(300, 300, 300, 0.5);
  71. width: 400px;
  72. padding: 10px;
  73. text-align: justify;
  74. word-wrap: break-word;
  75. margin-top: 60px;
  76. }
  77.  
  78. .organ img {
  79. max-width: 100%;
  80. }
  81.  
  82. .head {
  83. position: fixed;
  84. top: 100px;
  85. left: 100px;
  86. z-index: 2;
  87. }
  88.  
  89. .eye {
  90. margin-top: 15px;
  91. width: 8px;
  92. height: 8px;
  93. border: 1px solid {color:Link};
  94. {block:IfBackgroundImage}
  95. background: rgba(300, 300, 300, 0.4);
  96. {/block:IfBackgroundImage}
  97. float: left;
  98. margin-right: 5px;
  99. margin-bottom: -10px;
  100. -webkit-transition: all 0.3s;
  101. -moz-transition: all 0.3s;
  102. -ms-transition: all 0.3s;
  103. -o-transition: all 0.3s;
  104. transition: all 0.3s;
  105. }
  106.  
  107. .eye:hover {
  108. background: {color:Link};
  109. margin-right: 7px;
  110. margin-left: 2px;
  111. }
  112.  
  113. .eye span {
  114. position: absolute;
  115. text-transform: uppercase;
  116. font-size: 11px;
  117. padding: 3px;
  118. margin-top: 20px;
  119. margin-left: 15px;
  120. max-width: 100px;
  121. border: 1px solid {color:Link};
  122. color: {color:Link};
  123. {block:IfBackgroundImage}
  124. background: rgba(300, 300, 300, 0.4);
  125. {/block:IfBackgroundImage}
  126. display: none;
  127. }
  128.  
  129. .eye:hover span {
  130. display: block;
  131. letter-spacing: 0px;
  132. }
  133.  
  134. nerve {
  135. float: left;
  136. margin-right: 20px;
  137. text-transform: uppercase;
  138. font-style: italic;
  139. font-size: 40px;
  140. text-shadow: 1px 1px rgba(300, 300, 300, 0.5);
  141. }
  142.  
  143. tic {
  144. font-size: 16px;
  145. text-transform: uppercase;
  146. }
  147.  
  148. .thought {
  149. width: 348px;
  150. padding: 6px;
  151. background-color: rgba(150, 150, 150, 0.2);
  152. }
  153.  
  154. blockquote {
  155. margin-left: 2px;
  156. padding-left: 7px;
  157. border-left: 1px solid {color:Link};
  158. }
  159.  
  160. ul {
  161. list-style: none;
  162. padding:0;
  163. margin:0;
  164. }
  165.  
  166. li {
  167. padding-left: 10px;
  168. text-indent: -.7em;
  169. }
  170.  
  171. li:before {
  172. content: "- ";
  173. margin-right: 4px;
  174. color: {color:Link};
  175. }
  176.  
  177. .quote.short {
  178. font-size: 17px;
  179. }
  180.  
  181. .quote.medium {
  182. font-size: 15px;
  183. }
  184.  
  185. .quote.long {
  186. font-size: 14px;
  187. }
  188.  
  189. .blood {
  190. position: absolute;
  191. right: 0px;
  192. top: -11px;
  193. line-height: -10px;
  194. opacity: 0;
  195. width: 20px;
  196. padding-left: 20px;
  197. height: 100%;
  198. -webkit-transition: all 0.3s;
  199. -moz-transition: all 0.3s;
  200. -ms-transition: all 0.3s;
  201. -o-transition: all 0.3s;
  202. transition: all 0.3s;
  203. }
  204.  
  205. .blood .eye:hover {
  206. margin-right: 0px;
  207. margin-left: 0px;
  208. }
  209.  
  210. .organ:hover .blood {
  211. right: -30px;
  212. opacity: 1;
  213. }
  214.  
  215. .time {
  216. width: 420px;
  217. }
  218.  
  219. .days {
  220. height: 35px;
  221. width: 35px;
  222. font-size: 20px;
  223. text-align: center;
  224. border: 1px solid {color:Link};
  225. {block:IfBackgroundImage}
  226. background: rgba(300, 300, 300, 0.4);
  227. {/block:IfBackgroundImage}
  228. -webkit-transition: all 0.3s;
  229. -moz-transition: all 0.3s;
  230. -ms-transition: all 0.3s;
  231. -o-transition: all 0.3s;
  232. transition: all 0.3s;
  233. }
  234.  
  235. .days:hover {
  236. background: {color:Link};
  237. }
  238.  
  239. .days a:hover {
  240. letter-spacing: 0px;
  241. }
  242.  
  243. .days span {
  244. position: absolute;
  245. text-transform: uppercase;
  246. font-size: 11px;
  247. padding: 3px;
  248. margin-top: 15px;
  249. margin-left: 15px;
  250. max-width: 100px;
  251. border: 1px solid {color:Link};
  252. color: {color:Link};
  253. {block:IfBackgroundImage}
  254. background: rgba(300, 300, 300, 0.4);
  255. {/block:IfBackgroundImage}
  256. display: none;
  257. }
  258.  
  259. .days:hover span {
  260. display: block;
  261. letter-spacing: 0px;
  262. }
  263.  
  264. physical {
  265. z-index: 100;
  266. bottom: 15px;
  267. right: 20px;
  268. position: fixed;
  269. font-size: 30px;
  270. text-shadow: 2px 2px #fff;
  271. -webkit-transition: all 0.3s;
  272. -moz-transition: all 0.3s;
  273. -ms-transition: all 0.3s;
  274. -o-transition: all 0.3s;
  275. transition: all 0.3s;
  276. }
  277.  
  278. physical:hover {
  279. -webkit-transform:rotate(360deg);
  280. -moz-transform:rotate(360deg);
  281. -ms-transform:rotate(360deg);
  282. -o-transform:rotate(360deg);
  283. transform:rotate(360deg);
  284. }
  285.  
  286. </style>
  287.  
  288. <body>
  289.  
  290. <physical>
  291. <strong>
  292. <a title="theme credit" href="http://gay8.tumblr.com/">8</a>
  293. </strong>
  294. </physical>
  295.  
  296. <div class="head">
  297. <nerve>{Title}</nerve>
  298. <a href="/"><div class="eye"><span>home</span></div></a>
  299. <a href="/ask"><div class="eye"><span>ask</span></div></a>
  300. <a href="{text:Link 1 URL}"><div class="eye"><span>{text:Link 1 Title}</span></div></a>
  301. <a href="{text:Link 2 URL}"><div class="eye"><span>{text:Link 2 Title}</span></div></a>
  302. </div>
  303.  
  304. <div class="torso">
  305.  
  306. <div class="autopagerize_page_element">
  307.  
  308. {block:Posts}
  309.  
  310. {block:ContentSource}<!-- {SourceURL}
  311. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  312. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  313. {/block:ContentSource}
  314.  
  315. <!-- {block:NoRebloggedFrom}
  316. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  317. {/block:NoRebloggedFrom} -->
  318.  
  319. {block:Text}
  320. <div class="organ">
  321.  
  322. {block:Title}<tic>{Title}</tic><br />
  323. <div style="margin-top: 20px;"></div>{/block:Title}
  324. <div style="margin-top: -15px;"></div>
  325. {Body}
  326. {block:Date}<div style="margin-bottom: -13px;"></div>{/block:Date}
  327.  
  328. {block:IndexPage}
  329. <div class="blood">
  330. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  331. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  332. </div>
  333. {/block:IndexPage}
  334.  
  335. </div>
  336. {/block:Text}
  337.  
  338. {block:Photo}
  339. <div class="organ">
  340.  
  341. <img src="{PhotoURL-HighRes}" style="margin-bottom: -3px;" />
  342.  
  343. {block:PermalinkPage}
  344. {block:Caption}{Caption}{/block:Caption}
  345. {/block:PermalinkPage}
  346.  
  347. {block:IndexPage}
  348. <div class="blood">
  349. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  350. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  351. </div>
  352. {/block:IndexPage}
  353.  
  354. </div>
  355. {/block:Photo}
  356.  
  357. {block:Photoset}
  358. <div class="organ">
  359.  
  360. {Photoset-400}
  361. <div style="margin-top: -3px;"></div>
  362.  
  363. {block:PermalinkPage}
  364. {block:Caption}{Caption}{/block:Caption}
  365. {/block:PermalinkPage}
  366.  
  367. {block:IndexPage}
  368. <div class="blood">
  369. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  370. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  371. </div>
  372. {/block:IndexPage}
  373.  
  374. </div>
  375. {/block:Photoset}
  376.  
  377. {block:Quote}
  378. <div class="organ">
  379.  
  380. <div class="quote {Length}">"{Quote}"</div><br />
  381. <span style="float: right;">{Source}</span><br />
  382.  
  383. {block:IndexPage}
  384. <div class="blood">
  385. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  386. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  387. </div>
  388. {/block:IndexPage}
  389.  
  390. </div>
  391. {/block:Quote}
  392.  
  393. {block:Link}
  394. <div class="organ">
  395.  
  396. <tic><a href="{Link}">{Name}</a></tic>
  397. {block:Description}{Description}{/block:Description}
  398.  
  399. {block:IndexPage}
  400. <div class="blood">
  401. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  402. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  403. </div>
  404. {/block:IndexPage}
  405.  
  406. </div>
  407. {/block:Link}
  408.  
  409. {block:Chat}
  410. <div class="organ">
  411.  
  412. {block:Title}<tic>{Title}</tic>{/block:Title}
  413. {block:Lines}
  414. <p>{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</p>
  415. {/block:Lines}
  416. <div style="margin-bottom: -14px;"></div>
  417.  
  418. {block:IndexPage}
  419. <div class="blood">
  420. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  421. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  422. </div>
  423. {/block:IndexPage}
  424.  
  425. </div>
  426. {/block:Chat}
  427.  
  428. {block:Audio}
  429. <div class="organ">
  430.  
  431. {AudioEmbed-400}
  432. <div style="margin-top: -3px;"></div>
  433.  
  434. {block:PermalinkPage}
  435. {block:Caption}{Caption}{/block:Caption}
  436. {/block:PermalinkPage}
  437.  
  438. {block:IndexPage}
  439. <div class="blood">
  440. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  441. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  442. </div>
  443. {/block:IndexPage}
  444.  
  445. </div>
  446. {/block:Audio}
  447.  
  448. {block:Video}
  449. <div class="organ">
  450.  
  451. {VideoEmbed-400}
  452.  
  453. {block:PermalinkPage}
  454. {block:Caption}{Caption}{/block:Caption}
  455. {/block:PermalinkPage}
  456.  
  457. {block:IndexPage}
  458. <div class="blood">
  459. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  460. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  461. </div>
  462. {/block:IndexPage}
  463.  
  464. </div>
  465. {/block:Video}
  466.  
  467. {block:Answer}
  468.  
  469. <div class="organ">
  470.  
  471. <span style="float: left;">
  472. <img src="{AskerPortraitURL-30}" />
  473. </span>
  474. <span class="thought" style="float: right;">
  475. "{Question}"
  476. </span>
  477. <br />
  478. <span style="float: right; text-transform: lowercase; margin-top: 5px;">asked by {Asker}</span>
  479. <div style="clear: both;"></div>
  480. {Answer}
  481. <div style="margin-bottom: -14px;"></div>
  482.  
  483. {block:IndexPage}
  484. <div class="blood">
  485. <a href="{Permalink}" target="_blank"><div class="eye"><span>permalink</span></div></a>
  486. <br /><a href="{ReblogURL}" target="_blank"><div class="eye"><span>reblog</span></div></a>
  487. </div>
  488. {/block:IndexPage}
  489.  
  490. </div>
  491. {/block:Answer}
  492.  
  493. {block:Date}
  494. {block:PermalinkPage}
  495. <div class="organ">
  496. posted on: {DayOfMonth} {Month} {Year} at {12Hour}:{Minutes}{AmPm}
  497.  
  498. {block:RebloggedFrom}
  499. <br />
  500. reblogged from: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  501. {/block:RebloggedFrom}
  502.  
  503. {block:NoteCount}
  504. <br />
  505. number of notes: {NoteCount}
  506. {/block:NoteCount}
  507.  
  508. {block:RebloggedFrom}
  509. <br />
  510. posted by: <a href="{ReblogRootURL}">{ReblogRootName}</a>
  511. {/block:RebloggedFrom}
  512.  
  513. {block:HasTags}
  514. <br />
  515. tags: {block:Tags}#<a href="{TagURL}">{Tag}</a>  {block:Tags}
  516. {/block:HasTags}
  517. </div>
  518. {/block:PermalinkPage}
  519. {/block:Date}
  520.  
  521. {/block:Posts}
  522.  
  523. </div>
  524.  
  525. {block:IfNotInfiniteScrolling}
  526.  
  527. <br /><br /><br /><br /><br />
  528.  
  529. {block:Pagination}
  530.  
  531. <div class="time">
  532.  
  533. {block:PreviousPage}
  534. <a href="{PreviousPage}"><div class="days" style="float: left;"><div style="margin-top: 3px;"></div>-<span>previous</span></div></a>
  535. {/block:PreviousPage}
  536.  
  537. {block:NextPage}
  538. <a href="{NextPage}"><div class="days" style="float: right;"><div style="margin-top: 5px;"></div>+<span>next</span></div></a>
  539. {/block:NextPage}
  540.  
  541. </div>
  542.  
  543. {/block:Pagination}
  544.  
  545. <br /><br /><br /><br /><br /><br /><br /><br /><br />
  546.  
  547. {/block:IfNotInfiniteScrolling}
  548.  
  549. </div>
  550.  
  551. </body>
  552.  
  553. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement