API tools faq
paste
Advertisement
clamam

Base de três colunas por Gabriele (clamam)

clamam
Mar 4th, 2016
255
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.61 KB | None | 0 0
raw download clone embed print report
  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"><head><title>{title}</title>
  3.  
  4. <!-- Theme base de três coluna TOTALMENTE desenvolvido por Gabriele com ajuda de DETALHES da base explcativa da Julia (liriadas). Todos os detalhes foram creditados entre os códigos.
  5. ATENÇÃO: Favor, NÃO MUDAR o nome das divs. Serve como uma especie de crédito. -->
  6.  
  7. <!--
  8. Theme por SEU TUMBLR base por clamam.
  9. http://SEU-TUMBLR.tumblr.com/ ©
  10. http://clamam.tumblr.com/ ©
  11. -->
  12.  
  13. <meta name="color:fundo" content="#ffffff"/>
  14. <meta name="color:fundo da ask" content="#eeeeee"/>
  15. <meta name="color:titulo" content="#cd2626"/>
  16. <meta name="color:texto" content="#838282"/>
  17. <meta name="color:link" content="#b8b8b8"/>
  18. <meta name="color:link hover" content="#cd2626"/>
  19. <meta name="color:bordas" content="#eeeeee"/>
  20.  
  21. <meta name="text:Link 1 titulo" content="link 1" />
  22. <meta name="text:Link 1" content="/" />
  23. <meta name="text:Link 2 titulo" content="link 2" />
  24. <meta name="text:Link 2" content="/" />
  25. <meta name="text:Link 3 titulo" content="link 3" />
  26. <meta name="text:Link 3" content="/" />
  27. <meta name="text:Link 4 titulo" content="link 4" />
  28. <meta name="text:Link 4" content="/" />
  29. <meta name="text:Link 5 titulo" content="link 5" />
  30. <meta name="text:Link 5" content="/" />
  31.  
  32. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  33. <link rel="shortcut icon" href="{Favicon}"> {block:Description}
  34. <meta name="description" content="{MetaDescription}" /> {/block:Description}
  35.  
  36. <!-- FONTES GOOGLE -->
  37. <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
  38. <style type="text/css">
  39.  
  40. /* CORPO DO THEME */
  41. body{background:{color:fundo}; background-image:url('{image:image background}'); background-attachment:fixed; background-repeat:no-repeat; background-position:center; -o-background-size:cover; -webkit-background-size:cover; color:{color:texto}; font-family: 'Roboto', sans-serif; font-size:12px; line-height:160%;}
  42.  
  43. #gcenter{width:840px; {block:PermalinkPage}width:520px;{/block:PermalinkPage} position:relative; margin-left:auto; margin-right:auto; margin-top:0px; padding-bottom:20px; overflow:hidden; height:100%;}
  44. #gentry{width:900px; margin-left:0px; margin-top:-10px;}
  45. #gpost{top:0px; margin:10px auto 0; padding:10px; float:left; {block:IndexPage}width:250px; position:relative;{/block:IndexPage} {block:PermalinkPage}width:500px;{/block:PermalinkPage}}
  46. .gbox {position:relative;}
  47. .gbox img {display:block; max-width:100%;}
  48. .gbox iframe {max-width:100%;}
  49.  
  50. /* LINKS E HOVER */
  51. a{text-decoration:none; color:{color:link}; transition:all 1s ease;}
  52. a:hover{color:{color:link hover}; background-color:transparent; text-decoration:none; cursor:url('http://cur.cursors-4u.net/others/oth-6/oth589.cur'), default!important;}
  53.  
  54. /* ADICIONAIS */
  55. p{margin:6px 0 0 0}
  56. ul{list-style-type:circle;}
  57. blockquote{margin:2px 5px 2px 5px; padding:1px 0 3px 6px; border-left:1px solid {color:bordas};}
  58.  
  59. /* TÍTULOS */
  60. h1{font-family: 'Roboto', sans-serif; letter-spacing:.5px; text-transform:uppercase; text-align:left; font-size:10.5px; color:{color:titulo}; font-weight: bold; line-height:5px;}
  61. h1 a{color:{color:texto}; text-transform:uppercase; text-align:left; font-size:10.5px; font-weight:bold; line-height:5px;}
  62. h1 a:hover{text-align:left; font-size:12px; color:{color:links hover}; font-weight:normal; line-height:5px; letter-spacing:.5px;}
  63.  
  64. /* CHAT */
  65. .chat{line-height:200%; list-style:none}
  66. .chat ul {line-height:200%; list-style:none; padding:0px;}
  67. .person1 {border-bottom:1px dotted {color:bordas}; color:{color:text}; transition:all 1s ease;}
  68. .person1 .label{padding:0px;margin-left:3px;color:{color:titulo}; text-transform:uppercase; font-family: 'Roboto', sans-serif;font-size:10px;letter-spacing:.5px;}
  69. .person1:hover{padding-left:10px; border-bottom:1px solid {color:titulo}; transition:all 1s ease;}
  70. .person2{border-bottom:1px dotted {color:bordas}; color:{color:text};}
  71. .person2 .label{padding:0px; margin-left:0px; color:{color:titulo}; text-transform:uppercase;font-family: 'Roboto', sans-serif;font-size:10px; letter-spacing:.5px;}
  72. .person2:hover{padding-left:10px; border-bottom:1px solid {color:titulo}; transition:all 1s ease;}
  73.  
  74. /*ESTILO DE ASK BASE FEITA POR GABRIELE (http://clamam.tumblr.com) DISPONÍVEL EM PASSO-HTML(http://passo-html.tumblr.com). FAÇA A DIFERENÇA, NÃO RETIRE OS CREDITOS!*/
  75. .question{z-index:1; background:{color:fundo da ask}; text-align:justify; font-weight:normal; font-size:11px; text-align:left; padding:10px;}
  76. .bolt{width:10px; height:10px; background:{color:fundo da ask}; margin-left:50%; margin-top:-5px; z-index:1; -webkit-transform:rotate(45deg);}
  77. .asker{margin-top:8px; font-family: 'Roboto', sans-serif; font-size:11px; letter-spacing:.5px; text-align:center; text-transform:uppercase;}
  78. .answer{margin-top:-10px; text-align:justify; font-size:11px; padding:10px;}
  79. /*FIM DO ESTILO DE ASK*/
  80.  
  81. /* ESTILO DE NOTES BY CLAMAM */
  82. #gnotes{opacity:0; position: absolute; text-align:center; height:20px; line-height:20px; text-transform:uppercase; bottom:15px; left:10px; z-index:99; background:{color:fundo}; width:250px; color:{color:texto}; opacity:0; -webkit-transition-duration: 0.9s; -webkit-transition: opacity 0.5s linear; -webkit-transition:All 1s ease; -moz-transition:All 1s ease; -webkit-transition: all 0.6s ease-out; -o-transition:All 1s ease;}
  83. #gnotes a{font-family: 'Roboto', sans-serif; color:{color:texto}; font-size:9.5px; letter-spacing:.5px; text-transform:uppercase; margin-top:20px; padding:5px;}
  84. #gpost:hover #gnotes{opacity:1; bottom:5px;}
  85. .greblog{opacity:0; position:absolute; top:0px; right:20px;}
  86. #gpost:hover .greblog{opacity:1; position:absolute; top:15px; transition:all 1s ease;}
  87.  
  88. /* QUOTE E SOURCE */
  89. .gquote{font-family: 'Roboto', sans-serif; line-height:150%; text-align:justify; font-size:12px; }
  90. .gsource{text-align:left; font-family: 'Roboto', sans-serif; letter-spacing:.5px; text-transform:uppercase; font-size:10.5px;}
  91.  
  92.  
  93. /* BOTÃO DE CONTROLE */
  94. .tmblr-iframe--desktop-loggedin-controls{position:fixed!important; -webkit-filter:invert(100%); opacity:0.5; top:3px; text-transform:none;}
  95.  
  96. /* CORES */
  97. b, strong{color:{color:titulo};}
  98. i, em{color:{color:titulo};}
  99. s{color:{color:titulo};}
  100. u{border-bottom:{color:titulo}; color:{color:titulo};}
  101.  
  102. /* SELEÇÃO DE TEXTOS */
  103. ::selection{background:{color:texto}; color:{color:fundo};}
  104. ::-moz-selection{background:{color:texto}; color:{color:fundo};}
  105.  
  106.  
  107. </style>
  108. <!-- SCRIPT TOOLTIP -->
  109. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  110. <script> (function($){ $(document).ready(function(){ $("a[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:90, tip_fade_speed:600, attribute:"title"});});})(jQuery);</script>
  111.  
  112. </head>
  113. <body>
  114.  
  115.  
  116. <div id="gcenter"><!-- CENTRALIZAÇÃO DO THEME -->
  117.  
  118.  
  119.  
  120. <div id="gentry">
  121. <div class="vsanna">
  122. {block:RebloggedFrom}
  123. <a href="{ReblogParentURL}">via</a>
  124. {/block:RebloggedFrom}
  125. {block:ContentSource}
  126. <a href="{SourceURL}">source</a>
  127. {/block:ContentSource}</div>
  128. {block:Posts}
  129. <div id="gpost">
  130.  
  131. {block:Text}
  132. {block:IndexPage}
  133. <div id="gnotes">
  134. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  135. </div>
  136. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  137. </div>
  138. </div>
  139. {/block:IndexPage}
  140. <h1>{block:Title}{Title}{/block:Title}</h1>
  141. {Body}
  142. {/block:Text}
  143.  
  144.  
  145. {block:Photo}
  146. <div class="gbox">
  147. <img src="{PhotoURL-500}"><a href="{Permalink}" title="{notecountwithlabel}">
  148. {block:Caption}{Caption}{/block:Caption}
  149. </div>
  150. {block:IndexPage}
  151. <div class="greblog">{ReblogButton color="white" size="23"}</div>
  152. {/block:indexpage}
  153. {/block:Photo}
  154.  
  155.  
  156. {block:Photoset}
  157. {Photoset-250}
  158. {block:Caption}{Caption}{/block:Caption}
  159. {block:IndexPage}
  160. <div class="greblog">{ReblogButton color="white" size="23"}</div>
  161. {/block:indexpage}
  162. {/block:Photoset}
  163.  
  164.  
  165. {block:Quote}
  166. {block:IndexPage}
  167. <div id="gnotes">
  168. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  169. </div>
  170. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  171. </div>
  172. </div>
  173. {/block:IndexPage}
  174. <div class="gquote">{Quote}</div>
  175. {block:Source}
  176. <div class="gsource">{Source}</div>
  177. {/block:Source}
  178. {/block:Quote}
  179.  
  180.  
  181. {block:Link}
  182. {block:IndexPage}
  183. <div id="gnotes">
  184. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  185. </div>
  186. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  187. </div>
  188. </div>
  189. {/block:IndexPage}
  190. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  191. {block:Description}{Description}{/block:Description}
  192. {/block:Link}
  193.  
  194.  
  195. {block:Chat}
  196. {block:IndexPage}
  197. <div id="gnotes">
  198. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  199. </div>
  200. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  201. </div>
  202. </div>
  203. {/block:IndexPage}
  204. {block:Title}<a href="{Permalink}">{Title}</a>{/block:Title}
  205. <div class="chat"><ul>{block:Lines}
  206. <li class="person{UserNumber}">{block:Label}
  207. <span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ul></div>
  208. {/block:Chat}
  209.  
  210.  
  211. {block:Audio}
  212. {block:IndexPage}
  213. <div id="gnotes">
  214. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  215. </div>
  216. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  217. </div>
  218. </div>
  219. {/block:IndexPage}
  220. {AudioPlayerWhite}
  221. {block:Caption}{Caption}{/block:Caption}
  222. {/block:Audio}
  223.  
  224.  
  225. {block:Video}
  226. {block:IndexPage}
  227. <div id="gnotes">
  228. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  229. </div>
  230. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  231. </div>
  232. </div>
  233. {/block:IndexPage}
  234. <div class="gbox">
  235. {Video}
  236. {block:Caption}{Caption}{/block:Caption}
  237. </div>
  238. {/block:Video}
  239.  
  240. {block:Answer}
  241. {block:IndexPage}
  242. <div id="gnotes">
  243. <div style="float:left;"><a href="{Permalink}"><font color="{color:titulo}">♥</font> {NoteCount} notificações</a>
  244. </div>
  245. <div style="float:right"><a href="{ReblogURL}">reblogar <font color="{color:titulo}">↻</font></a>
  246. </div>
  247. </div>
  248. {block:IndexPage}
  249. <div class="question">{Question}</div>
  250. <div class="bolt"></div>
  251. <div class="asker">Disse {Asker} {timeago}</div>
  252. <div class="answer">{Answer}</div>
  253. {/block:IndexPage}
  254. {/block:Answer}
  255. </div>
  256. {/block:Posts}
  257.  
  258. {block:IndexPage}
  259. <div class="column navigation" id="navigation">
  260. {block:Pagination}
  261. {block:PreviousPage}
  262. <a href="{PreviousPage}" class="navigate">
  263. {/block:PreviousPage}
  264. {block:PreviousPage}</a>
  265. {/block:PreviousPage}
  266. {block:NextPage}
  267. <a href="{NextPage}" class="navigate" id="nextPage">
  268. {/block:NextPage}
  269. {block:NextPage}</a>{/block:NextPage}
  270. {/block:Pagination}
  271. </div>
  272. {/block:IndexPage}
  273. </div>
  274.  
  275. </body>
  276.  
  277. <script language="javascript">
  278. function clickIE() {if (document.all) {(mensagem);return false;}}
  279. function clickNS(e) {if
  280. (document.layers||(document.getElementById&&!document.all)) {
  281. if (e.which==2||e.which==3) {alert(mensagem);return false;}}}
  282. if (document.layers)
  283. {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
  284. else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
  285. document.oncontextmenu=new Function("return false")
  286. </script>
  287. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  288. <script src="http://static.tumblr.com/stnnkm0/36Hno1p6t/mhinfinitescroll.js"></script>
  289. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  290. <script>
  291. $(function(){
  292. var $container = $('#gentry');
  293. $container.imagesLoaded(function(){
  294. $container.masonry({
  295. itemSelector: '#gpost',
  296. columnWidth: 280
  297. });
  298. });
  299. $container.infinitescroll({
  300. navSelector : "div#navigation",
  301. nextSelector : "div#navigation a#nextPage",
  302. itemSelector : '#gpost',
  303. loadingImg : "http://static.tumblr.com/8yo5xxv/3Dem80mch/loading.gif",
  304. loadingText : " ",
  305. loading: {
  306. finishedMsg: ' ',
  307. img: ' '
  308. }
  309. },
  310. function( newElements ) {
  311. var $newElems = $( newElements ).css({ opacity: 0 });
  312. $newElems.imagesLoaded(function(){
  313. $newElems.animate({ opacity: 1 });
  314. $container.masonry( 'appended', $newElems, true );
  315. });
  316. }
  317. );
  318.  
  319. });
  320. </script>
  321.  
  322. </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!