API tools faq
paste
Advertisement
Sebastianstnn

Theme 07: Poseidon

Sebastianstnn
Oct 13th, 2014
3,084
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.57 KB | None | 0 0
raw download clone embed print report
  1.  
  2.  
  3. <!-- Theme 07 by billieplper
  4. - don't steal
  5. - don't remove the credit
  6. - enjoy
  7. - ask me if you have questions-->
  8.  
  9. <!DOCTYPE html>
  10. <head>
  11.  
  12.  
  13. <title>{Title}</title>
  14.  
  15. <link rel="shortcut icon" href="{Favicon}">
  16. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  17. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  18.  
  19. <!--Default Variables-->
  20. <meta name="if:Background" content="1"/>
  21.  
  22. <meta name="color:Background" content="#ffffff"/>
  23. <meta name="color:Text" content="#aaaaaa"/>
  24. <meta name="color:Link" content="#000000"/>
  25. <meta name="color:hover" content="#ffffff"/>
  26. <meta name="color:titlehover" content="#4d4d4d"/>
  27. <meta name="color:accent" content="#b7b7b7"/>
  28. <meta name="color:scrollbar" content="#b7b7b7"/>
  29. <meta name="color:scrollbarthingy" content="#4d4d4d"/>
  30. <meta name="color:headerbackground" content="#ffffff"/>
  31.  
  32. <meta name="image:Background" content=""/>
  33.  
  34. <meta name="text:secondtitle" content=""/>
  35. <meta name="text:Link 1 URL" content="" />
  36. <meta name="text:Link 1" content="" />
  37. <meta name="text:Link 2 URL" content="" />
  38. <meta name="text:Link 2" content="" />
  39. <meta name="text:Link 3 URL" content="" />
  40. <meta name="text:Link 3" content="" />
  41. <meta name="text:Link 4 URL" content="" />
  42. <meta name="text:Link 4" content="" />
  43.  
  44.  
  45.  
  46. <!-- jquery for tooltips-->
  47.  
  48.  
  49. <link href='http://fonts.googleapis.com/css?family=Lato:300italic&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
  50.  
  51.  
  52. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  53.  
  54. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  55.  
  56. <script>
  57.  
  58. (function($){
  59.  
  60. $(document).ready(function(){
  61.  
  62. $("a[title]").style_my_tooltips({
  63.  
  64. tip_follows_cursor:true,
  65.  
  66. tip_delay_time:30,
  67.  
  68. tip_fade_speed:300,
  69.  
  70. attribute:"title"
  71.  
  72. });
  73.  
  74. });
  75.  
  76. })(jQuery);
  77.  
  78. </script>
  79.  
  80. <script>
  81. $(window).scroll(function() {
  82. var scrollTopVal = $(this).scrollTop();
  83. if ( scrollTopVal > 500 ) {
  84. $('#sidebar').css({'opacity':'1'});
  85.  
  86. } else {
  87. $('#sidebar').css({'opacity':'0'});
  88. }
  89. });
  90. </script>
  91.  
  92.  
  93.  
  94.  
  95. <!--CSS customization here. -->
  96.  
  97. <style type="text/css">
  98.  
  99. #s-m-t-tooltip{
  100. max-width:300px;
  101. z-index:10;
  102. margin:24px 14px 7px 12px;
  103. padding:6px;
  104. background:{color:accent};
  105. font-size:11px;
  106. color:#fff;
  107. }
  108.  
  109. ::selection {background-color:{color:accent};}
  110.  
  111. ::-webkit-scrollbar { width: 7px; height: 4px; }
  112. ::-webkit-scrollbar-button:start:decrement,
  113. ::-webkit-scrollbar-button:end:increment { height: 0px; display: block; background: #fff; }
  114. ::-webkit-scrollbar-track-piece { background: {color:scrollbar}; }
  115. ::-webkit-scrollbar-thumb {height: 50px; background-color:{color:scrollbarthingy} }
  116.  
  117.  
  118.  
  119. /*basics*/
  120. blockquote {padding:5px 0 5px 30px;
  121. border-left:1px solid {color:text};
  122. margin-left:30px;
  123. }
  124.  
  125. body {
  126. {block:IfNotBackground}
  127. background:{color:background};
  128. {/block:IfNotBackground}
  129. {block:IfBackground}
  130. background-image:url({image:Background});
  131. background-attachment: fixed;
  132. background-repeat: repeat;
  133. background-position:right;
  134. {/block:IfBackground}
  135. color:{color:text};
  136. font-family:calibri;
  137. font-size:10px;
  138. text-align:justify;
  139. margin:0;
  140. line-height:16px;}
  141.  
  142.  
  143. a {
  144. color:{color:link};
  145. text-decoration:none;
  146. -webkit-transition-duration: .6s;
  147. -moz-transition-duration: .6s;
  148. -o-transition-duration: .6s;
  149. }
  150.  
  151. a:hover {
  152. text-decoration:none;
  153. color:{color:hover};
  154. -webkit-transition-duration: .6s;
  155. -moz-transition-duration: .6s;
  156. -o-transition-duration: .6s;
  157. }
  158.  
  159. img{opacity:1;
  160. text-decoration:none}
  161.  
  162.  
  163. small {
  164. font-size:9px;}
  165.  
  166. big {
  167. font-size:12px;}
  168.  
  169.  
  170. #title {font-size:12px;
  171. line-height:18px;
  172. font-weight:bold;
  173. margin-bottom:10px;
  174. text-transform:uppercase;
  175. text-align:left;}
  176.  
  177.  
  178. /*header*/
  179. #header {text-align:center;
  180. position:static;
  181. margin-left:auto;
  182. margin-right:auto;
  183. width:250px;
  184. margin-top:100px;
  185. background-color:{color:headerbackground};
  186. padding:30px;
  187. }
  188.  
  189.  
  190.  
  191. #secondtitle {
  192. width:150px;
  193. margin-left:auto;
  194. margin-right:auto;
  195. background-color:{color:accent};
  196. color:#fff;
  197. padding:6px;
  198. font-size:19px;
  199. font-family: 'Lato', sans-serif;
  200. font-style:italic;
  201. text-transform:uppercase;
  202. letter-spacing:3px;
  203. word-spacing:5px;
  204. transition:0.6s ease;
  205. -o-transition:0.6s ease;
  206. -moz-transition:0.6s ease;
  207. -webkit-transition:0.6s ease;
  208. }
  209.  
  210.  
  211.  
  212. #secondtitle:hover {
  213. background-color:{color:titlehover};
  214. color:#fff;
  215. letter-spacing:6px;
  216. word-spacing:8px;
  217. transition:0.6s ease;
  218. -o-transition:0.6s ease;
  219. -moz-transition:0.6s ease;
  220. -webkit-transition:0.6s ease;
  221. }
  222.  
  223. #links {
  224. margin: 0px 5px 0px 5px;
  225. line-height:16px;
  226. padding:5px;
  227. text-transform:uppercase;
  228. transition:0.6s ease;
  229. -o-transition:0.6s ease;
  230. -moz-transition:0.6s ease;
  231. -webkit-transition:0.6s ease;
  232.  
  233. }
  234.  
  235.  
  236. #links a {
  237. margin-right:5px;
  238. display:inline-block;
  239. margin-bottom:4px;
  240. padding:4px;
  241. text-decoration:none;
  242. transition:0.6s ease;
  243. -o-transition:0.6s ease;
  244. -moz-transition:0.6s ease;
  245. -webkit-transition:0.6s ease;
  246. }
  247.  
  248. #links a:hover {
  249. text-decoration:none;
  250. color:{color:text};
  251. box-shadow: 3px 3px 5px {color:accent};
  252. transition:0.6s ease;
  253. -o-transition:0.6s ease;
  254. -moz-transition:0.6s ease;
  255. -webkit-transition:0.6s ease;
  256. }
  257.  
  258. #description {
  259. margin:20px 0;
  260. width:150px;
  261. margin-right:auto;
  262. margin-left:auto;
  263. border-bottom: 1px solid {color:accent};
  264. padding-bottom:23px;
  265. }
  266.  
  267. /*sidebar*/
  268.  
  269. #sidebar {
  270. background-color:{color:headerbackground};
  271. padding:20px;
  272. text-align:left;
  273. position:fixed;
  274. margin-left:-225px;
  275. margin-top:100px;
  276. width:125px;
  277. opacity:0;
  278. transition:0.6s ease;
  279. -o-transition:0.6s ease;
  280. -moz-transition:0.6s ease;
  281. -webkit-transition:0.6s ease;
  282. }
  283.  
  284.  
  285.  
  286. #links2 {
  287. line-height:16px;
  288. text-transform:uppercase;
  289. }
  290.  
  291.  
  292. #links2 a {
  293. margin-right:5px;
  294. display:inline-block;
  295. margin-bottom:5px;
  296. }
  297.  
  298. #links2 a:hover {
  299. background-color:{color:accent};
  300. letter-spacing:3px;
  301. }
  302.  
  303.  
  304. #desc {
  305. margin:20px 0;
  306. }
  307.  
  308. /*pagination*/
  309. #pagination {
  310. margin:50px 0;
  311. text-transform:uppercase;
  312. font-style:italic;
  313. font-family:'Lato', sans-serif;
  314. font-size:16px;
  315. letter-spacing:3px;
  316. margin-right:auto;
  317. margin-left:auto;
  318. text-align:center;
  319. }
  320. #pagination a {
  321. padding:0 15px;
  322. color:{color:link};
  323. word-spacing:5px;
  324. }
  325.  
  326. #pagination a:hover {
  327. color:{color:link};
  328. letter-spacing:6px;
  329. }
  330. /*container*/
  331. #con {
  332. left:50%;
  333. margin-left:-250px;
  334. position:absolute;
  335. }
  336.  
  337.  
  338.  
  339. /*posts*/
  340.  
  341. #entries {
  342. margin-top:75px;
  343. width:500px;
  344. position:relative;
  345.  
  346. }
  347.  
  348.  
  349.  
  350. #posts {
  351. border:1px solid #f3f3f3;
  352. padding:10px;
  353. margin-top:200px;
  354. width:500px;
  355. {block:IndexPage}
  356. margin-bottom:75px;
  357. {/block:IndexPage}
  358. {block:PermalinkPage}
  359. margin-bottom:50px;
  360. {/block:PermalinkPage}
  361. position:relative;
  362. background:rgba(255,255,255,0.2);
  363. }
  364. #posts img {
  365. max-width:500px;
  366.  
  367. }
  368.  
  369. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  370. .caption {width:100%;
  371. margin-top:10px;
  372.  
  373. }
  374.  
  375.  
  376.  
  377. /*quote*/
  378.  
  379. #titlequote{text-align:center;
  380. font-size:16px;
  381. line-height:18px;
  382. font-weight:bold;
  383. font-family: 'Lato', sans-serif;
  384. text-transform:uppercase;
  385. letter-spacing:3px;
  386. text-style:italic;
  387. }
  388. #source {
  389. margin-top:15px;
  390. margin-left:15px;
  391. text-align:center;
  392. }
  393.  
  394. /*audio*/
  395.  
  396. .player {
  397. width:25px;
  398. height:25px;
  399. overflow:hidden;
  400. position:absolute;
  401. background:white;}
  402.  
  403. .audioinfo {
  404. margin-left:50px;
  405. }
  406.  
  407.  
  408. /*asks*/
  409.  
  410.  
  411. .q {margin-bottom:10px;
  412. background-color:{color:accent};
  413. padding:20px;
  414. font-family:'Lato', sans-serif;
  415. font-size:14px;
  416. font-style:italic;
  417. }
  418. .as {
  419. font-weight:bold;}
  420.  
  421. .a {
  422. margin-top:10px;
  423. font-family: sans-serif,arial;
  424. font-size:12px;
  425. text-align:center;
  426. }
  427.  
  428.  
  429. /*chat*/
  430.  
  431. .chat ol {
  432. padding:0;
  433. list-style:none;
  434. }
  435. .line {padding:5px 0;}
  436.  
  437. .label {font-weight:bold;
  438. }
  439.  
  440.  
  441.  
  442.  
  443.  
  444. /*permalink and notes*/
  445.  
  446. #permalink {
  447. margin-top:15px;
  448. font-size:9px;
  449. text-transform:uppercase;
  450. }
  451. #permalink a {margin-right:10px;
  452. }
  453.  
  454.  
  455. .tags {
  456. word-break:break-all;
  457. font-size:9px;
  458. }
  459.  
  460. .pagenotes {
  461. {block:IndexPage}
  462. display: none!important;
  463. {/block:IndexPage}
  464. width:400px;
  465. text-align:left;
  466.  
  467. }
  468. .pagenotes img {
  469. display:none!important;}
  470. .pagenotes li {
  471. list-style-type:none;
  472. padding:5px 0px;
  473. text-align:left;
  474. margin:0 0 0 -40px;
  475. }
  476.  
  477. #posts:hover .perma_hold {opacity:1;}
  478. .perma_hold {
  479. width:520px;
  480. height:100%;
  481. top:0px;
  482. left:0px;
  483. position:absolute;
  484. opacity:0;
  485. z-index:9999;
  486. background:rgba(255,255,255,0.8);
  487. transition:0.6s ease;
  488. -o-transition:0.6s ease;
  489. -moz-transition:0.6s ease;
  490. -webkit-transition:0.6s ease;
  491. }
  492.  
  493. .perma {
  494. top:45%;
  495. position:relative;
  496. font-size:14px;
  497. font-weight:bold;
  498. text-align:center;
  499. text-transform:uppercase;
  500. font-family:calibri;
  501. }
  502.  
  503. .info a{margin:0px 3px;}
  504. .info {margin-top:10px;font-size:7px;letter-spacing:0.5px;}
  505. .tags a{margin:0px 3px;}
  506. .tags {
  507. font-weight:normal;
  508. margin-top:10px;
  509. text-transform:none;
  510. font-size:9px;
  511. font-style:italic;
  512. width:400px;
  513. margin-right:auto;
  514. margin-left:auto;
  515. }
  516.  
  517. #cred {
  518. position:fixed;
  519. font-family:arial;
  520. bottom:10px;
  521. right:15px;
  522. font-size:9px;
  523. padding:5px;
  524. color:{color:text};
  525. border:1px solid {color:accent};
  526. text-transform:lowercase;
  527. transition-duration: 0.8s;
  528. -moz-transition-duration: 0.8s;
  529. -webkit-transition-duration: 0.8s;
  530. -o-transition-duration: 0.8s;
  531.  
  532.  
  533.  
  534. }
  535.  
  536. #cred:hover {
  537. background-color:{color:accent};
  538. border: 1px solid {color:hover};
  539. transition-duration: 0.8s;
  540. -moz-transition-duration: 0.8s;
  541. -webkit-transition-duration: 0.8s;
  542. -o-transition-duration: 0.8s;
  543. }
  544.  
  545.  
  546.  
  547. {CustomCSS}
  548.  
  549.  
  550. </style>
  551.  
  552.  
  553.  
  554. </head>
  555.  
  556.  
  557.  
  558.  
  559.  
  560. <body>
  561.  
  562.  
  563. <div id="con">
  564.  
  565. <div id="sidebar">
  566. <div id="desc"> {Description} </div>
  567. <div class="links"> <p>{block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}</p>
  568. <p>{block:ifLink2}<a href="{text:Link 2 URL}" >{text:Link 2}</a>{/block:ifLink2}</p>
  569. <p>{block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a> {/block:ifLink3}</p>
  570. <p>{block:ifLink4}<a href="{text:Link 4 URL}">{text:Link 4}</a> {/block:ifLink4}</p> </div> </div>
  571.  
  572.  
  573.  
  574. <div id="header">
  575. <div id="secondtitle">{text:secondtitle}</div>
  576. <div id="description">{Description}</div>
  577. <div id="links">
  578. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  579. {block:ifLink2}<a href="{text:Link 2 URL}" >{text:Link 2}</a>{/block:ifLink2}
  580. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a> {/block:ifLink3}
  581. {block:ifLink4}<a href="{text:Link 4 URL}">{text:Link 4}</a> {/block:ifLink4}
  582.  
  583. </div>
  584.  
  585.  
  586.  
  587.  
  588. </div>
  589.  
  590.  
  591.  
  592.  
  593.  
  594.  
  595.  
  596.  
  597.  
  598.  
  599. <div id="entries">
  600.  
  601. {block:Posts}
  602. <div id="posts">
  603.  
  604. {block:IndexPage}
  605. <div class="perma_hold">
  606. <div class="perma">
  607. <a href="{Permalink}">{NoteCountWithLabel}</a>
  608. <div class="info">
  609. <a href="{ReblogURL}">reblog</a>
  610. <a href="{ReblogParentURL}" title="{ReblogParentURL}">via</a>
  611. <a href="{ReblogRootURL}" title="{ReblogRootURL}">source</a>
  612. </div>
  613. {block:HasTags}<div class="tags">{block:Tags}
  614. <a href="{TagURL}">#{Tag}</a>
  615. {/block:Tags}</div>{/block:HasTags}
  616. </div>
  617. </div>
  618. {/block:IndexPage}
  619.  
  620.  
  621. {block:Quote}
  622.  
  623.  
  624. <div id="titlequote">“{Quote}”</div>
  625. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  626. {/block:Quote}
  627.  
  628.  
  629.  
  630. {block:Text}
  631.  
  632. {block:Title}
  633. <div id="title">{Title}</div>{/block:Title}
  634. {Body}
  635. {/block:Text}
  636.  
  637. {block:Link}
  638. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  639. {/block:Link}
  640.  
  641. {block:Chat}
  642. {block:Title}
  643. <h1>{Title}</h1>
  644. {/block:Title}
  645. <div class="chat">
  646. <ol>{block:Lines}
  647. <li class="line {Alt}">
  648. {block:Label}
  649. <span class="label">
  650. {Label}</span>
  651. {/block:Label}{Line}</li>
  652. {/block:Lines}
  653. </ol></div>
  654. {/block:Chat}
  655.  
  656. {block:Photo}
  657. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}
  658. {/block:Photo}
  659.  
  660. <div class="photoset">{block:Photoset}
  661. {Photoset-500}
  662. {/block:Photoset}</div>
  663.  
  664. {block:Video}
  665. {Video-500}
  666. {/block:Video}
  667.  
  668. {block:Audio}
  669. <div class="player">{AudioPlayerWhite}</div>
  670. <div class="audioinfo">
  671. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  672. </div>
  673. {/block:Audio}
  674.  
  675. {block:Answer}
  676. <div class="q">
  677. <div class="as">{Asker} said: </div>
  678. {Question}</div>
  679. <div class="a">{Answer}</div>
  680. {/block:Answer}
  681.  
  682.  
  683.  
  684.  
  685. {block:PermalinkPage} <div id="permalink">
  686. <a href="{Permalink}" >{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}</a>
  687. </div>{/block:PermalinkPage}
  688.  
  689.  
  690.  
  691.  
  692. </div>
  693.  
  694.  
  695. {block:PostNotes}
  696. <div class="pagenotes">
  697. {PostNotes}
  698. </div>
  699. {/block:PostNotes}
  700.  
  701.  
  702. {/block:Posts}
  703.  
  704. <div id="pagination">
  705. {block:Pagination}
  706. {block:PreviousPage}
  707. <a href="{PreviousPage}">&larr; drown </a>
  708. {/block:PreviousPage}
  709.  
  710.  
  711. {block:NextPage}
  712. <a href="{NextPage}">swim &rarr;</a>
  713. {/block:NextPage}
  714. {/block:Pagination}
  715. </div>
  716.  
  717.  
  718.  
  719. </div>
  720.  
  721. </div>
  722.  
  723.  
  724. {block:ContentSource}
  725. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  726. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  727. {/block:SourceLogo}
  728. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  729. {/block:ContentSource}
  730.  
  731. <div id="cred">
  732. <a title="themesbyisa"href="http://themesbyisa.tumblr.com">isa</a>
  733. </div>
  734.  
  735. </body></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!