API tools faq
paste
dansmilth

Theme Page

dansmilth
Aug 10th, 2015
801
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.19 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3. <title>Themes</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  7.  
  8. <link href='http://fonts.googleapis.com/css?family=Roboto:700,400' rel='stylesheet' type='text/css'>
  9.  
  10. <script type="text/javascript">
  11. WebFontConfig = {
  12. google: { families: [ 'Roboto:700,400:latin' ] }
  13. };
  14. (function() {
  15. var wf = document.createElement('script');
  16. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  17. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  18. wf.type = 'text/javascript';
  19. wf.async = 'true';
  20. var s = document.getElementsByTagName('script')[0];
  21. s.parentNode.insertBefore(wf, s);
  22. })(); </script>
  23.  
  24. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  25.  
  26. <script type="text/javascript"
  27. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  28. <script>
  29. $(document).ready(function() {
  30. //
  31. $('a.poplight[href^=#]').click(function() {
  32. var popID = $(this).attr('rel'); //Get Popup Name
  33. var popURL = $(this).attr('href'); //Get Popup href to define size
  34. var query= popURL.split('?');
  35. var dim= query[1].split('&');
  36. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  37. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  38. var popMargTop = ($('#' + popID).height() + 80) / 2;
  39. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  40. //Apply Margin to Popup
  41. $('#' + popID).css({
  42. 'margin-top' : -popMargTop,
  43. 'margin-left' : -popMargLeft
  44. });
  45. $('body').append('<div id="fade"></div>');
  46. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  47. return false;
  48. });
  49. $('a.close, #fade').live('click', function() {
  50. $('#fade , .popup_block').fadeOut(function() {
  51. $('#fade, a.close').remove(); //fade them both out
  52. });
  53. return false;
  54. });
  55. });
  56. </script>
  57.  
  58. <style type="text/css">
  59.  
  60. body {
  61. font-family:arial;
  62. font-size:12px;
  63. background:#f8f8f8; /**this is the color of the bg.*/
  64.  
  65. }
  66.  
  67. a {
  68. color:#676767; /**this is the color of the links.*/
  69. text-decoration:none;
  70. }
  71.  
  72. ::-webkit-scrollbar {
  73. background-color: white;
  74. height:8px;
  75. width:5px
  76. }
  77.  
  78. ::-webkit-scrollbar-thumb:vertical {
  79. background-color:black;
  80. height:50px
  81. }
  82.  
  83. ::-webkit-scrollbar-thumb:horizontal {
  84. background-color:black;
  85. height:8px!important
  86. }
  87.  
  88.  
  89. .top {
  90. width:1594px;
  91. background:white; /**this is the color of the topbar bg.*/
  92. text-align:left;
  93. padding-bottom:0px;
  94. margin-bottom:0px;
  95. margin-top:-9px;
  96. margin-left:-7px;
  97. }
  98.  
  99. .ti {
  100. float:left;
  101. padding:30px;
  102. padding-top:30px;
  103. font-family:'roboto', sans-serif;
  104. font-size:15px;
  105. text-transform:uppercase;
  106. font-weight:bold;
  107. }
  108.  
  109. .links {
  110. width:1100px;
  111. text-align:center;
  112. padding:30px;
  113.  
  114.  
  115. }
  116.  
  117. .links a {
  118. font-family:'roboto', sans-serif;
  119. font-size:15px;
  120. text-transform:uppercase;
  121. padding:30px;
  122. border-left:1px solid #eee;
  123. margin-left:-3px;
  124.  
  125.  
  126. }
  127.  
  128. .links a:hover {
  129. background:black; /**this is the color of the bg of the topbar links bg when you hover over them.*/
  130. color:white; /**this is the color of the topbar links when you hover over them.*/
  131.  
  132. }
  133.  
  134. .links a:last-child {
  135. border-right:1px solid #eee;
  136. }
  137.  
  138.  
  139. .category {
  140. background:white; /**this is the color of the bg of your categories.*/
  141. width:250px;
  142. height:280px;
  143. margin-top:0px;
  144. overflow:hidden;
  145. float:left;
  146. box-shadow:0px 3px 10px rgba(0,0,0,.15);
  147. margin:10px;
  148. color:black; /**this is the color of the text of your categories.*/
  149. margin-bottom:50px;
  150. }
  151.  
  152. .category:hover {
  153. background:black; /**this is the color of the bg of your categories when you hover over them.*/
  154. color:white; /**this is the color of the text of your categories when you hover over them.*/
  155. transition:1s;
  156. -webkit-transition:1s;
  157. -moz-transition:1s;
  158. -o-transition:1s;
  159. }
  160.  
  161. .icon {
  162. font-size:80px;
  163. padding:10px;
  164. border-bottom:1px solid #eee;
  165. }
  166.  
  167. .cti {
  168. text-align:left;
  169. font-weight:bold;
  170. font-family:'roboto', sans-serif;
  171. font-size:20px;
  172. padding:10px;
  173. text-transform:uppercase;
  174. }
  175.  
  176. .cdesc {
  177. text-align:justify;
  178. padding:10px;
  179. line-height:150%;
  180. }
  181.  
  182. .container {
  183. width:1080px;
  184. margin-top:10px;
  185.  
  186.  
  187. }
  188.  
  189. #content {
  190. margin:10px;
  191. overflow:hidden;
  192. width:250px;
  193. float:left;
  194. box-shadow:0px 3px 10px rgba(0,0,0,.15);
  195.  
  196. }
  197.  
  198. #content img {
  199. display:block;
  200. width:250px;
  201. height:125px;
  202. }
  203.  
  204.  
  205.  
  206. .hover {
  207. opacity:0;
  208. width:250px;
  209. height:125px;
  210. margin-top:-125px;
  211. z-index:1;
  212. position:absolute;
  213. background:URL("http://static.tumblr.com/zy3qjic/T4Znsglm1/hover_copy.png");
  214. }
  215.  
  216. .hover:hover {
  217. -webkit-transition: all 0.5s ease-in;
  218. -moz-transition: all 0.5s ease-in;
  219. -o-transition: all 0.5s ease-in;
  220. opacity:1;
  221. width:250px;
  222. height:125px;
  223. background:URL("http://static.tumblr.com/zy3qjic/T4Znsglm1/hover_copy.png");
  224. margin-top:-125px;
  225. z-index:1;
  226. position:absolute;
  227. }
  228.  
  229.  
  230. .tti {
  231. margin-top:35px;
  232. padding:10px;
  233. color:white;
  234. text-transform:uppercase;
  235. font-weight:bold;
  236. }
  237.  
  238. .tlinks {
  239. color:white;
  240. }
  241.  
  242. .tlinks a {
  243. color:#cd5050;
  244. text-transform:uppercase;
  245. font-size:10px;
  246. letter-spacing:1px;
  247. }
  248.  
  249. .tlinks a:hover {
  250. color:white;
  251. transition:1s;
  252. -webkit-transition:1s;
  253. -moz-transition:1s;
  254. -o-transition:1s;
  255. }
  256.  
  257. #footer {
  258. margin-top: 0px;
  259. background:#f8f8f8;
  260. float: left;
  261. width: 1100px;
  262. height: auto;
  263. padding-top: 30px;
  264. padding-bottom: 30px;
  265. margin-left:calc(50% - 550px);
  266. margin-top:70px;
  267. font-family:'roboto', sans-serif;
  268. text-transform:uppercase;
  269. font-size:12px;
  270.  
  271. }
  272.  
  273. #footer a {
  274. color: black;
  275. font-weight: bold;
  276. }
  277.  
  278. #footer a:hover{
  279. text-decoration: none;
  280. font-weight: bold;
  281. transition:1s;
  282. -webkit-transition:1s;
  283. -moz-transition:1s;
  284. -o-transition:1s;
  285. }
  286.  
  287. .popup_block{
  288. display:none;
  289. background:#fff;
  290. padding:20px;
  291. border:1px solid #eee; /* if you want a solid white pop-up, delete this */
  292. float:left;
  293. position:fixed;
  294. top:50%;left:50%;
  295. z-index: 99999;
  296. -webkit-box-shadow: 0px 0px 20px #000; /* delete for solid white */
  297. -moz-box-shadow: 0px 0px 20px #000; /* delete for solid white */
  298. box-shadow: 0px 0px 20px #000; /* delete for solid white */
  299. }
  300.  
  301. *html #fade {position: absolute;}
  302. *html .popup_block {position: absolute;}
  303. #fade {
  304. display:none;
  305. position:fixed;
  306. left:0px;
  307. top:0px;
  308. width:100%;
  309. height:100%;
  310. z-index:9999;
  311. background:#000; /* change to #fff for solid white */
  312. opacity:0.5; /* change to opacity:1; */
  313. }
  314.  
  315.  
  316. </style>
  317. </head>
  318.  
  319. <body>
  320.  
  321.  
  322. <!-- THIS IS A POP UP BOX. YOU DONT HAVE TO USE THEM BUT IT'S THERE IF YOU WANT -->
  323. <!-- IF YOU WANT TO ADD A NEW POP UP BOX JUST COPY AND PASTE STARTING FROM HERE -->
  324. <div id="box1" class="popup_block">
  325. <center><h1>Rules</h1></center>
  326. You guys can donate any amount of money you like. Every donation is appreciated. It's to thank/support me for making free themes. The money will help me to pay for school and rent. Thank you so much if you donate money, I love you ♥</font><br><br>
  327.  
  328. <center><form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
  329. <input type="hidden" name="cmd" value="_s-xclick">
  330. <input type="hidden" name="hosted_button_id" value="FJ74QE4ZKVBS2">
  331. <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
  332. <img alt="" border="0" src="https://www.paypalobjects.com/fr_FR/i/scr/pixel.gif" width="1" height="1">
  333. </form></center>
  334. </div>
  335. </div></div></div></div></div></div></div></div></div></div>
  336. <!-- ENDING HERE -->
  337.  
  338. <!-- EVERYTIME YOU ADD A NEW POP UP BOX CHANGE THE NUMBER OF THE BOX. SEE HERE IT'S CALLED BOX2 INSTEAD OF BOX1 -->
  339. <div id="box2" class="popup_block">
  340. <center><h1>Rules</h1></center>
  341. <li> Do not remove the credit.
  342. <li> Do not redistribute.
  343. <li> Do not steal.
  344. <li> Do not claim as your own.
  345. </div>
  346. </div></div></div></div></div></div></div></div></div></div>
  347.  
  348.  
  349. <!-- TOPBAR LINKS + TITLE -->
  350.  
  351. <div class="top">
  352. <div class="ti"><i class="fa fa-diamond"></i> themes by clumhood</div>
  353. <center><div class="links">
  354. <a href="/">Home</a>
  355. <a href="/message">inbox</a>
  356. <a href="/tagged/theme ask">FAQ</a>
  357. <a href="/tagged/theme">Theme tag</a>
  358.  
  359. <!-- THATS WHAT YOUR LINK LOOKS LIKE TO LEAD TO YOUR POP UP BOX. JUST COPY AND PASTE ALL OF THAT AND MAKE SURE THE NUMBER OF THE BOX MATCHES YOUR POP UP BOX-->
  360. <a href="#?w=300" rel="box2" class="poplight">Rules</a>
  361. </div></center>
  362. </div>
  363.  
  364.  
  365. <!-- CATEGORIES -->
  366.  
  367.  
  368. <center><div class="container">
  369.  
  370. <a href="/tagged/theme"><div class="category">
  371. <div class="icon"><i class="fa fa-code"></i> </div>
  372. <div class="cti">Themes</div>
  373. <div class="cdesc">I provide you with a wide variety of themes, from simple themes to fansite themes or even icon pages, event pages etc. </div>
  374. </div></a>
  375.  
  376. <a href="/message"><div class="category">
  377. <div class="icon"><i class="fa fa-tasks"></i> </div>
  378. <div class="cti">Requests</div>
  379. <div class="cdesc">Requests are open. If you want me to make a type of theme, or a type of page, go to my ask and tell me what you'd like. Unlike, commissions it'll be posted publicly and available to everyone. </div>
  380. </div></a>
  381.  
  382. <a href="/commissions"><div class="category">
  383. <div class="icon"><i class="fa fa-desktop"></i> </div>
  384. <div class="cti">Commissions</div>
  385. <div class="cdesc">Want a customized theme? If you're willing to pay for your theme/fansite theme/gallery theme, I now take commissions! Your theme will never be published publicly and will only be used by you. </div>
  386. </div></a>
  387.  
  388. <a href="#?w=300" rel="box1" class="poplight"><div class="category">
  389. <div class="icon"><i class="fa fa-credit-card"></i> </div>
  390. <div class="cti">Donate</div>
  391. <div class="cdesc">Want to thank me and support me for making free themes? You can donate some money here. It's not necessary but it would be really appreciated. </div>
  392. </div></a>
  393.  
  394.  
  395. <!-- THEMES -->
  396.  
  397. <!-- TO ADD A NEW THEME COPY AND PASTE STARTING FROM HERE -->
  398. <!-- THE PREVIEWS ARE SIZED 250X125PX -->
  399. <div id="content"><img src="http://41.media.tumblr.com/759ae833007f4dd802248e257c665a6a/tumblr_nsbb7nbzeJ1tws1sgo1_500.png"/>
  400. <div class="hover">
  401. <div class="tti">Event page</div>
  402. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/event">preview</a> + <a href="http://pastebin.com/UwHTiRK0">code</a> + <a href="http://clumhood.tumblr.com/post/125444347581/event-page-by-clumhood-static-preview-code">info</a></div>
  403. </div></div>
  404. <!-- ENDING HERE -->
  405.  
  406. <div id="content"><img src="http://static.tumblr.com/zy3qjic/cKansgm1n/2.png"/>
  407. <div class="hover">
  408. <div class="tti">theme 11</div>
  409. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th11">preview</a> + <a href="http://pastebin.com/ym5PEk3U">code</a> + <a href="http://clumhood.tumblr.com/post/125089123096/theme-11-drive-by-clumhood-static-preview">info</a></div>
  410. </div></div>
  411.  
  412. <div id="content"><img src="http://static.tumblr.com/zy3qjic/Racnsgm6n/2.png"/>
  413. <div class="hover">
  414. <div class="tti">gallery #2</div>
  415. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/g2p1">preview</a> + <a href="http://pastebin.com/KHEKQegT">code</a> + <a href="http://clumhood.tumblr.com/post/124490446341/theme-page-02-gallery-2-by-clumhood-part1">info</a></div>
  416. </div></div>
  417.  
  418. <div id="content"><img src="http://41.media.tumblr.com/253fecd7ca2dfbd55bee636fda543e50/tumblr_nrqnpgZKYV1tws1sgo2_r1_500.png"/>
  419. <div class="hover">
  420. <div class="tti">gallery #1</div>
  421. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/gallery1">preview</a> + <a href="http://pastebin.com/QK3zLt3F">code</a> + <a href="http://clumhood.tumblr.com/post/124490439221/theme-page-01-gallery-1-by-clumhood-static">info</a></div>
  422. </div></div>
  423.  
  424. <div id="content"><img src="http://static.tumblr.com/zy3qjic/xjTnsgmdx/2.png"/>
  425. <div class="hover">
  426. <div class="tti">Fansite theme #2</div>
  427. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th10">preview</a> + <a href="http://pastebin.com/fY5nSDmH">code</a> + <a href="http://clumhood.tumblr.com/post/122429071896/theme-10-fansite-theme-2-by-clumhood-static">info</a></div>
  428. </div></div>
  429.  
  430. <div id="content"><img src="http://static.tumblr.com/zy3qjic/lkJnsgml2/2.png"/>
  431. <div class="hover">
  432. <div class="tti">Theme 09</div>
  433. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th09">preview</a> + <a href="http://pastebin.com/iViMdwi4">code</a> + <a href="http://clumhood.tumblr.com/post/120939077586/theme-09-hold-me-down-by-clumhood-static">info</a></div>
  434. </div></div>
  435.  
  436. <div id="content"><img src="http://static.tumblr.com/zy3qjic/I0tnsgmoe/2.png"/>
  437. <div class="hover">
  438. <div class="tti">Theme 08</div>
  439. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th08">preview</a> + <a href="http://pastebin.com/BWRuAMKq">code</a> + <a href="http://clumhood.tumblr.com/post/119454316126/theme-08-control-by-clumhood-static-preview">info</a></div>
  440. </div></div>
  441.  
  442. <div id="content"><img src="http://static.tumblr.com/zy3qjic/4Lxnsgmtf/2.png"/>
  443. <div class="hover">
  444. <div class="tti">Theme 07</div>
  445. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th07">preview</a> + <a href="http://pastebin.com/e3yHGnZk">code</a> + <a href="http://clumhood.tumblr.com/post/118401417061/theme-07-new-flame-by-clumhood-static-preview">info</a></div>
  446. </div></div>
  447.  
  448. <div id="content"><img src="http://static.tumblr.com/zy3qjic/mRvnsgn0v/2.png"/>
  449. <div class="hover">
  450. <div class="tti">Fansite theme #1</div>
  451. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th06">preview</a> + <a href="http://pastebin.com/uGuMSNJp">code</a> + <a href="http://clumhood.tumblr.com/post/117567093871/theme-06-by-clumhood-static-preview-code">info</a></div>
  452. </div></div>
  453.  
  454. <div id="content"><img src="http://static.tumblr.com/zy3qjic/8qunsgnb3/2.png"/>
  455. <div class="hover">
  456. <div class="tti">theme 05</div>
  457. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th05">preview</a> + <a href="http://pastebin.com/pDh5wmXL">code</a> + <a href="http://clumhood.tumblr.com/post/117189001701/theme-05-wanderess-by-clumhood-static-preview">info</a></div>
  458. </div></div>
  459.  
  460. <div id="content"><img src="http://static.tumblr.com/zy3qjic/maLnsgnd2/2.png"/>
  461. <div class="hover">
  462. <div class="tti">theme 04</div>
  463. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th04">preview</a> + <a href="http://pastebin.com/7ZqiDL07">code</a> + <a href="http://clumhood.tumblr.com/post/94954489701/theme-04-by-clumhood-all-about-that-bass">info</a></div>
  464. </div></div>
  465.  
  466. <div id="content"><img src="http://static.tumblr.com/zy3qjic/ShGnsgng4/2.png"/>
  467. <div class="hover">
  468. <div class="tti">theme 02</div>
  469. <div class="tlinks"><a href="http://clumhoodthemes.tumblr.com/th02">preview</a> + <a href="http://pastebin.com/YavKkYaL">code</a> + <a href="http://clumhood.tumblr.com/post/94954489701/theme-04-by-clumhood-all-about-that-bass">info</a></div>
  470. </div></div>
  471.  
  472. </div></center>
  473.  
  474. <!-- DONT REMOVE THIS -->
  475.  
  476. <center><div id="footer"> Theme by <a href="http://clumhood.tumblr.com/">clumhood</a> © </div></center>
  477.  
  478.  
  479. </body>
  480. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!