API tools faq
paste
dracarysthemes

Livin' on the Edge Theme

dracarysthemes
Dec 8th, 2013
467
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.33 KB | None | 0 0
raw download clone embed print report
  1.  
  2.  
  3.  
  4.  
  5.  
  6. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  7.  
  8. <html>
  9. <head>
  10.  
  11.  
  12. <!--
  13. Livin' on the Edge Theme by Westerus for DracarysThemes
  14. Let me know if you need any help with the code
  15.  
  16. DO NOT REDISTRIBUTE
  17.  
  18. Please keep the credit somewhere
  19. http://westerus.tumblr.com/
  20.  
  21. -->
  22.  
  23.  
  24.  
  25.  
  26.  
  27.  
  28. <meta name="color:Background" content="#cccccc" />
  29. <meta name="color:Links" content="#000" />
  30. <meta name="color:Primary Colour" content="#03999b" />
  31. <meta name="color:Secondary Colour" content="#4cc3c5" />
  32. <meta name="font:Body" content="Cambria" />
  33. <meta name="image:Left Background" content=""/>
  34. <meta name="image:Right Background" content="" />
  35. <meta name="if:Infinite Scroll" content="0">
  36. <meta name="if:Rounded Borders" content="">
  37. <meta name="if:Posts Borders" content="">
  38. <meta name="if:Custom Font" content="">
  39. <meta name="if:Custom Font Text" content="">
  40.  
  41. <meta name="text:Link1 Url" content="/" />
  42. <meta name="text:Link1 Title" content="Link 1" />
  43. <meta name="text:Link2 Url" content="/" />
  44. <meta name="text:Link2 Title" content="Link 2" />
  45. <meta name="text:Link3 Url" content="/" />
  46. <meta name="text:Link3 Title" content="Link 3" />
  47. <meta name="text:Link4 Url" content="/" />
  48. <meta name="text:Link4 Title" content="Link 4" />
  49.  
  50.  
  51.  
  52.  
  53.  
  54. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  55. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  56. <link rel="shortcut icon" href="{Favicon}" />
  57.  
  58. <!--Custom font-->
  59.  
  60. <link href='http://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css'>
  61. <link href='http://fonts.googleapis.com/css?family=MedievalSharp' rel='stylesheet' type='text/css'>
  62. <link href='http://fonts.googleapis.com/css?family=Grand+Hotel' rel='stylesheet' type='text/css'>
  63.  
  64.  
  65. <style type="text/css">
  66.  
  67.  
  68.  
  69.  
  70.  
  71.  
  72.  
  73. body {
  74. background-color: {color:Background};
  75. font-family: {font:Body};
  76. background-image: url({image:Left Background}), url({image:Right Background});
  77. background-attachment:fixed;
  78. background-size: 400px, 600px;
  79. background-repeat:no-repeat, no-repeat;
  80. background-position:bottom 0px left 40px, bottom 0px right -50px;
  81. margin: 0;
  82. word-wrap: break-word;
  83. font-family:cambria;
  84. font-size:11px;
  85. }
  86.  
  87.  
  88.  
  89. #sidebar {
  90. background-color: white;
  91. width: 260px;
  92. position: fixed;
  93. top: 150px;
  94. left: 120px;
  95. }
  96.  
  97. #links {width:160px;
  98. background-color:transparent;
  99. display:inline-block;
  100. padding:5px;
  101. margin-bottom:-90px;
  102. margin-top:-10px;
  103. margin-left:60px;
  104. text-decoration:none;
  105. float:left;
  106. text-align:left;
  107. font-size:20px;
  108. font-family:cambria;
  109. -moz-transition: .5s linear;
  110. -webkit-transition: .5s linear;
  111. -o-transition:.5s linear;
  112. transition: .5s linear;}
  113.  
  114. #links a {
  115. text-decoration:none;
  116. margin-left:10px;
  117. color:{color:Links};
  118. }
  119.  
  120. #links a:hover {
  121. -moz-transition: .5s linear;
  122. -webkit-transition: .5s linear;
  123. -o-transition:.5s linear;
  124. transition: .5s linear;
  125. }
  126.  
  127.  
  128.  
  129.  
  130. #sidebar .title {
  131. {block:ifcustomfont}
  132. font-family: 'Great Vibes';
  133. {/block:ifcustomfont}
  134. text-decoration:none;
  135. border-bottom:2px;
  136. font-size: 27px;
  137. margin-bottom:-280px;
  138. margin-left:-10px;
  139. text-align: center;
  140. padding: 13px;
  141. }
  142.  
  143. #sidebar .title a {
  144. color: {color:Primary Colour};
  145. text-decoration: none;
  146. }
  147.  
  148. #sidebar .title a:hover {
  149. color: {color:Secondary Colour};
  150. text-decoration:none;
  151. }
  152.  
  153.  
  154.  
  155.  
  156.  
  157. #sidebar .description {
  158. color: black;
  159. font-size: 11px;
  160. text-align: left;
  161. font-style:italic;
  162. padding:10px;
  163. margin-bottom:10px;
  164. margin-top:250px;
  165. line-height:100%;
  166.  
  167. }
  168.  
  169. #sidebar .description a {
  170. color: {color:Primary Colour};
  171. text-decoration: none;
  172. }
  173.  
  174. #sidebar .description a:hover {
  175. color: {color:Secondary Colour};
  176. }
  177.  
  178.  
  179.  
  180. #content {
  181. width:250px;
  182. {block:if300pxposts}
  183. width:300px;
  184. {/block:if300pxposts}
  185.  
  186. background-color: rgba(255, 255, 255, 0.4);
  187. margin: 0px 0 0px 400px;
  188. padding: 20px 10px;
  189. color: black;
  190. }
  191.  
  192.  
  193.  
  194. #content a {
  195. color: {color:Primary Colour};
  196. text-decoration: none;
  197. }
  198.  
  199. #content a:hover {
  200. color: {color:Secondary Colour};
  201. }
  202.  
  203. #content blockquote {
  204. border-left: solid 2px black;
  205. margin: 0;
  206. padding-left: 10px;
  207. }
  208.  
  209. img {
  210. margin-bottom:-7px;
  211. max-width: 100%;
  212. {block:ifroundedborders}
  213. border-radius:10px;
  214. {/block:ifroundedborders}
  215. }
  216.  
  217. #content
  218. #posts {
  219. background-color: white;
  220. {block:if300pxposts}
  221. width:300px;
  222. {/block:if300pxposts}
  223. width:250px;
  224. margin:0 auto 20px;
  225. margin-bottom:3px;
  226. margin-top:0px;
  227. padding:10px;
  228. padding:4px;
  229. {block:ifpostsborders}
  230. border:1px #aaa dotted;
  231. {/block:ifpostsborders}
  232. }
  233.  
  234. #content #posts .perma a{
  235. color:;}
  236.  
  237. .permalink {
  238. display: block;
  239. border-top: 1px solid #ddd;
  240. padding: 3px;
  241. margin: 4px 8px 0px 8px;
  242. font-family: cambria;
  243. font-size: 8px;
  244. color: #424242;
  245. line-height: 18px;
  246. text-align: center;
  247. text-decoration: none;
  248. -webkit-transition: color 0.9s ease-out;
  249. -moz-transition: color 0.9s ease-out;
  250. }
  251.  
  252. #content #posts .perma a{
  253. color:;
  254. -webkit-transition: color 0.9s ease-out;
  255. -moz-transition: color 0.9s ease-out;
  256. }
  257.  
  258.  
  259. #content #posts .perma{
  260. width:240px;
  261. {block:if300pxposts}
  262. width:300px;
  263. {/block:if300pxposts}
  264. height: 5px;
  265. font-family:cambria;
  266. font-size: 10px;
  267. text-transform:lowercase;
  268. position: absolute;
  269. line-height: 5px;
  270. text-align: center;
  271. overflow:hidden;
  272. opacity: 0.0;
  273. background-color:white;
  274. letter-spacing:0px;
  275. margin-top:160px;
  276. padding-bottom:1px;
  277. padding:3px;padding:5px;
  278. border-radius: 0px;
  279. -webkit-transition: opacity 0.5s linear; opacity: 0.0;
  280. -webkit-transition: all 0.5s linear;
  281. -moz-transition: all 0.5s linear;
  282. transition: all 0.5s linear;
  283. }
  284.  
  285. #content #posts:hover .perma{
  286. overflow:hidden;
  287. margin-top:160px;
  288. border-top-right-radius: 0px;
  289. border-bottom-left-radius: 0px;
  290. -webkit-transition: all 0.5s linear; opacity: 1;
  291. -webkit-transition: all 0.5s linear;
  292. -moz-transition: all 0.5s linear;
  293. transition: all 0.5s linear;
  294. }
  295. .permalinktext {
  296. width:80px;
  297. height: 70px;
  298. font-family:times;
  299. font-size: 10px;
  300. text-transform:uppercase;
  301. position: absolute;
  302. line-height: 15px;
  303. text-align: left;
  304. overflow:hidden;
  305. opacity: 0.0;
  306. background-color:#transparent;
  307. letter-spacing:0px;
  308. margin-top:-80px;
  309. margin-left:230px;
  310. padding-bottom:1px;
  311. padding:3px;padding:5px;
  312. border-radius: 20px;
  313. -webkit-transition: opacity 0.5s linear; opacity: 0.0;
  314. -webkit-transition: all 0.5s linear;
  315. -moz-transition: all 0.5s linear;
  316. transition: all 0.5s linear;
  317. }
  318.  
  319. #content #posts:hover .permalinktext{
  320. overflow:hidden;
  321. height:70px;
  322. margin-top:-80px;
  323. margin-left:260px;
  324. border-top-right-radius: 20px;
  325. border-bottom-left-radius: 20px;
  326. -webkit-transition: all 0.5s linear; opacity: 1;
  327. -webkit-transition: all 0.5s linear;
  328. -moz-transition: all 0.5s linear;
  329. transition: all 0.5s linear;
  330. }
  331. #content #posts .permtext{
  332. width:400px;
  333. }
  334.  
  335.  
  336.  
  337.  
  338. #content #posts .title {
  339. {block:ifcustomfonttext}
  340. font-size: 18px;
  341. font-family:'Great Vibes',cursive;
  342. {/block:ifcustomfonttext}
  343. font-size:18px;
  344. {block:ifnotcustomfonttext}
  345. font-size:14px;
  346. {/block:ifnotcustomfonttext}
  347. }
  348.  
  349. #content #posts .text {
  350. font-size:11px;
  351. font-family:cambria;
  352. }
  353.  
  354. #content #posts #permalink {
  355. font-size:9px;
  356. margin-top:10px;
  357.  
  358.  
  359. #content #posts #tags {
  360. font-size:9px;
  361. }
  362.  
  363. #content #posts #tags .comma:last-child {
  364. display: none;
  365. }
  366.  
  367.  
  368.  
  369. #content #notecontainer {
  370. margin: 20px auto;
  371. width: 500px;
  372. font-size: 11px;
  373. }
  374.  
  375. #content #notecontainer ol.notes {
  376. list-style-type: none;
  377. margin: 0;
  378. padding: 0;
  379. }
  380.  
  381. #content #notecontainer img.avatar {
  382. margin-right: 10px;
  383. width: 16px;
  384. height: 16px;
  385. }
  386.  
  387. #sidebar .pagination {
  388. width: 260px;
  389. text-align: center;
  390. padding: 3px 0;
  391. }
  392.  
  393. #sidebar .pagination a {
  394. color: {color:Primary Colour};
  395. text-decoration: none;
  396. }
  397.  
  398. #sidebar .pagination a:hover {
  399. color: {color:Secondary Colour};
  400. }
  401.  
  402.  
  403.  
  404.  
  405.  
  406.  
  407.  
  408.  
  409. </style>
  410.  
  411. {block:IfInfiniteScroll}
  412. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  413. {/block:IfInfiniteScroll}
  414.  
  415.  
  416.  
  417. </head>
  418. <body>
  419.  
  420.  
  421.  
  422.  
  423.  
  424.  
  425.  
  426.  
  427.  
  428.  
  429.  
  430. <div id="sidebar">
  431. <div class="title"><a href="/">{Title}</a></div>
  432. <div class="description">{Description}</div>
  433. <div id="links"><a href="{text:Link1 Url}" title="{text:Link1 Title}">I</a> <a href="{text:Link2 Url}" title="{text:Link2 Title}">II</a></a>
  434. <a href="{text:Link3 Url}" title="{text:Link3 Title}">III</a>
  435. <a href="{text:Link4 Url}" title="{text:Link4 Title}">IV</a>
  436. </div>
  437. </div>
  438.  
  439.  
  440. </div>
  441.  
  442.  
  443.  
  444.  
  445.  
  446. {block:IfNotInfiniteScroll}
  447. <div class="pagination">
  448. {block:PreviousPage}<a href="{PreviousPage}">« </a>{/block:PreviousPage}
  449. {block:NextPage}<a href="{NextPage}"> »</a>{/block:NextPage}
  450. </div>
  451. {/block:IfNotInfiniteScroll}
  452.  
  453.  
  454.  
  455. </div> <!--sidebar-->
  456.  
  457. <div id="content">
  458.  
  459. <div class="autopagerize_page_element">
  460.  
  461.  
  462.  
  463.  
  464.  
  465. {block:Posts}
  466.  
  467.  
  468.  
  469. <div id="posts">
  470.  
  471.  
  472.  
  473.  
  474.  
  475. {block:Photo}{block:IndexPage}
  476. <div class="perma">
  477. <a href="{permalink}">{NoteCountWithLabel}</a> / <a href="{ReblogURL}" target="_blank"> reblog </a></span></div>
  478. {/block:IndexPage}
  479. {block:IndexPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width=300px /></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<div class="permtext"><img src="{PhotoURL-500}" alt="{PhotoAlt}"width=400px/>{LinkCloseTag}{block:Caption}<br><div id="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
  480. {/block:Photo}
  481.  
  482. {block:Video}
  483. {Video-250}
  484. {block:Caption}{Caption}{/block:Caption}
  485. <div class="permalinktext"> <a href="{Permalink}">{TimeAgo}</a><br>
  486. <a href="{Permalink}">{NotecountWithLabel}</a><br>
  487. <a href="{ReblogURL}" target="_blank">reblog</a></div>
  488. {/block:Video}
  489.  
  490. {block:Audio}
  491. {AudioPlayer}
  492. <br />{PlayCountWithLabel}
  493. {block:Caption}<br />{Caption}{/block:Caption}
  494. <div class="permalinktext"><a href="{Permalink}">{NoteCountWithLabel}</a> · <a href="{Permalink}">{DayofMonth} {ShortMonth}</a></span></a></div>
  495. {/block:Audio}
  496.  
  497. {block:Quote}
  498. <div class="title">{Quote}</div>
  499. <div class="permalinktext"> <a href="{Permalink}">{TimeAgo}</a><br>
  500. <a href="{Permalink}">{NotecountWithLabel}</a><br>
  501. <a href="{ReblogURL}" target="_blank">reblog</a></div>
  502. {/block:Quote}
  503.  
  504. {block:Photoset}
  505. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  506. {block:PermalinkPage}{PhotoSet-700}{/block:PermalinkPage}
  507. <div class="permalinktext"><a href="{ReblogUrl}">reblog</a><br><a href="{permalink}">{NoteCountwithLabel}</a></div>
  508. {/block:Photoset}
  509.  
  510. {block:Text}
  511. {block:Title}<center><span class="title">{Title}</span></center>{/block:Title}
  512. <div style="margin-bottom:-10px"></div>
  513. <span class="text">{Body}</span>
  514. <div class="permalinktext"> <a href="{Permalink}">{TimeAgo}</a><br>
  515. <a href="{Permalink}">{NotecountWithLabel}</a><br>
  516. <a href="{ReblogURL}" target="_blank">reblog</a></div>
  517. {/block:Text}
  518.  
  519. {block:Answer}
  520. <div style="border-bottom:1px #aaa solid; padding:2px; font-size:11px"><div class="ask"><i><b>{Asker}:</b></i><i> {Question}</i></div></div>
  521. <div class="answer">{Answer}</div>
  522. {block:IndexPage}
  523. <div class="permalinktext">
  524. <a href="{Permalink}">{TimeAgo}</a><br>
  525. <a href="{Permalink}">{NotecountWithLabel}</a><br>
  526. <a href="{ReblogURL}" target="_blank"></a></div>
  527. {/block:IndexPage}
  528. {/block:Answer}
  529.  
  530. {block:Chat}
  531. {block:Title}{Title}<br />{/block:Title}
  532. {block:Lines}
  533. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br />
  534. {/block:Lines}
  535.  
  536. {/block:Chat}
  537.  
  538. {block:Link}
  539. <a style="font-family:'Grand Hotel'; font-size:16px" href="{URL}" >{Name}</a>
  540. {block:Description}<br />{Description}{/block:Description}
  541. <div class="permalinktext"> <a href="{Permalink}">{TimeAgo}</a><br>
  542. <a href="{Permalink}">{NotecountWithLabel}</a><br>
  543. <a href="{ReblogURL}" target="_blank">reblog</a></div>
  544. {/block:Link}
  545.  
  546.  
  547. <div id="permalink">
  548. <a href="{Permalink}">
  549.  
  550.  
  551. </a>
  552. </div>
  553.  
  554. {block:HasTags}<div id="tags">
  555. {block:Tags}
  556.  
  557. {/block:Tags}
  558. </div>
  559. {/block:HasTags}
  560.  
  561. </div>
  562.  
  563.  
  564. {block:PostNotes}
  565. {PostNotes}
  566. {/block:PostNotes}
  567.  
  568.  
  569.  
  570.  
  571.  
  572. {/block:Posts}
  573. </div>
  574.  
  575. </body>
  576. <div style="position:fixed;bottom:10px;right:10px;">
  577. <a style="color:grey" href="http://westerus.tumblr.com/">theme</a>
  578. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!