API tools faq
paste
Advertisement
deboranuns

Squaring - Theme #02 (Version 1 Collumn)

deboranuns
Jul 10th, 2013
309
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 16.87 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4.    
  5. <!---                        
  6.  
  7. Theme #1 - Squaring - by Debora [mentoris @ tumblr]
  8. Using this themes you agree to have read and follow the terms bellow:
  9. 1. Do not remove the credit of the theme. I took a time to do this specially for you
  10. 2. Do not use as a "base" code. If I could do it, why can't you?
  11. 3. Do not mix it with orther theme. Something might go wrong.
  12. ______________________________________________________________________________________________________
  13.  
  14. Intructions:
  15. 1. All the colors can be change at the customize. Do not put anything in the HTML/CSS part
  16. 2. If you want to change the sidebar image, look for this (http://static.tumblr.com/30265cb26c27a12fb2eea32766ef915f/9n6lwpt/Ga1moq0uz/tumblr_static_lost101r0h2o07.png) URL and change it, athought it is cutomizable in the appereance
  17. 3. Have questions? Ask me!
  18.  
  19. Have fun :)
  20. --->
  21.  
  22.  
  23.  
  24.  
  25.  
  26. <meta name="image:Sidebar" src="http://static.tumblr.com/30265cb26c27a12fb2eea32766ef915f/9n6lwpt/Ga1moq0uz/tumblr_static_lost101r0h2o07.png" />
  27.  
  28.  
  29.  
  30. <meta name="text:Link1" content="/ask" />
  31. <meta name="text:Link1 Title" content="ask" />
  32. <meta name="text:Link2" content="/submit" />
  33. <meta name="text:Link2 Title" content="submit" />
  34. <meta name="text:Link3" content="/archive" />
  35. <meta name="text:Link3 Title" content="Archive" />
  36. <meta name="text:Link4" content="/random" />
  37. <meta name="text:Link4 Title" content="Random" />
  38. <meta name="text:Link5" content="/" />
  39. <meta name="text:Link5 Title" content="-" />
  40.  
  41. <meta name="color:Menu Hover" content="#3dbb8f" />
  42. <meta name="color:Ask" content="#edfee8" />
  43. <meta name="color:Ask Text" content="#abd390" />
  44. <meta name="color:Light" content="#fcfbf9" />
  45.  
  46.  
  47. <html xmlns="http://www.w3.org/1999/xhtml">
  48. <head profile="http://gmpg.org/xfn/11">
  49. <head>
  50.  
  51. <script type="text/javascript" src="http://static.tumblr.com/ifqwhnb/M5ym2zs6s/infinitescrollingportthy.txt"></script>
  52.  
  53.  
  54. <link href='http://fonts.googleapis.com/css?family=Pontano+Sans' rel='stylesheet' type='text/css'>
  55. <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
  56. <title>{Title}</title>
  57. <link rel="shortcut icon" href="{Favicon}" />
  58.  
  59.     <script type="text/javascript" src="http://static.tumblr.com/8yo5xxv/Ebrm7rdy0/botao.js"></script>
  60.    
  61.     <link href='http://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
  62.  
  63. </head>
  64.  
  65.    
  66.  
  67. <style type="text/css">
  68.  
  69.  
  70. /* --------------------------------------
  71.     Ask
  72. -------------------------------------- */
  73. #asked {font-family:Georgia;color:#808080;text-align:justify;}
  74. #question {background-color:{color:Ask}; margin-top: 0px; margin-left: 70px; font-style: none; font-family: Calibri; padding:8px; font-size: 10px; min-height: 33px; padding-bottom: 5px;text-align:justify;}
  75. #question a{color:{color:Ask Text};}  
  76. #answer {margin-top:15px; text-align:left;text-align:justify;}
  77. #asker img{border: 8px solid {color:Ask};}
  78. #asker {padding-right: 8px; margin-bottom: 4px; margin-top: 5px;}
  79. #triangle {font: 20px  arial; margin-bottom: 0px; margin-top: 12px; margin-left: -5px; color:{color:Ask}; float: left;}
  80.  
  81.  
  82. /* --------------------------------------
  83.     Audio
  84. -------------------------------------- */
  85. .trackid  {font-family: 'Pontano Sans', sans-serif;  font-size: 9pt; margin-left: 98px;padding: 7px; margin-top: 1px; margin-bottom: 2px; background:#f4fcf2;margin-right: 0px; text-shadow: 0px 1px 1px #;}
  86. .trackid  c {color: #b1d1a8;text-transform:uppercase; font-size: 8pt;}
  87. .trackid2  {margin-top: 1px; background:#e4e4e4; display: block; height:27px;overflow:hidden; padding:1px;}
  88. .album {opacity: 0.7;margin-top: 0px; float: left; display: inline-block;}
  89. .boxmusica {background:#fff;}
  90. .clear {margin-top:1px;}
  91.  
  92. /* --------------------------------------
  93.   Quote
  94. -------------------------------------- */
  95. .quote  {text-align:center; font-family: georgia; color:{color:Ask Text}; font-size: 15pt; padding: 1px; font-style:italic;background:{color:Ask};padding:5px;}
  96.  
  97. #trianglee {font: 20px  arial; margin-bottom: 0px; margin-top: 12px; margin-left: -5px; -webkit-transform: rotate(90deg);
  98. -moz-transform: rotate(90deg);     ;color:{color:Ask}; float: left; margin-top:-6px; margin-left:10px;}
  99.  
  100. /* --------------------------------------
  101.     Titles
  102. -------------------------------------- */
  103.  
  104. .h2 a { background-repeat: no-repeat; font-style: normal;font-size: 27px;color: {color:Menu Hover};text-transform:uppercase; margin-top: 0px;
  105. text-align:justy; font-family:  georgia;}
  106. .h1  { background-repeat: no-repeat; font-style: normal;font-size: 18px;color: {color:Menu Hover}; margin-top: 0px; text-align:justy; font-family:  'Inconsolata'; background: ;  padding: 1px;;}
  107. .h1 small { background-repeat: no-repeat; font-style: normal;font-size: 18px;color: {color:Menu Hover}; margin-top: 0px; text-align:justy; font-family:  'Inconsolata'; background: ;  padding: 1px;;}
  108. .h1 a  { background-repeat: no-repeat; font-style: normal;font-size: 18px;color: {color:Menu Hover}; margin-top: 0px; text-align:justy; font-family:  'Inconsolata'; background: ;  padding: 1px;;}
  109.  
  110.  
  111. /* --------------------------------------------------------
  112.    Bold, Italic, Underlined, Blockquote, Strike & Links
  113. -------------------------------------------------------- */
  114. strong, b, bold {color:{color:Menu Hover}}; text-decoration:none; font-weight:bold;} /* BOLD */
  115. i, em {font-weight:italic;color:{color:Ask Text};} /* ITALIC */
  116. u, underline {text-decoration:none; border-bottom:1px solid {color:Menu Hover}} /* UNDERLINED */
  117. s, strike {color: {color:Menu Hover}} /* STRIKE */
  118. a {color: {color:Menu Hover}; text-decoration: none;}/* LINK */
  119. a:hover {opacity:0.5 ; }/* LINK HOVER */
  120. blockquote {border-left:2px solid {color:Ask Text} ; padding:5px; margin:0px 2px 0px 10px; font-style:normal;background-color:#fff;}
  121.  
  122.  
  123. /* ###### CREDIT ###### */
  124.  
  125. #credit {
  126.     position: fixed;
  127.     bottom: 20px;
  128.     left: 20px;
  129.     text-transform: uppercase;
  130.     font: 11px 'Inconsolata', sans-serif;padding: 8px;
  131.     transition-duration: 0.3s;  -moz-transition-duration: 0.3s;   -webkit-transition-duration: 0.3s;
  132. }
  133.  
  134. #credit:hover{background-color:{color:Menu Hover};color:#fff;transition-duration: 0.3s;  -moz-transition-duration: 0.3s;   -webkit-transition-duration: 0.3s;}
  135.  
  136. #credit:hover a{color:#fff;}
  137.  
  138. #credit a{color:{color:Menu Hover};}
  139.  
  140. #credit a:hover{color:#fff;}
  141.  
  142.  
  143.  
  144.  
  145.  
  146. /* --------------------------------------
  147.     Fonts
  148. -------------------------------------- */
  149.  
  150. @font-face {font-family: "04b03";
  151. src: url('http://static.tumblr.com/icz5xqv/ZUmlobzpk/bonjourlindas.blgspt_upload_pxl.ttf'); format("truetype"); }
  152. @font-face {font-family: "charnarr";
  153. src: url('http://static.tumblr.com/icz5xqv/ZUmlobzpk/bonjourlindas.blgspt_upload_pxl.ttf'); format("truetype"); }
  154.  
  155.  
  156.  
  157.  
  158. /* --------------------------------------
  159.     Body + Post
  160. -------------------------------------- */
  161. body {font:11px calibri; color:#808080; margin:0; text-align:justify;
  162. background: {color:bg};}
  163.  
  164.  
  165. #cont{width: 750px; text-align:left; margin-left: auto ; margin-right: auto;}
  166. #posts {float:right;  width: 500px; margin-right: 300px;margin-top:20px;text-align:justify;}
  167.  
  168. .post{text-align: left;width: 500px;padding: 2px}
  169.  
  170. /* --------------------------------------
  171.     Chat
  172. -------------------------------------- */
  173.  
  174. h { text-transform:uppercase; padding-right:3px;line-height:18px;color:{color:Menu Hover}; padding-bottom:20px;}
  175.  
  176. j {height: 10px; background-color: {color:Light}}
  177.  
  178. .light {padding:40px; background-color: {color:Light};}
  179.  
  180.  
  181.  /* --------------------------------------
  182.     Sidebar + Menu
  183. -------------------------------------- */
  184.  
  185. #sidebar {text-align:justify; float:left; width: 250px; margin-top: 400px;
  186. padding:0px; position: fixed; overflow: hidden;}
  187.  
  188. .sidebar{ position: fixed;}
  189.  
  190. .sidebar img{width: 100px;height:100px; padding:7px; border:1px solid #f2f2f2;margin-top: 200px;margin-left:-50px;}
  191.  
  192.  
  193.  
  194.  
  195. .description {  width:200px;  line-height: 110%;
  196.     padding: 5px;
  197.     color: #a0a0a0;
  198.     font: 10px 'Inconsolata', sans-serif; padding-left:100px;}
  199.    
  200.    
  201. .menua{margin-left:65px; margin-top:-118px;font-family:verdana;}
  202. .menub{margin-left:98px; margin-top:-13px;font-family:verdana;}
  203. .menuc{margin-left:65px; margin-top:14px;font-family:verdana;}
  204. .menud{margin-left:98px; margin-top:-13px;font-family:verdana;}
  205. .menue{margin-left:65px; margin-top:14px;font-family:verdana;}
  206. .menuf{margin-left:98px; margin-top:-13px;font-family:verdana;}
  207.  
  208. .sidebar a {background-color: #f6f7f7; font: calibri; font-size: 8px; text-transform:uppercase;padding:5px 10px;color:#bdbdbd;transition-duration: 0.3s;  -moz-transition-duration: 0.3s;   -webkit-transition-duration: 0.3s;       -o-transition-duration: 0.3s;margin: 10px;margin-bottom:10px;letter-spacing:1px;margin-bottom: 9px; margin-top:  10px; text-align: center;}
  209.  
  210. .sidebar a:hover {color: #fff; background-color: #3dbb8f; transition-duration: 0.3s;  -moz-transition-duration: 0.3s;   -webkit-transition-duration: 0.3s;       -o-transition-duration: 0.3s;}
  211.  
  212.  
  213. /* --------------------------------------
  214.     Post Info
  215. -------------------------------------- */
  216.  
  217.  
  218.  
  219. .info a{background-color: #f6f7f7; font: calibri; font-size: 8px; text-transform:uppercase;padding:5px 10px;color:#bdbdbd;transition-duration: 0.3s;  -moz-transition-duration: 0.3s;   -webkit-transition-duration: 0.3s;       -o-transition-duration: 0.3s;margin: 10px;margin-bottom:10px;letter-spacing:1px;}
  220.  
  221. .info a:hover {color: #fff; background-color: {color:menu}; transition-duration: 0.3s;  -moz-transition-duration: 0.3s;   -webkit-transition-duration: 0.3s;       -o-transition-duration: 0.3s;}
  222.  
  223.  </style>
  224.  
  225. <body>
  226.  
  227.  
  228.  
  229.  
  230.  
  231.  
  232. <div id="cont">
  233.  
  234.  
  235.  
  236.  
  237. <div class="sidebar">
  238.  
  239.  
  240. <img src="{image:Sidebar}" style="width:100px"><br>
  241.  
  242.  
  243.  
  244.  
  245. <br><br>
  246. <div class="menua"><a href="/" title="home">A</a></div>
  247.  
  248.  
  249. <div class="menub"><a href="{text:Link1}" title="{text:Link1 Title}">B</a></div>
  250.  
  251. <div class="menuc"><a href="{text:Link2}" title="{text:Link2 Title}">C</a></div>
  252.  
  253. <div class="menud"><a href="{text:Link3}" title="{text:Link3 Title}">D</a>
  254. </div>
  255.  
  256. <div class="menue"><a href="{text:Link4}" title="{text:Link4 Title}">E</a>
  257. </div>
  258.  
  259. <div class="menuf"><a href="{text:Link5}" title="{text:Lin53 Title}">F</a>
  260. </div>
  261.  
  262. </div>
  263. </div>
  264. <div id="posts">
  265.  
  266.  
  267.  
  268. {block:Posts}
  269.  
  270. <div class="post">
  271.  
  272. {block:Regular}
  273.  
  274.  
  275.  
  276. {block:Title}<div class="h1"><a href="{Permalink}">{Title}</a></div>{/block:Title}
  277. {Body}{block:IndexPage}{/block:IndexPage}
  278.  
  279.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  280.     {TimeAgo}{/block:SameDayDate}</a>
  281.        
  282.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  283.        
  284.        <a href="{ReblogURL}"> Reblog</a><br><br>
  285.        
  286.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  287.        
  288.     </div>
  289.  
  290. {/block:Regular}
  291.  
  292.  
  293. {block:Photo}
  294.  
  295.  
  296. {block:IndexPage}<img src="{PhotoURL-500}">{/block:IndexPage}
  297.  
  298. {block:PermalinkPage}<img src="{PhotoURL-500}">{/block:PermalinkPage}
  299.  
  300.  
  301. <div class="top">  
  302. <div class="border"></div>
  303.  </div><br>
  304.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  305.     {TimeAgo}{/block:SameDayDate}</a>
  306.        
  307.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  308.        
  309.        <a href="{ReblogURL}"> Reblog</a><br><br>
  310.        
  311.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  312.        
  313.     </div>
  314.  
  315.  
  316. {/block:Photo}
  317.  
  318.  
  319.  
  320. {block:Photoset}
  321.  
  322.  
  323. <div class="efeito">
  324. {block:IndexPage}
  325. <center><div class="borderimage">{Photoset-500}</div></div>{/block:IndexPage}</center>
  326. {block:PermalinkPage}<div class="borderimage">{Photoset-500}</div>{/block:PermalinkPage}<br>
  327.  
  328.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  329.     {TimeAgo}{/block:SameDayDate}</a>
  330.        
  331.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  332.        
  333.        <a href="{ReblogURL}"> Reblog</a><br><br>
  334.        
  335.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  336.        
  337.     </div>
  338. {/block:Photoset}
  339.  
  340.  
  341. {block:Answer}
  342.  
  343.  
  344.  
  345. <div id="asker"> <img src="{AskerPortraitURL-30}" style="width="30px" height="30px" align="left"> </div>
  346. <div id="triangle">►</div>
  347. <div id="question">{Asker} shouted: {Question}</div>
  348. <div id="answer">{Answer}</div><br>
  349.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  350.     {TimeAgo}{/block:SameDayDate}</a>
  351.        
  352.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  353.        
  354.        <a href="{ReblogURL}"> Reblog</a><br><br>
  355.        
  356.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  357.        
  358.     </div>
  359. {/block:Answer}
  360.  
  361. {block:Quote}
  362.  
  363.  
  364.  
  365. <div class="quote">"{Quote}"</div><div id="trianglee">►</div>
  366. {block:Source}{/block:Source}<br><br>
  367.  
  368.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  369.     {TimeAgo}{/block:SameDayDate}</a>
  370.        
  371.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  372.        
  373.        <a href="{ReblogURL}"> Reblog</a><br><br>
  374.        
  375.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  376.        
  377.     </div>
  378. {/block:Quote}
  379.  
  380. {block:Link}
  381.  
  382. <a href="{URL}" {Target}><div class="h1">{Name}</div></a>
  383. {block:Description}{Description}{/block:Description}{block:IndexPage} {/block:IndexPage}<br>
  384.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  385.     {TimeAgo}{/block:SameDayDate}</a>
  386.        
  387.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  388.        
  389.        <a href="{ReblogURL}"> Reblog</a><br><br>
  390.        
  391.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  392.        
  393.     </div>
  394. {/block:Link}
  395.  
  396. {block:Chat}
  397.  
  398.  
  399. {block:Title}<a href="{Permalink}"><div class="h1">{Title}</a></div>{/block:Title}
  400. <div class="light">
  401. {block:Lines}
  402. {block:Label}
  403. <h>{Label}</h>
  404. {/block:Label}
  405. <j>{Line}</j><br>
  406. {/block:Lines}
  407. </div>
  408. {block:IndexPage} {/block:IndexPage}<br>
  409.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  410.     {TimeAgo}{/block:SameDayDate}</a>
  411.        
  412.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  413.        
  414.        <a href="{ReblogURL}"> Reblog</a><br><br>
  415.        
  416.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  417.        
  418.     </div>
  419.  
  420. {/block:Chat}
  421.  
  422. {block:Audio}
  423.  
  424.  
  425. <div class="trackid2">{AudioPlayerGrey}</div>
  426. <div class="boxmusica">
  427. <div class="album">{block:AlbumArt}
  428. <img src="{AlbumArtURL}" class="album"width="95" >
  429. {/block:AlbumArt}</div>
  430. {block:TrackName}<div class="trackid">
  431. <c>Track:</c> {TrackName}</div>{/block:TrackName}
  432. {block:Artist} <div class="trackid"><c>Artist:</c> {Artist}</div>{/block:Artist}
  433. <div class="trackid"><c>Played:</c> ({PlayCount}) Times</div>
  434. <div class="clear"></div>
  435. </div><br>
  436.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  437.     {TimeAgo}{/block:SameDayDate}</a>
  438.        
  439.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  440.        
  441.        <a href="{ReblogURL}"> Reblog</a><br><br>
  442.        
  443.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  444.        
  445.     </div>
  446. {/block:Audio}
  447.  
  448. {block:Video}
  449.  
  450.  
  451.  
  452. {Video-500}
  453. {block:Caption}{Caption}{/block:Caption}{block:IndexPage} {/block:IndexPage}<br>
  454.  <div class="info"><a href="{Permalink}"> {block:NewDayDate}{DayOfMonthWithZero} {ShortMonth} {/block:NewDayDate} {block:SameDayDate}    
  455.     {TimeAgo}{/block:SameDayDate}</a>
  456.        
  457.        <a href="{Permalink}"> {NoteCountWithLabel}</a>
  458.        
  459.        <a href="{ReblogURL}"> Reblog</a><br><br>
  460.        
  461.        {block:HasTags}<div class="tgs">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  462.        
  463.     </div>
  464.  
  465. {/block:Video}
  466.  
  467. </div>
  468.  
  469.  <br><br>
  470. {/block:Posts}
  471.  
  472.  
  473.  
  474. </div>
  475.  
  476. <div id="credit">&copy; <a href="http://mentoris.tumblr.com/" target="_blank">MENTORIS</a></div>
  477.  
  478. <script src="http://static.tumblr.com/df28qmy/SHUlh3i7s/jquery.infinitescroll.js"></script>
  479.  
  480.  
  481.  
  482.  
  483.  
  484.  
  485. </body>
  486. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!