Advertisement
trenzalours

theme 04 serenity

May 4th, 2014
1,038
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.18 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head><title>{Title}</title>
  4. <link rel="shortcut icon" href="{favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7.  
  8.  
  9.  
  10.  
  11.  
  12. <!--- |||||||||| T R E N Z A L O U R S - T H E M E S ||||||||||
  13.  
  14. -PLEASE DON'T REMOVE THE CREDIT
  15. -DON'T REPOST AND CLAIM AS YOUR OWN
  16. -EDIT AS MUCH AS YOU LIKE
  17. -Don't just take the update code from theme.
  18. -You can remove the updates tab I've labeled where the codes begin and end for you.
  19. -Feel free to message me with any questions! Enjoy!
  20.  
  21. wwww.trenzathemes.tumblr.com
  22. --->
  23.  
  24.  
  25.  
  26.  
  27. <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
  28.  
  29. <meta name="text:title2" content="/"/>
  30. <meta name="color:Background" content="#ffffff"/>
  31. <meta name="color:hover" content="#B8AA95"/>
  32. <meta name="color:scrollbar" content="#B8AA95"/>
  33. <meta name="color:title2" content="#FFCFAD"/>
  34. <meta name="color:title" content="#5E5A54"/>
  35. <meta name="color:navilink" content="##ffcfad"/>
  36. <meta name="color:selection" content="##ffcfad"/>
  37. <meta name="color:accent" content="#ffffff"/>
  38. <meta name="color:text" content="#B8AA95"/>
  39. <meta name="color:links" content="#b8b8b8"/>
  40. <!---begin updates tab code--->
  41.  
  42. <meta name="color:icons" content="#FFCFAD">
  43. <meta name="color:updatesbar" content="#FFCFAD">
  44.  
  45.  
  46. <!---end updates tab code--->
  47. <meta name="image:sidebar" content=""/>
  48. <meta name="text:link1" content="link1"/>
  49. <meta name="text:link1url" content="/"/>
  50. <meta name="text:link2" content="link2"/>
  51. <meta name="text:link2url" content="/"/>
  52. <meta name="text:link3" content="link3"/>
  53. <meta name="text:link3url" content="/"/>
  54. <meta name="text:link4" content="link4"/>
  55. <meta name="text:link4url" content="/"/>
  56.  
  57.  
  58.  
  59. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  60. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  61. <script>
  62. (function($){
  63. $(document).ready(function(){
  64. $("a[title]").style_my_tooltips({
  65. tip_follows_cursor:true,
  66. tip_delay_time:90,
  67. tip_fade_speed:600,
  68. attribute:"title"
  69. });
  70. });
  71. })(jQuery);
  72. </script>
  73.  
  74. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  75.  
  76.  
  77. <style type="text/css">
  78.  
  79. *, body, a, a:hover {cursor: url(http://i58.tinypic.com/a2qecm.png), auto;}
  80.  
  81. ::-webkit-scrollbar-thumb {
  82. height:auto;
  83. background-color: {color:scrollbar};
  84. border:1px solid #fff;
  85. border-radius:5px;
  86. }
  87.  
  88. ::-webkit-scrollbar {
  89. border-radius:5px;
  90. height:9px;
  91. width:7px;
  92. background-color:white;
  93. border:1px solid white;
  94. }
  95.  
  96. /*---begin updates tab css--*/
  97. #icon{
  98.  
  99. opacity:1;
  100. margin-top:-8px;
  101. padding:5px;
  102. font-size:9px;
  103. color:{color:icons};
  104. z-index:999999;
  105. }
  106.  
  107.  
  108. #tab1title{
  109. font-size:13px;
  110. text-align:left;
  111. font-family:'Open Sans Condensed';
  112. color:{color:title2};
  113. margin-top:-24px;
  114. margin-left:20px;
  115. font-weight:bold;
  116. margin-bottom:5px;
  117. }
  118.  
  119. #tab1{
  120. opacity:1;
  121. font-size:8px;
  122. color:{color:text};
  123. background:white;
  124. text-align:center;
  125. margin-top:0px;
  126.  
  127. }
  128.  
  129. #tab1box{
  130. overflow:hidden;
  131. width:20px;
  132. height:18px;
  133. z-index:99;
  134. -webkit-transition: all 0.8s ease-out;
  135. -moz-transition: all 0.8s ease-out;
  136. transition: all 0.8s ease-out;
  137.  
  138. }
  139.  
  140. #tab1box:hover{
  141. border-left:4px solid {color:text};
  142. width:70px;
  143. height:150px;
  144.  
  145. }
  146.  
  147. #tab2{
  148. opacity:1;
  149. font-size:8px;
  150. color:{color:text};
  151. background:white;
  152. text-align:center;
  153. margin-top:0px;
  154.  
  155. }
  156.  
  157.  
  158. #tab2box{
  159. overflow:hidden;
  160. width:20px;
  161. height:20px;
  162. z-index:99;
  163. -webkit-transition: all 0.8s ease-out;
  164. -moz-transition: all 0.8s ease-out;
  165. transition: all 0.8s ease-out;
  166.  
  167. }
  168. #tab2box:hover{
  169.  
  170. border-left:4px solid {color:text};
  171. background:transparent;
  172. width:90px;
  173. height:120px;
  174.  
  175. }
  176.  
  177. #tab3{
  178. opacity:1;
  179. font-size:8px;
  180. color:{color:text};
  181. text-align:center;
  182. margin-top:0px;
  183.  
  184. }
  185. #tab3box{
  186. overflow:hidden;
  187. width:20px;
  188. height:20px;
  189. z-index:99;
  190. -webkit-transition: all 0.8s ease-out;
  191. -moz-transition: all 0.8s ease-out;
  192. transition: all 0.8s ease-out;
  193.  
  194.  
  195. }
  196. #tab3box:hover{
  197.  
  198. border-left:4px solid {color:text};
  199. background:transparent;
  200. width:70px;
  201. height:163px;
  202.  
  203. }
  204.  
  205. #tab4{
  206. opacity:1;
  207. font-size:8px;
  208. color:{color:text};
  209. text-align:center;
  210. margin-top:0px;
  211.  
  212. }
  213.  
  214. #tab4box{
  215. overflow:hidden;
  216. width:20px;
  217. height:20px;
  218. z-index:99;
  219. -webkit-transition: all 0.8s ease-out;
  220. -moz-transition: all 0.8s ease-out;
  221. transition: all 0.8s ease-out;
  222.  
  223.  
  224. }
  225. #tab4box:hover{
  226.  
  227. border-left:4px solid {color:text};
  228. background:transparent;
  229. width:70px;
  230. height:120px;
  231.  
  232. }
  233.  
  234. #tab5{
  235. opacity:1;
  236. font-size:8px;
  237. color:{color:text};
  238. text-align:center;
  239. margin-top:0px;
  240.  
  241. }
  242.  
  243. #tab5box{
  244.  
  245. overflow:hidden;
  246. width:20px;
  247. height:20px;
  248. z-index:99;
  249. -webkit-transition: all 0.8s ease-out;
  250. -moz-transition: all 0.8s ease-out;
  251. transition: all 0.8s ease-out;
  252.  
  253.  
  254. }
  255. #tab5box:hover{
  256.  
  257. border-left:4px solid {color:text};
  258. background:transparent;
  259. width:90px;
  260. height:90px;
  261.  
  262. }
  263.  
  264. #tab6{
  265. opacity:1;
  266. font-size:8px;
  267. color:{color:text};
  268. text-align:center;
  269. margin-top:0px;
  270.  
  271. }
  272. #tab6box{
  273.  
  274. overflow:hidden;
  275. width:20px;
  276. height:20px;
  277. z-index:99;
  278. -webkit-transition: all 0.8s ease-out;
  279. -moz-transition: all 0.8s ease-out;
  280. transition: all 0.8s ease-out;
  281.  
  282.  
  283. }
  284. #tab6box:hover{
  285.  
  286. border-left:4px solid {color:text};
  287. background:transparent;
  288. width:95px;
  289. height:80px;
  290.  
  291. }
  292.  
  293. #tab6{
  294. opacity:1;
  295. font-size:8px;
  296. color:{color:text};
  297. text-align:center;
  298. margin-top:0px;
  299.  
  300. }
  301.  
  302. #holder{
  303. border-left:3px solid {color:updatesbar};
  304. font-size:10px;
  305. text-transform:uppercase;
  306. position:fixed;
  307. font-family:calibri;
  308. left:6px;
  309. background-color:transparent;
  310. letter-spacing:0px;
  311. z-index:9999;
  312. top:20px;
  313. }
  314. /*---end updates tab css---*/
  315.  
  316. /*---begin tooltips---*/
  317.  
  318. #s-m-t-tooltip{
  319. max-width:250px;
  320. z-index:999999;
  321. margin-top:-25px;
  322. padding:2px 2px;
  323. text-transform:uppercase;
  324. font-family:trebuchet ms;
  325. font-size:8px;
  326. box-shadow:2px 2px 5px rgba(0,0,0,.1);
  327. border:0px solid {color:border};
  328. background:{color:title};
  329. color:white;
  330. }
  331. /*---end tooltips---*/
  332.  
  333.  
  334.  
  335. body {
  336. background:{color:background};
  337. margin:0px;
  338. color:{color:text};
  339. font-family:century gothic;
  340. font-size:10px;
  341. line-height:110%;
  342. }
  343.  
  344. a {
  345. color:{color:links};
  346. margin-left:0px;
  347. text-decoration:none;
  348. -webkit-transition-duration:.3s;
  349. -moz-transition-duration:.3s;
  350. -o-transition-duratsion:.3s;
  351. }
  352.  
  353.  
  354. a:hover {
  355. color:{color:hover};
  356.  
  357. -webkit-transition-duration:.3s;
  358. -moz-transition-duration:.3s;
  359. -o-transition-duration:.3s;
  360. }
  361.  
  362. img {
  363. border:;
  364. }
  365.  
  366. blockquote {
  367. padding-left:5px;
  368. border-left:2px solid;
  369. }
  370.  
  371. blockquote blockquote {
  372. padding-left:5px;
  373. border-left:2px solid;
  374. }
  375.  
  376. h1 {
  377. font-size:15px;
  378. text-transform:uppercase;
  379. font-family:'Open Sans Condensed';
  380. letter-spacing:3px;
  381. line-height:110%;
  382. }
  383. b{
  384. color:{color:title};
  385. }
  386. strong{
  387. color:{color:title};
  388. }
  389. em{
  390. color:{color:accent};
  391. }
  392. big{
  393. font-size:2em;
  394. }
  395.  
  396. #sidebar {
  397. width:245px;
  398. position:fixed;
  399. margin-left:200px;
  400. margin-top:100px;
  401. }
  402. @font-face { font-family: "learningcurve"; src: url('http://static.tumblr.com/rmj06l2/paAlm4ymo/learningcurve.ttf'); }
  403.  
  404. #title2{
  405. text-transform:lowercase;
  406. text-align:center;
  407. font-family:'learningcurve';
  408. padding:2px;
  409. font-size:22px;
  410. margin-top:-15px;
  411. margin-left:48px; /*---adjust this to center your secondary title---*/
  412. line-height:82%;
  413. color:{color:title2};
  414. position:fixed;
  415.  
  416. }
  417.  
  418.  
  419. #title {
  420. font-size:15px;
  421. text-align:center;
  422. margin-bottom:13px;
  423. margin-left:7px;
  424. text-transform:uppercase;
  425. letter-spacing:5px;
  426. font-weight:bold;
  427. font-family:'Open Sans Condensed';
  428. color:{color:title};
  429. }
  430.  
  431. #sidebarimage {
  432. width 150px;
  433. }
  434.  
  435. #sidebarimage img {
  436. width:150px;
  437. margin-left:50px;
  438. margin-top:2px;
  439. }
  440.  
  441. #description {
  442. padding:6px;
  443. text-align:justify;
  444. margin-left:39px;
  445. width:160px;
  446. }
  447.  
  448. #links{
  449. margin-left:57px;
  450. margin-top:5px;
  451. }
  452. #links a{
  453. font-style:italic;
  454. font-family:century gothic;
  455. padding:4px;
  456. border:1px solid {color:navilink};
  457. color:{color:links};
  458. padding-left:2px;
  459. margin-top:3px;
  460. margin-left:2px;
  461. display:inline-block;
  462. -webkit-transition-duration:.5s;
  463. -moz-transition-duration::.5s;
  464. -o-transition-duration:.5s;
  465.  
  466. }
  467. #links a:hover{
  468. padding:4px;
  469. margin-top:3px;
  470. color:{color:text};
  471. border-left:4px solid {color:hover};
  472. -webkit-transition-duration:.5s;
  473. -moz-transition-duration::.5s;
  474. -o-transition-duration:.5s;
  475.  
  476. }
  477.  
  478. #entries {
  479. padding:10px;
  480. width:500px;
  481. margin-left:500px;
  482. margin-top:40px;
  483. }
  484.  
  485. #post {
  486. opacity:.86;
  487. width:500px;
  488. padding-bottom:50px;
  489. -webkit-transition-duration:1s;
  490. -moz-transition-duration::.1s;
  491. -o-transition-duration:1s;
  492. }
  493.  
  494. #post:hover{
  495. opacity:1;
  496. -webkit-transition-duration:1s;
  497. -moz-transition-duration::.1s;
  498. -o-transition-duration:1s;
  499. }
  500.  
  501. ::selection {
  502. background-color:{color:selection};
  503. color:white;
  504. }
  505.  
  506. #pagination {
  507. margin-top:5px;
  508. margin-right:15px;
  509. font-size:20px;
  510. text-align:center;
  511. color:{color:text};
  512.  
  513. }
  514.  
  515.  
  516. #info {
  517. text-align:center;
  518. opacity:0;
  519. width:100%;
  520. margin-top:10px;
  521. font-size:9px;
  522. color:{color:hover};
  523. letter-spacing:1px;
  524. padding-top:3px;
  525. padding-bottom:7px;
  526. text-align:center;
  527. width:100%;
  528. -webkit-transition-duration:1s;
  529. -o-transition-duration:1s;
  530. -moz-transition-duration:1s;
  531. }
  532.  
  533. #post:hover #info {
  534. opacity:1;
  535. -webkit-transition-duration:1s;
  536. -o-transition-duration:1s;
  537. -moz-transition-duration:1s;
  538. }
  539.  
  540.  
  541. #asker {
  542. float:left;
  543. margin-right:5px;
  544.  
  545. }
  546.  
  547. .asker {
  548.  
  549. background-color:#fff;
  550. width:100%;
  551. font-family:'Open Sans Condensed';
  552. font-size:20px;
  553. color:{color:title};
  554. letter-spacing:-1px;
  555. text-transform:lowercase;
  556. font-weight:bold;
  557. }
  558.  
  559.  
  560. .question {
  561. background-color:#fff;
  562. color:{color:text};
  563. width:100%;
  564. padding:10px;
  565. margin-left:25px;
  566. text-align:left;
  567. font-size:12px;
  568. min-height:20px;
  569. font-style:italic;
  570.  
  571. }
  572.  
  573. .reply {
  574. border-bottom:1px solid {color:accent};
  575. margin-top:-20px;
  576. color:{color:navilink};
  577. text-align:center;
  578. font-size:10px;
  579. letter-spacing:1px;
  580. font-family:'Open Sans Condensed';
  581. line-height:110%;
  582. font-weight:bold;
  583. }
  584.  
  585. #cred {
  586. bottom:3px;
  587. position:fixed;
  588. right:10px;
  589. float:right;
  590. font-family:arial;
  591. font-weight:bold;
  592. font-size:13px;
  593. letter-spacing:1px;
  594. text-transform:uppercase;
  595.  
  596. padding:4px;
  597. }
  598.  
  599. #cred a {
  600. color:{color:links};
  601. -webkit-transition-duration:1s;
  602. -o-transition-duration:1s;
  603. -moz-transition-duration:1s;
  604.  
  605. }
  606.  
  607. #cred a:hover {
  608. color:{color:hover};
  609. color:transparent;
  610. text-shadow: white 0 5 5px;
  611. -webkit-transition-duration:1s;
  612. -o-transition-duration:1s;
  613. -moz-transition-duration:1s;
  614. }
  615. .pagenotes {
  616. {block:IndexPage}
  617. display: none!important;
  618. {/block:IndexPage}
  619. width:400px;
  620. text-align:left;
  621.  
  622. }
  623. .pagenotes img {
  624. display:none!important;}
  625. .pagenotes li {
  626. list-style-type:none;
  627. padding:5px 0px;
  628. text-align:left;
  629. margin:0 0 0 -40px;
  630. }
  631.  
  632.  
  633.  
  634. {CustomCSS}</style></head><body>
  635. <!---If you want to change the icons on the tab::
  636. head over to http://astronautweb.co/snippet/font-awesome/ site and pick the icon you want
  637. replace the entire <i class=""></i> with the one provided.--->
  638. <!---begin updates tab code--->
  639.  
  640. <div id="holder">
  641. <div id="tab1box">
  642. <div id="icon"><p><i class="fa fa-thumb-tack fa-lg"></i></div>
  643. <div id="tab1"><div id="tab1title">TITLE</div>
  644. If you want to change the icons on the tab::<br>
  645. head over to <a href="http://astronautweb.co/snippet/font-awesome/" target="_blank">this</a> site and pick the icon you want<br><p></p>
  646. replace the entire < i class="/"></ i > with the one provided.
  647. </div></div>
  648.  
  649. <div id="tab2box">
  650. <div id="icon"><p><i class="fa fa-pencil fa-lg"></i></div>
  651. <div id="tab2"><div id="tab1title"> TITLE</div>
  652. TEXT
  653. </div></div>
  654.  
  655. <div id="tab3box">
  656. <div id="icon"><p><i class="fa fa-comments fa-lg"></i></div>
  657. <div id="tab3"><div id="tab1title">TITLE</div>
  658. TEXT
  659. </div></div>
  660. <div id="tab4box">
  661. <div id="icon"><p><i class="fa fa-quote-left fa-lg"></i></div>
  662. <div id="tab4"><div id="tab1title">TITLE</div>
  663. TEXT
  664. </div></div>
  665.  
  666. <div id="tab5box">
  667. <div id="icon"><p><i class="fa fa-cog fa-lg"></i></div>
  668. <div id="tab5"><div id="tab1title">TITLE</div>
  669. TEXT
  670.  
  671. </div></div></div>
  672.  
  673. <!---end updates tab code-->
  674.  
  675.  
  676. <div id="sidebar">
  677.  
  678. <div id="title"> <a href="/">{Title}</a></div>
  679. <div id="title2">{text:title2}</div>
  680.  
  681.  
  682.  
  683. <div id="sidebarimage"><img src="{image:sidebar}"></div>
  684. <div id="links">
  685. <a href="{text:link1url}">{text:link1}</a>
  686. <a href="{text:link2url}">{text:link2}</a>
  687. <a href="{text:link3url}">{text:link3}</a>
  688. <a href="{text:link4url}">{text:link4}</a>
  689.  
  690.  
  691.  
  692. </div>
  693. <div id="description">{Description}</div>
  694.  
  695. <div id="pagination">
  696. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}"title="previous">&#8672;</a>{/block:PreviousPage}
  697. {block:NextPage}<a href="{NextPage}" title="forward">&#8674;</a>{/block:NextPage}{/block:Pagination}
  698. </div>
  699.  
  700. </div>
  701.  
  702. <div id="entries">{block:Posts}<div id="post">
  703.  
  704. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  705.  
  706. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  707.  
  708. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  709.  
  710. {block:Quote}<h1>{Quote}</h1>{block:Source}-{Source}{/block:Source}{/block:Quote}
  711.  
  712. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  713.  
  714. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  715.  
  716. {block:Audio}{AudioPlayerWhite}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  717.  
  718. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  719.  
  720. {block:Answer}
  721. <div class="asker">
  722. {Asker};</div>
  723. <div class="question"><i>{Question}</i></div>
  724. <div class="reply">
  725. {Answer}</div>
  726. {/block:Answer}
  727.  
  728. <div id="info">
  729. posted <a href="{Permalink}">{DayOfWeek} {MonthNumber}/{DayOfMonth}/{Year}</a> with<a href="{Permalink}">{NoteCountWithLabel}</a>
  730. {block:RebloggedFrom}<a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom} {block:ContentSource}<a href="{SourceURL}" > &copy; <a href="{SourceURL}"></a>{/block:ContentSource}{/block:RebloggedFrom}
  731. <br>
  732. {block:HasTags}filed: <i>{block:Tags}<a href="{TagURL}">{Tag}, </a>{/block:Tags}{/block:HasTags}</i>
  733.  
  734. </div></div>
  735. {block:PostNotes}
  736. <div class="pagenotes">
  737. {PostNotes}
  738. </div>
  739. {/block:PostNotes}
  740. <!---don't remove//edit-->
  741. <div id="cred">
  742.  
  743. <a href="http://trenzalours.tumblr.com/" title="trenzalours themes">
  744. <i class="fa fa-pagelines"></i>
  745. </a></div>
  746.  
  747. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement