Advertisement
quirons

basic, seven

Feb 7th, 2015
715
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.62 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. BASE CODE BY @QUIRONS.
  8. - feel free to delete this and put your credits!
  9. - don't redistribute this exact code
  10.  
  11. -->
  12.  
  13. {block:Description}
  14. <meta name="description" content="{MetaDescription}" />
  15. {/block:Description}
  16.  
  17. <meta charset="utf-8">
  18. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22.  
  23. <!-- SCRIPTS -->
  24.  
  25. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  26. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  27. <script>
  28. (function($){
  29. $(document).ready(function(){
  30. $("a[title]").style_my_tooltips({
  31. tip_follows_cursor:true,
  32. tip_delay_time:90,
  33. tip_fade_speed:600,
  34. attribute:"title"
  35. });
  36. });
  37. })(jQuery);
  38. </script>
  39.  
  40. <!-- METAS -->
  41.  
  42. <meta name="color:background" content="#ffffff"/>
  43. <meta name="color:text" content="#000000"/>
  44. <meta name="color:links" content="#000000"/>
  45. <meta name="image:sidebar image" content=""/>
  46.  
  47. <meta name="text:Link1" content="Link 1"/>
  48. <meta name="text:Link2" content="Link 2"/>
  49. <meta name="text:Link3" content="Link 3"/>
  50. <meta name="text:URL1" content="URL 1"/>
  51. <meta name="text:URL2" content="URL 2"/>
  52. <meta name="text:URL3" content="URL 3"/>
  53.  
  54. <style type="text/css">
  55.  
  56. /* -------- SCROLLBAR -------- */
  57.  
  58. ::-webkit-scrollbar {width: 2px;}
  59. ::-webkit-scrollbar-track {background:none;}
  60. ::-webkit-scrollbar-thumb {background:black;}
  61. ::-webkit-scrollbar-thumb:window-inactive {background: transparent;}
  62. ::-webkit-scrollbar-thumb:horizontal {display:none;}
  63.  
  64. /* -------- TOOLTIPS -------- */
  65.  
  66. #s-m-t-tooltip {
  67. max-width:300px;
  68. margin:15px;
  69. padding:5px;
  70. background-color:black;
  71. font-family:helvetica;
  72. font-size:12px;
  73. color:white;
  74. z-index:999999999999999999999999999999999999;
  75. }
  76.  
  77. /* -------- BASICS -------- */
  78.  
  79. body {
  80. color:{color:text};
  81. font-family:helvetica, arial, times;
  82. background-color:{color:background};
  83. font-size:11px;
  84. }
  85.  
  86. a {
  87. text-decoration:none;
  88. font-weight:bold;
  89. color:{color:links};
  90. -webkit-transition: all .3s;
  91. -moz-transition: all .3s;
  92. -o-transition: all .3s;
  93. -ms-transition: all .3s;
  94. transition: all .3s;
  95. }
  96.  
  97. a:hover {
  98. opacity:.75;
  99. }
  100.  
  101. h1 {
  102. text-transform:uppercase;
  103. font-size:13px;
  104. }
  105.  
  106. #pagination {
  107. font-weight:bold;
  108. color:{color:links};
  109. margin-top:-85px;
  110. margin-bottom:-75px;
  111. text-align:center;
  112. }
  113.  
  114. #pagination a {
  115. color:{color:links};
  116. }
  117.  
  118. /* ------- SIDEBAR ------ */
  119.  
  120. #sidebar img {
  121. width:120px;
  122. display:block;
  123. margin-bottom:15px;
  124. }
  125.  
  126. #sidebar {
  127. display:block;
  128. color:{color:text};
  129. position:fixed;
  130. float:left;
  131. width:120px;
  132. padding:15px 15px 10px 15px;
  133. overflow:hidden;
  134. border:1px solid black;
  135. left:230px;
  136. top:300px;
  137. -webkit-transition: all .9s;
  138. -moz-transition: all .9s;
  139. -o-transition: all .9s;
  140. -ms-transition: all .9s;
  141. transition: all .9s;
  142. }
  143.  
  144. #sblinks {
  145. margin-top:10px;
  146. padding-top:5px;
  147. border-top:1px solid black;
  148. }
  149.  
  150. #sblinks a {
  151. display:inline-block;
  152. padding:2.5px;
  153. }
  154.  
  155. #sblinks a:last-child {
  156. padding-right:2.5px;
  157. }
  158.  
  159. /* ------- POSTS ------- */
  160.  
  161. #entries {
  162. margin-top:75px;
  163. margin-left:450px;
  164. position:static;
  165. float:left;
  166. }
  167.  
  168. #post {
  169. border:1px solid black;
  170. padding:20px 20px 0px 20px;
  171. width:500px;
  172. margin-bottom:135px;
  173. -webkit-transition: ease .5s;
  174. -moz-transition: ease .5s;
  175. -o-transition: ease .5s;
  176. -ms-transition: ease .5s;
  177. transition: ease .5s;
  178. }
  179.  
  180. #tags {
  181. color:{color:links};
  182. -webkit-transition: ease .9s;
  183. -moz-transition: ease .9s;
  184. -o-transition: ease .9s;
  185. -ms-transition: ease .9s;
  186. transition: ease .9s;
  187. padding-top:15px;
  188. margin-bottom:20px;
  189. margin-top:20px;
  190. border-top:1px solid {color:links};
  191. }
  192.  
  193. blockquote {
  194. margin-left:15px;
  195. border-left:1px solid #2f2f2f;
  196. padding:5px 0px 5px 30px;
  197. }
  198.  
  199. .pic, video {
  200. min-width:500px;
  201. }
  202.  
  203. .source {
  204. text-align:right;
  205. }
  206.  
  207. ul.chat {
  208. list-style:none;
  209. }
  210.  
  211. .chat span {
  212. margin-left:-30px;
  213. float:left;
  214. }
  215.  
  216. .person {
  217. font-weight:bold;
  218. margin-right:5px;
  219. }
  220.  
  221. #ask {
  222. color:{color:text};
  223. padding:10px;
  224. border:1px solid black;
  225. }
  226.  
  227. #ask a {
  228. color:{color:text};
  229. }
  230.  
  231. .comma:last-child {
  232. display:none;
  233. }
  234.  
  235. /* ------- MUSIC ------- */
  236.  
  237. #audioinfo {
  238. background:#f0f0f0;
  239. color:black;
  240. text-align:center;
  241. text-transform:uppercase;
  242. width:390px;
  243. display:inline-block;
  244. position:absolute;
  245. margin-left:5px;
  246. height:100px;
  247. }
  248.  
  249. .info {
  250. margin-top:20px;
  251. padding:20px;
  252. text-align:center;
  253. }
  254.  
  255. .cover {
  256. width:100px;
  257. z-index:99;
  258. position:relative;
  259. -webkit-filter: Grayscale(100%);
  260. -webkit-transition-duration: 0.8s;
  261. -moz-transition-duration:0.8s;
  262. transition-duration:0.8s;
  263. -o-transition-duration:0.8s;
  264. }
  265.  
  266. #audio:hover .cover {
  267. -webkit-filter: Grayscale(0%);
  268. -webkit-transition: all 0.5s ease-out;
  269. -moz-transition: all 0.5s ease-out;
  270. transition: all 0.5s ease-out;
  271. }
  272.  
  273. .playbutton {
  274. width: 20px;
  275. height: 35px;
  276. overflow: hidden;
  277. z-index: 9999;
  278. margin-left:17.5px;
  279. padding-bottom:7.5px;
  280. padding-top:15px;
  281. }
  282.  
  283. .playbox {
  284. background-color:black;
  285. position: absolute;
  286. z-index: 900;
  287. margin-top: 25px;
  288. margin-left: 22.5px;
  289. padding-right:22.5px;
  290. opacity:.75;
  291. border-radius:50%;
  292. }
  293.  
  294. /* ------- NOTES ------- */
  295.  
  296. ol.notes {
  297. display:block;
  298. text-align:left;
  299. list-style:none;
  300. margin-left:-40px;
  301. }
  302.  
  303. ol.notes li.note{
  304. padding-bottom:5px;
  305. }
  306.  
  307. .pagenotes {
  308. margin-top:-75px;
  309. margin-bottom:60px;
  310. }
  311.  
  312. .pagenotes img{
  313. padding-right:5px;
  314. padding-top:5px;
  315. margin-bottom:-5px;
  316. display:none;
  317. }
  318.  
  319. </style>
  320. </head>
  321. <body>
  322.  
  323. <div id="sidebar">
  324. <a href="/" title="refresh"><img src="{image:sidebar image}"/></a>
  325. {Description}
  326. <div id="sblinks">
  327. <a href="{text:URL1}">{text:Link1}</a>
  328. <a href="{text:URL2}">{text:Link2}</a>
  329. <a href="{text:URL3}">{text:Link3}</a>
  330. </div>
  331. </div>
  332.  
  333. <!-- POSTS -->
  334.  
  335. <div id="entries">
  336.  
  337. {block:Posts}
  338.  
  339. <div id="post">
  340.  
  341. <!-- VIA/SOURCE FIX -->
  342.  
  343. {block:ContentSource}
  344. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  345. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  346. {/block:SourceLogo}
  347. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  348. {/block:ContentSource}
  349.  
  350. {block:Text}
  351. {block:Title}
  352. <h1><a href="{Permalink}">{Title}</a></h1>
  353. {/block:Title}
  354. {Body}
  355. {/block:Text}
  356.  
  357. {block:Photo}
  358. {LinkOpenTag}
  359. <img class="pic" src="{PhotoURL-500}" alt="{PhotoAlt}" />
  360. {LinkCloseTag}
  361. {/block:Photo}
  362.  
  363. {block:Photoset}
  364. {Photoset-500}
  365. {/block:Photoset}
  366.  
  367. {block:Quote}
  368. {Quote}
  369. {block:Source}
  370. <div class="source"><br>{Source}</div>
  371. {/block:Source}
  372. {/block:Quote}
  373.  
  374. {block:Link}
  375. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  376. {block:Description}{Description}{/block:Description}
  377. {/block:Link}
  378.  
  379. {block:Chat}
  380. <ul class="chat">
  381. {block:Lines}
  382. <li class="{Alt}">
  383. {block:Label}<span class="person">{Label}</span>{/block:Label}
  384. <p> {Line} </p></li>
  385. {/block:Lines}
  386. </ul>
  387. {/block:Chat}
  388.  
  389. {block:Audio}
  390. <div id="audio">
  391. <div class="playbox"><div class="playbutton">
  392. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  393. </div></div>
  394. {block:AlbumArt}<img src="{AlbumArtURL}" class="cover">{/block:AlbumArt}
  395. <div id="audioinfo">
  396. <div class="info">
  397. {block:TrackName}
  398. <b>{TrackName}</b><br />
  399. {/block:TrackName}
  400. {block:Artist}
  401. <b style="opacity:.8">{Artist}</b>
  402. {/block:Artist}
  403. {block:Album}
  404. <span style="padding-left:7.5px;opacity:.8">{Album}</span>
  405. {/block:Album}
  406. </div></div>
  407. </div>
  408. {/block:Audio}
  409.  
  410. {block:Video}
  411. {Video-500}
  412. {/block:Video}
  413.  
  414. {block:Answer}
  415. <div id="ask">
  416. <b style="text-transform:lowercase;">{Asker}: </b>
  417. {Question}
  418. </div>
  419. <div id="answer">{Answer}</div>
  420. {/block:Answer}
  421.  
  422. {block:Caption}
  423. {Caption}
  424. {/block:Caption}
  425.  
  426. {block:Date}
  427. <a href="{Permalink}">
  428. <div id="tags">
  429. {block:Date}<span style="text-transform:lowercase;">
  430. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix}, {TimeAgo}</span>
  431. {/block:Date}
  432. </a>
  433.  
  434. {block:NoteCount}
  435. <a href="{Permalink}"> + {NoteCount} </a>
  436. {/block:NoteCount}
  437.  
  438. <!--VIA AND SOURCE-->
  439. {block:RebloggedFrom} /
  440. <a href="{ReblogParentURL}">via</a>
  441. {/block:RebloggedFrom}
  442. {block:ContentSource}
  443. & <a href="{SourceURL}">source</a>
  444. {/block:ContentSource}
  445. {block:RebloggedFrom}{/block:RebloggedFrom}
  446.  
  447. {block:HasTags}
  448. / <b>tag:</b>
  449. {block:Tags}
  450. <a href="{TagURL}"> {Tag}</a><span class="comma">,</span>
  451. {/block:Tags}
  452. {/block:HasTags}
  453. </div>
  454. {/block:Date}
  455.  
  456. </div>
  457.  
  458. <!--POST NOTES-->
  459.  
  460. {block:PostNotes}
  461. <div class="pagenotes">{PostNotes-16}</div>
  462. {/block:PostNotes}
  463.  
  464. {/block:Posts}
  465.  
  466. {block:Pagination}
  467. <div id="pagination">
  468. {block:PreviousPage}
  469. <a href="{PreviousPage}">Previous</a> |
  470. {/block:PreviousPage}
  471. {block:NextPage}
  472. <a href="{NextPage}">Next</a>
  473. {/block:NextPage}
  474. </div>
  475. {/block:Pagination}
  476.  
  477. </div>
  478.  
  479. </body>
  480. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement