Advertisement
dylaenobriens

Theme #55 Ver.1: Sleepwalking

Jan 27th, 2014
131
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.79 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. <!-- theme #55 ver 1 by alexgaeskarth
  4. do not steal if you value your life -->
  5.  
  6. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  7.  
  8.  
  9. <head>
  10.  
  11. <title>{Title}</title>
  12.  
  13. {block:Description}<meta name="description" content="{MetaDescription}"/>
  14. {/block:Description}
  15. <link rel="shortcut icon" href="{Favicon}" />
  16. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  17.  
  18. <meta name="color:Bg" content="#ffffff">
  19. <meta name="color:Link" content="#969696">
  20. <meta name="color:Sidebar Links" content="#b4b4b4">
  21. <meta name="color:Text" content="#a7a7a7">
  22. <meta name="color:Tags" content="#a2a2a2">
  23. <meta name="color:Ask" content="#fcfcfc">
  24. <meta name="color:Hover" content="#eeeeee">
  25. <meta name="color:Border" content="#e7e7e7">
  26. <meta name="color:Scrollbar" content="#d6d5d5">
  27. <meta name="color:Selection" content="#f7f7f7">
  28.  
  29.  
  30. <meta name="image:sidebar" content=""/>
  31.  
  32. <meta name="text:link 1" content="">
  33. <meta name="text:link 1 url" content="/">
  34. <meta name="text:link 2" content="">
  35. <meta name="text:link 2 url" content="/">
  36. <meta name="text:link 3" content="">
  37. <meta name="text:link 3 url" content="/">
  38. <meta name="text:link 4" content="">
  39. <meta name="text:link 4 url" content="/">
  40. <meta name="text:link 5" content="">
  41. <meta name="text:link 5 url" content="/">
  42.  
  43. <meta name="if:Cursor" content="1">
  44. <meta name="if:500pxPosts" content="1">
  45. <meta name="if:400pxPosts" content="0">
  46.  
  47.  
  48. <style type="text/css">
  49.  
  50.  
  51. /*--scrollbar--*/
  52.  
  53. ::-webkit-scrollbar-thumb:vertical {border:3px solid #fff;height:12px; background-color:{color:scrollbar};}
  54. ::-webkit-scrollbar-thumb:horizontal {background-color:#fff;}
  55. ::-webkit-scrollbar {background-color:{color:scrollbar};height:7px;width:12px;border:5px solid #fff;}
  56. /*--body--*/
  57.  
  58.  
  59. body {
  60. margin:0px;
  61. font-style:none;
  62. background-color:{color:bg};
  63. font-family:arial;
  64. color:{color:text};
  65. font-size:8px;
  66. }
  67.  
  68.  
  69. a {
  70. color:{color:link};
  71. text-decoration:none;
  72. -webkit-transition: all 0.6s ease;
  73. -moz-transition: all 0.6s ease;
  74. -o-transition: all 0.6s ease;
  75. }
  76.  
  77. a:hover {
  78. color:{color:hover};
  79. text-decoration:none;
  80. -webkit-transition: all 0.8s ease-out;
  81. -moz-transition: all 0.8s ease-out;
  82. transition: all 0.8s ease-out;
  83. }
  84.  
  85. img {
  86. max-width:100%;
  87. border:none;
  88. }
  89.  
  90. pre {
  91. background:#eee;
  92. padding:8px;
  93. }
  94.  
  95. blockquote {
  96. padding-left:5px;
  97. border-left:2px solid {color:border};
  98. }
  99.  
  100. h1 {
  101. text-align:center;
  102. font-style:italic;
  103. font-weight:none;
  104. font-family:lao ui;
  105. font-size:16px;
  106. line-height:115%;
  107. font-style:none;
  108. }
  109.  
  110. h1 a {
  111. color:{color:text};
  112. }
  113.  
  114. h2 {
  115. text-align:left;
  116. font-style:italic;
  117. font-weight:none;
  118. font-family:lao ui;
  119. font-size:17px;
  120. line-height:115%;
  121. font-style:none;
  122. }
  123.  
  124.  
  125. ::selection {
  126. background-color:{color:selection};
  127. }
  128.  
  129. big {
  130. font-size:2em;
  131. }
  132.  
  133. /*--Cursor code--*/
  134.  
  135. {block:ifCursor}
  136.  
  137. body, a{cursor:url("http://i.imgur.com/2qleX.jpg"), auto !important; }
  138.  
  139. a:hover{cursor:url("http://i.imgur.com/IepP2.jpg"), auto !important;}
  140.  
  141. {/block:ifCursor}
  142.  
  143.  
  144.  
  145. /*--sidebar--*/
  146.  
  147. #sidebar {
  148. position:fixed;
  149. width:110px;
  150. text-align:left;
  151. margin-left:180px;
  152. margin-top:150px;
  153. }
  154.  
  155. #sidebarimage {
  156. width:110px;
  157. }
  158.  
  159. #sidebarimage img {
  160. width:110px;
  161. height:110px;
  162. border:1px solid {color:border};
  163. padding:3px;
  164. border-radius:100px;
  165. -webkit-transition: all 1s ease;
  166. -moz-transition: all 1s ease;
  167. -o-transition: all 1s ease;
  168. }
  169.  
  170. #sidebar:hover #sidebarimage img {
  171. -webkit-transform:rotateY(360deg);
  172. -webkit-transition: all 0.8s ease;
  173. -moz-transition: all 0.8s ease;
  174. -o-transition: all 0.8s ease;
  175. }
  176.  
  177. /*--border--*/
  178.  
  179. #dick {
  180. color:transparent;
  181. position:fixed;
  182. top:0px;
  183. margin-left:150px;
  184. height:100%;
  185. border-left:1px solid {color:border};
  186. }
  187.  
  188. /*--links--*/
  189.  
  190. #links {
  191. width:118px;
  192. margin-top:-10px;
  193. font-family:'calibri';
  194. text-transform:uppercase;
  195. text-align:center;
  196. opacity:0;
  197. -webkit-transition: all .8s ease;
  198. -moz-transition: all .8s ease;
  199. -o-transition: all .8s ease;
  200. }
  201.  
  202.  
  203. #links a {
  204. padding:3px;
  205. font-size:8px;
  206. color:{color:sidebar links};
  207. }
  208.  
  209. #links a:hover {
  210. color:{color:hover};
  211. }
  212.  
  213. #sidebar:hover #links {
  214. opacity:1;
  215. margin-top:8px;
  216. -webkit-transition: all 0.7s ease;
  217. -moz-transition: all 0.7s ease;
  218. -o-transition: all 0.7s ease;
  219. }
  220.  
  221. /*--description--*/
  222.  
  223. #description {
  224. width:118px;
  225. margin-top:8px;
  226. font-family:'baskerville';
  227. letter-spacing:1px;
  228. font-size:9px;
  229. text-align:justify;
  230. color:{color:Text};
  231. }
  232.  
  233. #description a{
  234. color:{color:description links};
  235. }
  236.  
  237. /*--pagination--*/
  238.  
  239. #pagination {
  240. width:118px;
  241. color:{color:link};
  242. margin-top:8px;
  243. text-transform:lowercase;
  244. text-align:center;
  245. font-size:9px;
  246. font-family:calibri;
  247. }
  248.  
  249. #pagination a{
  250. color:{color:Link};
  251. }
  252.  
  253. #pagination a:hover {
  254. color:{color:Hover};
  255. }
  256.  
  257. /*--posts--*/
  258.  
  259. {block:if500pxPosts}
  260.  
  261. #posts {
  262. width:500px;
  263. margin-bottom:10px;
  264. padding:1px;
  265. font-size:11px;
  266. color:{color:Text};
  267. line-height:100%;
  268. text-align:justify;
  269. }
  270.  
  271. {/block:if500pxPosts}
  272.  
  273. {block:if400pxPosts}
  274.  
  275. #posts {
  276. width:400px;
  277. margin-bottom:10px;
  278. padding:1px;
  279. font-size:11px;
  280. color:{color:Text};
  281. line-height:100%;
  282. text-align:justify;
  283. }
  284.  
  285. {/block:if400pxPosts}
  286.  
  287. #postscontainer {
  288. margin-bottom:20px;
  289. padding:1px;
  290. margin-left:400px;
  291. margin-top:55px;
  292. }
  293.  
  294.  
  295. #info {
  296. font-family:'trebuchet ms';
  297. text-align:left;
  298. border-top:solid 1px #F0F0F0;
  299. text-transform:uppercase;
  300. margin-bottom:10px;
  301. margin-top:10px;
  302. letter-spacing:1px;
  303. font-size:7px;
  304. padding-top:5px;
  305. color:#b9b8b8;
  306. }
  307.  
  308. #info a {
  309. color:#b9b8b8;
  310. }
  311.  
  312. #info a:hover {
  313. color:{color:hover};
  314. }
  315.  
  316.  
  317. /*--tags--*/
  318.  
  319. #tags {
  320. font-family:trebuchet ms;
  321. width:490px;
  322. margin-left:0px;
  323. margin-top:0px;
  324. font-size:7px;
  325. color:#b9b8b8;
  326. }
  327.  
  328. #tags a {
  329. color:#b9b8b8;
  330. }
  331.  
  332. #tags a:hover {
  333. color:{color:Hover};
  334. }
  335.  
  336. /*--asks--*/
  337.  
  338. #ask {
  339. padding:10px;
  340. background-color:{color:Ask};
  341. }
  342.  
  343.  
  344.  
  345. /*--audio--*/
  346.  
  347. .newplayerbutton {
  348. position: relative;
  349. width: 28px;
  350. height: 27px;
  351. overflow: hidden;
  352. }
  353.  
  354. .playerbuttonhug {
  355. position: absolute;
  356. top: -12px;
  357. left: -8px;
  358. }
  359.  
  360.  
  361. .tumblr_audio_player {
  362. border: none;
  363. padding: 0px;
  364. margin: 0px;
  365. height: 53px;
  366. width: 500px;
  367. }
  368.  
  369. .playerbuttonbg {
  370. position: absolute;
  371. left: 25px;
  372. top: 20px;
  373. width: 28px;
  374. height: 28px;
  375. background-color: #fff;
  376. padding: 10px;
  377. -webkit-border-radius: 40px;
  378. -moz-border-radius: 40px;
  379. border-radius: 40px;
  380. opacity: .4;
  381. filter: alpha(opacity=40);
  382. -moz-opacity: 0.4;
  383. -khtml-opacity: 0.4;
  384. transition: opacity .7s ease-in-out;
  385. -moz-transition: opacity .7s ease-in-out;
  386. -webkit-transition: opacity .7s ease-in-out;
  387. }
  388.  
  389. .playerbuttonbg:hover {
  390. opacity: 1;
  391. filter: alpha(opacity=100);
  392. -moz-opacity: 1;
  393. -khtml-opacity: 1;
  394. }
  395.  
  396. .audioimgwrapper {
  397. position: absolute;
  398. left: 10px;
  399. top: 5px;
  400. -webkit-border-radius: 50px;
  401. -moz-border-radius: 50px;
  402. border-radius: 50px;
  403. overflow: hidden;
  404. width: 78px;
  405. height: 78px;
  406. }
  407.  
  408. .audioimgwrapper img {
  409. width: 100%;
  410. height: auto;
  411. -webkit-border-radius: 50px;
  412. -moz-border-radius: 50px;
  413. border-radius: 50px;
  414. }
  415.  
  416. .trackdetails {
  417. width: auto;
  418. display:inline-block;
  419. margin-left: 100px;
  420. margin-top:10px;
  421. min-height: 85px;
  422. line-height:150%;
  423. }
  424.  
  425. .audiowrapper {
  426. position: relative;
  427. display:inline-block;
  428. width:100%;
  429. height:88px;
  430. color:{color:text};
  431. }
  432.  
  433. /*--credit--*/
  434.  
  435. #credit {
  436. right:2px;
  437. bottom:0px;
  438. font-size:9px;
  439. padding:5px;
  440. text-transform:uppercase;
  441. position:fixed;
  442. -webkit-transition: all 0.5s ease-out;
  443. -moz-transition: all 0.5s ease-out;
  444. transition: all 0.5s ease-out;
  445. }
  446.  
  447. /*--tooltips--*/
  448.  
  449. #s-m-t-tooltip {
  450. max-width:300px;
  451. padding:3px 4px 5px 4px;
  452. margin:20px 0px 0px 20px;
  453. background-color:#d3d3d3; /* change the background color */
  454. font-family:calibri; /* change the font */
  455. font-size:9px; /* change the font size */
  456. letter-spacing:1px; /* change the letter spacing */
  457. text-transform:uppercase; /* can be uppercase, lowercase, none*/
  458. color:white; /* change the text color */
  459. z-index:999999999999999999999999999999999999;
  460. }
  461.  
  462.  
  463.  
  464.  
  465. {CustomCSS}
  466.  
  467. </style></head>
  468.  
  469. <!--tooltips javascript-->
  470.  
  471. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  472.  
  473. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  474.  
  475. <script>
  476.  
  477. (function($){
  478.  
  479. $(document).ready(function(){
  480.  
  481. $("a[title]").style_my_tooltips({
  482.  
  483. tip_follows_cursor:true,
  484.  
  485. tip_delay_time:90,
  486.  
  487. tip_fade_speed:600,
  488.  
  489. attribute:"title"
  490.  
  491. });
  492.  
  493. });
  494.  
  495. })(jQuery);
  496.  
  497. </script>
  498.  
  499. <body>
  500.  
  501. <div id="sidebar">
  502. <div id="dick">I</div>
  503. <div id="sidebarimage">
  504. <a href="/"><img src="{image:sidebar}"></div></a>
  505.  
  506.  
  507. <div id="description">{description}</div>
  508.  
  509. <div id="links">
  510. <a href="{text:link 1 url}">{text:link 1}</a>
  511. <a href="{text:link 2 url}">{text:link 2}</a>
  512. <a href="{text:link 3 url}">{text:link 3}</a>
  513. <a href="{text:link 4 url}">{text:link 4}</a>
  514. </div>
  515.  
  516.  
  517. {block:Pagination}
  518. <div id="pagination">
  519.  
  520. {block:PreviousPage}<a href="{PreviousPage}">Prev</a>{/block:PreviousPage}
  521. {block:NextPage}- <a href="{NextPage}">Next</a>{/block:NextPage}
  522. </div>{/block:Pagination}
  523.  
  524. </div></div>
  525.  
  526.  
  527. <div id="postscontainer">
  528.  
  529. {block:Posts}
  530.  
  531. <div id="posts">
  532.  
  533.  
  534. {block:Text}{block:Title}<h1>{Title}{/block:Title}</h1>{Body}{/block:Text}
  535.  
  536.  
  537. {block:Photo}{LinkOpenTag}
  538.  
  539. {block:if500pxPosts}
  540. <img src="{PhotoURL-500}">
  541. {/block:if500pxPosts}
  542.  
  543. {block:if400pxPosts}
  544. <img src="{PhotoURL-400}">
  545. {/block:if400pxPosts}
  546.  
  547. {LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  548.  
  549. {block:Photoset}
  550.  
  551. {block:if500pxPosts}
  552. {Photoset-500}
  553. {/block:if500pxPosts}
  554.  
  555. {block:if400pxPosts}
  556. {Photoset-400}
  557. {/block:if400pxPosts}
  558.  
  559. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  560.  
  561. {block:Quote}<h2>"{Quote}"</h2>{block:Source} &#8212;{Source}{/block:Source}{/block:Quote}
  562.  
  563. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  564.  
  565. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  566.  
  567. {block:Audio}{block:AudioPlayer}
  568. <div class="audiowrapper">
  569. {block:AlbumArt}
  570. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  571. {/block:AlbumArt}
  572.  
  573. <div class="playerbuttonbg">
  574. <div class="newplayerbutton">
  575. <div class="playerbuttonhug">
  576.  
  577. {AudioPlayerWhite}
  578.  
  579. </div>
  580. </div>
  581. </div>
  582.  
  583. <div class="trackdetails">
  584.  
  585. {block:TrackName}<b>{TrackName}</b>{/block:TrackName}<br/>
  586. {block:Artist}<b>Artist:</b> {Artist}{/block:Artist}<br/>
  587. {block:Album}<b>Album:</b> {Album}{/block:Album}<br/>
  588. <b>{PlayCountWithLabel}</b>
  589.  
  590. </div>
  591. </div>
  592. {/block:AudioPlayer}
  593.  
  594. {block:Caption}{Caption}{/block:Caption}{/block:Audio}
  595.  
  596. {block:Video}
  597.  
  598. {block:if500pxPosts}
  599. {Video-500}
  600. {/block:if500pxPosts}
  601.  
  602. {block:if400pxPosts}
  603. {Video-400}
  604. {/block:if400pxPosts}
  605.  
  606. {block:Caption}{Caption}{/block:Caption}{/block:Video}
  607.  
  608.  
  609. {block:Answer}<div id="ask"><span style="font-family:times;font-size:15px;font-style:italic;"><b>{Asker}</b></span>: {Question}</div> {Answer}{/block:Answer}
  610.  
  611. <div id="info">{block:Date} <a href="{Permalink}">
  612. {DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a></a>{/block:Date} - {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  613. and {block:ContentSource} <a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}{/block:RebloggedFrom} with <a href="{Permalink}">
  614. {NoteCountWithLabel}</a>
  615. {block:HasTags} <div id="tags">tags:{block:Tags} <a href="{TagURL}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div>
  616.  
  617.  
  618. </div>
  619.  
  620. {/block:Posts}
  621.  
  622. {block:PostNotes}{PostNotes}</div>{/block:PostNotes}
  623. {/block:Posts}
  624.  
  625. </div>
  626.  
  627. <div id="credit"><a href="http://alexgaeskarth.tumblr.com/"><img src="http://static.tumblr.com/ujmsumm/TJamv4jm6/sg.png" width="40px;"></div></a>
  628. </body>
  629. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement