API tools faq
paste
Advertisement
surdd

THEME SURDADDY - 07

surdd
May 5th, 2016
772
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 15.88 KB | None | 0 0
raw download clone embed print report
  1.        <!-----------------------------------------------------------
  2.                      DESIGN by SURDADDY - ORIGINAL ©
  3.      ------------------------------------------------------------->
  4.        
  5. <meta name="color:background" content="#fff" />
  6. <meta name="color:text" content="#999" />
  7. <meta name="color:links" content="#b0b0b0" />
  8. <meta name="color:title" content="#d7c5b1" />
  9. <meta name="color:linkshover" content="#d7c5b1" />
  10. <meta name="color:rolagem" content="#d7c5b1" />
  11. <meta name="image:foto" content="" />
  12. <meta name="text:title" content="dangerous" />
  13.  
  14. <meta name="text:Link1" content="/" />
  15. <meta name="text:Link1 Title" content="link 1" />
  16. <meta name="text:Link2" content="/" />
  17. <meta name="text:Link2 Title" content="link 2" />
  18. <meta name="text:Link3" content="/" />
  19. <meta name="text:Link3 Title" content="link 3" />
  20. <meta name="text:Link4" content="/" />
  21. <meta name="text:Link4 Title" content="link 4" />
  22.  
  23. <head>
  24.  
  25.                      <title>{Title}</title>
  26.   <link rel="shortcut icon" href="{FavIcon}"><link rel="alternate" type="application/rss+xml" href="{RSS}">{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  27.  
  28. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script> <script> (function($){ $(document).ready(function(){ $("[title]").style_my_tooltips(); }); })(jQuery); </script>  
  29.  
  30. <link href='https://fonts.googleapis.com/css?family=NTR' rel='stylesheet' type='text/css'>
  31.  
  32. <link href='https://fonts.googleapis.com/css?family=Pathway+Gothic+One' rel='stylesheet' type='text/css'>
  33.  
  34. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  35.  
  36. <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>
  37.  
  38. </head>
  39.  
  40. <style type="text/css">
  41.  
  42. #s-m-t-tooltip {max-width:200px;line-height:17px;height:17px; font-size:10px; color:#999; padding:3px 4px 3px 4px; margin:20px 0px 0px 20px; z-index:99999;transition: 0.5s;background:#fff;text-transform:uppercase;letter-spacing:2px;font-family:consolas;}
  43.  
  44. #scrollToTop:link,#scrollToTop:visited { color: transparent; background-color: transparent; display: none; position: fixed; bottom:45px; right: 42px;}
  45. #scrollToTop i {font-size:13px;color:#000;}
  46.  
  47. body {font-family:helvetica; font-size:10px; background:{color:background}; color:{color:text};text-align:justify;}
  48.  
  49. a {color: #000; text-decoration: none; text-transform: none;}
  50. a:hover {color:#000; transition:0.5s;}
  51. h1 {font-size:10px;text-align:center;text-transform:uppercase;letter-spacing:1px;}
  52.  
  53. #content {margin-top:40px; margin-left:360px; width:1000px;}
  54.  
  55. .posts{float:left;width:190px;margin:15px;padding:10px;background:#fff;overflow:hidden;border:1px solid #faf7f5;{block:permalinkpage}width:500px;border:1px solid #faf7f5;margin-left:120px;{/block:permalinkpage};}
  56. .posts img {width:190px;transition: all 0.5s ease-in-out;}
  57. .postimage img {width:190px;{block:PermalinkPage}width:98%;padding:5px;{/block:PermalinkPage};}
  58.  
  59. .quote:first-letter {font-size: 15px; line-height:15px; color:#000}
  60. .quote {text-align:left; line-height:15px; color:{color:text}; padding:3px;}
  61. .source {text-transform:uppercase; text-align:right;font-size:10px; margin-top:1px;}
  62.  
  63. .perguntou {float:left;text-align:left; text-indent:3px;width:100px;text-transform:uppercase;margin-left:1px;margin-top:0px;height:20px;line-height:28px;}
  64. .perguntou a {text-transform:uppercase;color:{color:text};font-size:9px;}
  65. .fotinha {float:left;text-align:left;width:20px;height:20px;margin-left:6px;margin-top:0px;border-radius:20px;border:5px solid #fff;z-index:9;}
  66. .fotinha img {width:20px; height:20px;margin-left:0px;margin-top:0px;border-radius:20px;}
  67. .pergunta {background:#b0b0b0;text-align:left; text-indent:-20px;width:166px;color:#fff;margin-left:6px;margin-top:23px;height:auto;line-height:18px;padding:5px;}
  68. .resposta{text-align:left;padding:5px; width:163px;height:auto;line-height:13px;margin-left:6px;margin-top:0px;color:{color:text};border:1px solid #faf7f5;}
  69.  
  70. #audio {width:100px; height:80px;}
  71. #audio img {position:absolute; width:80px; height:80px; background-color:#fff;}
  72. #audiott {position:absolute;margin:12px 84px; width:110px;}
  73. #audiott span {color:{color:text};}
  74. #play {position:absolute; overflow:hidden; height:28px; width:28px; margin:10px;}
  75. #player {position:absolute; width:46px; height:46px; z-index:9; margin:17px; border-radius:40px; opacity:0.6; transition:1s; background:#fff;}
  76. #player:hover {opacity:1; transition:1s;}
  77.  
  78. /******** NOTES POR SURDADDY / DON'T COPY *******/
  79. #notes {width:106px; height:36px;transition:0.8s; position:absolute;left:14px;bottom:15px;opacity:0;border:1px solid rgba(255,255,255,0.4);}            
  80. #perms {left:2px;bottom:0px;position:absolute;opacity:1;transition:1s;}
  81. #perms a {transition:1s; width:30px;height:30px;text-align:center;font-size:20px;float:left;color:#fff; margin:3px 2px;background: rgba(255,255,255,0.4);}
  82. #perms a i {line-height:30px;}
  83. #perms a:hover {color:#d7c5b1;}
  84. .posts:hover #notes {opacity:1;}
  85. #notes_n {width:106px; height:36px;transition:0.8s; position:absolute;right:-28px;bottom:8px;opacity:0;}
  86. #perms_n {left:2px;bottom:0px;position:absolute;transition:1s;border:1px solid #b0b0b0;background: #fff}
  87. #perms_n a {transition:1s; width:20px;height:20px;text-align:center;font-size:13px;float:left;color:#b0b0b0; margin:3px 1px;}
  88. #perms_n a i {line-height:20px;}
  89. #perms_n a:hover {color:#d7c5b1;}
  90. .posts:hover #notes_n {opacity:1;}
  91.  
  92. .vsanna{display: none;}
  93. blockquote {margin:0px;}
  94.  
  95. #infscr-loading{position:absolute!important;width:16px!important;height:11px!important;margin-bottom:-16px!important;top:auto!important;bottom:0;left:40%!important}
  96. .tumblrAutoPager_page_separator, .tumblrAutoPager_page_info {display: none;}
  97.  
  98. /*** FRAGILEHELP ***/
  99. #lpermalink {padding:0px; margin-bottom:1px;overflow-x:hidden; overflow-y:auto;height:200px;border:1px solid #faf7f5;color:;}
  100. #lpermalink a {color:;margin-left:5px;}
  101. #lpermalink img {float:left; width:20px;}
  102. ol.notes li {list-style-type:none; margin:2px; line-height:18px; padding:5px; border-bottom:1px solid #faf7f5;margin-left:-30px;}
  103.  
  104. #creditos {right:45px; bottom:25px; position:fixed;z-index:99999;}
  105. #creditos a {text-align:center; width:20px; height:20px;float:left;line-height:20px;color:#999;font-size:11px;font-family:'NTR';}
  106.  
  107. ::-webkit-scrollbar {height:4px;width:4px;background: {color:rolagem};border: 1px solid {color:background};}
  108. ::-webkit-scrollbar-thumb:vertical{background: {color:rolagem};height:auto;}
  109.  
  110. #side { width:141px; height:141px; position:fixed; margin-left:130px;margin-top:120px;border:2px solid #faf7f5;}
  111. #foto{position:fixed;margin-left:20px;margin-top:20px;}
  112. #foto img { width:100px;outline-offset:-5px; outline:4px solid rgba(225,225,225,0.4);;}
  113. #line { width:2000px; height:25px; position:fixed; margin-left:-10px;margin-top:-40px;border:1px solid #faf7f5;background:#fff;z-index:1;}
  114. #line2 { width:30px; height:2000px; position:fixed; left:-5px;top:-40px;border:1px solid #faf7f5;background:#fff;}
  115. #line3 { width:30px; height:2000px; position:fixed; right:-5px;top:-40px;border:1px solid #faf7f5;background:#fff;}
  116.  
  117. #title {position:fixed;width:85px; height:15px; margin-top:-14px; margin-left:24px; text-align:left;text-indent:5px;color:{color:title};font-size:13px;font-family: 'Pathway Gothic One', sans-serif;letter-spacing:3px;text-transform:uppercase;background:#fff;}
  118.  
  119. /*  MENU POR SURDADDY, DON'T COPY.  */
  120. .list {position:fixed; margin-top:135px;margin-left:15px; width:20px;transition:1s;background:#fff;text-indent:5px;}
  121. .list i {text-align:left;color:{color:title};font-size:13px;transition:1s;}
  122. .list i:hover {color:#b0b0b0;transition:1s;}
  123. .list:hover #menu {opacity:1;transition:1s;}
  124.  
  125. #menu {position:fixed; margin-top:5px;margin-left:8px; width:90px;transition:2s;border-top:1px solid #faf7f5;opacity:0;}
  126. #menu a {transition:0.5s; width:88px;height:15px;text-transform:uppercase; float: left;margin-left:0px;margin-top:5px; color:#b0b0b0; line-height:16px;font-size:11px; text-align:left;font-family: 'Pathway Gothic One', sans-serif;letter-spacing:1px;border:1px solid #faf7f5;}
  127. #menu a:hover{box-shadow:inset -66px 0px 0px {color:linkshover}; color:#fff;transition:0.5s;}
  128. #menu i {margin-left:-2px;font-size:12px;line-height:16px;color:#b0b0b0;border-bottom:1px solid #fff;width:20px;}
  129.  
  130. #menu .l1 {transition-delay:0.8s;opacity:0;margin-top:0px;transform:rotateX(-180deg);}
  131. #menu .l2 {transition-delay: 0.6s;opacity:0;margin-top:-5px;transform:rotateX(-180deg);}
  132. #menu .l3 {transition-delay: 0.4s;opacity:0;margin-top:-5px;transform:rotateX(-180deg);}
  133. #menu .l4 {transition-delay: 0.3s;opacity:0;margin-top:-5px;transform:rotateX(-180deg);}
  134.  
  135. .list:hover #menu .l1 {transition-delay: 0.3s;opacity:1;margin-top:5px;transform:rotateX(0deg);}
  136. .list:hover #menu .l2 {transition-delay: 0.4s;opacity:1;margin-top:5px;transform:rotateX(0deg);}
  137. .list:hover #menu .l3 {transition-delay: 0.6s;opacity:1;margin-top:5px;transform:rotateX(0deg);}
  138. .list:hover #menu .l4 {transition-delay: 0.8s;opacity:1;margin-top:5px;transform:rotateX(0deg);}
  139.  
  140. </style>
  141. <body>
  142.  
  143. <div id="line"></div><div id="line2"></div><div id="line3"></div>
  144.  
  145. <div id="side">
  146. <div id="foto"><img src="http://67.media.tumblr.com/eac6d061e5343dd09820e9220bc8fde1/tumblr_o6o8cxgaTA1u7ll4wo6_250.png"></div>
  147.  
  148. <div class="list"><i class="fa fa-bars"></i> <div id="title">{text:title}</div>
  149. <div id="menu">
  150.  
  151. <a class="l1" href="{text:Link1}"><i class="fa fa-home"></i> {text:Link1 title} </a>
  152. <a class="l2" href="{text:Link2}"><i class="fa fa-comments"></i></i> {text:Link2 title} </a>
  153. <a class="l3" href="{text:Link3}"><i class="fa fa-tag"></i> {text:Link3 title}</a>
  154. <a class="l4" href="{text:Link4}"><i class="fa fa-gift"></i> {text:Link4 title}</a>
  155. </div></div>
  156. </div>
  157.  
  158. <div id="content">{block:Posts} <div class="posts">
  159.  
  160. {block:Text}
  161. {block:Title} <h1>{Title}</h1> {/block:Title}
  162. {Body}
  163. {block:indexpage}
  164. <div id="notes">
  165. <div id="perms"><a href="{ReblogURL}" title="reblog"><img src="https://cdn2.iconfinder.com/data/icons/synchronize/24/synchronize-5-128.png"></a></div>
  166. <div id="perms_n"><a>{TimeAgo} - <a href="{permalink}">{NoteCount} NOTES</a></div></div>
  167. {/block:indexpage}
  168. {/block:Text}
  169.  
  170. {block:Photo}
  171. <div class="postimage"><img src="{PhotoURL-250}"></div>
  172. {block:indexpage}
  173. <div id="notes">
  174. <div id="perms">
  175. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  176. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  177. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  178. {/block:indexpage}
  179. {/block:Photo}
  180.  
  181. {block:Photoset}
  182. {Photoset}
  183. {block:indexpage}
  184. <div id="notes">
  185. <div id="perms">
  186. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  187. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  188. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  189. {/block:indexpage}
  190. {/block:Photoset}
  191.  
  192. {block:Quote}
  193. <div class="quote">{Quote}<div class="source">- <b>{Source}</b></div></div>
  194. {block:indexpage}
  195. <div id="notes_n">
  196. <div id="perms_n">
  197. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  198. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  199. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  200. {/block:indexpage}
  201. {/block:Quote}
  202.  
  203. {block:Link}
  204. <a href="{URL}" {Target}>{Name}</a>
  205. {block:Description} {Description}{/block:Description}
  206. {block:indexpage}
  207. <div id="notes_n">
  208. <div id="perms_n">
  209. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  210. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  211. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  212. {/block:indexpage}
  213. {/block:Link}
  214.  
  215. {block:Chat}
  216. {block:Title}{Title}{/block:Title}
  217. {block:Lines} {block:Label} <br> <b>{Label}</b> {/block:Label} {Line} {/block:Lines}
  218. {block:indexpage}
  219. <div id="notes_n">
  220. <div id="perms_n">
  221. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  222. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  223. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  224. {/block:indexpage}
  225. {/block:Chat}
  226.  
  227. {block:Video}
  228. {Video-250}
  229. {block:indexpage}
  230. <div id="notes">
  231. <div id="perms">
  232. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  233. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  234. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  235. {/block:indexpage}
  236. {/block:Video}
  237.  
  238. {block:Audio}
  239. <div id="audio">
  240. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  241. <div id="player"><div id="play">{AudioPlayerWhite}</div></div>
  242. <div id="audiott">
  243. Track: {block:TrackName}<span>{TrackName}</span>{/block:TrackName}
  244. <p>Artist: {block:Artist}<span>{Artist}</span>{/block:Artist}</p>
  245. <p>Album: {block:Album}<span>{Album}</span>{/block:Album}</p>
  246. </div></div>
  247. {block:indexpage}
  248. <div id="notes_n">
  249. <div id="perms_n">
  250. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  251. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  252. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  253. {/block:indexpage}
  254. {/block:Audio}
  255.  
  256. {block:Answer}
  257. <div class="fotinha"><img src="{AskerPortraitURL-16}"></div>
  258. <div class="perguntou"><a>{Asker}:</a></div>
  259. <div class="pergunta">{Question}</div>
  260. <div class="resposta">{Answer}</div>
  261. {block:indexpage}
  262. <div id="notes_n">
  263. <div id="perms_n">
  264. <a title="{TimeAgo}"><i class="fa fa-info-circle"></i></a>
  265. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet"></i></a>
  266. <a href="{permalink}" title="{NoteCount}"> <i class="fa fa-heart-o"></i></a></div></div>
  267. {/block:indexpage}
  268. {/block:Answer}
  269.  
  270. {block:PermalinkPage}
  271. <div class="box" style="border:1px solid #fff">
  272. {block:Caption}{Caption}{/block:Caption}
  273. {block:HasTags}
  274. <p><i class="fa fa-hashtag"></i> {lang:Tagged}: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  275. <p>{block:Date}<i class="fa fa-clock-o"></i> {TimeAgo}, {MonthNumber}/{DayOfMonth}/{Year}.{/block:Date}
  276. <p>{block:NoteCount}<i class="fa fa-heart-o"></i> {NoteCountWithLabel}.{/block:NoteCount}
  277. <p>{block:RebloggedFrom}<i class="fa fa-share"></i> Via <a href="{ReblogParentURL}">{ReblogParentName}</a>,by <a href="{ReblogRootURL}">{ReblogRootName}</a>.{block:RebloggedFrom}
  278. {block:PostNotes}<div id="lpermalink" style="text-align:left">{PostNotes}</div>{/block:PostNotes}</div>{/block:PermalinkPage}</div>{/block:Posts}</div>
  279.  
  280. <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> <script type="text/javascript"> $(window).load(function () { $('#content').masonry(),
  281. $('.masonryWrap').infinitescroll({ navSelector : "div#navigation",
  282. nextSelector : "div#navigation a#nextPage", itemSelector : ".posts",
  283. bufferPx : 10000, extraScrollPx: 11000, loadingImg : "http://goo.gl/2RmWUx", loadingText : "<i> </i>",
  284. },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}
  285.  
  286. <div id="creditos">
  287. <a href="http://surdaddy.tumblr.com" title="by Surdaddy ">THEME</a>
  288. </div>
  289.  
  290. </body>
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!