Advertisement
surdd

THEME SURDADDY- 16

Jul 10th, 2016
3,145
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 16.59 KB | None | 0 0
  1.       <!-----------------------------------------------------------
  2.                      DESIGN by SURDADDY - ORIGINAL ©
  3.      ------------------------------------------------------------->
  4.  
  5. <head>
  6.                      <title>{Title}</title>
  7.   <link rel="shortcut icon" href="{FavIcon}"><link rel="alternate" type="application/rss+xml" href="{RSS}">{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  8.  
  9. <meta name="color:Background" content="#fff" />
  10. <meta name="color:Posts" content="#fff" />
  11. <meta name="color:Text" content="#000" />
  12. <meta name="color:Title" content="#555" />
  13. <meta name="color:Title Hover" content="#000" />
  14. <meta name="color:Desc" content="#999" />
  15. <meta name="color:Links" content="#999" />
  16. <meta name="color:Links Hover" content="#555" />
  17. <meta name="color:Borders" content="#f8f8f8" />
  18. <meta name="color:Notes" content="#999" />
  19. <meta name="color:Rolagem" content="#555" />
  20. <meta name="text:Title" content="COCK UP OF THE BITCHES" />
  21. <meta name="text:Desc" content="EXCUSE ME, NO, I BELIEVE THE PROPER TERM'S EXCUSE YOU. I COULD SWITCH UP ON YOU NIGGAS AND START SHITTIN'." />
  22.  
  23. <meta name="select:Columns" content="3" title="3" />
  24. <meta name="select:Columns" content="2" title="2" />
  25. <meta name="select:Columns" content="4" title="4" />
  26. <meta name="select:Columns" content="5" title="5" />
  27.  
  28. <meta name="select:Post Size" content="200" title="200px" />
  29. <meta name="select:Post Size" content="180" title="180px" />
  30. <meta name="select:Post Size" content="250" title="250px" />
  31. <meta name="select:Post Size" content="400" title="400px" />
  32.  
  33. <meta name="text:Link1" content="/" />
  34. <meta name="text:Link1 Title" content="home" />
  35. <meta name="text:Link2" content="/" />
  36. <meta name="text:Link2 Title" content="ask" />
  37. <meta name="text:Link3" content="/" />
  38. <meta name="text:Link3 Title" content="faq" />
  39. <meta name="text:Link4" content="/" />
  40. <meta name="text:Link4 Title" content="uploads" />
  41. <meta name="text:Link5" content="/" />
  42. <meta name="text:Link5 Title" content="archive" />
  43. <meta name="text:Link6" content="/" />
  44. <meta name="text:Link6 Title" content="themes" />
  45.  
  46. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript" src="https://secure.static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script> <script> (function($){ $(document).ready(function(){ $("[title]").style_my_tooltips({tip_delay_time:200,tip_fade_speed:300}); }); })(jQuery); </script>
  47.  
  48. <link href='https://fonts.googleapis.com/css?family=Karla:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  49. <link rel="stylesheet" type="text/css" href="http://assets.tumblr.com/fonts/gibson/stylesheet.css?v=3">
  50. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  51. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  52.  
  53. <script>
  54. $(document).ready(function(){$(".set").click(function(){$('.sur_up, .sur').toggleClass('rotate');});});
  55. </script>
  56.  
  57. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script><a href="javascript:;" id="scrollToTop"><i class="fa fa-chevron-up"></i></a>
  58.  
  59. <style type="text/css">
  60.    
  61. .tmblr-iframe{position:fixed!important;top:0px !important;right:0px !important;opacity:.8 !important;-webkit-filter:invert(100%);z-index:10;transition:0.5s;}
  62.    
  63. #s-m-t-tooltip {max-width:200px;line-height:17px;height:17px; font-size:8px; color:#555; padding:3px 4px 3px 4px; margin:20px 0px 0px 20px; z-index:99999;transition: 0.5s;background:#eee;text-transform:uppercase;}
  64.  
  65. #scrollToTop:link,#scrollToTop:visited { color: transparent; background-color: transparent; display: none; position: fixed; bottom:45px; right: 42px;}
  66. #scrollToTop i {font-size:13px;color:#000;}
  67.  
  68. body {font-family:karla, sans-serif; font-size:10.5px; background:{color:Background}; color:{color:Text};text-align:justify;}
  69.  
  70. a {color:{color:Links}; text-decoration: none; text-transform: none;}
  71. a:hover {color:{color:Links Hover};transition:0.5s;}
  72. h1 {text-align:center;text-transform:uppercase;letter-spacing:1px;font-family:karla, sans-serif; font-size:10.5px;}
  73.    
  74. header, #content{width:calc(({select:Post Size}px + 20px*2)*{select:Columns});margin:0 auto; position:relative;{block:PermalinkPage}width:calc(500px + 20px*2);{/block:PermalinkPage}}
  75.  
  76. #content {margin:-10px auto;}
  77.  
  78. main { margin:100px auto; }
  79.  
  80. .posts {width:{select:Post Size}px;{block:PermalinkPage}width:500px;{/block:PermalinkPage}margin:20px;position:relative;}
  81. .posts img, img:not(.lightbox-image) { max-width:100%; height:auto; }
  82. .photo img { width:100%; display:block;transition: all 0.5s ease-in-out;}
  83. .posts:hover .photo img {opacity:0.8;}
  84. .box {padding:10px;border:1px solid #f2f2f2;background:{color:Posts};overflow:hidden;}
  85.  
  86. .tmblr-lightbox, #tumblr_lightbox {background:rgba(0,0,0,.8)!important;}
  87. .lightbox-image, #tumblr_lightbox img {padding:0!important;}
  88.  
  89. .video, .video iframe  { display:block; overflow:hidden; }
  90.  
  91. .n {padding:0px;} .n span{display:block;margin:5px 40px;} .tumblr_audio_player {width:27px;height:27px;overflow:hidden;} .audio {padding:5px;padding-bottom:10px;} .play {position:absolute; overflow:hidden; height:28px; width:28px; margin:5px}
  92.  
  93. .perguntou {float:left;text-align:left; text-indent:3px;width:100px;text-transform:uppercase;margin-left:1px;margin-top:-5px;height:20px;line-height:28px;}
  94. .perguntou a {text-transform:uppercase;color:{color:Text};font-size:9px;}
  95. .fotinha {float:left;text-align:left;width:20px;height:20px;margin-left:6px;margin-top:-5px;border-radius:20px;border:5px solid #fff;z-index:9;}
  96. .fotinha img {width:20px; height:20px;margin-left:0px;margin-top:0px;border-radius:20px;}
  97. .pergunta {text-align:left; text-indent:5px;width:85%;color:{color:Text};margin-left:35px;margin-top:15px;height:auto;line-height:18px;padding:1px;}
  98. .resposta{text-align:left;padding:5px; width:95%;height:auto;line-height:13px;margin-left:0px;margin-top:0px;color:{color:Text};}
  99.  
  100. .quote:first-letter {font-size: 15px; line-height:15px; color:#000}
  101. .quote {text-align:left; line-height:15px; color:{color:Text}; padding:3px;}
  102. .source {text-transform:uppercase; text-align:right;font-size:10px; margin-top:1px;}
  103.  
  104. .vsanna{display: none;}
  105. blockquote {margin:0px;}
  106. .pagination, #infscr-loading { display:none!important; }
  107. .tumblrAutoPager_page_separator, .tumblrAutoPager_page_info {display: none;}
  108.  
  109. ::-webkit-scrollbar {height:0px;width:5px;background: #fff;}
  110. ::-webkit-scrollbar-thumb:vertical{background:{color:Rolagem};height:auto;}
  111.  
  112. /******** NOTES POR SURDADDY / DON'T COPY *******/
  113. .notes_posts {width:100%; height:100%;transition:0.5s; position:absolute;left:0px;top:-10%;text-align:center;opacity:0;z-index:1;}
  114. .posts:hover .notes_posts {opacity:1;top:0%;}
  115.  
  116. .notes-top {position:absolute;top:45%;left:30%;width:auto;transition:.5s;}
  117. .notes-top a {width:auto;padding:0px 8px;text-align:center;font-size:12px;display:inline-block;color:{color:Notes};background:rgba(255,255,255,.7);border-radius:3px;line-height:20px;}
  118. .notes-top i {line-height:20px;}
  119. .notes-top a:hover {color:#5a5e51;}
  120.  
  121. .notes-top .like {width:20px;height:20px;position:absolute;overflow:hidden;left:-22px;top:0px;background:rgba(255,255,255,.7);border-radius:3px;}
  122. .notes-top .like .like_button iframe {width:100%;height:100%;top:0;bottom:0;left:0;right:0;position:absolute;opacity:0;z-index:10;}
  123. .notes-top .like .like_button.liked + svg {fill:#ff6666;}
  124. svg {width:16px;display:block;fill:#ff6666;}
  125. .notes-top svg {margin:2px 2px;display:block;fill:{color:Notes};}
  126. .notes-top .like:hover svg { fill:#ff6666; }
  127.  
  128. .notes-bottom {width:{select:Post Size}px; height:25px;transition:0.5s; position:relative;left:-10px;top:10px;background:#f2f2f2;text-align:center;}
  129. .notes-bottom a {text-align:center;color:{color:Links};text-transform:uppercase;font-size:9px; display:inline-block;width:auto;padding:2px 10px;line-height:25px;}
  130.  
  131. .notes-fixed {position:relative;top:5px;left:0px;width:auto;transition:.5s;border-top:1px solid #eee;}
  132. .notes-fixed a {text-align:center;color:{color:Links};text-transform:uppercase;font-size:9px; display:inline-block;width:auto;padding:2px 12px;line-height:25px;margin-left:8px;}
  133.  
  134. /*** FRAGILEHELP MODIFICADO POR SURDADDY ***/
  135. #lpermalink {padding:0px; margin-bottom:1px;overflow-x:hidden; overflow-y:auto;height:200px;border:1px solid {color:Borders};color:{color:Text};}
  136. #lpermalink a {color:{color:Text};margin-left:5px;}
  137. #lpermalink img {float:left; width:20px;}
  138. ol.notes li {list-style-type:none; margin:2px; line-height:18px; padding:5px; border-bottom:1px solid {color:Borders};margin-left:-30px;}
  139.  
  140. header {margin:0 auto 20px auto;padding:0px 20px ;position:relative;box-sizing:border-box;}
  141.  
  142. nav {margin-top:5px; margin-left:0px;}
  143. nav a {transition:0.5s;color:{color:Links}; line-height:15px;text-align:center;font-size:8px;letter-spacing:.5px;text-transform:uppercase;margin:0px 1px;display:inline-block;width:auto;height:15px;font-weight:bold;opacity:.5;padding:3px;}
  144. nav a:hover {color:{color:Links Hover};opacity:1;}
  145. nav bu {color:#f8f8f8}
  146.  
  147. .title {padding:5px;font-weight:bold;color:{color:Title};}
  148. .title:hover {color:{color:Title};}
  149.  
  150. .set {padding:5px;font-size:13px;color:{color:Title}; transition: 0.5s;z-index:9999;cursor:pointer;}
  151. .set:hover {color:{color:Links Hover};}
  152.  
  153. .desc {font-size:8px;letter-spacing:1px;color:{color:Desc};margin-top:5px; width:400px;margin-left:5px;}
  154.  
  155. .sur_up {position:relative; margin:0px;width:auto;height:auto;text-align:left;}
  156. .sur {transition:0.3s;width:auto;height:0px;text-align:left;position:relative;margin:0px;opacity:0;background:{color:Background};padding:0px 0px 0px 0px;}
  157. .sur.rotate {transition:0.5s;opacity:1;margin-top:10px;height:30px;}
  158.  
  159.  
  160. </style>
  161. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  162. <body>
  163. <main>
  164.  
  165. <header>
  166. <a class="title">{text:Title}</a>
  167. <a class="set"><i class="fa fa-bars"></i></a>
  168. <div class="sur_up">
  169. <div class="sur">
  170. <div class="desc">{text:Desc}</div>
  171. <nav>
  172. <a href="{text:Link1}">{text:Link1 Title}</a> <bu>/</bu>
  173. <a href="{text:Link2}">{text:Link2 Title}</a> <bu>/</bu>
  174. <a href="{text:Link3}">{text:Link3 Title}</a> <bu>/</bu>
  175. <a href="{text:Link4}">{text:Link4 Title}</a> <bu>/</bu>
  176. <a href="{text:Link5}">{text:Link5 Title}</a> <bu>/</bu>
  177. <a href="{text:Link6}">{text:Link6 Title}</a>
  178. </nav>
  179. </div></div>
  180. </header>
  181.  
  182. <div id="content">{block:Posts}<div class="posts">
  183.  
  184. {block:Text}
  185. <div class="box">
  186. {block:Title} <h1>{Title}</h1> {/block:Title}
  187. {Body}
  188. {block:indexpage}
  189. <div class="notes-bottom">
  190. <a>{Month}, {DayofMonth}</a>
  191. <a href="{ReblogURL}">REBLOG</a>
  192. <a href="{permalink}">{NoteCount} NOTES</a>
  193. </div></div>
  194. {/block:indexpage}
  195. {/block:Text}
  196.  
  197. {block:Photo}
  198. <div class="photo"><img src="{PhotoURL-500}"/></div>
  199. {block:indexpage}
  200. <div class="notes_posts">
  201. <div class="notes-top">
  202. <a href="{Permalink}">{NoteCount}</a>
  203. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active');return false"><i class="fa fa-search"></i></a>
  204. <a href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a>
  205. <div class="like">{LikeButton}
  206. <svg x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M148,37.8c-3.9,0-7.5,0.6-10.8,1.9c-15.1,5.7-24.6,17.8-29.8,26.7c-6-8.6-16.1-20.5-27.6-24.4c-3.8-1.3-8.1-2-12.3-2c-10.7,0-20.3,4.1-27,11.5c-5.7,6.2-12,18-10,38.8c4.1,42.6,71.5,87.1,74.3,88.9c1,0.7,2.1,1,3.3,1c1.1,0,2.3-0.3,3.3-1c2.7-1.8,66.5-43.6,73.7-86.1c3.7-21.8-2.7-34.9-8.8-42.1C169.2,42.7,158.6,37.8,148,37.8z M173.1,91c-2.6,15.2-15.1,33.4-36.1,52.7c-11.9,10.9-23.5,19.4-29,23.2c-5.7-4-17.9-12.9-30.3-24.3C56,122.5,43.8,104,42.3,89c-1.3-13,1.1-23.2,6.9-29.6c6-6.6,13.9-7.6,18.1-7.6c3,0,5.9,0.5,8.5,1.3c11.4,3.9,23.3,21.7,26.9,28.3c1.1,2.1,3.4,3.3,5.7,3.1c2.4-0.2,4.4-1.7,5.2-4c0.1-0.2,8.2-22.4,27.7-29.7c1.9-0.7,4.2-1.1,6.6-1.1c7.2,0,14.3,3.3,19,9C173.3,66.2,175.5,77.4,173.1,91z"/></svg></div>
  207. </div></div>
  208. {/block:indexpage}
  209. {/block:Photo}
  210.  
  211. {block:Photoset}
  212. {Photoset}
  213. {block:indexpage}
  214. <div class="notes-fixed">
  215. <a>{Month}, {DayofMonth}</a>
  216. <a href="{ReblogURL}">REBLOG</a>
  217. <a href="{permalink}">{NoteCount}</a>
  218. </div>
  219. {/block:indexpage}
  220. {/block:Photoset}
  221.  
  222. {block:Video}
  223. <div class="video">{Video-500}</div>
  224. {/block:Video}
  225.  
  226. {block:Quote}
  227. <div class="box">
  228. <div class="quote">{Quote}<div class="source">- <b>{Source}</b></div></div>
  229. {block:indexpage}
  230. <div class="notes-bottom">
  231. <a>{Month}, {DayofMonth}</a>
  232. <a href="{ReblogURL}">REBLOG</a>
  233. <a href="{permalink}">{NoteCount} NOTES</a>
  234. </div></div>
  235. {/block:indexpage}
  236. {/block:Quote}
  237.  
  238. {block:Link}
  239. <div class="box">
  240. <a href="{URL}" {Target}>{Name}</a>
  241. {block:Description} {Description}{/block:Description}
  242. {block:indexpage}
  243. <div class="notes-bottom">
  244. <a>{Month}, {DayofMonth}</a>
  245. <a href="{ReblogURL}">REBLOG</a>
  246. <a href="{permalink}">{NoteCount} NOTES</a>
  247. </div></div>
  248. {/block:indexpage}
  249. {/block:Link}
  250.  
  251. {block:Chat}
  252. <div class="box">
  253. {block:Title}{Title}{/block:Title}
  254. {block:Lines} {block:Label} <br> <b>{Label}</b> {/block:Label} {Line} {/block:Lines}
  255. {block:indexpage}
  256. <div class="notes-bottom">
  257. <a>{Month}, {DayofMonth}</a>
  258. <a href="{ReblogURL}">REBLOG</a>
  259. <a href="{permalink}">{NoteCount} NOTES</a>
  260. </div></div>
  261. {/block:indexpage}
  262. {/block:Chat}
  263.  
  264. {block:Audio}
  265. <div class="box">
  266. <div class="audio">{block:AudioPlayer}
  267. <div class="play">{AudioPlayerWhite}</div>{/block:AudioPlayer}
  268. <div class="n">
  269. {block:TrackName}<span class="tt">{TrackName}</span>{/block:TrackName}
  270. {block:Artist}<span>{Artist}</span>{/block:Artist}
  271. </div></div>
  272. {block:indexpage}
  273. <div class="notes-bottom">
  274. <a>{Month}, {DayofMonth}</a>
  275. <a href="{ReblogURL}">REBLOG</a>
  276. <a href="{permalink}">{NoteCount} NOTES</a>
  277. </div></div>
  278. {/block:indexpage}
  279. {/block:Audio}
  280.  
  281. {block:Answer}
  282. <div class="box">
  283. <div class="fotinha"><img src="{AskerPortraitURL-16}"></div>
  284. <div class="perguntou"><a>{Asker}:</a></div>
  285. <div class="pergunta">{Question}</div>
  286. <div class="resposta">{Answer}</div>
  287. {block:indexpage}
  288. <div class="notes-bottom">
  289. <a>{Month}, {DayofMonth}</a>
  290. <a href="{ReblogURL}">REBLOG</a>
  291. <a href="{permalink}">{NoteCount} NOTES</a>
  292. </div></div>
  293. {/block:indexpage}
  294. {/block:Answer}
  295.  
  296. <div class="vsanna">{block:RebloggedFrom}<a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  297. {block:ContentSource}<a href="{SourceURL}">source</a>{/block:ContentSource}
  298. </div>
  299.  
  300. {block:PermalinkPage}
  301. <div class="box" style="border:1px solid #fff">
  302. {block:Caption}{Caption}{/block:Caption}
  303. {block:HasTags}
  304. <p><i class="fa fa-hashtag"></i> {lang:Tagged}: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  305. <p>{block:Date}<i class="fa fa-clock-o"></i> {TimeAgo}, {MonthNumber}/{DayOfMonth}/{Year}.{/block:Date}
  306. <p>{block:NoteCount}<i class="fa fa-heart-o"></i> {NoteCountWithLabel}.{/block:NoteCount}
  307. <p>{block:RebloggedFrom}<i class="fa fa-share"></i> Via <a href="{ReblogParentURL}">{ReblogParentName}</a>,by <a href="{ReblogRootURL}">{ReblogRootName}</a>.{block:RebloggedFrom}
  308. {block:PostNotes}<div id="lpermalink" style="text-align:left">{PostNotes}</div>{/block:PostNotes}</div>{/block:PermalinkPage}</div>{/block:Posts}</div>
  309. </main>
  310.  
  311. <a href="http://surdaddy.tumblr.com" style="padding:10px; bottom:5px; right:5px; position:fixed;" title="THEME BY SURDADDY">surd.</a>
  312.  
  313. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script> <script src="http://static.tumblr.com/df28qmy/SHUlh3i7s/jquery.infinitescroll.js"></script> <script src="http://static.tumblr.com/thpaaos/lLwkowcqm/jquery.masonry.js"></script>
  314.  
  315. <script type="text/javascript"> $(window).load(function () {var $container = $('#content');$container.masonry({itemSelector: '.posts',columnWidth:{select:Post Size} + 20*2,});$('.masonryWrap').infinitescroll({ navSelector : "div#navigation", nextSelector : "div#navigation a#nextPage", itemSelector : ".posts", bufferPx : 10000, extraScrollPx: 11000, loadingImg : "http://goo.gl/2RmWUx", loadingText : "<i> </i>",},function() { $('#content').masonry({ appendedContent: $(this) }); } ); }); </script> {block:IndexPage}<div class="column navigation" id="navigation">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}" class="navigate"> {/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}{/block:Pagination}</div>{/block:IndexPage}
  316.  
  317. </body>
  318. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement