pjo06

Theme #005 - Thelma

Aug 24th, 2015
1,531
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.74 KB | None | 0 0
  1. <!--THEME BY LAURAHOLLIIS ~ DO NOT REMOVE CREDIT-->
  2. <!--TH5 - thelma-->
  3. <!--w/ scroll down-->
  4.  
  5.  
  6. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  7. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  8. <head><title>{Title}</title>
  9. <link rel="shortcut icon" href="{Favicon}">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  12.  
  13. <!--TEST BLOG 4-->
  14.  
  15. <meta name="color:bg" content="#ffffff" />
  16. <meta name="color:text" content="#5a5a5a" />
  17. <meta name="color:link" content="#5a5a5a" />
  18. <meta name="color:link hover" content="#5a5a5a" />
  19. <meta name="color:gray out" content="#e5e5e5"/>
  20. <meta name="color:graybg" content="#f4f4f4"/>
  21. <meta name="color:Scrollbar" content="#df1f3a">
  22.  
  23.  
  24. <meta name="image:Sidebar" content=""/>
  25. <meta name="text:link1" content="" />
  26. <meta name="text:link 1 URL" content="/" />
  27. <meta name="text:link2" content="" />
  28. <meta name="text:link 2 URL" content="/" />
  29.  
  30.  
  31.  
  32.  
  33. <!--START-->
  34.  
  35. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  36.  
  37. <link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
  38.  
  39. <!--TOOLTIPS-->
  40. <link href="http://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  41. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  42. <script src="http://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  43. <script>
  44. (function($){
  45. $(document).ready(function(){
  46. $("[title]").style_my_tooltips({
  47. tip_follows_cursor:true,
  48. tip_delay_time:200,
  49. tip_fade_speed:300
  50. });
  51. });
  52. })(jQuery);
  53. </script>
  54.  
  55.  
  56.  
  57. <style type="text/css">
  58.  
  59. ::-webkit-scrollbar-thumb:vertical {background-color:{color:Scrollbar};height:5px;}
  60. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:Scrollbar};height:5px!important;}
  61. ::-webkit-scrollbar {background-color:{color:Background};height:5px;width:6px;}
  62.  
  63.  
  64. #s-m-t-tooltip {
  65. max-width:300px;
  66. margin:15px;
  67. padding:3px;
  68. border:1px solid {color:gray out};
  69. border-radius:0px;
  70. background:white;
  71. color:{color:text};
  72. z-index:999999;
  73. font-size:7px;
  74. font-style:none;
  75. font-weight:lighter;
  76. letter-spacing:1px;
  77. font-family:trebuchet ms;
  78. text-transform:uppercase;
  79. box-shadow:1px 1px 3px rgba(0,0,0,.0);
  80. }
  81.  
  82.  
  83.  
  84. body {
  85. font-family:calibri;
  86. font-size:11px;
  87. color:{color:text};
  88. background-color:{color:bg};
  89. }
  90.  
  91. #entry {
  92. margin-bottom:80px;
  93. margin-top:80px;
  94. margin-left:5px;
  95. }
  96.  
  97.  
  98. #posts {
  99. width:500px;
  100. margin-left:560px;
  101. margin-bottom:90px;
  102. {block:PermalinkPage}
  103. margin-bottom:30px;
  104. {/block:PermalinkPage}
  105. }
  106.  
  107.  
  108. a {
  109. text-decoration:none;
  110. color:{color:link};
  111. }
  112.  
  113. a:hover {
  114. text-decoration:underline;
  115. color:{color:link hover};
  116.  
  117. }
  118.  
  119.  
  120.  
  121.  
  122. /*SIDEBAR*/
  123.  
  124. #sidebar {
  125. width:245px;
  126. position:fixed;
  127. margin-left:190px;
  128. margin-top:80px;
  129. }
  130.  
  131. #sidebarimg {
  132. width:245px;
  133. text-align:center;
  134.  
  135. }
  136.  
  137. #sidebarimg img {
  138. width:245px;
  139. }
  140.  
  141.  
  142.  
  143. #description {
  144. width: 180px;
  145. text-align:justify;
  146. margin-top:15px;
  147. margin-left:30px;
  148. background-color:white;
  149. padding-bottom:15px;
  150. margin-bottom:-10px;
  151. }
  152.  
  153. .linkscaret {
  154. position:relative;
  155. opacity:1;
  156. color:#232323;
  157. text-align:center;
  158. margin-top:10px;
  159. width:180px;
  160. padding-bottom:2px;
  161. border:1px solid {color:gray out};
  162. margin-left:30px;
  163. background-color:{color:graybg};
  164. }
  165.  
  166.  
  167.  
  168. #caret {
  169. opacity:.5;
  170. -moz-transition-duration: 0.4s;
  171. -o-transition-duration: 0.4s;
  172. -webkit-transition-duration: 0.4s;
  173. transition-duration: 0.4s;
  174. }
  175.  
  176. #linksdown1 {
  177. position:relative;
  178. }
  179.  
  180. #linksdown1:hover #caret{
  181. -moz-transform: rotate(180deg);
  182. -webkit-transform: rotate(180deg);
  183. -o-transform: rotate(180deg);
  184. transform: rotate(180deg);
  185.  
  186. -moz-transition-duration: 0.6s;
  187. -o-transition-duration: 0.6s;
  188. -webkit-transition-duration: 0.6s;
  189. transition-duration: 0.6s;
  190. }
  191.  
  192. #linksdown1:hover #linksdown2 {
  193. margin-top:0px;
  194. visibility:visible;
  195. position:relative;
  196. z-index:0;
  197. -moz-transition-duration: 0.4s ease-in-out;
  198. -o-transition-duration: 0.4s ease-in-out;
  199. -webkit-transition-duration: 0.4s ease-in-out;
  200. transition-duration: 0.4s ease-in-out;
  201. }
  202.  
  203. #linksdown2 {
  204. /*margin-top:60px;*/
  205. margin-top:-54px;
  206. position:relative;
  207. z-index:-6;
  208. visibility:visible;
  209. -moz-transition-duration: 0.4s ;
  210. -o-transition-duration: 0.4s;
  211. -webkit-transition-duration: 0.4s;
  212. transition-duration: 0.4s;
  213. }
  214.  
  215. #sidecover {
  216. width:245px;
  217. height:80px;
  218. background-color:white;
  219. position:absolute;
  220. z-index:-5;
  221. margin-top:-50px;
  222. }
  223.  
  224. .sidelinks {
  225. text-align:center;
  226. width:245px;
  227. word-spacing:2px;
  228. text-transform:uppercase;
  229. font-size:8px;
  230. margin-top:4px;
  231. /*margin-top:8px;*/
  232. margin-left:-2px;
  233. margin-bottom:0px;
  234. font-family:trebuchet ms;
  235. }
  236.  
  237.  
  238.  
  239. .sidelinks a {
  240. text-align:center;
  241. color:#232323;
  242. display:inline-block;
  243. width:75px;
  244. background-color:{color:graybg};
  245. border: 1px solid {color:gray out};
  246. padding:5px;
  247. margin:2px 0px 2px 0px;
  248. }
  249.  
  250. .sidelinks a:hover {
  251. text-decoration:none;
  252.  
  253. }
  254.  
  255. #pagination {
  256. text-align:center;
  257. word-spacing:2px;
  258. text-transform:uppercase;
  259. font-size:13px;
  260. margin-top:15px;
  261. font-family:arial;
  262. position:relative;
  263. -moz-transition-duration: 0.4s ;
  264. -o-transition-duration: 0.4s;
  265. -webkit-transition-duration: 0.4s;
  266. transition-duration: 0.4s;
  267. }
  268.  
  269. #pagination a:hover {
  270. text-decoration:none;
  271. }
  272.  
  273.  
  274.  
  275.  
  276. #quote {
  277. font-style:italic;
  278. font-family:lato;
  279. font-size: 17px;
  280. }
  281.  
  282. .source {
  283. font-style:italic;
  284. }
  285.  
  286. .title {
  287. font-family:lato;
  288. font-size:17px;
  289. font-style:italic;
  290. }
  291.  
  292. .linkname {
  293. font-size:18px;
  294. font-style:italic;
  295. font-family:lato;
  296. }
  297.  
  298.  
  299. /*AUDIO*/
  300.  
  301. #albumart {
  302. position:absolute;
  303. z-index:999;
  304. margin-top:25px;
  305. margin-left:25px;
  306. }
  307.  
  308. .playbox {
  309. background-color:#fafafa;
  310. position:absolute;
  311. margin-left:61.5px;
  312. margin-top:61.5px;
  313. width:27px;
  314. height:27px;
  315. z-index:1000;
  316. opacity:.5;
  317. }
  318.  
  319. .playbutton {
  320. width: 27px;
  321. height: 27px;
  322. overflow: hidden;
  323. position: absolute;
  324. opacity:.5;
  325. -moz-transition-duration: 0.4s;
  326. -o-transition-duration: 0.4s;
  327. -webkit-transition-duration: 0.4s;
  328. transition-duration: 0.4s;
  329. }
  330.  
  331. .playbox:hover .playbutton {
  332. opacity:1;
  333. -moz-transition-duration: 0.4s;
  334. -o-transition-duration: 0.4s;
  335. -webkit-transition-duration: 0.4s;
  336. transition-duration: 0.4s;
  337. }
  338.  
  339. /*
  340. ORIGINAL
  341. .audiosrc {
  342. position:absolute;
  343. max-width:330px;
  344. margin-left:247px;
  345. margin-top:63px;
  346. font-size:9px;
  347. letter-spacing:1.5px;
  348. text-transform:uppercase;
  349. text-align:left;
  350. color:black;
  351.  
  352. }*/
  353.  
  354. .audiosrc {
  355. position:absolute;
  356. max-width:330px;
  357. margin-left:150px;
  358. margin-top:63px;
  359. font-size:9px;
  360. letter-spacing:1.5px;
  361. text-transform:uppercase;
  362. text-align:left;
  363. color:black;
  364. font-family:trebuchet ms;
  365.  
  366. }
  367.  
  368. #srccontainer {
  369. position:relative;
  370. background-color:none;
  371. width:500px;
  372. height:150px;
  373. z-index:999;
  374. margin-bottom:10px;
  375. border-radius:6px;
  376. }
  377.  
  378. /*QUESTION*/
  379.  
  380. .question {
  381. font-size:100px;
  382.  
  383. }
  384.  
  385. .asker {
  386. font-style:italic;
  387. text-transform:uppercase;
  388. font-size:12;
  389. text-align:center;
  390. }
  391.  
  392.  
  393. /*INFO*/
  394.  
  395.  
  396. #postinfo {
  397. text-transform:uppercase;
  398. font-family:trebuchet ms;
  399. font-size:9px;
  400. border:1px solid {color:gray out};
  401. margin-top:6px;
  402. padding:6px;
  403. background-color:{color:graybg};
  404. }
  405.  
  406. #postinfo a:hover {
  407. text-decoration:none;
  408. }
  409.  
  410. .notes ol, .notes li{
  411. list-style:none;
  412. }
  413.  
  414.  
  415. ol.notes li.note img.avatar {
  416. vertical-align:-8px;
  417. border-radius:100%;
  418. margin-right:10px;
  419. width:16px;
  420. height:16px;
  421. margin-top:4px;
  422. margin-bottom:4px;
  423. }
  424.  
  425.  
  426. .tags {
  427. margin-top:5px;
  428. font-size:10px;
  429. text-transform:none;
  430. margin-left:6px;
  431. font-family:trebuchet ms;
  432. {block:PermalinkPage}
  433. margin-bottom:40px;
  434. {/block:PermalinkPage}
  435. }
  436.  
  437. .tags a:hover {
  438. text-decoration:none;
  439. opacity:.6;
  440. -moz-transition-duration: 0.3s;
  441. -o-transition-duration: 0.3s;
  442. -webkit-transition-duration: 0.3s;
  443. transition-duration: 0.4s;
  444. }
  445.  
  446. .tags a {
  447. opacity:1;
  448. -moz-transition-duration: 0.3s;
  449. -o-transition-duration: 0.3s;
  450. -webkit-transition-duration: 0.3s;
  451. transition-duration: 0.3s;
  452. }
  453.  
  454.  
  455. blockquote {
  456. padding-left:5px;
  457. border-left:1px solid #e5e5e5;
  458. margin-left:25px;
  459.  
  460. }
  461.  
  462.  
  463. blockquote blockquote {
  464. padding-left:5px;
  465. border-left:1px solid #e5e5e5;
  466. margin-left:14px;
  467. }
  468.  
  469.  
  470. {CustomCSS}</style>
  471.  
  472.  
  473. </head>
  474. <body>
  475.  
  476. <div id="entry">
  477.  
  478.  
  479. <!--sidebar-->
  480.  
  481. <div id="sidebar">
  482.  
  483.  
  484. {block:IfSidebarImage}
  485. <div id="sidebarimg"><img src="{image:sidebar}"></div>
  486. {/block:IfSidebarImage}
  487.  
  488.  
  489. <div id="description">
  490. {description}
  491. </div>
  492.  
  493.  
  494.  
  495. <div id="sidecover"></div>
  496.  
  497.  
  498. <div id="linksdown1">
  499. <div class="linkscaret">
  500. <div id="caret">&#9660;</div>
  501. </div>
  502.  
  503.  
  504. <div id="linksdown2">
  505. <div class="sidelinks">
  506. <a href="/">home</a>
  507. <a href="/ask">ask</a><br>
  508. {block:IfLink1} <a href="{text:link 1 URL}">{text:link1}</a>{/block:IfLink1}
  509. {block:IfLink2} <a href="{text:link 2 URL}">{text:link2}</a>{/block:IfLink2}
  510.  
  511. </div></div>
  512.  
  513.  
  514.  
  515.  
  516.  
  517. </div>
  518.  
  519. <div id="pagination">
  520. {block:Pagination}
  521. {block:PreviousPage}<a href="{PreviousPage}">&larr;</a>&nbsp;&nbsp;{/block:PreviousPage}{block:NextPage}<a href="{NextPage}">&rarr;</a>{/block:NextPage}
  522. {/block:Pagination}
  523. </div>
  524.  
  525.  
  526.  
  527. </div>
  528.  
  529.  
  530.  
  531.  
  532. <!--posts-->
  533.  
  534. {block:posts} <div id="posts">
  535.  
  536. {block:Text}
  537. <div class="title">{block:Title}{Title}{/block:Title}</div>{Body}
  538. {/block:Text}
  539.  
  540. {block:Photo}
  541. {LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}
  542. {/block:Photo}
  543.  
  544. {block:Photoset}
  545. {Photoset-500}{block:Caption}{Caption}{/block:Caption}
  546. {/block:Photoset}
  547.  
  548. {block:Quote}
  549. <div id="quote">{Quote}</div><div class="source">{block:Source}— {Source}{/block:Source}</div>
  550. {/block:Quote}
  551.  
  552. {block:Link}
  553. <a href="{URL}"><div class="linkname">{Name}</div></a>{block:Description}{description}{/block:Description}
  554. {/block:Link}
  555.  
  556. {block:Chat}
  557. {block:title}<h2>{Title}</h2>{/block:title}{block:lines}{block:label}<b>{label}</b>{/block:label} {line} <br>{/block:lines}
  558. {/block:Chat}
  559.  
  560.  
  561.  
  562.  
  563. {block:Audio}<div class="audiocontainer">
  564.  
  565. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
  566.  
  567. <div id="srccontainer">
  568.  
  569.  
  570. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="100px" height="100px">{/block:AlbumArt}</div>
  571.  
  572. <div class="audiosrc">
  573. {block:Artist}<b>Artist:</b> {Artist}{/block:Artist}<br>
  574. {block:TrackName}<b>Track:</b> {TrackName}{/block:TrackName}<br>
  575.  
  576. </div></div></div>
  577. {block:Caption}{caption}{/block:Caption}
  578. {/block:Audio}
  579.  
  580. {block:video}
  581. {VideoEmbed-500}{block:Caption}{caption}{/block:Caption}
  582. {/block:video}
  583.  
  584. {block:answer}<div id="caption">
  585. <div class="question">
  586. <div class="asker">
  587. <b>{asker} said:</b></div>
  588. <br>{question}
  589. </div>
  590. {Answer}</div>
  591. {/block:answer}
  592.  
  593.  
  594. <!--postinfo-->
  595.  
  596. <div id="postinfo">
  597.  
  598. <!--{block:Date}
  599. {TimeAgo}
  600. {/block:Date}-->
  601.  
  602. {block:Date}
  603. <span title="{timeago}"><a href="{permalink}">{DayOfMonthWithZero} {ShortMonth} {ShortYear}</a></span>
  604. {/block:Date}
  605. /
  606. <a href="{Permalink}">
  607. {NoteCountWithLabel}
  608. </a>
  609.  
  610. <font style="float:right">
  611. {block:RebloggedFrom}
  612. <a href="{ReblogParentURL}"><span title="{ReblogParentname}">via</span></a> / <a href="{ReblogRootURL}"><span title="{Reblogrootname}">src</span></a>
  613. {/block:RebloggedFrom}</font style>
  614.  
  615.  
  616. {block:ContentSource}
  617. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  618. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  619. {/block:SourceLogo}
  620. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  621. {/block:ContentSource}
  622.  
  623.  
  624. <br>
  625.  
  626. </div>
  627.  
  628. <div class="tags">
  629. {block:HasTags}
  630. {block:tags}
  631. <a href="{TagURL}">#{Tag}&nbsp;&nbsp;</a>
  632. {/block:tags}
  633. {/block:HasTags}
  634. </div>
  635.  
  636.  
  637.  
  638. <div class="notes">
  639. {block:PostNotes}{PostNotes}{/block:PostNotes}
  640. </div>
  641.  
  642.  
  643. </div>{/block:posts}
  644.  
  645. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  646. <script type="text/javascript">
  647. window.onload = function() {
  648. $('iframe.photoset').contents().find('.photoset_row').attr("style", "width:500px; margin-bottom: -4px;");
  649. $('iframe.photoset').contents().find('.photoset_row').find('img').attr("style", "width:500px;");
  650. $('iframe.photoset').contents().find('.photoset_row_2').find('img').attr("style", "width:245px; margin-right: 0px;");
  651. $('iframe.photoset').contents().find('.photoset_row_3').find('img').attr("style", "width:160px; margin-right: 0px;");
  652. }
  653. </script>
  654.  
  655. </div>
  656.  
  657. <div style="position:fixed; bottom:10px; right:10px; padding:2px 2px; font-size:11px;">
  658. <a href="http://lauraholliis.tumblr.com"><i class="fa fa-code"></i></a>
  659. </div>
  660.  
  661. </body>
  662. </html>
Advertisement
Add Comment
Please, Sign In to add comment