Advertisement
vassilias

Theme 05. Sea Legs

Mar 9th, 2015
5,938
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.41 KB | None | 0 0
  1. <!--Theme by Wren @ vassilias-->
  2.  
  3. <!DOCTYPE html>
  4. <head>
  5.  
  6.  
  7. <title>{Title}</title>
  8.  
  9. <link rel="shortcut icon" href="{Favicon}">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11. {block:Description}<mseta name="description" content="{MetaDescription}" />{/block:Description}
  12.  
  13. <!--Default Variables-->
  14.  
  15. <meta name="color:Background" content="#ffffff"/>
  16. <meta name="image:Header" content=""/>
  17. <meta name="color:Text" content="#000000"/>
  18. <meta name="color:Primary Accent Color" content="#fafafa"/>
  19. <meta name="color:Links Color" content="#000000"/>
  20. <meta name="color:Links Hover Color" content="#222222"/>
  21. <meta name="color:Header Links Color" content="#000000"/>
  22. <meta name="color:Header Links Hover Color" content="#fafafa"/>
  23. <meta name="color:Scrollbar" content="#f0f0f0" />
  24. <meta name="color:Scrollbar background" content="#fafafa" />
  25.  
  26.  
  27. <meta name="text:Link 1 URL" content="/" />
  28. <meta name="text:Link 1" content="HOME" />
  29. <meta name="text:Link 2 URL" content="/ask" />
  30. <meta name="text:Link 2" content="ASK" />
  31. <meta name="text:Link 3 URL" content="/" />
  32. <meta name="text:Link 3" content="ARCHIVE" />
  33. <meta name="text:Link 4 URL" content="" />
  34. <meta name="text:Link 4" content="" />
  35. <meta name="text:Link 5 URL" content="" />
  36. <meta name="text:Link 5" content="" />
  37.  
  38. <meta name="if:500px Width" content="1"/>
  39. <meta name="if:400px Width" content="0"/>
  40.  
  41.  
  42.  
  43. <!-- jquery for tooltips-->
  44. <link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
  45. <link href='http://fonts.googleapis.com/css?family=times' rel='stylesheet' type='text/css'>
  46.  
  47. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  48.  
  49. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  50.  
  51. <script>
  52.  
  53. (function($){
  54.  
  55. $(document).ready(function(){
  56.  
  57. $("a[title]").style_my_tooltips({
  58.  
  59. tip_follows_cursor:true,
  60.  
  61. tip_delay_time:30,
  62.  
  63. tip_fade_speed:300,
  64.  
  65. attribute:"title"
  66.  
  67. });
  68.  
  69. });
  70.  
  71. })(jQuery);
  72.  
  73. </script>
  74.  
  75.  
  76.  
  77. <link href='http://fonts.googleapis.com/css?family=Prata' rel='stylesheet' type='text/css'>
  78.  
  79.  
  80. <!--CSS customization here. -->
  81.  
  82. <style type="text/css">
  83.  
  84. #s-m-t-tooltip{
  85. position:absolute;
  86. z-index:999999999;
  87. font-family: times;
  88. font-size: 6px;
  89. letter-spacing: 1px;
  90. color: #fff;
  91. background:#000;
  92. padding: 3px 5px 3px 5px;
  93. text-transform: uppercase;
  94. }
  95.  
  96. ::-webkit-scrollbar {
  97. height: 8px;
  98. width: 8px;
  99. background: {color:Scrollbar background};
  100. }
  101.  
  102. ::-webkit-scrollbar-thumb {
  103. background: {color:Scrollbar};
  104. }
  105.  
  106. /*Basic Formatting*/
  107.  
  108. body {
  109. background:{color:Background};
  110. color:{color:text};
  111. font-family: times;
  112. font-size: 9px;
  113. margin: 0px;
  114. text-align: justify;
  115. line-height:20px;
  116. }
  117.  
  118. blockquote {
  119. padding: 15px;
  120. border-left: solid 1px #f0f0f0;
  121. margin-left: 20px;
  122. }
  123.  
  124. a {
  125. color: {color:Links Color};
  126. -webkit-transition: all 0.3s ease-out;
  127. -moz-transition: all 0.3s ease-out;
  128. -o-transition: all 0.3s ease-out;
  129. text-decoration: none;
  130. }
  131.  
  132. a:hover {
  133. text-decoration: none;
  134. color: {color:Links Hover Color};
  135. -webkit-transition: all 0.3s ease-out;
  136. -moz-transition: all 0.3s ease-out;
  137. -o-transition: all 0.3s ease-out;
  138. }
  139. img{
  140. opacity:1;
  141. border:none;
  142. text-decoration:none
  143. }
  144.  
  145. small {
  146. font-size:8px;
  147. }
  148.  
  149. big {
  150. font-size:12px;
  151. }
  152.  
  153.  
  154. /*Pagination*/
  155.  
  156. #pagination {
  157. margin:0px;
  158. text-transform:uppercase;
  159. font-family: times;
  160. font-size: 8px;
  161. letter-spacing: 1px;
  162. font-weight:bold;
  163. text-align: center;
  164. padding-bottom: 150px;
  165. }
  166.  
  167. #pagination a {
  168. padding: 5px;
  169. font-weight: none;
  170. text-transform:uppercase;
  171. font-size: 6px;
  172. letter-spacing: 1px;
  173. }
  174.  
  175. /*Cotainer*/
  176.  
  177. #con {
  178. left:50%;
  179. position:absolute;
  180. margin-left:-260px;
  181. }
  182.  
  183. /*Posts*/
  184.  
  185. #entries {
  186. {block:if500pxWidth}
  187. width:500px;
  188. margin-top:100px;
  189. margin-left:15px;
  190. {/block:if500pxWidth}
  191. {block:if400pxWidth}
  192. width:400px;
  193. margin-top:100px;
  194. margin-left: 65px;
  195. {/block:if400pxWidth}
  196. }
  197.  
  198. #posts {
  199. {block:if500pxWidth}width:500px;{/block:if500pxWidth}
  200. {block:if400pxWidth}width:400px;{/block:if400pxWidth}
  201. {block:IndexPage}
  202. margin-bottom:150px;
  203. {/block:IndexPage}
  204. {block:PermalinkPage}
  205. margin-bottom:100px;
  206. {/block:PermalinkPage}
  207. }
  208.  
  209. #posts img {
  210. {block:if500pxWidth}width:500px;{/block:if500pxWidth}
  211. {block:if400pxWidth}width:400px;{/block:if400pxWidth}
  212. }
  213.  
  214. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  215.  
  216. .caption {
  217. margin-top:5px;
  218. padding: 20px;
  219. background: {color:Primary Accent Color};
  220. }
  221.  
  222.  
  223. /*Quote*/
  224.  
  225. #titlequote{
  226. text-align:left;
  227. font-size:9px;
  228. font-style:italic;
  229. line-height:20px;
  230. font-weight:none;
  231. padding: 20px;
  232. background: {color:Primary Accent Color};
  233. }
  234.  
  235. #source {
  236. margin-top:10px;
  237. background: {color:Primary Accent Color};
  238. padding: 20px;
  239. }
  240.  
  241. /*Audio*/
  242.  
  243. .player {
  244. width:25px;
  245. margin-top:20px;
  246. background:#fff;
  247. height:25px;
  248. overflow:hidden;
  249. margin-left:10px;
  250. position:absolute;
  251. }
  252.  
  253. .audioinfo {
  254. margin-left:50px;
  255. padding: 20px;
  256. background:{color:Primary Accent Color};
  257. margin-bottom:10px;
  258. }
  259.  
  260. .song {
  261. font-weight:bold;
  262. }
  263.  
  264. /*Asks*/
  265.  
  266. .q {
  267. margin-bottom:10px;
  268. background:{color:Primary Accent Color};
  269. padding: 20px;
  270. }
  271.  
  272. .as {
  273. font-weight:bold;
  274. text-transform:uppercase;
  275. font-size: 7px;
  276. }
  277.  
  278. .as a {
  279. font-size: 7px;
  280. }
  281.  
  282. .a {
  283. margin-top:10px;
  284. background:{color:Primary Accent Color};
  285. padding: 20px;
  286. }
  287.  
  288.  
  289. /*Chat*/
  290.  
  291. .chat ol {
  292. padding:0;
  293. list-style:none;
  294. }
  295. .line {padding:5px 0;}
  296.  
  297. .label {font-weight:bold;
  298. }
  299.  
  300.  
  301. /* LINKS */
  302.  
  303. .links {
  304. color:{color: Header Links Color};
  305. text-align:center;
  306. font-size: 6px;
  307. letter-spacing: 1px;
  308. padding-bottom: 20px;
  309. }
  310.  
  311. .links a {
  312. color:{color: Header Links Hover Color};
  313. padding-left: 3px;
  314. padding-right: 3px;
  315. }
  316.  
  317. /*header*/
  318.  
  319. .hcont {
  320. background:#fff;
  321. margin-top: 100px;
  322. height: 310px;
  323. width: 400px;
  324. padding-top: 40px;
  325. margin-bottom: 100px;
  326. }
  327.  
  328. #header {
  329. margin-top: 20px;
  330. font-family: times;
  331. }
  332.  
  333. #blogt {
  334. font-family: times;
  335. text-transform: uppercase;
  336. width: 310px;
  337. color:{color:Text};
  338. text-align:center;
  339. padding: 40px 20px 20px 20px;
  340. }
  341.  
  342. #blogt a {
  343. color: {color:Links Color};
  344. font-family: times;
  345. font-weight: bold;
  346. text-align: center;
  347. font-size: 10px;
  348. line-height: 20px;
  349. letter-spacing: 1px;
  350. }
  351. #blogt a:hover {
  352. color: {color:Links Hover Color};
  353. text-decoration: none;
  354. }
  355.  
  356. #description {
  357. text-align: center;
  358. background: #fff;
  359. color: {color:Text};
  360. padding-top: 20px;
  361. padding-bottom: 30px;
  362. width: 260px;
  363. }
  364.  
  365. /*Permalink and Notes*/
  366.  
  367. #permalink {
  368. {block:IndexPage}
  369. opacity:0;
  370. {/block:IndexPage}
  371. margin-top:13px;
  372. padding-top: 10px;
  373. border-top: solid 1px #f6f6f6;
  374. font-size:6px;
  375. letter-spacing: 1px;
  376. text-align:center;
  377. text-transform:uppercase;
  378. -webkit-transition:all 1.0s;
  379. -moz-transition:all 1.0s;
  380. -ms-transition:all 1.0s;
  381. -o-transition:all 1.0s;
  382. transition:all 1.0s;
  383. }
  384.  
  385. #permalink a {
  386. display:inline-block;
  387. margin-right:5px;
  388. font-size:6px;
  389. letter-spacing: 1px;
  390. }
  391.  
  392. #posts:hover #permalink {
  393. opacity:1;-webkit-transition:all 1.0s;
  394. -moz-transition:all 1.0s;
  395. -ms-transition:all 1.0s;
  396. -o-transition:all 1.0s;
  397. transition:all 1.0s;
  398. }
  399.  
  400. .tags {
  401. {block:IndexPage}
  402. opacity:0;
  403. {/block:IndexPage}
  404. word-break:break-all;
  405. font-size:6px;
  406. text-transform: uppercase;
  407. margin-top:12px;
  408. padding-top: 10px;
  409. border-top: solid 1px {color:Primary Accent Color};
  410. -webkit-transition:all 1.0s;
  411. -moz-transition:all 1.0s;
  412. -ms-transition:all 1.0s;
  413. -o-transition:all 1.0s;
  414. transition:all 1.0s;
  415. }
  416.  
  417. #posts:hover .tags {
  418. opacity:1;-webkit-transition:all 1.0s;
  419. -moz-transition:all 1.0s;
  420. -ms-transition:all 1.0s;
  421. -o-transition:all 1.0s;
  422. transition:all 1.0s;
  423. }
  424.  
  425. .pagenotes {
  426. {block:IndexPage}
  427. display: none!important;
  428. {/block:IndexPage}
  429. {block:if500pxWidth}width:460px;{/block:if500pxWidth}
  430. {block:if400pxWidth}width:360px;{/block:if400pxWidth}
  431. text-align:left;
  432. font-size: 6px;
  433. letter-spacing: 1px;
  434. text-transform:uppercase;
  435. overflow-y:auto;
  436. height: 200px;
  437. padding: 20px;
  438. background: {color:Primary Accent Color};
  439. margin-bottom: 100px;
  440. }
  441. .pagenotes a {
  442. font-size: 6px;
  443. letter-spacing: 1px;
  444. text-transform:uppercase;
  445. font-weight: bold;
  446. }
  447. .pagenotes img {
  448. display:none!important;
  449. }
  450. .pagenotes li {
  451. list-style-type:none;
  452. padding:5px 0px;
  453. text-align:left;
  454. margin:0 0 0 -40px;
  455. }
  456.  
  457. /*Credit - DO NOT REMOVE */
  458.  
  459. .credit a {
  460. position: fixed;
  461. bottom: 0;
  462. right: 0;
  463. color: #000;
  464. padding: 15px;
  465. font-family: arial;
  466. font-size: 7px;
  467. letter-spacing: 1;
  468.  
  469. }
  470. .credit a:hover {
  471. text-decoration: none;
  472. }
  473.  
  474.  
  475. {CustomCSS}
  476.  
  477.  
  478. </style>
  479.  
  480.  
  481.  
  482. </head>
  483.  
  484. <body>
  485. <div class="credit"><a href="http://vassilias.tumblr.com" title="vassilias">&copy;</div></a>
  486.  
  487. <center>
  488. <div style="height:350px; width:1000px; background-image:url({image:Header});">
  489. <center>
  490. <div class="hcont">
  491. <div id="header">
  492. <center>
  493. <div id="blogt">
  494. <a href="/">{Title}</a>
  495. </div>
  496. </div>
  497.  
  498. <div class="links">
  499. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  500. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  501. <a href="{text:Link 3 URL}">{text:Link 3}</a>
  502. <a href="{text:Link 4 URL}">{text:Link 4}</a>
  503. <a href="{text:Link 5 URL}">{text:Link 5}</a>
  504. <a href="{text:Link 6 URL}">{text:Link 6}</a>
  505. </div>
  506.  
  507. <div style="text-align:center; font-size: 15px; font-weight: bold;">+</div>
  508.  
  509. <center>
  510. <div id="description">{Description}</div>
  511. </center>
  512. </div></center></div></center>
  513. <div style="margin-bottom: 120px;"></div>
  514.  
  515.  
  516. <div id="con">
  517. <div id="entries">
  518.  
  519. {block:Posts}
  520. <div id="posts">
  521.  
  522.  
  523. {block:Quote}
  524.  
  525.  
  526. <div id="titlequote">{Quote}</div>
  527. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  528. {/block:Quote}
  529.  
  530.  
  531.  
  532. {block:Text}
  533.  
  534. {block:Title}
  535. <div id="title">{Title}</div>{/block:Title}
  536. {Body}
  537. {/block:Text}
  538.  
  539. {block:Link}
  540. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  541. {/block:Link}
  542.  
  543. {block:Chat}
  544. {block:Title}
  545. <h1>{Title}</h1>
  546. {/block:Title}
  547. <div class="chat">
  548. <ol>{block:Lines}
  549. <li class="line {Alt}">
  550. {block:Label}
  551. <span class="label">
  552. {Label}</span>
  553. {/block:Label}{Line}</li>
  554. {/block:Lines}
  555. </ol></div>
  556. {/block:Chat}
  557.  
  558. {block:Photo}
  559. {LinkOpenTag}<img src="{block:if500pxWidth}{PhotoURL-500}{/block:if500pxWidth}{block:if400pxWidth}{PhotoURL-400}{/block:if400pxWidth}" alt="{PhotoAlt}"/>{LinkCloseTag}
  560. {/block:Photo}
  561.  
  562. {block:Photoset}
  563. {block:if500pxWidth}{Photoset-500}{/block:if500pxWidth}{block:if400pxWidth}{Photoset-400}{/block:if400pxWidth}
  564. {/block:Photoset}
  565.  
  566. {block:Video}
  567. {block:if500pxWidth}{Video-500}{/block:if500pxWidth}{block:if400pxWidth}{Video-400}{/block:if400pxWidth}
  568. {/block:Video}
  569.  
  570. {block:Audio}
  571. <div class="player">{AudioPlayer}</div>
  572. <div class="audioinfo">
  573. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  574. </div>
  575. {/block:Audio}
  576.  
  577. {block:Answer}
  578. <div class="q">
  579. <div class="as">{Asker} ASKED: </div>
  580. {Question}</div>
  581. <div class="a">{Answer}</div>
  582. {/block:Answer}
  583.  
  584. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  585.  
  586. {block:Date}
  587. <div id="permalink">
  588. <a href="{Permalink}" >{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}&nbsp;</a>{block:NoteCount}<a href="{Permalink}">{NoteCount} NOTES</a>&nbsp;{/block:NoteCount}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>&nbsp;{block:ContentSource}<a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:ContentSource}{/block:RebloggedFrom}{block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">{Tag}</a>&nbsp;{/block:Tags}</div>{/block:HasTags}
  589. </div>
  590. {/block:Date}
  591.  
  592.  
  593.  
  594. </div>
  595.  
  596.  
  597. {block:PostNotes}
  598. <div class="pagenotes">
  599. {PostNotes}
  600. </div>
  601. {/block:PostNotes}
  602.  
  603.  
  604. {/block:Posts}
  605.  
  606. {block:Pagination}
  607. <div id="pagination">
  608. {block:PreviousPage}
  609. <a href="{PreviousPage}">previous</a>
  610. {/block:PreviousPage}
  611.  
  612. {block:JumpPagination length="5"}
  613. {block:CurrentPage}
  614. <span class="current_page">{PageNumber}</span>
  615. {/block:CurrentPage}
  616.  
  617. {block:JumpPage}
  618. <a class="jump_page" href="{URL}">{PageNumber}</a>
  619. {/block:JumpPage}
  620. {/block:JumpPagination}
  621.  
  622. {block:NextPage}
  623. <a href="{NextPage}">next</a>
  624. {/block:NextPage}
  625. </div>
  626. {/block:Pagination}
  627.  
  628.  
  629.  
  630. </div>
  631.  
  632. </div>
  633.  
  634.  
  635. {block:ContentSource}
  636. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  637. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  638. {/block:SourceLogo}
  639. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  640. {/block:ContentSource}
  641.  
  642. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement