Advertisement
stephanieofrp

spooktacular theme v.1 by stephanieofrp

Oct 22nd, 2018
154
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.23 KB | None | 0 0
  1.  
  2. <!---- spooktacular by stephanieofrp
  3.  
  4. >> don't remove the credit
  5. >> if u need help mssg me
  6. >> don't steal it
  7. >> don't use as a base
  8. >> edit for personal use only
  9.  
  10. --->
  11.  
  12.  
  13. <html>
  14.  
  15.  
  16. <head>
  17.  
  18.  
  19. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  20. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  21. <link rel="shortcut icon" href="{Favicon}">
  22.  
  23. <!--- Photos --->
  24. <meta name="image:background" content="">
  25. <meta name="image:sidebar" content="">
  26.  
  27. <!--- Colors --->
  28. <meta name="color:background" content="#1a1010">
  29. <meta name="color:container" content="#412727">
  30. <meta name="color:post bg" content="#4f3434">
  31. <meta name="color:title" content="#704343">
  32. <meta name="color:title shadow" content="#151515">
  33. <meta name="color:text" content="#c6c6c6">
  34. <meta name="color:link" content="#ccafaf">
  35. <meta name="color:hover" content="#9e9e9e">
  36. <meta name="color:pagi" content="#cccccc">
  37. <meta name="color:info text" content="#cccccc">
  38. <meta name="color:info bg" content="#5d3d3d">
  39. <meta name="color:scrollbar" content="#b39696">
  40.  
  41.  
  42. <!--- Links --->
  43. <meta name="text:link 1 label" content="Home">
  44. <meta name="text:link 1" content="/">
  45. <meta name="text:link 2 label" content="FAQ">
  46. <meta name="text:link 2" content="/">
  47. <meta name="text:link 3 label" content="Navi">
  48. <meta name="text:link 3" content="/">
  49.  
  50.  
  51. <link href="https://fonts.googleapis.com/css?family=Gloria+Hallelujah|Patrick+Hand|Roboto" rel="stylesheet">
  52.  
  53.  
  54.  
  55.  
  56. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  57.  
  58.  
  59. <style type="text/css">
  60.  
  61.  
  62.  
  63.  
  64. #s-m-t-tooltip{
  65. font-size:9px;
  66. position:absolute;
  67. margin-top:15px;
  68. font-family:arial;
  69. border:1px solid {color:container};
  70. background:#f0f0f0;
  71. z-index:9999;
  72. color:{color:text};
  73. background-color:#f0f0f0;
  74. text-transform:lowercase;
  75. padding:3px 3px 3px 3px;
  76. -webkit-transition:all 0.2s;
  77. -moz-transition:all 0.2s;
  78. -ms-transition:all 0.2s;
  79. -o-transition:all 0.2s;
  80. transition:all 0.2s;
  81. }
  82.  
  83.  
  84. ::-webkit-scrollbar {
  85. width:2px;
  86. height:2px;
  87. background-color:transparent ;}
  88. ::-webkit-scrollbar-thumb {
  89. background-color:{color:scrollbar};
  90. }
  91.  
  92.  
  93. /* CREDIT ! DO NOT TOUCH */
  94.  
  95.  
  96. #cred{
  97. position:fixed;
  98. display:block;
  99. bottom: 14px;
  100. right: 12px;
  101. text-align:center;
  102. background-color:transparent;
  103. color:{color:container};
  104. width:35px;
  105. font-weight:bold;
  106. font-size:10px;
  107. letter-spacing:2px;
  108. }
  109.  
  110.  
  111.  
  112. /* BASICS */
  113.  
  114. pre{
  115. text-align:left;
  116. font-weight:bold;
  117. font-size:11.7px;
  118. padding:4px;
  119. border-bottom:3px solid {color:container};
  120. color:{color:text};
  121. }
  122.  
  123. h1{
  124. text-align:center;
  125. text-transform:uppercase;
  126. font-size:17px;
  127. padding:5px;
  128. color:{color:text};
  129. }
  130.  
  131. h2{
  132. text-align:center;
  133. text-transform:uppercase;
  134. font-size:17px;
  135. padding:5px;
  136. color:{color:text};
  137. }
  138.  
  139. h3{
  140. text-align:center;
  141. text-transform:uppercase;
  142. font-size:17px;
  143. padding:5px;
  144. color:{color:text};
  145. }
  146.  
  147. blockquote{
  148. border-left:2px solid #dadada;
  149. color:#dadada;
  150. padding:7px;
  151. padding-top:0px;
  152. padding-bottom:0px;
  153. margin-left:9px;
  154. margin-right:6px;
  155. }
  156.  
  157. img{
  158. max-width:100%;
  159. }
  160.  
  161.  
  162. pre {
  163. padding:5px;
  164. font-family:arial;
  165. white-space: pre-wrap;
  166. line-height:120%;
  167. }
  168.  
  169. small {
  170. font-size:11px;
  171. }
  172.  
  173. big{
  174. font-size:15px;
  175. }
  176.  
  177. img{
  178. max-width:100%;
  179. }
  180.  
  181. body{
  182. background:{color:Background} url('{image:Background}') top left fixed repeat;
  183. color:{color:Text};
  184. background-image:;
  185. background-attachment:fixed;
  186.  
  187. }
  188.  
  189. a{
  190. color:{color:link};
  191. font-family: 'Gloria Hallelujah', cursive;
  192. text-decoration:none;
  193. }
  194.  
  195. a:hover{
  196. color: {color:hover};
  197. -moz-transition-duration:0.3s;
  198. -webkit-transition-duration:0.3s;
  199. -o-transition-duration:0.3s;
  200. }
  201.  
  202. /* SIDEBAR */
  203.  
  204.  
  205.  
  206. #titlebg{
  207. position:fixed;
  208. width:312px;
  209. height:40px;
  210. margin-left:500px;
  211. margin-top:47px;
  212. font-family: 'Gloria Hallelujah', cursive;
  213. z-index:40;
  214. color:{color:title};
  215. text-align:center;
  216. font-size:32px;
  217. padding-top:13px;
  218. padding-left:11px;
  219. padding-right:11px;
  220. padding-bottom:11px;
  221. font-weight:bold;
  222. text-shadow: 2px 2px {color:title shadow};
  223. }
  224.  
  225.  
  226. #sb{
  227. position:fixed;
  228. margin-left:453px;
  229. margin-top:10px;
  230. width:416px;
  231. border:10px solid {color:container};
  232. height:140px;
  233. z-index:30;
  234. -webkit-border-radius: 10px;
  235. border-radius:10px 10px 10px 10px;
  236. }
  237.  
  238.  
  239.  
  240.  
  241.  
  242.  
  243.  
  244.  
  245. #description{
  246. overflow-y:hidden;
  247. z-index:50;
  248. position:fixed;
  249. margin-left:455px;
  250. margin-top:14px;
  251. width:394px;
  252. height:117px;
  253. padding-bottom:12px;
  254. padding-top:20px;
  255. padding-left:19px;
  256. padding-right:19px;
  257. text-align:center;
  258. background-color:{color:container};
  259. font-family: 'Roboto', sans-serif;
  260. line-height:17px;
  261. font-size:13px;
  262. opacity:0;
  263.  
  264. transition-delay:0.1s;
  265. -webkit-transition-delay:0.1s;
  266. transition-duration: 0.4s;
  267. -moz-transition-duration:0.2s;
  268. -webkit-transition-duration:0.8s;
  269. -o-transition-duration:0.2s;
  270. }
  271.  
  272.  
  273. #description:hover { opacity:1;
  274. transition-delay:0.1s;
  275. -webkit-transition-delay:0.1s;
  276. transition-duration: 0.4s;
  277. -moz-transition-duration:0.2s;
  278. -webkit-transition-duration:0.8s;
  279. -o-transition-duration:0.2s;}
  280.  
  281.  
  282.  
  283. #pagi{
  284. position:fixed;
  285. width:341px;
  286. height:150px;
  287. margin-left:663px;
  288. margin-top:643px;
  289. text-align:center;
  290. line-height:150%;
  291. font-family: 'Gloria Hallelujah', cursive;
  292. text-transform:uppercase;
  293. color:{color:pagi};
  294. font-size:12px;
  295. z-index:30;
  296. }
  297.  
  298.  
  299. #pagi a{
  300. background-color:transparent;
  301. width:181px;
  302. height:20px;
  303. padding:3px;
  304. padding-bottom:4.5px;
  305. font-weight:bold;
  306. letter-spacing:3px;
  307. font-family: 'Gloria Hallelujah', cursive;
  308. margin-bottom:5px;
  309. margin-right:2px;
  310. margin-left:5px;
  311. color:{color:pagi};
  312. }
  313.  
  314. #pagi a:hover{
  315. -moz-transition-duration:0.3s;
  316. -webkit-transition-duration:0.3s;
  317. -o-transition-duration:0.3s;
  318. color:{color:hover};
  319. }
  320.  
  321.  
  322.  
  323.  
  324.  
  325. #pagibg{
  326. position:fixed;
  327. width:108px;
  328. height:28px;
  329. margin-left:777px;
  330. margin-top:636px;
  331. background-color:{color:container};
  332. border:2px solid {color:container};
  333. border-radius:0px 0px 10px 10px;
  334.  
  335. transition-delay:0.1s;
  336. -webkit-transition-delay:0.1s;
  337. transition-duration: 0.4s;
  338. -moz-transition-duration:0.2s;
  339. -webkit-transition-duration:0.8s;
  340. -o-transition-duration:0.2s;
  341. }
  342.  
  343.  
  344. #pagibg:hover { opacity:1;
  345. transition-delay:0.1s;
  346. -webkit-transition-delay:0.1s;
  347. transition-duration: 0.4s;
  348. -moz-transition-duration:0.2s;
  349. -webkit-transition-duration:0.8s;
  350. -o-transition-duration:0.2s;}
  351.  
  352.  
  353.  
  354. /* LINKS */
  355.  
  356.  
  357.  
  358. .links {
  359. position:fixed;
  360. margin-top:643px;
  361. margin-left:453px;
  362.  
  363.  
  364. }
  365.  
  366. .links a {
  367. width:104px;
  368. margin-bottom:8px;
  369. height:7px;
  370. text-align:center;
  371. padding-left:15px;
  372. padding-right:15px;
  373. padding-bottom:8px;
  374. padding-top:9px;
  375. letter-spacing:3px;
  376. color:{color:text};
  377. font-family: 'Gloria Hallelujah', cursive;
  378. background-color:{color:container};
  379. font-size:10px;
  380. font-weight:bold;
  381. text-transform:uppercase;
  382. border:2px solid {color:container};
  383. display:inline;
  384. border-radius:0px 0px 10px 10px;
  385. }
  386.  
  387.  
  388. .links a:hover {
  389. -moz-transition-duration:0.3s;
  390. -webkit-transition-duration:0.3s;
  391. -o-transition-duration:0.3s;
  392. color:{color:hover};
  393. }
  394.  
  395.  
  396.  
  397.  
  398. /* POSTS SECTION */
  399.  
  400.  
  401. .container{
  402. position:fixed;
  403. margin-top:160px;
  404. padding-top:10px;
  405. margin-left:453px;
  406. width:436px;
  407. height:466px;
  408. background:{color:container};
  409. z-index:20;
  410. overflow-y: auto;
  411. overflow-x:hidden;
  412. }
  413.  
  414.  
  415. #entries{
  416. margin-top:00px;
  417. margin-left:-10px;
  418. }
  419.  
  420. #posts{
  421. margin-left:20px;
  422. width:400px;
  423. background-color:{color:post bg};
  424. border:1px solid {color:post bg};
  425. color:{color:Text};
  426. padding-right:7px;
  427. padding-left:7px;
  428. padding-top:15px;
  429. padding-bottom:18px;
  430. margin-bottom:8px;
  431. font-size:12px;
  432. line-height:130%;
  433. font-family: 'Roboto', sans-serif;
  434. border-radius:10px 10px 10px 10px;
  435. }
  436.  
  437.  
  438. #info{
  439. width:400px;
  440. margin-left:0px;
  441. color:{color:info text};
  442. font-family: 'Roboto', sans-serif;
  443. text-align:center;
  444. margin-bottom:-13px;
  445. font-size:9px;
  446. padding-top:-15px;
  447. padding-bottom:8px;
  448. background:{color:info bg};
  449. border-radius:10px 10px 10px 10px;
  450. border:1px solid {color:info bg};
  451. }
  452.  
  453.  
  454.  
  455. #info a{
  456. color:{color:info text};
  457. font-family: 'Roboto', sans-serif;
  458. text-align:center;
  459.  
  460. }
  461.  
  462.  
  463. info a:hover{
  464. -moz-transition-duration:0.3s;
  465. -webkit-transition-duration:0.3s;
  466. -o-transition-duration:0.3s;
  467. color:{color:hover};
  468. }
  469.  
  470.  
  471.  
  472.  
  473.  
  474.  
  475.  
  476. .questions{
  477. color:{color:text};
  478. background-color:{color:ask bg};
  479. font-size:11px;
  480. line-height:125%;
  481. padding:1px;
  482. padding-top:7px;
  483. text-align:center;
  484. }
  485.  
  486.  
  487.  
  488.  
  489.  
  490.  
  491.  
  492. .answer{
  493. color:{color:text};
  494. text-align:left;
  495. margin-top:1px;
  496.  
  497. }
  498.  
  499.  
  500.  
  501.  
  502.  
  503.  
  504.  
  505. </style>
  506.  
  507. </head>
  508.  
  509. <body>
  510.  
  511.  
  512.  
  513. <div id="titlebg">{Title}</div>
  514. <div id="sb"><img src="{image:sidebar}"></div>
  515. <div id="description">{Description}</div>
  516.  
  517.  
  518. <div class="links">
  519. <a href="{text:link 1}">{text:link 1 label}</a>
  520. <a href="{text:link 2}">{text:link 2 label}</a>
  521. <a href="{text:link 3}">{text:link 3 label}</a>
  522. </div>
  523.  
  524.  
  525.  
  526. <div id="pagi">
  527.  
  528. {block:PreviousPage}<a href="{PreviousPage}">← </a>{/block:PreviousPage}
  529. {block:NextPage}<a href="{NextPage}"> →</a>{/block:NextPage}
  530. </div></div>
  531. <div id="pagibg"></div>
  532.  
  533.  
  534.  
  535. <div class="container">
  536. <div id="entries">
  537.  
  538. {block:Posts}
  539.  
  540. <div id="posts">
  541.  
  542.  
  543.  
  544. {block:Text}{block:Title}<h2>{Title}</h2>{/block:Title}{Body}{/block:Text}
  545.  
  546.  
  547.  
  548. {block:Photo}<center><img src="{PhotoURL-400}"/></center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  549.  
  550. {block:Photoset}<center>{Photoset-400}</center>
  551. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  552.  
  553.  
  554. {block:Quote}
  555. <h2>{Quote}</h2>
  556. <div align="center">
  557. {block:Source}<h1>-{Source}</h1>{/block:Source}
  558. </div>
  559. {/block:Quote}
  560.  
  561.  
  562. {block:Video}
  563. {Video-400}<br>
  564. {block:Caption}{Caption}{/block:Caption}
  565. {/block:Video}
  566.  
  567.  
  568. {block:Link}
  569. <a href="{URL}" class="link" {Target}><h2>{Name}</h2></a><BR>
  570. {block:Description}{Description}{/block:Description}
  571. {/block:Link}
  572.  
  573. {block:Chat}
  574. {block:Title}<h2>{Title}</h2>{/block:Title}
  575. {block:Lines}
  576. {block:Label}
  577. <p><b>{Label}</b>
  578. {/block:Label}
  579. &nbsp;{Line}<p>
  580. {/block:Lines}
  581. {/block:Chat}
  582.  
  583. {block:Audio}{block:AlbumArt}<img src="{AlbumArtURL}" width="50px" height="50px" align="right"/>{/block:AlbumArt}
  584. {block:TrackName}<b>{TrackName}</b>{/block:TrackName} x
  585. {block:Artist}<b>{Artist}</b>{/block:Artist}<p>
  586. <span class="audio">{AudioPlayerBlack}</left></span>
  587. {/block:ExternalAudio}
  588. {/block:Audio}
  589.  
  590.  
  591. {block:Answer}<div class="questions"><div style='border-bottom:solid 1px #cccccc; padding-bottom:5px; line-height:150%; text-align: center;'><b>{Asker} said: </b> {Question} </div><div class="answer">{Answer}</div></div>{/block:answer}
  592.  
  593.  
  594. <br><div id="info"><p>{block:Date}<div style="text-align:center"><a href="{Permalink}">{TimeAgo}</a> • <a href="{Permalink}">{NoteCount}</a> • <a href="{ReblogParentURL}">VIA</a> • <a href="{SourceURL}">SOURCE</a></div>{/block:Date}
  595.  
  596. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}</div>
  597. </div>
  598. {/block:Posts}
  599.  
  600. </div>
  601.  
  602.  
  603. </div>
  604. </body>
  605. <div id="cred"><a href="http://stephanieofrp.tumblr.com/tagged/mine:%20theme">☆彡</a></div>
  606.  
  607.  
  608. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement