Advertisement
xariaaaa

[THEME] #ᴘʀɪɴᴄᴇss97

Aug 10th, 2016
107
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.27 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. <!-- ʙᴀsᴇ ʙʏ ᴇɴᴛᴇʀᴘʀɪᴢᴇʀ. ᴛʜᴇᴍᴇ ʙʏ ᴀʀɪᴀsʀᴘʜ ᴘʟᴇᴀsᴇ ᴅᴏ ɴᴏᴛ sᴛᴇᴀʟ ɪᴛ! ᴇᴅɪᴛɪɴɢ ɪs ᴀʟᴏᴡᴇᴅ, ʙᴜᴛ ᴘʟᴇᴀsᴇ ʟᴇᴀᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛɪɴɢ ɪɴᴛᴀᴄᴛ. -->
  9.  
  10.  
  11. <meta name="image:Trigger" content="http://placehold.it/250x100" />
  12.  
  13. <meta name="text:Link1" content="/" />
  14. <meta name="text:Link2" content="/ask" />
  15. <meta name="text:Link3" content="/" />
  16. <meta name="text:Link4" content="/" />
  17. <meta name="text:Link5" content="/" />
  18. <meta name="text:Link6" content="/" />
  19.  
  20. <meta name="text:Title1" content="Link title" />
  21. <meta name="text:Title2" content="Link title" />
  22. <meta name="text:Title3" content="Link title" />
  23. <meta name="text:Title4" content="Link title" />
  24. <meta name="text:Title5" content="Link title" />
  25. <meta name="text:Title6" content="Link title" />
  26.  
  27.  
  28. <meta name="text:TriggerHover" content="Popup title" />
  29. <meta name="text:TriggerPop" content="Popup for trigger" />
  30. <meta name="text:BlogTitle" content="#PRNICESS97" />
  31. <meta name="text:Description" content="Tiny princess" />
  32.  
  33. <style type="text/css">
  34.  
  35. /* GASARA */
  36. @font-face { font-family: "gasara"; src: url('https://dl.dropbox.com/s/9mird7ef2oyhzbc/gasara.ttf'); }
  37.  
  38. /* DARLESTON */
  39. @font-face { font-family: "darleston"; src: url('https://dl.dropboxusercontent.com/s/pon2nz49g2gofuu/Darleston.otf') }
  40.  
  41. ::-webkit-scrollbar-thumb {
  42. height: auto;
  43. background-color: #be0006;
  44. }
  45.  
  46. ::-webkit-scrollbar {
  47. height: 9px;
  48. width: 3px;
  49. background: #e3e3e3;
  50. background-image: url('http://i.imgur.com/QbFYTkt.png');
  51. }
  52.  
  53. ::-webkit-scrollbar:vertical {
  54. height: 9px;
  55. width: 3px;
  56. background: #e3e3e3;
  57. background-image: url('http://i.imgur.com/QbFYTkt.png');
  58. }
  59.  
  60. body {
  61. background: #e3e3e3;
  62. background-image: url('http://i.imgur.com/QbFYTkt.png');
  63. }
  64.  
  65. a {
  66. outline: none;
  67. color: #be0006;
  68. text-decoration: none;
  69. -moz-outline-style: none;
  70. }
  71.  
  72. img {
  73. border:none;
  74. }
  75.  
  76. blockquote, blockquote blockquote {
  77. margin-left: 5px;
  78. padding-left: 5px;
  79. border-left: 1px solid #be0006;
  80. }
  81.  
  82. blockquote img {
  83. max-width: 235px;
  84. height: auto;
  85. }
  86.  
  87. blockquote blockquote img {
  88. max-width: 180px;
  89. height: auto;
  90. }
  91.  
  92. blockquote img, blockquote blockquote img, #post img, .answer img, .photopost {
  93. opacity: 0.4;
  94. -webkit-filter: grayscale(100%);
  95. -webkit-transition: opacity 0.7s linear;
  96. -webkit-transition: all 0.7s ease-out;
  97. -moz-transition: all 0.7s ease-out;
  98. transition: all 0.7s ease-out;
  99. }
  100.  
  101. blockquote img:hover, blockquote blockquote img:hover, #post img:hover, .answer img:hover, .photopost:hover {
  102. opacity: 1;
  103. -webkit-filter: grayscale(0%);
  104. -webkit-transition: opacity 0.7s linear;
  105. -webkit-transition: all 0.7s ease-out;
  106. -moz-transition: all 0.7s ease-out;
  107. transition: all 0.7s ease-out;
  108. }
  109.  
  110. h1, h2, h3, h4 {
  111. font-family: "Darleston";
  112. font-size: 30px;
  113. text-align: justify;
  114. color: #be0006;
  115. }
  116.  
  117. pre, code, .question {
  118. background-color: #e3e3e3;
  119. background-image: url('http://i.imgur.com/QbFYTkt.png');
  120. padding: 10px;
  121. font-family: "Gasara";
  122. font-size: 8px;
  123. line-height: 10px;
  124. white-space:pre-wrap;
  125. word-wrap:break-word;
  126. }
  127.  
  128. #entries {
  129. width: 290px;
  130. float: right;
  131. margin-right: 230px;
  132. margin-top: 30px;
  133. }
  134.  
  135. #post {
  136. margin-bottom: 40px;
  137. width: 250px;
  138. padding: 20px;
  139. background-color: #efefef;
  140. font-family: "Calibri";
  141. font-size: 10px;
  142. text-align: justify;
  143. }
  144.  
  145. #post b {
  146. font-family: "Calibri";
  147. font-size: 15px;
  148. text-transform: uppercase;
  149. color: #be0006;
  150. }
  151.  
  152. #post i {
  153. font-family: "Gasara";
  154. font-size: 8px;
  155. }
  156.  
  157. #post img {
  158. max-width: 250px;
  159. height: auto;
  160. }
  161.  
  162. .posttitle {
  163. font-family: "Darleston";
  164. font-size: 30px;
  165. text-align: center !important;
  166. }
  167.  
  168. .quote {
  169. font-family: "Darleston";
  170. font-size: 30px;
  171. text-align: justify;
  172. }
  173.  
  174. .source {
  175. font-family: "Gasara";
  176. font-size: 8px;
  177. text-align: right;
  178. }
  179.  
  180. .asker {
  181. font-family: "Darleston";
  182. font-size: 30px;
  183. text-align: center;
  184. margin-bottom: 10px;
  185. }
  186.  
  187. .audio {
  188. padding: 0;
  189. }
  190.  
  191. .audio_container {
  192. overflow: hidden;
  193. position: relative;
  194. width: 100px;
  195. }
  196.  
  197. .soundcloud_audio_player {
  198. width: 100%;
  199. }
  200.  
  201. .tumblr_audio_player {
  202. width: 100%;
  203. }
  204.  
  205. .perma {
  206. margin-top: 20px;
  207. font-family: "Gasara";
  208. font-size: 8px;
  209. text-align: center;
  210. }
  211.  
  212. .pageperma {
  213. margin-top: 20px;
  214. text-align: center;
  215. font-family: "Calibri";
  216. font-size: 12px;
  217. text-transform: uppercase;
  218. }
  219.  
  220. .pageperma:first-letter {
  221. font-family: "Darleston";
  222. font-size: 20px;
  223. }
  224.  
  225. .notes {
  226. margin-left: -15px;
  227. font-family: "Gasara";
  228. font-size: 8px;
  229. text-align: justify;
  230. line-height: 12px;
  231. }
  232.  
  233. .notes img {
  234. display: none;
  235. }
  236.  
  237. #credit {
  238. font-family: "Gasara";
  239. font-size: 8px;
  240. position: fixed;
  241. float: left;
  242. left: 10px;
  243. bottom: 5px;
  244. }
  245.  
  246. #sidebar {
  247. left: 100px;
  248. bottom: 120px;
  249. height: 300px;
  250. width: 400px;
  251. position: fixed;
  252. float: left;
  253. border-bottom: 30px solid white;
  254. }
  255.  
  256. .render {
  257. position: absolute;
  258. z-index: 999999;
  259. top: 00px;
  260. }
  261.  
  262. .desc {
  263. height: 100px;
  264. width: 180px;
  265. padding: 10px;
  266. background-color: white;
  267. margin-left: 200px;
  268. margin-top: 5px;
  269. font-family: "Calibri";
  270. font-size: 10px;
  271. text-transform: uppercase;
  272. text-align: justify;
  273. }
  274.  
  275. .hvr {
  276. height: 20px;
  277. width: 220px;
  278. display: inline-block;
  279. margin-top: 5px;
  280. margin-left: 200px;
  281. }
  282.  
  283. .hh {
  284. width: 20px;
  285. height: 20px;
  286. margin-right: 12px;
  287. display: inline-block;
  288. background-color: #ffffff;
  289. -webkit-transition: opacity 0.7s linear;
  290. -webkit-transition: all 0.7s ease-out;
  291. -moz-transition: all 0.7s ease-out;
  292. transition: all 0.7s ease-out;
  293. }
  294.  
  295. .hh:hover {
  296. border-radius: 50%;
  297. transform: rotate(360deg);
  298. opacity: 0.1;
  299. -webkit-transition: opacity 0.7s linear;
  300. -webkit-transition: all 0.7s ease-out;
  301. -moz-transition: all 0.7s ease-out;
  302. transition: all 0.7s ease-out;
  303. }
  304.  
  305. .title {
  306. width: 200px;
  307. height: auto;
  308. font-family: "Bebas";
  309. color: white;
  310. font-size: 30px;
  311. margin-left: 200px;
  312. margin-top: 5px;
  313. letter-spacing: 3px;
  314. }
  315.  
  316. .img1 {
  317. width: 180px;
  318. padding: 10px;
  319. height: 72px;
  320. background-color: white;
  321. margin-left: 200px;
  322. margin-top: 0px;
  323. }
  324.  
  325. .trigger {
  326. position: absolute;
  327. z-index: 99999999999999;
  328. width: 40px;
  329. height: 40px;
  330. margin-left: 0px;
  331. margin-top: -230px;
  332. transform: rotate(-10deg);
  333. }
  334.  
  335. .trigger img {
  336. height: 40px;
  337. width :auto;
  338. }
  339.  
  340. /* POPUP */
  341.  
  342. /* POPUP BOX */
  343. .popup_block{
  344. top: 50%;
  345. left: 50%;
  346. float: left;
  347. padding: 20px;
  348. display: none;
  349. height: 400px;
  350. color: #000000;
  351. position: fixed;
  352. font-size: 10px;
  353. overflow-x: auto;
  354. overflow-y: hidden;
  355. background: #ffffff;
  356. text-align: justify;
  357. font-family: "Calibri";
  358. z-index: 99999999999999999;
  359. }
  360.  
  361. .popup_block img {
  362. text-align: center;
  363. }
  364.  
  365. *html #e3e3e3 {
  366. position: absolute;
  367. }
  368.  
  369. *html .popup_block {
  370. position: absolute;
  371. }
  372.  
  373. #fade {
  374. top:0px;
  375. left:0px;
  376. width:100%;
  377. opacity: 1;
  378. height:100%;
  379. display: none;
  380. position: fixed;
  381. z-index: 9999999;
  382. background: #e3e3e3;
  383. background-image: url('http://i.imgur.com/QbFYTkt.png');
  384. }
  385.  
  386. #s-m-t-tooltip{
  387. max-width: 200px;
  388. margin-top: 15px;
  389. margin-left: 15px;
  390. padding: 5px;
  391. border-left: 1px solid #be0006;
  392. border-bottom: 1px dotted #be0006;
  393. z-index:9999999999999999999999;
  394. background-color:#ffffff;
  395. color: #000000;
  396. font-family: 'Gasara';
  397. text-align:justify;
  398. font-size: 8px;
  399. line-height: 11px;
  400. letter-spacing: 1px;
  401. text-transform:uppercase;
  402. box-shadow: 0px 0px 10px #e3e3e3;
  403. }
  404. </style>
  405.  
  406. <!-- S-M-T-TOOLTIP JAVA -->
  407.  
  408. <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js'></script>
  409. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  410. <script>
  411. (function($){
  412. $(document).ready(function(){
  413. $("[title]").style_my_tooltips();
  414. });
  415. })(jQuery);
  416. </script>
  417.  
  418. <script type="text/javascript"
  419. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  420. <script>
  421. $(document).ready(function() {
  422. $('a.poplight[href^=#]').click(function() {
  423. var popID = $(this).attr('rel');
  424. var popURL = $(this).attr('href');
  425. var query= popURL.split('?');
  426. var dim= query[1].split('&');
  427. var popWidth = dim[0].split('=')[1];
  428. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  429. var popMargTop = ($('#' + popID).height() + 80) / 2;
  430. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  431. $('#' + popID).css({
  432. 'margin-top' : -popMargTop,
  433. 'margin-left' : -popMargLeft
  434. });
  435. $('body').append('<div id="fade"></div>');
  436. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
  437. return false;
  438. });
  439. $('a.close, #fade').live('click', function() {
  440. $('#fade , .popup_block').fadeOut(function() {
  441. $('#fade, a.close').remove();
  442. });
  443. return false;
  444. });
  445. });
  446. </script>
  447.  
  448. </head>
  449. <body>
  450.  
  451. <div id="trgg" class="popup_block">
  452. <img src="{image:trigger}" /><br />
  453. {text:TriggerPop}
  454. </div>
  455.  
  456. <div id="sidebar">
  457.  
  458. <div class="render"><img src="http://i.imgur.com/Vm9wqAE.png" /></div>
  459.  
  460.  
  461. <div class="img1"><img src="http://i.imgur.com/hYXSzOK.gif" /></div>
  462. <div class="title">{text:BlogTitle}</div>
  463. <div class="hvr">
  464. <a href="{text:Link1}" title="{text:Title1}"><div class="hh"></div></a>
  465. <a href="{text:Link2}" title="{text:Title2}"><div class="hh"></div></a>
  466. <a href="{text:Link3}" title="{text:Title3}"><div class="hh"></div></a>
  467. <a href="{text:Link4}" title="{text:Title4}"><div class="hh"></div></a>
  468. <a href="{text:Link5}" title="{text:Title5}"><div class="hh"></div></a>
  469. <a href="{text:Link6}" title="{text:Title6}"><div class="hh"></div></a>
  470. </div>
  471.  
  472. <div class="desc">{Text:Description}</div>
  473.  
  474. <div class="trigger">
  475. <a href="#?w=250" title="{text:TriggerHover}" rel="trgg" class="poplight">
  476. <img src="http://25.media.tumblr.com/a8688f91f28ccb8a429caad7b697cdf9/tumblr_muf7t4dAe71s1jpc5o1_500.gif" />
  477. </a>
  478. </div>
  479. </div>
  480.  
  481. <div id="entries">
  482. {block:Posts}
  483. <div id="post">
  484.  
  485. <!-- TEXT POSTS -->
  486. {block:Text}
  487. <div class="posttitle">{block:Title}{Title}{/block:Title}</div>
  488. {Body}
  489. {/block:Text}
  490.  
  491. <!-- PHOTO POSTS -->
  492. {block:Photo}
  493. {LinkOpenTag}<img src="{PhotoURL-250}">{LinkCloseTag}
  494. {block:Caption}{Caption}{/block:Caption}
  495. {/block:Photo}
  496.  
  497. <!-- PHOTOSET POSTS -->
  498. {block:Photoset}
  499. <div class="photopost">{Photoset-250}</div>
  500. {block:Caption}{Caption}{/block:Caption}
  501. {/block:Photoset}
  502.  
  503. <!-- QUOTE POSTS -->
  504. {block:Quote}
  505. <div class="quote">{Quote}</div>
  506. <div class="source">{block:Source} —{Source}{/block:Source}</div>
  507. {/block:Quote}
  508.  
  509. <!-- LINK POSTS -->
  510. {block:Link}
  511. <div class="posttitle"><a href="{URL}" {Target}>{Name}</a></div>
  512. {block:Description}{Description}{/block:Description}
  513. {/block:Link}
  514.  
  515. <!-- CHAT POSTS -->
  516. {block:Chat}
  517. <div class="posttitle">{block:Title}{Title}{/block:Title}</div>
  518. {block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}
  519. {/block:Chat}
  520.  
  521.  
  522. <!-- ASK POST -->
  523. {block:Answer}
  524. <div class="asker">{Asker}</div>
  525. <div class="question">{Question}</div>
  526. <div class="answer">{Answer}</div>
  527. {/block:Answer}
  528.  
  529. <!-- AUDIO POST -->
  530. {block:Audio}
  531. <div class="audioContainer">
  532. {block:AudioEmbed}{AudioEmbed color="white"}{/block:AudioEmbed}
  533. </div>
  534. {block:Caption}{Caption}{/block:Caption}
  535. {/block:Audio}
  536.  
  537. <!-- VIDEO POST -->
  538. {block:Video}
  539. <div class="photopost">{Video-250}</div>
  540. {block:Caption}{Caption}{/block:Caption}
  541. {/block:Video}
  542.  
  543. <!-- POST PERMA -->
  544.  
  545. {block:IndexPage}
  546. <div class="perma">
  547. <a href="{Permalink}" title="{block:Date}{DayOfMonth}/{MonthNumberWithZero}/{ShortYear}{/block:Date}">POSTED</a> ×
  548. <a href="{Permalink}" title="{block:HasTags}{block:Tags}#{Tag} {/block:Tags}{/block:HasTags}">TAGGED</a> ×
  549. <a href="{Permalink}" title="{NoteCountWithLabel}">NOTES</a> ×
  550. <a href="{ReblogURL}" title="Get it?">REBLOG</a>
  551. </div>
  552. {/block:IndexPage}
  553.  
  554. {block:PermalinkPage}
  555. <div class="pageperma">
  556. Posted on {block:Date}{DayOfMonth} {Month} '{ShortYear}{/block:Date}<br />
  557. Tagged as {block:HasTags}{block:Tags} <a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  558. </div>
  559. <div class="notes">
  560. {block:PostNotes}{PostNotes}{/block:PostNotes}
  561. </div>
  562. {/block:PermalinkPage}
  563. </div> <!-- END OF POST -->
  564. {/block:Posts}
  565. </div> <!-- END OF ENTRIES -->
  566.  
  567. <div id="credit">
  568. <a href="http://97brk.tumblr.com/" title="THEME BY 97BRK.">CREDIT</a>
  569. </div>
  570. </body>
  571. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement