Beautifully-Flawless

Theme 76: Ashley

Nov 1st, 2013
1,051
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.91 KB | None | 0 0
  1. <!--Theme 76- Ashley, Made By Vanilla-Beaux -->
  2. <!--PLEASE KEEP CREDIT-->
  3. <!--PLEASE KEEP CREDIT-->
  4. <!--PLEASE KEEP CREDIT-->
  5. <!--PLEASE KEEP CREDIT-->
  6. <!--PLEASE KEEP CREDIT-->
  7.  
  8. <html>
  9. <head>
  10.  
  11. <script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  12.  
  13. <!--Variables-->
  14. <meta name="color:Background" content="#fff" />
  15. <meta name="color:Text" content="#000" />
  16. <meta name="color:Links" content="#ababab" />
  17. <meta name="color:Posts Background" content="#fff" />
  18. <meta name="color:Image Permalink" content="#aaa" />
  19. <meta name="color:Permalink" content="#888" />
  20. <meta name="color:Posts Header" content="#aaa" />
  21. <meta name="color:BlockQuote Background" content="#F7F7F7" />
  22. <meta name="color:BlockQuote Border" content="#888" />
  23. <meta name="color:BlockQuote Shadow" content="#ccc" />
  24. <meta name="color:Top Bar Border" content="#DEB887" />
  25. <meta name="color:Quote" content="#777" />
  26. <meta name="color:Navigation Box" content="#D2B48C" />
  27. <meta name="color:Sidebar Bg" content="#fff" />
  28. <meta name="color:Sidebar Border" content="#DEB887" />
  29.  
  30. <meta name="image:Background" content="http://static.tumblr.com/gdh5wux/G7im7im1y/tumblr_lpwovn6xpc1qcn2vb.png" />
  31. <meta name="image:Sidebar" content="http://static.tumblr.com/cfa74213209a9ccecab9e9897755117f/aorjzw7/Eqlms3jfz/tumblr_static_2_4.jpg" />
  32.  
  33. <meta name="text:Stat 1" content="INSERT STAT HERE" />
  34. <meta name="text:Stat 2" content="INSERT STAT HERE" />
  35. <meta name="text:Link 1 URL" content="/submit" />
  36. <meta name="text:Link 1" content="Submit" />
  37. <meta name="text:Link 2 URL" content="/favorites" />
  38. <meta name="text:Link 2" content="Favorites" />
  39. <meta name="text:Link 3 URL" content="/links" />
  40. <meta name="text:Link 3" content="Other Links" />
  41. <meta name="text:Quote" content="Fashion Fades, But Style is Eternal" />
  42. <!--Variables-->
  43.  
  44. <title>{Title}</title>
  45. <link rel="shortcut icon" href="{Favicon}">
  46. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  47. {block:Description}
  48. <meta name="description" content="{MetaDescription}" />
  49. {/block:Description}
  50.  
  51. <style type="text/css">
  52. ::-webkit-scrollbar {width: 8px; height: 4px;background:white;}
  53. ::-webkit-scrollbar-thumb { background-color:{color:Color Scheme};-webkit-box-shadow: inset 0 0 12px #000;-webkit-border-radius: 6px;border-radius: 6px;}
  54.  
  55. #tumblr_controls{
  56. position:fixed !important;
  57. -webkit-filter: invert(100%);
  58. }
  59.  
  60. body {
  61. background-image:url('{image:Background}');
  62. background-attachment: fixed;
  63. background-repeat: repeat;
  64. background-position: center;
  65. background-color:{color:Background};
  66. margin:0px;
  67. }
  68.  
  69. body, div, p, textarea, submit, input {
  70. font-family:'consolas';
  71. font-size:10px;
  72. line-height:12px;
  73. color:{color:Text};
  74. text-transform:none;
  75. }
  76.  
  77. a:link, a:active, a:visited{
  78. color:#8B4513;
  79. text-decoration: none;
  80. -webkit-transition: color 0.5s ease-out;
  81. -moz-transition: color 0.5s ease-out;
  82. transition: color 0.5s ease-out;
  83. }
  84.  
  85. a:hover{
  86. -webkit-transition: color 0.5s ease-out;
  87. -moz-transition: color 0.5s ease-out;
  88. transition: color 0.5s ease-out;
  89. text-shadow:none;
  90. }
  91.  
  92. @font-face { font-family: "lovenote"; src: url('http://static.tumblr.com/4yxykdm/k6plrfhwf/ck_love_note.ttf'); }
  93.  
  94. @font-face { font-family: "discipuli"; src: url('http://static.tumblr.com/gdh5wux/MN6moz1m2/discipuli.ttf'); }
  95.  
  96. @font-face { font-family:"quicksand"; src: url('http://static.tumblr.com/fxpo5zq/ad0m5vybr/quicksand_light.otf'); }
  97.  
  98. div#posts {
  99. float:left;
  100. width:920px;
  101. z-index:99;
  102. margin-left:390px;
  103. margin-top:70px;
  104. }
  105.  
  106. .entry {
  107. float:left;
  108. margin:8px;
  109. padding:10px;
  110. overflow:hidden;
  111. background-color:#fff;
  112. border:4px double #ddd;
  113. {block:IndexPage}
  114. width:250px;
  115. {/block:IndexPage}
  116. {block:PermalinkPage}
  117. width:500px;
  118. {/block:PermalinkPage}
  119. -webkit-transition: opacity 0.9s linear;
  120. -webkit-transition: all 0.9s ease-in-out;
  121. -moz-transition: all 0.9s ease-in-out;
  122. -o-transition: all 0.9s ease-in-out;
  123. }
  124.  
  125. .entry:hover #permalink{
  126. opacity:1.0;
  127. -webkit-transition: opacity 0.3s ease-out;
  128. -webkit-transition: all 0.3s ease-out;
  129. -moz-transition: all 0.3s ease-out;
  130. transition: all 0.3s ease-out;
  131. }
  132.  
  133. #permalink{
  134. position:absolute;
  135. background:#fff;
  136. border-top:4px solid #FC8EAC;
  137. width:250px;
  138. height:20px;
  139. bottom:0px;
  140. left:0px;
  141. padding:5px;
  142. opacity:0.0;
  143. font-family:'calibri';
  144. font-size:8px;
  145. line-height:10px;
  146. text-align:center;
  147. letter-spacing:1px;
  148. text-transform:uppercase;
  149. -webkit-transition: opacity 0.6s ease-out;
  150. -webkit-transition: all 0.6s ease-out;
  151. -moz-transition: all 0.6s ease-out;
  152. transition: all 0.6s ease-out;
  153. }
  154.  
  155. #permalink a{color:#555;}
  156.  
  157. #permalink a:hover{color:#aaa;}
  158.  
  159. #info{
  160. font-family:'Calibri';
  161. color:{color:Permalink};
  162. font-size:10px;
  163. text-align:right;
  164. line-height:15px;
  165. margin-top:1px;
  166. border-top:1px dotted #aaa;
  167. text-transform:uppercase;
  168. }
  169.  
  170. #infscr-loading{
  171. bottom: -70px;
  172. position: absolute;
  173. left: 50%;
  174. margin-left:-8px;
  175. width:16px;
  176. height:11px;
  177. overflow:hidden;
  178. margin-bottom: 50px;
  179. }
  180.  
  181. .title{
  182. font-family:'quicksand';
  183. text-transform:uppercase;
  184. font-size:20px;
  185. line-height:20px;
  186. color:{color:Posts Header};
  187. text-shadow:1px 2px 4px #ddd;
  188. text-align:center;
  189. }
  190.  
  191. .quote{
  192. font-family:'Arial';
  193. font-size:8px;
  194. text-transform:uppercase;
  195. line-height:25px;
  196. text-align:right;
  197. color:{color:Posts Header};
  198. }
  199.  
  200. #audiocontainer{
  201. width:500px;
  202. height:110px;
  203. margin-bottom:5px;
  204. }
  205.  
  206. .albumart{
  207. width:100px;
  208. height:100px;
  209. position:absolute;
  210. }
  211.  
  212. .albumart img{
  213. width:100px;
  214. height:100px;
  215. float:left;
  216. }
  217.  
  218. .defaultalbum{
  219. width:100px;
  220. height:100px;
  221. position:absolute;
  222. }
  223.  
  224. .defaultalbum img{
  225. width:100px;
  226. height:100px;
  227. float:left;
  228. }
  229.  
  230. .audioinfo{
  231. padding:3px;
  232. margin:0 0 5px 100px;
  233. text-transform:uppercase;
  234. font-family:'Calibri';
  235. font-size:8px;
  236. border-left:15px solid {color:Color Scheme};
  237. }
  238.  
  239. .audioinfo:hover{
  240. border-left:30px solid {color:Color Scheme};
  241. -webkit-transition-duration: 0.6s;
  242. -moz-transition-duration: 0.6s;
  243. }
  244.  
  245. .audioinfotwo{
  246. padding:3px;
  247. margin:0 0 5px 100px;
  248. text-transform:uppercase;
  249. font-size:8px;
  250. border-left:15px solid {color:Color Scheme};
  251. }
  252.  
  253. .audioinfotwo:hover{
  254. border-left:30px solid {color:Color Scheme};
  255. -webkit-transition-duration: 0.6s;
  256. -moz-transition-duration: 0.6s;
  257. }
  258.  
  259. .margin{
  260. margin-bottom:1px;
  261. }
  262.  
  263. .player{
  264. margin-left:100px;
  265. margin-top:0px;
  266. float:left;
  267. }
  268.  
  269. asker{
  270. font-family:'discipuli';
  271. font-size:10px;
  272. text-transform:uppercase;
  273. color:{color:Asker URL};
  274. }
  275.  
  276. #ask{
  277. padding:3px;
  278. font-family:'consolas';
  279. font-size:10px;
  280. text-transform:uppercase;
  281. color:#999;
  282. }
  283.  
  284. #askbox{
  285. margin-top:0px;
  286. margin-left:0px;
  287. overflow:hidden;
  288. padding:4px;
  289. }
  290.  
  291. blockquote{
  292. padding:0px 0px 2px 5px;
  293. margin:0px 0px 2px 10px;
  294. background-color:{color:BlockQuote Background};
  295. border-left: 7px solid {color:BlockQuote Border};
  296. -moz-box-shadow: 1px 1px 1px {color:BlockQuote Shadow};
  297. -webkit-box-shadow: 1px 1px 1px {color:BlockQuote Shadow};
  298. box-shadow: 1px 1px 1px {color:BlockQuote Shadow};
  299. }
  300.  
  301. ul, ol, li{list-style:circle; margin:5px; margin-left:10px; padding-left:3px;}
  302. .user_1 .label, .user_4 .label, .user_7 .label, .user_2 .label, .user_5 .label, .user_8 .label, .user_3 .label, .user_6 .label,
  303. .user_9 .label color:{color:text};}
  304.  
  305. .notes img{width:10px; position:relative; top:3px;}
  306.  
  307. #topbar{
  308. position:fixed;
  309. width:120%;
  310. height:40px;
  311. left:-5px;
  312. top:20px;
  313. background: rgba(255, 255, 255, 0.6);
  314. border-bottom:6px solid {color:Top Bar Border};
  315. z-index:999999;
  316. }
  317.  
  318. #blogtitle{
  319. position:fixed;
  320. text-transform:none;
  321. font-family:'discipuli';
  322. font-size:40px;
  323. color:#666;
  324. left:20px;
  325. top:520px;
  326. text-shadow:0px 2px 4px #555;
  327. }
  328.  
  329. #subtitle{
  330. position:absolute;
  331. font-family:'lovenote';
  332. font-size:50px;
  333. color:{color:Quote};
  334. left:40px;
  335. top:15px;
  336. }
  337.  
  338. #linksbox{
  339. position:fixed;
  340. width:280px;
  341. height:10px;
  342. left:40px;
  343. top:450px;
  344. padding:15px;
  345. position:fixed;
  346. color:#fff;
  347. background:{color:Navigation Box};
  348. }
  349.  
  350. div.navigate img{
  351. height:20px;
  352. width:20px;
  353. margin-left:5px;
  354. margin-top:-4px;
  355. margin-right:21px;
  356. float:left;
  357. display:block;
  358. -webkit-transition: all 1s ease-out;
  359. -moz-transition: all 1s ease-out;
  360. transition: all 1s ease-out;
  361. }
  362.  
  363. div#qTip {
  364. padding:3px 14px 3px 14px;
  365. display:none;
  366. text-align: center;
  367. position: absolute;
  368. font-size:10px;
  369. line-height:10px;
  370. font-family:calibri;
  371. z-index:1000;
  372. z-index: 9999999;
  373. color:#000;
  374. background:#fff;
  375. letter-spacing:1px;
  376. }
  377.  
  378. #sidebar{
  379. position:fixed;
  380. width:300px;
  381. height:350px;
  382. left:40px;
  383. top:80px;
  384. background:{color:Sidebar Bg};
  385. border:5px solid {color:Sidebar Border};
  386. -webkit-transition: all 3s ease-in-out;
  387. -moz-transition: all 3s ease-in-out;
  388. transition: all 3s ease-in-out;
  389. }
  390.  
  391. #sidebar img{width:100%; height:100%;}
  392.  
  393. #sidebar:hover #des{
  394. opacity:1;
  395. bottom:0px;
  396. background: rgba(255, 255, 255, 0.8);
  397. -webkit-transition: all 1s ease-in-out;
  398. -moz-transition: all 1s ease-in-out;
  399. transition: all 1s ease-in-out;
  400. }
  401.  
  402. #des{
  403. position:absolute;
  404. width:300px;
  405. max-height:80px;
  406. left:0px;
  407. bottom:10px;
  408. background: rgba(255, 255, 255, 0.8);
  409. text-align:center;
  410. padding-top:5px;
  411. opacity:0;
  412. z-index:9999;
  413. -webkit-transition: all 1s ease-in-out;
  414. -moz-transition: all 1s ease-in-out;
  415. transition: all 1s ease-in-out;
  416. }
  417.  
  418.  
  419. {CustomCSS}
  420. </style>
  421.  
  422. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  423.  
  424. <body>
  425.  
  426. <div id="topbar"><div id="subtitle">{text:Quote}</div></div>
  427.  
  428. <div id="blogtitle">{title}</div>
  429.  
  430. <div id="sidebar">
  431. <div id="des">
  432. {description}
  433. <br>
  434. {text:Stat 1} . {text:Stat 2}
  435. </div>
  436. <img src="{image:Sidebar}">
  437. </div>
  438.  
  439. <div id="linksbox">
  440. <div class="navigate">
  441. <a href="/"title="Home"><img src="http://i.imgur.com/z76zQOW.png"></a>
  442.  
  443. <a href="/ask"title="Inbox"><img src="http://i.imgur.com/IjvXm53.png"></a>
  444.  
  445. <a href="{text:Link 1 URL}" title="{text:Link 1}"><img src="http://i.imgur.com/07trkwx.png"></a>
  446.  
  447. <a href="{text:Link 2 URL}"title="{text:Link 2}"><img src="http://i.imgur.com/Q1gOBl2.png"></a>
  448.  
  449. <a href="{text:Link 3 URL}"title="{text:Link 3}"><img src="http://i.imgur.com/Z8MRiTA.png"></a>
  450.  
  451. <a href="http://vanillabeaux.co.vu/"title="Theme Credit"><img src="http://i.imgur.com/Pkegpk8.png"></a>
  452. </div>
  453. </div>
  454.  
  455. <div id="posts">
  456. {block:Posts}
  457. <div class="entry">
  458.  
  459. {block:Text}
  460. {block:Title}
  461. <div class="title">{Title}</div>
  462. {/block:Title}
  463. <span class="entrytext">{Body}</span>
  464. <div id="info">
  465. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  466. </div>
  467. {/block:Text}
  468.  
  469. {block:Link}
  470. <div class="title"><a href="{URL}">{Name}</a></div>
  471. {block:Description}
  472. {Description}
  473. {/block:Description}
  474. <div id="info">
  475. <a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  476. </div>
  477. {block:Link}
  478.  
  479. {block:Photo}
  480. {block:IndexPage}
  481. <div id="permalink">
  482. posted {timeago} / {dayofweek}, {shortmonth} {dayofmonth}{dayofmonthsuffix}
  483. <br>
  484. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> / <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
  485. </div>
  486. {LinkOpenTag}
  487. <div class="photo"><a href="{permalink}">
  488. <img src="{PhotoURL-HighRes}"alt="{PhotoAlt}"width="250"/></a></div>
  489. {LinkCloseTag}
  490. {/block:IndexPage}
  491. {block:PermalinkPage}
  492. {LinkOpenTag}
  493. <a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"/></a>
  494. {LinkCloseTag}
  495. {/block:PermalinkPage}
  496. {/block:Photo}
  497.  
  498. {block:Photoset}
  499. {block:IndexPage}
  500. <div id="permalink">
  501. posted {timeago} / {dayofweek}, {shortmonth} {dayofmonth}{dayofmonthsuffix}
  502. <br>
  503. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> / <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
  504. </div>
  505. {Photoset-250}
  506. {/block:IndexPage}
  507. {block:PermalinkPage}
  508. <center>
  509. {Photoset-500}
  510. </center>
  511. {/block:PermalinkPage}
  512. {/block:Photoset}
  513.  
  514. {block:Quote}
  515. {Quote}
  516. {block:Source}
  517. <div class="quote">{Source}</div>
  518. {/block:Source}
  519. <div id="info">
  520. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  521. </div>
  522. {/block:Quote}
  523.  
  524. {block:Chat}
  525. {block:Title}
  526. <span class="title">{Title}</span>
  527. {/block:Title}
  528. <ul class="chat">
  529. {block:Lines}
  530. <li class="user_{UserNumber}">
  531. {block:Label}
  532. <span class="label">{Label}</span>
  533. {/block:Label}
  534. {Line}
  535. </li>
  536. {/block:Lines}
  537. </ul>
  538. <div id="info">
  539. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  540. </div>
  541. {/block:Chat}
  542.  
  543. {block:Audio}
  544. <div id="post audio">
  545. <div id="audiocontainer">
  546. <div class="albumart">
  547. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  548. </div>
  549. {block:TrackName}
  550. <div class="audioinfo">{TrackName}</div>
  551. {/block:TrackName}
  552. {block:Artist}
  553. <div class="audioinfotwo">{Artist}</div>
  554. {/block:Artist}
  555. {block:Album}
  556. <div class="audioinfo">{Album}
  557. <div class="margin"></div>
  558. </div>
  559. {/block:Album}
  560. <div class="player">{AudioPlayerWhite}</div>
  561. </div>
  562. </div>
  563. <div id="info">
  564. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  565. </div>
  566. {/block:Audio}
  567.  
  568. {block:Video}
  569. {block:IndexPage}
  570. <center>
  571. {Video-250}
  572. </center>
  573. <div id="info">
  574. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  575. </div>
  576. {/block:IndexPage}
  577. {block:PermalinkPage}
  578. <center>
  579. {Video-500}
  580. </center>
  581. {/block:PermalinkPage}
  582. {block:Video}
  583.  
  584. {block:Answer}
  585. <div id="askbox">
  586. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:6px; box-shadow: 1px 1px 1px #000; padding:1px; background:{color:Ask Icons BG};"/>
  587. <asker>{Asker}:</asker>
  588. <div id="ask">{Question}</div>
  589. <br>
  590. <img src="{PortraitURL-30}" width="30" align="right" style="margin-left:6px; box-shadow: 1px 1px 1px #000; padding:1px; background:{color:Ask Icons BG};"/>
  591. <asker> I answered:</asker>
  592. {Answer}
  593. </div>
  594. {block:IndexPage}
  595. <div id="info">
  596. <a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
  597. </div>
  598. {/block:IndexPage}
  599. {/block:Answer}
  600.  
  601. {block:PermalinkPage}
  602. <center>
  603. <br>
  604.  
  605. {block:Caption}
  606. {Caption}
  607. {/block:Caption}
  608.  
  609. {block:ContentSource}
  610. <a href="{SourceURL}"> </a>
  611. {block:ContentSource}
  612.  
  613. {block:RebloggedFrom}
  614. <a href="{ReblogParentURL}"> </a>
  615. <a href="{ReblogRootURL}"> </a>
  616. {/block:RebloggedFrom}
  617.  
  618. {block:NoteCount}
  619. {NoteCountWithLabel}
  620. {/block:NoteCount}
  621.  
  622. {block:HasTags}
  623. &middot;
  624. {block:Tags}
  625. <a href="TagURL">#{Tag}</a>
  626. {/block:Tags}
  627. {/block:hasTags}
  628. </center>
  629. {/block:PermalinkPage}
  630.  
  631.  
  632. {block:PostNotes}
  633. {PostNotes}
  634. {/block:PostNotes}
  635. </div>
  636.  
  637. {/block:Posts}
  638. </div>
  639. </div>
  640.  
  641. {block:IndexPage}
  642. {block:Pagination}
  643. <div id="pagination">
  644. {block:NextPage}
  645. <a id="nextPage" href="{NextPage}"></a>
  646. {/block:NextPage}
  647. {block:PreviousPage}
  648. <a href="{PreviousPage}"></a>
  649. {/block:PreviousPage}
  650. </div>
  651. {/block:Pagination}
  652. {/block:IndexPage}
  653. {block:IndexPage}
  654. {block:IndexPage}
  655. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  656. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  657.  
  658. <script type="text/javascript">
  659. $(window).load(function () {
  660. var $content = $('#posts');
  661. $content.masonry({itemSelector: '.entry'}),
  662. $content.infinitescroll({
  663. navSelector : 'div#pagination',
  664. nextSelector : 'div#pagination a#nextPage',
  665. itemSelector : '.entry',
  666. loading: {
  667. finishedMsg: '',
  668. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  669. },
  670. bufferPx : 600,
  671. debug : false,
  672. },
  673. // call masonry as a callback.
  674. function( newElements ) {
  675. var $newElems = $( newElements );
  676. $newElems.hide();
  677. // ensure that images load before adding to masonry layout
  678. $newElems.imagesLoaded(function(){
  679. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(400);} );
  680.  
  681.  
  682. });
  683. });
  684. });
  685. </script>
  686. {/block:IndexPage}
  687. </div>
  688. </body>
  689. </html>
Advertisement
Add Comment
Please, Sign In to add comment