Advertisement
thehandyblog

Basic Theme #1

Aug 9th, 2012
281
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.75 KB | None | 0 0
  1. <html>
  2.  
  3. <!--
  4.  
  5. Theme by Asyrral.
  6. Please don't remove the credits :)
  7.  
  8. --->
  9.  
  10. <head>
  11.  
  12. <meta name="color:Background" content="#f3f3f3"/>
  13. <meta name="color:posts" content="#ffffff"/>
  14. <meta name="color:headers" content="#000"/>
  15. <meta name="color:text" content="#353535"/>
  16. <meta name="color:bold texts" content="#000">
  17. <meta name="color:links" content="#949191"/>
  18. <meta name="color:links hover" content="#fff"/>
  19. <meta name="color:sidebar" content="#ffffff">
  20. <meta name="color:blockquote" content="#000">
  21. <meta name="color:blockquote text" content="#acacac">
  22. <meta name="color:scrollbar" content="#9ee2ec"/>
  23. <meta name="color:scrollbar background" content="#f3f3f3"/>
  24. <meta name="color:chat background" content="#ccc">
  25. <meta name="color:navigation bg" content="#fff">
  26. <meta name="color:navigation text" content="#353535">
  27. <meta name="color:question background" content="#f7f7f7"/>
  28. <meta name="color:permalink text" content="#111"/>
  29. <meta name="color:permalink hover" content="#ccc"/>
  30.  
  31. <meta name="image:Background" content=""/>
  32. <meta name="image:sidebar" content="http://static.tumblr.com/evyge5h/9Trm8hg8y/tumblr_m5h365grfq1qm9b8do1_1280.png">
  33.  
  34. <meta name="if:show caption" content="0">
  35. <meta name="if:tiny cursor" content="1">
  36. <meta name="if:fading images" content="1">
  37. <meta name="if:Black Audio Player" content="1">
  38. <meta name="if:White Audio Player" content="0">
  39. <meta name="if:Grey Audio Player" content="0">
  40. <meta name="if:Stretch Photos" content="1">
  41.  
  42. <meta name="text:link url 1" content="/">
  43. <meta name="text:link title 1" content="Link 1">
  44. <meta name="text:link url 2" content="/">
  45. <meta name="text:link title 2" content="Link 2">
  46. <meta name="text:link url 3" content="/">
  47. <meta name="text:link title 3" content="Link 3">
  48. <meta name="text:link url 4" content="/">
  49. <meta name="text:link title 4" content="Link 4">
  50.  
  51. <title>{Title}</title>
  52. <link rel="shortcut icon" href="{Favicon}"/>
  53. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  54. {block:Description} <meta name="description" content="{MetaDescription}"/> {/block:Description}
  55.  
  56. <style type="text/css">
  57.  
  58. body {
  59. background-color: {color:Background};
  60. background-image:url("{image:background}");
  61. background-attachment: fixed;
  62. background-repeat: repeat;
  63. font-family: calibri;
  64. font-size: 11px;
  65. color: {color:text};
  66. text-wrap: normal;
  67. overflow-x:hidden;
  68. word-wrap: break-word;
  69. margin:0px 0px;
  70. text-align:center;
  71. height: 100%;
  72. {block:iftinycursor}
  73. cursor: url("http://i.imgur.com/2qleX.jpg"), auto;
  74. {/block:iftinycursor}
  75. }
  76.  
  77. a:link, a:visited, a:active {
  78. color: {color:links};
  79. text-decoration:none;
  80. transition-duration: 0.50s;
  81. -moz-transition-duration: 0.50s;
  82. -webkit-transition-duration: 0.50s;
  83. -o-transition-duration: 0.50s;
  84. }
  85.  
  86.  
  87. a:hover {
  88. color: {color:Links hover};
  89. text-decoration:bold;
  90. transition-duration: 0.50s;
  91. -moz-transition-duration: 0.50s;
  92. -webkit-transition-duration: 0.50s;
  93. -o-transition-duration: 0.50s;
  94. {block:iftinycursor}
  95. cursor: url("http://i.imgur.com/IepP2.jpg"), auto;
  96. {/block:iftinycursor}
  97. }
  98.  
  99. {block:iffadingimages}
  100. #catimg{
  101. opacity:.7;
  102. transition-duration: 0.50s;
  103. -moz-transition-duration: 0.50s;
  104. -webkit-transition-duration: 0.50s;
  105. -o-transition-duration: 0.50s;}
  106.  
  107. #catimg:hover{opacity:1;}
  108. {/block:iffadingimages}
  109.  
  110. #main{
  111. background-color: transparent;
  112. position: absolute;
  113. width: 750px;
  114. height: 100%;
  115. top: 0px;
  116. left: 50%;
  117. margin-left: -375px;
  118. }
  119.  
  120. #sidebar{
  121. background-color: transparent;
  122. position: fixed;
  123. height: auto;
  124. width: 200px;
  125. padding: 10px;
  126. left: 140px;
  127. top: 240px;
  128. }
  129.  
  130. #content{
  131. background-color: transparent;
  132. position: absolute;
  133. width: 500px;
  134. height: auto;
  135. left: 370px;
  136. top: 0px;
  137. }
  138.  
  139. .title{
  140. color:{color:Title};
  141. font-family: calibri;
  142. font-size:25px;
  143. }
  144.  
  145. .title2{
  146. color:{color:Title};
  147. font-family: calibri;
  148. font-size:15px;
  149. letter-spacing:4px;
  150. font-weight:bold;
  151. }
  152.  
  153. .post{
  154. text-align: left;
  155. margin: 5px 0px 0px 0px;
  156. color: {color:text};
  157. padding-top: 5px;
  158. padding-bottom: 3px;
  159. padding-left: 4px;
  160. padding-right: 5px;
  161. background:{color:posts};
  162. width:501px;
  163. }
  164.  
  165. blockquote{
  166. padding-left:5px;
  167. margin-left:5px;
  168. border-left: 1px solid {color:blockquote};
  169. }
  170.  
  171. h3{
  172. font-size: 15px;
  173. font-family: calibri;
  174. font-color: {color:headers};
  175. }
  176.  
  177. strong{
  178. color:{color:bold texts};
  179. }
  180.  
  181. .quote{
  182. font-size: 15px;
  183. font-style:italic;
  184. font-family: calibri;
  185. font-color: {color:headers};
  186. }
  187.  
  188. .source{
  189. text-align: right;
  190. color: {color:links};
  191. }
  192.  
  193. ul.chat {
  194. margin: 0 0 0 0;
  195. padding: 0 0 0 0;
  196. }
  197. .chat li {
  198. list-style-type: none;
  199. margin-left: 0px;
  200. padding: 3px;
  201. }
  202. .chat li.odd {
  203. background-color: {color:chat background};
  204. }
  205. .chat li.even {
  206. background-color: transparent;
  207. }
  208. .label {
  209. font-weight: bold;
  210. }
  211.  
  212. #entry img {opacity:.8px;}
  213.  
  214. #entry img:hover {opacity:1px;}
  215.  
  216. #sidebar img{
  217. width: 219px;
  218. height: auto;
  219. margin-left:-53px;
  220. margin-top:-108px;
  221. border: 3px solid {color:sidebar};
  222. }
  223.  
  224. #about{width:225px;padding-top:0px;padding-bottom:2px;margin-left:-39px;background:{color:sidebar};letter-spacing:3px;margin-top:0px;margin-bottom:4px; margin-top:2px; height:13px;}
  225.  
  226. #descrip{margin-top:0px;height:auto;position:;padding:5px;width:215px;background:{color:sidebar};}
  227.  
  228. .bubble {
  229. position: relative;
  230. background-color:{color:question background};
  231. margin: 0;
  232. padding:10px;
  233. text-align:center;
  234. width:482px;
  235. -webkit-box-shadow: 0px 0 1px rgba(0,0,0,0);
  236. -moz-box-shadow: 0px 0 1px rgba(0,0,0,0);
  237. box-shadow: 0px 0 1px rgba(0,0,0,0);
  238.  
  239. }
  240. .bubble:after {
  241. position: absolute;
  242. display: block;
  243. content: "";
  244. border-color: {color:question background} transparent transparent transparent;
  245. border-style: solid;
  246. border-width: 10px;
  247. height:0;
  248. width:0;
  249. position:absolute;
  250. bottom:-19px;
  251. left:1em;
  252. }
  253.  
  254. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  255.  
  256. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  257. .user_7 .label, .user_8 .label, .user_9 .label {color:#555555;}
  258.  
  259. .notes img{width:10px; position:relative; top:3px;}
  260.  
  261. #paginacaoml {
  262. font-size: 10px;
  263. width:525px;
  264. background:{color:center};
  265. margin-top:10px;
  266. font-weight: bold;
  267. line-height: 21px;
  268. text-shadow: 0 1px 1px #fff;
  269. }
  270.  
  271. #paginacaoml a {
  272. background: #cor de fundo;
  273. margin: 0 1px 0 0;
  274. padding: 2px 4px;
  275. color: #cor da fonte;
  276. text-decoration: none;
  277. }
  278.  
  279. #paginacaoml a:hover {
  280. background: #cor de fundo;
  281. border: none;
  282. }
  283.  
  284. #paginacaoml span.pagina_atual {
  285. background: #cor de fundo;
  286. margin: 0 1px 0 0;
  287. padding: 2px 4px;
  288. color: #cor da fonte;
  289. text-decoration: none;
  290. }
  291.  
  292. #paginacaoml span.info {
  293. background: #cor de fundo;
  294. margin: 0 1px 0 0;
  295. padding: 2px 4px;
  296. color:#cor da fonte;
  297. text-decoration: none;
  298. }
  299.  
  300. .permalink:hover{
  301. opacity:0;
  302. }
  303.  
  304. .post:hover .permalink{
  305. opacity:.9;
  306. margin-left:20px;
  307. margin-top:5px;}
  308.  
  309. .permalink{
  310. text-align: left;
  311. width:auto;
  312. line-height:8px;
  313. padding:5px;
  314. border-radius:10px;
  315. border-bottom:3px solid #111;
  316. position:absolute;
  317. background:#fff;
  318. color: {color:permalink};
  319. opacity:0;
  320. z-index:999;
  321. -webkit-transition: all 0.5s ease-in-out;
  322. -moz-transition: all 0.5s ease-in-out;
  323. -o-transition: all 0.5s ease-in-out;
  324. -ms-transition: all 0.5s ease-in-out;
  325. transition: all 0.5s ease-in-out;}
  326.  
  327. .permalink a{
  328. font-family:consolas;
  329. font-size:10px;
  330. text-transform:uppercase;
  331. letter-spacing:2px;
  332. color:{color:permalink text};
  333. }
  334.  
  335. .permalink a:hover{
  336. color: {color:permalink hover};
  337. }
  338.  
  339. div.drop{
  340. display: none;
  341. margin-left:-39px;
  342. margin-bottom:4px;
  343. }
  344.  
  345. div.imaa{
  346. z-index:1;
  347. }
  348.  
  349. div.imaa:hover{
  350. display:block;
  351. z-index:2;
  352. }
  353.  
  354. ::-webkit-scrollbar { width: 5px; height: 5px; }
  355. ::-webkit-scrollbar-button:start:decrement,
  356. ::-webkit-scrollbar-button:end:increment { height: 0px; display: block; background: {color:scrollbar background}; }
  357. ::-webkit-scrollbar-track-piece { background: {color:scrollbar background}; }
  358. ::-webkit-scrollbar-thumb {height: 50px; background-color: {color:scrollbar}; }
  359.  
  360. #menu{margin-left:-53px; margin-top:-1px;}
  361.  
  362. #answerr{padding-left:35px;}
  363.  
  364. .page{background:#fff; bottom:0px; position:fixed; border-radius:20px 20px 0px 0px; padding-left:7px; padding-right:7px; margin-left:950px;}
  365.  
  366. .page a{color:{color:text}; letter-spacing:2px;}
  367.  
  368. .page a:hover{color:{color:links hover};}
  369.  
  370. #playerr{margin-top:-103px; margin-left:110px; position:absolute}
  371.  
  372. </style>
  373.  
  374. <script type="text/javascript"
  375. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  376. <script>
  377. $(document).ready(function() {
  378. //
  379. $('a.poplight[href^=#]').click(function() {
  380. var popID = $(this).attr('rel'); //Get Popup Name
  381. var popURL = $(this).attr('href'); //Get Popup href to define size
  382. var query= popURL.split('?');
  383. var dim= query[1].split('&');
  384. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  385. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://media.tumblr.com/tumblr_m2er5fVIQI1qh7cpd.png" class="btn_close" title="Close" alt="Close!!" /></a>');
  386. var popMargTop = ($('#' + popID).height() + 80) / 2;
  387. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  388. //Apply Margin to Popup
  389. $('#' + popID).css({
  390. 'margin-top' : -popMargTop,
  391. 'margin-left' : -popMargLeft
  392. });
  393. $('body').append('<div id="fade"></div>');
  394. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  395. return false;
  396. });
  397. $('a.close, #fade').live('click', function() {
  398. $('#fade , .popup_block').fadeOut(function() {
  399. $('#fade, a.close').remove(); //fade them both out
  400. });
  401. return false;
  402. });
  403. });
  404. </script>
  405.  
  406. </head>
  407.  
  408. <script>
  409.  
  410. $(document).ready(function(){
  411.  
  412. $(".imaa").click(function(){
  413.  
  414. $(".drop", this).slideToggle("slow");
  415.  
  416. });
  417.  
  418. });
  419.  
  420.  
  421.  
  422. </script>
  423.  
  424. <body>
  425.  
  426.  
  427. <div id="main">
  428.  
  429. <div id="sidebar">
  430.  
  431. <div id="sidebar img">{Block:ifsidebarimage}<br>
  432. <img src="{image:sidebar}">
  433. {/Block:ifsidebarimage}</div>
  434.  
  435. <div id="menu">
  436. <center><select style="background-color: {color:navigation bg}; font-size: 10px; color: {color:navigation text}; padding-left:15px; font-family: calibri; letter-spacing:2px; width: 225px; text-transform:lowercase; border:0px;" onchange="window.location=this.options[this.selectedIndex].value;"> <option>→ navigation</OPTION>
  437. <option value="/">► refresh</option>
  438. <option value="/ask">► message me</option>
  439. <option value="/archive">► archive</option>
  440. {Block:IfLinkTitle1}<option value="{text:link url 1}">► {text:link title 1}</option>{/Block:IfLinkTitle1}
  441. {Block:IfLinkTitle2}<option value="{text:link url 2}">► {text:link title 2}</option>{/Block:IfLinkTitle2}
  442. {Block:IfLinkTitle3}<option value="{text:link url 3}">► {text:link title 3}</option>{/Block:IfLinkTitle3}
  443. {Block:IfLinkTitle4}<option value="{text:link url 4}">► {text:link title 4}</option>{/Block:IfLinkTitle4}
  444. <option value="http://asyrral.tumblr.com">► credit</option>
  445. </select></center>
  446. </div>
  447.  
  448. <div class="imaa">
  449. <div id="about">about +</div>
  450. <div class="drop"><div id="descrip">
  451. <center>
  452. {Description}</div>
  453. </center></div></div>
  454.  
  455. </div></div>
  456.  
  457. <div class="page">
  458. <center>
  459.  
  460. {block:PreviousPage}
  461. <a href="{PreviousPage}"><span style="font-family:century gothic;">&larr;</span> previous</a><br>
  462. {/block:PreviousPage}
  463. {block:NextPage}
  464. <a href="{NextPage}">next <span style="font-family:century gothic;">&rarr;</span></a>
  465. {/block:NextPage}
  466.  
  467. </center>
  468. </div>
  469.  
  470. <div id="content">
  471.  
  472. {block:Posts}
  473.  
  474. {block:Text}
  475. <div class="post">
  476. <div class="permalink">
  477. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  478. <a href="{Permalink}">{NoteCount}♥</a><br>
  479. <a href="{ReblogURL}">reblog</a></div>
  480. {block:Title}
  481. <h3><a href="{Permalink}">{Title}</a></h3>
  482. {/block:Title}
  483. {Body}
  484. </div>
  485. {/block:Text}
  486.  
  487. {block:Photo}
  488. <div class="post">
  489. <div class="permalink">
  490. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  491. <a href="{Permalink}">{NoteCount}♥</a><br>
  492. <a href="{ReblogURL}">reblog</a></div>
  493. <center>{LinkOpenTag}
  494. <div id="catimg">
  495. <img src="{PhotoURL-500}" alt="{PhotoAlt}" {Block:IfStretchPhotos}width="500px"{/Block:IfStretchPhotos}/>
  496. </div>
  497. {LinkCloseTag}</center>
  498. {block:IfShowCaption}
  499. {block:Caption}
  500. <div class="caption">{Caption}</div>
  501. {/block:Caption}
  502. {/block:IfShowCaption}
  503. </div>
  504. {/block:Photo}
  505.  
  506. {block:Photoset}
  507. <div class="post">
  508. <div class="permalink">
  509. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  510. <a href="{Permalink}">{NoteCount}♥</a><br>
  511. <a href="{ReblogURL}">reblog</a></div>
  512. <center>
  513. <div id="catimg">
  514. {Photoset-500}
  515. </div>
  516. </center>
  517. {block:IfShowCaption}
  518. {block:Caption}
  519. <div class="caption">{Caption}</div>
  520. {/block:Caption}
  521. {/block:IfShowCaption}
  522. </div>
  523. {/block:Photoset}
  524.  
  525. {block:Quote}
  526. <div class="post">
  527. <div class="permalink">
  528. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  529. <a href="{Permalink}">{NoteCount}♥</a><br>
  530. <a href="{ReblogURL}">reblog</a></div>
  531. <div class="quote">"{Quote}"</div>
  532. </div>
  533. {/block:Quote}
  534.  
  535. {block:Link}
  536. <div class="post">
  537. <div class="permalink">
  538. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  539. <a href="{Permalink}">{NoteCount}♥</a><br>
  540. <a href="{ReblogURL}">reblog</a></div>
  541. <center><h3><a href="{URL}" class="link" {Target}>{Name}</a></h3></center>
  542. {block:Description}
  543. <div class="description">{Description}</div>
  544. {/block:Description}
  545. </div>
  546. {/block:Link}
  547.  
  548. {block:Chat}
  549. <div class="post">
  550. <div class="permalink">
  551. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  552. <a href="{Permalink}">{NoteCount}♥</a><br>
  553. <a href="{ReblogURL}">reblog</a></div>
  554. {block:Title}
  555. <h3><a href="{Permalink}">{Title}</a></h3>
  556. {/block:Title}
  557. <ul class="chat">
  558. {block:Lines}
  559. <li class="{Alt} user_{UserNumber}">
  560. {block:Label}
  561. <span class="label">{Label}</span>
  562. {/block:Label}
  563. {Line}
  564. </li>
  565. {/block:Lines}
  566. </ul>
  567. </div>
  568. {/block:Chat}
  569.  
  570. {block:Video}
  571. <div class="post">
  572. <div class="permalink">
  573. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  574. <a href="{Permalink}">{NoteCount}♥</a><br>
  575. <a href="{ReblogURL}">reblog</a></div>
  576. <center>{Video-500}</center>
  577. {block:IfShowCaption}
  578. {block:Caption}
  579. <div class="caption">{Caption}</div>
  580. {/block:Caption}
  581. {/block:IfShowCaption}
  582. </div>
  583. {/block:Video}
  584.  
  585. {block:Audio}
  586. <div class="post">
  587. <div class="permalink">
  588. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  589. <a href="{Permalink}">{NoteCount}♥</a><br>
  590. <a href="{ReblogURL}">reblog</a></div>
  591. {Block:IfBlackAudioPlayer}
  592. {AudioPlayerBlack}<p>
  593. {/Block:IfBlackAudioPlayer}
  594. {Block:IfWhiteAudioPlayer}
  595. {AudioPlayerWhite}<p>
  596. {/Block:IfWhiteAudioPlayer}
  597. {Block:IfGreyAudioPlayer}
  598. {AudioPlayerGrey}<p>
  599. {/Block:IfGreyAudioPlayer}
  600. {block:Artist}
  601. <b>Artist:</b> {Artist}<p>
  602. {/block:Artist}
  603.  
  604. {block:Album}
  605. <b>Album:</b> {Album}<p>
  606. {/block:Album}
  607.  
  608. {block:TrackName}
  609. <b>Track:</b> {TrackName}
  610. {/block:TrackName}
  611. {block:caption}<p>{caption}{/block:caption}
  612. </div>
  613. {/block:Audio}
  614.  
  615. {block:Answer}
  616. <div class="post">
  617. <div class="permalink">
  618. <a href="{Permalink}">{24Hour}:{Minutes}</a><br>
  619. <a href="{Permalink}">{NoteCount} </a></div>
  620. <div class="bubble"><strong>{Asker}</strong> asked: <i>{Question}</i></div><div id="answerr">{Answer}</div>
  621. </div>
  622. {/block:Answer}
  623.  
  624. {block:PermalinkPage}
  625. <div style="width:486px; background:{color:posts}; text-align:center; padding-top: 5px;
  626. padding-bottom: 12px;
  627. padding-left: 12px;
  628. padding-right: 12px;">
  629. {block:Date}{MonthNumberWithZero}/{DayOfMonthWithZero}/{ShortYear}{/block:Date} <br> {block:HasTags}
  630. {block:Tags}<a href="{TagURL}"> #{Tag}</a>{/block:Tags}
  631. {/block:HasTags} <p> {block:PostNotes}{PostNotes}{/block:PostNotes}</div>{/block:PermalinkPage}
  632.  
  633. {/block:Posts}
  634.  
  635. </div>
  636.  
  637. </div>
  638.  
  639. </body>
  640.  
  641. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement