API tools faq
paste
Advertisement
earlydreamers

theme 01: |-/

earlydreamers
May 14th, 2015
288
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.93 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. <!--
  4. theme 01 by artcicmonkeys, i used the help of the base code by adoredash
  5. -->
  6.  
  7. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  8. <head>
  9.  
  10. <title>{Title}</title>
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  14.  
  15.  
  16. <meta name="color:Text" content="#000000"/>
  17. <meta name="color:Link" content="#999999"/>
  18. <meta name="color:LinkHover" content="#444444"/>
  19. <meta name="color:LogoHover" content="#cccccc"/>
  20.  
  21. <meta name="text:Link 1 URL" content="" />
  22. <meta name="text:Link 1" content="" />
  23. <meta name="text:Link 2 URL" content="" />
  24. <meta name="text:Link 2" content="" />
  25. <meta name="text:Link 3 URL" content="" />
  26. <meta name="text:Link 3" content="" />
  27.  
  28.  
  29. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
  30. </script>
  31.  
  32. <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js">
  33. </script>
  34.  
  35. <script>
  36. $(function() {
  37. $(document).tooltip({
  38. track:true
  39. });
  40. });
  41. </script>
  42.  
  43. <style type="text/css">
  44. .ui-tooltip {
  45. position:absolute;
  46. z-index:9999;
  47. padding-top:8px;
  48. }
  49.  
  50. .ui-tooltip-content {
  51. background:#eee;
  52. padding:5px 5px;
  53. font-size:9px;
  54. font-family:arial;
  55. border:1px solid #ddd;
  56. text-transform:uppercase;
  57. color:#000;
  58. }
  59.  
  60. ::selection {color:#f5f5f5; background:#ccc;}
  61. ::-moz-selection {color:#f5f5f5; background:#ccc;}
  62. ::-webkit-selection {color:#f5f5f5; background:#ccc;}
  63.  
  64. body {
  65. background-color:#fff;
  66. font-family:arial;
  67. font-size:10px;
  68. padding-bottom:5px;
  69. padding-top:0px;
  70. padding-right:0px;
  71. padding-left:0px;
  72. text-align:justify;
  73. color:{color:Text};
  74. margin:0;
  75. }
  76.  
  77. a {
  78. text-decoration:none;
  79. color:{color:Link};
  80. -webkit-transition: all 0.5s ease;
  81. -moz-transition: all 0.5s ease;
  82. -o-transition: all 0.5s ease
  83. }
  84.  
  85. a:hover {
  86. opacity:1;
  87. text-decoration: line-through;
  88. color:{color:LinkHover};
  89. color: transparent;
  90. text-shadow: #000 0 0 1px;
  91. -webkit-transition: all 0.5s ease;
  92. -moz-transition: all 0.5s ease;
  93. -o-transition: all 0.5s ease;
  94. }
  95.  
  96. a:active {
  97. text-decoration: line-through;
  98. }
  99.  
  100. img {
  101. border:none;
  102. opacity: 1;
  103. }
  104.  
  105. h1 {
  106. font-size:14px;
  107. text-align:left;
  108. text-transform:uppercase;
  109. }
  110.  
  111. blockquote {
  112. width: 480px;
  113. text-transform: normal;
  114. line-height:12px;
  115. margin-left:0px;
  116. padding-left:9px;
  117. border-left: 3px solid #ccc;
  118. }
  119.  
  120. #sidebar {
  121. margin-left:90px;
  122. width:211px; /* DO NOT MAKE THIS SMALLER */
  123. margin-top:150px;
  124. position:fixed;
  125. }
  126.  
  127. #coolio {
  128. width:190px;
  129. margin-left:-21px;
  130. position:fixed;
  131. transition:all 1s ease;
  132. opacity:0;
  133. }
  134.  
  135. #sidebar:hover #coolio {
  136. opacity:1;
  137. transition:all 1s ease;
  138. }
  139.  
  140. #boxblue {
  141. display: inline-block;
  142. position: relative;
  143. overflow: auto;
  144. padding:0px;
  145. width:40px;
  146. height:180px;
  147. background-color:#6ac0d9;
  148. z-index: 1;
  149. }
  150.  
  151. #boxblue p {
  152. position: absolute;
  153. top: 50%;
  154. left: 50%;
  155. margin-right: -50%;
  156. transform: translate(-50%, -50%);
  157. }
  158.  
  159. a.fill-boxblue {
  160. display: block;
  161. height: 100%;
  162. width: 100%;
  163. }
  164.  
  165. #boxblue a:hover {
  166. background:{color:LogoHover};
  167. }
  168.  
  169. #boxblack {
  170. display: inline-block;
  171. position: relative;
  172. bottom:70px;
  173. left:-37px;
  174. overflow: auto;
  175. padding:0px;
  176. width: 125px;
  177. height: 40px;
  178. background-color:#010101;
  179. z-index: 2;
  180. }
  181.  
  182. #boxblack p {
  183. position: absolute;
  184. top: 50%;
  185. left: 50%;
  186. margin-right: -50%;
  187. transform: translate(-50%, -50%);
  188. }
  189.  
  190. a.fill-boxblack {
  191. display: block;
  192. height: 100%;
  193. width: 100%;
  194. }
  195.  
  196. #boxblack a:hover {
  197. background:{color:LogoHover};
  198. }
  199.  
  200. #boxred {
  201. transform:rotate(30deg);
  202. transform-origin: bottom left;
  203. display: inline-block;
  204. position: relative;
  205. bottom:20px;
  206. left:-127px;
  207. overflow: auto;
  208. padding:0px;
  209. width: 40px;
  210. height: 180px;
  211. background-color:#ef4723;
  212. z-index: 1;
  213. }
  214.  
  215. #boxred p {
  216. position: absolute;
  217. top: 50%;
  218. left: 50%;
  219. margin-right: -50%;
  220. transform: translate(-50%, -50%);
  221. }
  222.  
  223. a.fill-boxred {
  224. display: block;
  225. height: 100%;
  226. width: 100%;
  227. }
  228.  
  229. #boxred a:hover {
  230. background:{color:LogoHover};
  231. }
  232.  
  233. #description {
  234. position:fixed;
  235. left:70px;
  236. top:420px;
  237. overflow:auto;
  238. border:1px solid #eee;
  239. padding:5px;
  240. width:190px;
  241. }
  242.  
  243. #sidebarlinks {
  244. position:fixed;
  245. left:70px;
  246. top:390px;
  247. overflow:auto;
  248. text-align:center;
  249. padding:5px;
  250. width:190px;
  251. }
  252.  
  253. #pagination {
  254. position:fixed;
  255. left:70px;
  256. top:150px;
  257. overflow:auto;
  258. text-align:center;
  259. padding:5px;
  260. width:190px;
  261. margin-right:0px;
  262. margin-top:10px;
  263. font-size:12px;
  264. }
  265.  
  266. #entries {
  267. padding:10px;
  268. width:500px;
  269. margin-left:450px;
  270. margin-top:50px;
  271. margin-bottom:50px;
  272. }
  273.  
  274. #posts {
  275. width:500px;
  276. padding-bottom:20px;
  277. padding:10px;
  278. margin-top:50px;
  279. }
  280.  
  281. #info {
  282. text-transform: uppercase;
  283. border-top:1px solid #E6E6E6;
  284. width:500px;
  285. padding-top:2px;
  286. font-style:normal;
  287. text-align:left;
  288. margin-bottom:-8px;
  289. -moz-transition-duration:0.5s;
  290. -webkit-transition-duration:0.5s;
  291. -o-transition-duration:0.5s;
  292. }
  293.  
  294. .tags {
  295. width:500px;
  296. line-height:100%;
  297. text-align:left;
  298. padding-top:25px;
  299. margin-top:25px;
  300. text-transform: normal;
  301. -moz-transition-duration:0.5s;
  302. -webkit-transition-duration:0.5s;
  303. -o-transition-duration:0.5s;
  304. }
  305.  
  306. .notes {
  307. margin-top:20px;
  308. margin-left:-30px;
  309. text-align:left;
  310. line-height:10px;
  311. border-bottom:1px solid #D8D8D8;
  312. }
  313.  
  314. .notes li {
  315. list-style-type:none;
  316. padding:5px 0px;
  317. border-bottom:1px solid #eee;
  318. }
  319.  
  320. .notes li:last-of-type {
  321. border-bottom:0;
  322. }
  323.  
  324. .notes img {
  325. display:none!important;
  326. }
  327.  
  328. .quote {
  329. font-size:12px;
  330. font-family:helvetica;
  331. line-height:17px;
  332. margin-bottom:10px;
  333. font-weight:bold;
  334. }
  335.  
  336. .quotesource {
  337. margin-bottom:5px
  338. }
  339.  
  340. .user_1 .label {font-family:courier; font-size:11px; letter-spacing:-1px;}
  341. .user_2 .label {font-family:courier; font-size:11px; letter-spacing:-1px;}
  342. .user_3 .label {font-family:courier; font-size:11px; letter-spacing:-1px;}
  343. .user_4 .label {font-family:courier; font-size:11px; letter-spacing:-1px;}
  344. .user_5 .label {font-family:courier; font-size:11px; letter-spacing:-1px;}
  345. .user_6 .label {font-family:courier; font-size:11px; letter-spacing:-1px;}
  346. .chat li {list-style:none; margin-left:-38px; padding:2px; font-style: none; font-size: 9px; }
  347.  
  348. .audio {
  349. height:60px;
  350. margin-bottom:40px;
  351. }
  352.  
  353. .audio-album {
  354. position:absolute;
  355. width:80px;
  356. padding:3px;
  357. border:1px solid #E1E1E1;
  358. -webkit-transition: opacity 0.1s linear;
  359. opacity: 1;
  360. }
  361.  
  362. .audio-player {
  363. opacity:1;
  364. filter:alpha(opacity=90);
  365. width:25px;
  366. height:25px;
  367. overflow:hidden;
  368. position:absolute;
  369. border:30px;
  370. z-index:2;
  371. margin-left:33px;
  372. margin-top:33px;
  373. opacity:0;
  374. -webkit-transition: all 0.6s ease-out;
  375. -o-transition: all 0.6s ease-out;
  376. -webkit-transition: all 0.6s ease-out;
  377. -moz-transition: all 0.6s ease-out;
  378. }
  379.  
  380. .audio-info {
  381. margin-top:7px;
  382. position:relative;
  383. margin-left:100px;
  384. line-height:180%;
  385. padding:2px;
  386. }
  387.  
  388. .audio:hover .audio-player {
  389. opacity:.6;
  390. -webkit-transition: all 0.6s ease-out;
  391. -o-transition: all 0.6s ease-out;
  392. -webkit-transition: all 0.6s ease-out;
  393. -moz-transition: all 0.6s ease-out;
  394. }
  395.  
  396. #credit {
  397. float:right;
  398. position:fixed;
  399. bottom:5px;
  400. right:10px;
  401. padding:7px;
  402. font-size:8px;
  403. text-align:center;
  404. line-height:210%;
  405. text-transform:uppercase;
  406. }
  407.  
  408. #credit a{
  409. padding:7px;
  410. color:#A4A4A4;
  411. }
  412.  
  413. #credit a:hover{
  414. color:#fff;
  415. padding:7px;
  416. background-color:#fff;
  417. text-decoration: none;
  418. }
  419.  
  420. {CustomCSS}
  421. </style>
  422. </head>
  423.  
  424. <body>
  425.  
  426. <div id="sidebar">
  427.  
  428. <div id="pagination">
  429. {block:Pagination}
  430. {block:PreviousPage}
  431. <a href="{PreviousPage}" title="prev">⇍</a> ―
  432. {/block:PreviousPage}
  433.  
  434. {block:NextPage}
  435. <a href="{NextPage}" title="next"> ⇏</a>
  436. {/block:NextPage}
  437. {/block:Pagination}
  438. </div>
  439.  
  440. <div id="boxblue">
  441. <a href="/ask" class="fill-boxblue" title="ask"><p> </p></a>
  442. </div>
  443.  
  444. <div id="boxblack">
  445. <a href="/" class="fill-boxblack" title="home"><p> </p></a>
  446. </div>
  447.  
  448. <div id="boxred">
  449. <a href="/archive" class="fill-boxred" title="archive">
  450. <p> </p></a>
  451. </div>
  452.  
  453.  
  454. <div id="coolio">
  455. <div id="sidebarlinks">
  456. {block:ifLink1}
  457. <a href="{text:Link 1 URL}"><b>{text:Link 1}</b></a>
  458. {/block:ifLink1}
  459.  
  460. {block:ifLink2}
  461. &emsp;|&emsp;
  462. <a href="{text:Link 2 URL}"><b>{text:Link 2}</b></a>
  463. {/block:ifLink2}
  464.  
  465. {block:ifLink3}
  466. &emsp;|&emsp;
  467. <a href="{text:Link 3 URL}"><b>{text:Link 3}</b></a>
  468. {/block:ifLink3}
  469. </div>
  470.  
  471. <div id="description">
  472. {Description}
  473. </div>
  474. </div>
  475.  
  476. </div>
  477.  
  478.  
  479.  
  480. <div id="entries">{block:Posts}<div id="posts">
  481.  
  482. {block:Text}
  483. <h1>{block:Title}{Title}{/block:Title}</h1>
  484. {Body}
  485. {/block:Text}
  486.  
  487.  
  488. {block:Photo}
  489. {LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  490. {block:Caption}{Caption}{/block:Caption}
  491. {/block:Photo}
  492.  
  493.  
  494. {block:Photoset}
  495. {Photoset-500}
  496. {block:Caption}{Caption}{/block:Caption}
  497. {/block:Photoset}
  498.  
  499.  
  500. {block:Quote}
  501. <div class="quote">"{Quote}"</div>
  502. {block:Source} <div class="quotesource">—{Source}</div>{/block:Source}
  503. {/block:Quote}
  504.  
  505.  
  506. {block:Link}
  507. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  508. {block:Description}{Description}{/block:Description}
  509. {/block:Link}
  510.  
  511.  
  512. {block:Chat}
  513. <ul class="chat">{block:Title}{Title}{/block:Title}
  514. {block:Lines}<li class="user_{UserNumber}">
  515. {block:Label}<span class="label">{Label}</span>{/block:Label}
  516. &nbsp;{Line}</li>{/block:Lines}</ul>
  517. {/block:Chat}
  518.  
  519.  
  520. {block:Audio}
  521. <div class="audio">
  522. {block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}">{/block:AlbumArt}
  523. <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>
  524.  
  525. <div class="audio-info">
  526. {block:TrackName}<b>Title:</b> {TrackName}<BR>{/block:TrackName}
  527. {block:Artist}<b>Artist:</b> {Artist}<BR>{/block:Artist}
  528. {block:Album}<b>Album:</b> {Album}<BR>{/block:Album}
  529. {block:PlayCount}<b>Plays:</b> {PlayCount}<BR>{/block:PlayCount}
  530. </div></div>
  531. <div class="audiocaption">{block:Caption}{Caption}{/block:Caption}</div>
  532. <br>
  533. {/block:Audio}
  534.  
  535.  
  536. {block:Video}
  537. {Video-500}
  538. {block:Caption}{Caption}{/block:Caption}
  539. {/block:Video}
  540.  
  541.  
  542. {block:Answer}
  543. <span style="text-transform:uppercase;font-size:9px;font-style:italic;">— {Asker}: </span>
  544. {Question}<left> {Answer}
  545. {/block:Answer}
  546.  
  547.  
  548.  
  549. <div id="info">
  550. {block:RebloggedFrom}
  551. <a href="{ReblogURL}" target="_blank" title="reblog">↺</a> |
  552. {/block:RebloggedFrom}
  553.  
  554. <a href="{Permalink}" title="{DayOfWeekNumber} {ShortMonth} {Year} at {12Hour}:{Minutes} {CapitalAmPm}">{TimeAgo}</a>
  555.  
  556. {block:NoteCount}
  557. | <a href="{Permalink}" title="{NoteCountWithLabel}">{NoteCount}</a>
  558. {/block:NoteCount}
  559.  
  560. {block:RebloggedFrom} |
  561. <a href="{ReblogParentURL}" title="via {ReblogParentName}">via</a> |
  562. <a href="{ReblogRootURL}" title="src {ReblogRootName}">src</a>
  563. {/block:RebloggedFrom}
  564.  
  565.  
  566. {block:HasTags}<div id="tags">{block:Tags} #<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div></div>
  567.  
  568. {/block:Posts}
  569. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  570. {/block:Posts}</div></div></div>
  571.  
  572.  
  573. <div id="credit"><a href="http://amylilythemes.tumblr.com/themes">ALT</a></div></center>
  574.  
  575. </body>
  576. </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!