API tools faq
paste
Advertisement
sasorisbutt

Ice Cream (Light) Page - BakaThemes

sasorisbutt
Jan 4th, 2014
814
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.05 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. PAGE MADE BY BAKATHEMES OR AKATSUKII @ TUMBLR
  4. Edit/tweak as much as you like but pleeeeaaaase
  5. DO NOT remove the credits, copy and
  6. redistribute the theme as your own.
  7. I will fucking hunt you down if you do.
  8.  
  9. -->
  10.  
  11.  
  12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  13. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  14.  
  15. <head>
  16.  
  17. <title>{Title}</title>
  18. <link rel="shortcut icon" href="{Favicon}">
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20.  
  21. <script type="text/javascript" src="http://static.tumblr.com/3ikgvxs/0TGl4zgpu/jquery.min.js"></script>
  22.  
  23. <script src="http://static.tumblr.com/fsavqrf/TvBmx19ce/jquery.style-my-tooltips-white.js"></script>
  24.  
  25. <script>
  26. $().ready(function() {
  27. $("[title]").style_my_tooltips({
  28. tip_follows_cursor: "on", //on/off
  29. tip_delay_time: 80 //milliseconds
  30. });
  31. });
  32. </script>
  33.  
  34.  
  35. <style type="text/css">
  36.  
  37. ::-webkit-scrollbar {
  38. width:5px;
  39. height:3px;
  40. background:#fff;
  41. }
  42.  
  43. ::-webkit-scrollbar-thumb {
  44. background:#4eb7ff;
  45. }
  46.  
  47. #s-m-t-tooltip {
  48. max-width:200px;
  49. font-family:Calibri;
  50. font-size:8px;
  51. text-transform:uppercase;
  52. letter-spacing:1px;
  53. margin:0 0 0 20px;
  54. padding:3px;
  55. color:#fff;
  56. background:#4eb7ff;
  57. z-index:999999;
  58. }
  59.  
  60. body {
  61. font-family:Calibri;
  62. font-size:8px;
  63. color:#494949;
  64. letter-spacing:1px;
  65. text-transform:uppercase;
  66. margin:0;
  67. padding:0;
  68. background:#fff;
  69. cursor:default;
  70. }
  71.  
  72. a {
  73. text-decoration:none;
  74. color:#999;
  75. cursor:crosshair;
  76. transition:all 0.5s ease;
  77. -webkit-transition:all 0.5s ease;
  78. -moz-transition:all 0.5s ease;
  79. -o-transition:all 0.5s ease;
  80. -ms-transition:all 0.5s ease;
  81. }
  82.  
  83. a:hover {
  84. color:#ccc;
  85. }
  86.  
  87. #center {
  88. top:120px;
  89. width:800px;
  90. height:518px;
  91. margin:120px auto;
  92. }
  93.  
  94. #right {
  95. float:right;
  96. width:200px;
  97. height:512px;
  98. text-align:right;
  99. border-top:3px double #aaddff;
  100. border-bottom:3px double #aaddff;
  101. transition:all 0.5s ease;
  102. -webkit-transition:all 0.5s ease;
  103. -moz-transition:all 0.5s ease;
  104. -o-transition:all 0.5s ease;
  105. -ms-transition:all 0.5s ease;
  106. overflow:hidden;
  107. }
  108.  
  109. #right:hover {
  110. border-top:3px double #4eb7ff;
  111. border-bottom:3px double #4eb7ff;
  112. transition:all 0.5s ease;
  113. -webkit-transition:all 0.5s ease;
  114. -moz-transition:all 0.5s ease;
  115. -o-transition:all 0.5s ease;
  116. -ms-transition:all 0.5s ease;
  117. }
  118.  
  119. #right img {
  120. width:180px;
  121. padding:12px;
  122. }
  123.  
  124. #right a {
  125. display:block;
  126. margin-right:10px;
  127. padding:8px;
  128. transition:all 0.5s ease;
  129. -webkit-transition:all 0.5s ease;
  130. -moz-transition:all 0.5s ease;
  131. -o-transition:all 0.5s ease;
  132. -ms-transition:all 0.5s ease;
  133. }
  134.  
  135. #right a:hover {
  136. padding-right:80px;
  137. color:#fff;
  138. background:#4eb7ff;
  139. text-decoration:underline;
  140. transition:all 0.5s ease;
  141. -webkit-transition:all 0.5s ease;
  142. -moz-transition:all 0.5s ease;
  143. -o-transition:all 0.5s ease;
  144. -ms-transition:all 0.5s ease;
  145. }
  146.  
  147. .left {
  148. float:left;
  149. width:584px;
  150. height:518px;
  151. border-left:3px double #4eb7ff;
  152. }
  153.  
  154. .top {
  155. background:#aaddff;
  156. padding:10px 20px;
  157. text-align:center;
  158. border-bottom:1px dashed #4eb7ff;
  159. transition:all 0.5s ease;
  160. -webkit-transition:all 0.5s ease;
  161. -moz-transition:all 0.5s ease;
  162. -o-transition:all 0.5s ease;
  163. -ms-transition:all 0.5s ease;
  164. }
  165.  
  166. .top li {
  167. list-style-type:none;
  168. }
  169.  
  170. .top li b {
  171. color:#4eb7ff;
  172. transition:all 0.5s ease;
  173. -webkit-transition:all 0.5s ease;
  174. -moz-transition:all 0.5s ease;
  175. -o-transition:all 0.5s ease;
  176. -ms-transition:all 0.5s ease;
  177. }
  178.  
  179. #center:hover .top {
  180. color:#fff;
  181. background:#4eb7ff;
  182. border-bottom:1px dashed #fff;
  183. transition:all 0.5s ease;
  184. -webkit-transition:all 0.5s ease;
  185. -moz-transition:all 0.5s ease;
  186. -o-transition:all 0.5s ease;
  187. -ms-transition:all 0.5s ease;
  188. }
  189.  
  190. #center:hover .top b {
  191. color:#aaddff;
  192. transition:all 0.5s ease;
  193. -webkit-transition:all 0.5s ease;
  194. -moz-transition:all 0.5s ease;
  195. -o-transition:all 0.5s ease;
  196. -ms-transition:all 0.5s ease;
  197. }
  198.  
  199. #desc {
  200. height:420px;
  201. margin-top:20px;
  202. padding:10px;
  203. text-align:center;
  204. overflow-y:auto;
  205. }
  206.  
  207. #message {
  208. display:none;
  209. }
  210.  
  211. #faq {
  212. height:260px;
  213. margin-top:20px;
  214. overflow-y:auto;
  215. }
  216.  
  217. #question {
  218. float:left;
  219. width:280px;
  220. margin-left:5px;
  221. }
  222.  
  223. #question h4 {
  224. color:#4eb7ff;
  225. padding:10px;
  226. text-align:center;
  227. background:#aaddff;
  228. }
  229.  
  230. #links {
  231. display:none;
  232. }
  233.  
  234. #link {
  235. height:450px;
  236. overflow-x:hidden;
  237. overflow-y:auto;
  238. }
  239.  
  240. #link table td {
  241. vertical-align:top;
  242. }
  243.  
  244. #links #title table {
  245. margin-left:3px;
  246. border-collapse:separate;
  247. border-spacing:4px;
  248. }
  249.  
  250. #links #title table td {
  251. width:71px;
  252. padding:10px 20px;
  253. color:#4eb7ff;
  254. background:#aaddff;
  255. }
  256.  
  257. #section {
  258. width:111px;
  259. }
  260.  
  261. #section a {
  262. display:block;
  263. width:78px;
  264. height:10px;
  265. margin:0 0 10px 3px;
  266. padding:5px;
  267. text-align:center;
  268. border-bottom:1px solid #aaddff;
  269. transition:all 0.5s ease;
  270. -webkit-transition:all 0.5s ease;
  271. -moz-transition:all 0.5s ease;
  272. -o-transition:all 0.5s ease;
  273. -ms-transition:all 0.5s ease;
  274. overflow:hidden;
  275. white-space:nowrap;
  276. }
  277.  
  278. #section a:hover {
  279. border-bottom:1px solid #4eb7ff;
  280. transition:all 0.5s ease;
  281. -webkit-transition:all 0.5s ease;
  282. -moz-transition:all 0.5s ease;
  283. -o-transition:all 0.5s ease;
  284. -ms-transition:all 0.5s ease;
  285. }
  286.  
  287. #blogroll {
  288. display:none;
  289. width:584px;
  290. }
  291.  
  292. #names {
  293. margin-top:7px;
  294. width:584px;
  295. height:480px;
  296. overflow-x:hidden;
  297. overflow-y:auto;
  298. }
  299.  
  300. #name a {
  301. float:left;
  302. width:78px;
  303. height:10px;
  304. margin:0 0 3px 8px;
  305. padding:5px;
  306. text-align:center;
  307. border-bottom:1px solid #aaddff;
  308. transition:all 0.5s ease;
  309. -webkit-transition:all 0.5s ease;
  310. -moz-transition:all 0.5s ease;
  311. -o-transition:all 0.5s ease;
  312. -ms-transition:all 0.5s ease;
  313. overflow:hidden;
  314. white-space:nowrap;
  315. }
  316.  
  317. #name a:hover {
  318. border-bottom:1px solid #4eb7ff;
  319. transition:all 0.5s ease;
  320. -webkit-transition:all 0.5s ease;
  321. -moz-transition:all 0.5s ease;
  322. -o-transition:all 0.5s ease;
  323. -ms-transition:all 0.5s ease;
  324. }
  325.  
  326. #name:hover #info {
  327. display:table;
  328. }
  329.  
  330. #info {
  331. position:fixed;
  332. display:none;
  333. width:584px;
  334. height:70px;
  335. margin-top:550px;
  336. overflow:hidden;
  337. }
  338.  
  339. #info b {
  340. color:#4eb7ff;
  341. font-weight:none;
  342. }
  343.  
  344. #info img {
  345. float:left;
  346. margin-left:120px;
  347. border:3px solid #4eb7ff;
  348. }
  349.  
  350. #text {
  351. display:table-cell;
  352. width:350px;
  353. color:#999;
  354. vertical-align:middle;
  355. }
  356.  
  357. </style>
  358. </head>
  359.  
  360.  
  361.  
  362. <body>
  363.  
  364.  
  365.  
  366. <div id="center">
  367.  
  368.  
  369.  
  370. <!--------------------------- START OF SIDEBAR --------------------------->
  371.  
  372. <div id="right">
  373. <!-- Sidebar Image Here. Use this tag: <img src=""> -->
  374.  
  375. <a href="/">home</a>
  376. <a href="#" onclick="toggleVisibility('about')">About</a>
  377. <a href="#" onclick="toggleVisibility('message')">Message/FAQ</a>
  378. <a href="#" onclick="toggleVisibility('links')">Links</a>
  379. <a href="#" onclick="toggleVisibility('blogroll')">Blogroll</a>
  380.  
  381. </div>
  382.  
  383. <!---------------------------- END OF SIDEBAR ---------------------------->
  384.  
  385.  
  386.  
  387. <div id="about" class="left">
  388.  
  389.  
  390.  
  391. <!-------------------------- START OF ABOUT PAGE -------------------------->
  392.  
  393. <div class="top"><ul>
  394. <li><b>Name: </b><!-- Your Name Here --></li>
  395. <li><b>Age: </b><!-- Your Age Here --></li>
  396. <li><b>Gender: </b><!-- Male/Female --></li>
  397. <li><b>Location: </b><!-- Your Location Here --></li>
  398. </ul></div>
  399.  
  400. <div id="desc">
  401. <!---------- DESCRIPTION GOES HERE ---------->
  402. </div>
  403.  
  404. <!-------------------------- END OF ABOUT PAGE -------------------------->
  405.  
  406.  
  407.  
  408. </div>
  409.  
  410. <div id="message" class="left">
  411.  
  412. <div class="top"><!-- Ask Page Title Here --></div>
  413.  
  414.  
  415.  
  416.  
  417. <!------------------------- START OF MESSAGE PAGE ------------------------->
  418.  
  419. <p style="margin-top:20px;"><center>
  420.  
  421. <!---------- START OF ASK BOX ---------->
  422. <!---------- PUT YOUR URL INSIDE THE IFRAME TAG ---------->
  423.  
  424. <iframe frameborder="0" height="180" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/yourusernamehere.tumblr.com" width="500px"></iframe>
  425.  
  426. <!---------- END OF ASK BOX ---------->
  427.  
  428. </center></p>
  429.  
  430. <div id="faq">
  431.  
  432. <!---------- START OF FAQ ---------->
  433.  
  434. <div id="question">
  435. <h4><!-- Question here --></h4>
  436. <p><!-- Answer here --></p>
  437. </div>
  438. <div id="question">
  439. <h4><!-- Question here --></h4>
  440. <p><!-- Answer here --></p>
  441. </div>
  442. <div id="question">
  443. <h4><!-- Question here --></h4>
  444. <p><!-- Answer here --></p>
  445. </div>
  446. <div id="question">
  447. <h4><!-- Question here --></h4>
  448. <p><!-- Answer here --></p>
  449. </div>
  450. <div id="question">
  451. <h4><!-- Question here --></h4>
  452. <p><!-- Answer here --></p>
  453. </div>
  454. <div id="question">
  455. <h4><!-- Question here --></h4>
  456. <p><!-- Answer here --></p>
  457. </div>
  458. <div id="question">
  459. <h4><!-- Question here --></h4>
  460. <p><!-- Answer here --></p>
  461. </div>
  462. <div id="question">
  463. <h4><!-- Question here --></h4>
  464. <p><!-- Answer here --></p>
  465. </div>
  466.  
  467. <!---------- END OF FAQ ---------->
  468.  
  469. <!------------------------- END OF MESSAGE PAGE ------------------------->
  470.  
  471.  
  472.  
  473. </div>
  474. </div>
  475.  
  476. <div id="links" class="left">
  477.  
  478.  
  479.  
  480. <!-------------------------- START OF LINKS PAGE -------------------------->
  481.  
  482. <div class="top"><!-- Links Page Title Here --></div>
  483.  
  484. <div id="title"><table>
  485.  
  486. <td><!-- Category 1 Title Here --></td>
  487. <td><!-- Category 2 Title Here --></td>
  488. <td><!-- Category 3 Title Here --></td>
  489. <td><!-- Category 4 Title Here --></td>
  490. <td><!-- Category 5 Title Here --></td>
  491.  
  492. </table></div>
  493.  
  494. <div id="link"><table>
  495.  
  496. <td><div id="section">
  497.  
  498. <!---------- START OF CATEGORY 1 LINKS ---------->
  499.  
  500. <!-- <a> LINK </a> -->
  501. <!-- <a> LINK </a> -->
  502. <!-- <a> LINK </a> -->
  503. <!-- <a> LINK </a> -->
  504. <!-- <a> LINK </a> -->
  505. <!-- <a> LINK </a> -->
  506. <!-- <a> LINK </a> -->
  507. <!-- <a> LINK </a> -->
  508. <!-- <a> LINK </a> -->
  509. <!-- <a> LINK </a> -->
  510. <!-- <a> LINK </a> -->
  511. <!-- <a> LINK </a> -->
  512. <!-- <a> LINK </a> -->
  513.  
  514. </div></td>
  515.  
  516. <!---------- END OF CATEGORY 1 LINKS ---------->
  517.  
  518. <!---------- START OF CATEGORY 2 LINKS ---------->
  519.  
  520. <td><div id="section">
  521.  
  522. <!-- <a> LINK </a> -->
  523. <!-- <a> LINK </a> -->
  524. <!-- <a> LINK </a> -->
  525. <!-- <a> LINK </a> -->
  526. <!-- <a> LINK </a> -->
  527. <!-- <a> LINK </a> -->
  528. <!-- <a> LINK </a> -->
  529. <!-- <a> LINK </a> -->
  530. <!-- <a> LINK </a> -->
  531. <!-- <a> LINK </a> -->
  532. <!-- <a> LINK </a> -->
  533. <!-- <a> LINK </a> -->
  534. <!-- <a> LINK </a> -->
  535.  
  536. </div></td>
  537.  
  538. <!---------- END OF CATEGORY 2 LINKS ---------->
  539.  
  540. <!---------- START OF CATEGORY 3 LINKS ---------->
  541.  
  542. <td><div id="section">
  543.  
  544. <!-- <a> LINK </a> -->
  545. <!-- <a> LINK </a> -->
  546. <!-- <a> LINK </a> -->
  547. <!-- <a> LINK </a> -->
  548. <!-- <a> LINK </a> -->
  549. <!-- <a> LINK </a> -->
  550. <!-- <a> LINK </a> -->
  551. <!-- <a> LINK </a> -->
  552. <!-- <a> LINK </a> -->
  553. <!-- <a> LINK </a> -->
  554. <!-- <a> LINK </a> -->
  555. <!-- <a> LINK </a> -->
  556. <!-- <a> LINK </a> -->
  557.  
  558. </div></td>
  559.  
  560. <!---------- END OF CATEGORY 3 LINKS ---------->
  561.  
  562. <!---------- START OF CATEGORY 4 LINKS ---------->
  563.  
  564. <td><div id="section">
  565.  
  566. <!-- <a> LINK </a> -->
  567. <!-- <a> LINK </a> -->
  568. <!-- <a> LINK </a> -->
  569. <!-- <a> LINK </a> -->
  570. <!-- <a> LINK </a> -->
  571. <!-- <a> LINK </a> -->
  572. <!-- <a> LINK </a> -->
  573. <!-- <a> LINK </a> -->
  574. <!-- <a> LINK </a> -->
  575. <!-- <a> LINK </a> -->
  576. <!-- <a> LINK </a> -->
  577. <!-- <a> LINK </a> -->
  578. <!-- <a> LINK </a> -->
  579.  
  580. </div></td>
  581.  
  582. <!---------- END OF CATEGORY 4 LINKS ---------->
  583.  
  584. <!---------- START OF CATEGORY 5 LINKS ---------->
  585.  
  586. <td><div id="section">
  587.  
  588. <!-- <a> LINK </a> -->
  589. <!-- <a> LINK </a> -->
  590. <!-- <a> LINK </a> -->
  591. <!-- <a> LINK </a> -->
  592. <!-- <a> LINK </a> -->
  593. <!-- <a> LINK </a> -->
  594. <!-- <a> LINK </a> -->
  595. <!-- <a> LINK </a> -->
  596. <!-- <a> LINK </a> -->
  597. <!-- <a> LINK </a> -->
  598. <!-- <a> LINK </a> -->
  599. <!-- <a> LINK </a> -->
  600. <!-- <a> LINK </a> -->
  601.  
  602. </div></td>
  603.  
  604. <!---------- END OF CATEGORY 5 LINKS ---------->
  605.  
  606. </table></div>
  607.  
  608. <!-------------------------- END OF LINKS PAGE -------------------------->
  609.  
  610.  
  611.  
  612. </div>
  613.  
  614. <div id="blogroll" class="left">
  615.  
  616.  
  617.  
  618. <!------------------------ START OF BLOGROLL PAGE ------------------------>
  619.  
  620. <div class="top" style="width:545px;">
  621. <!---- Blogroll Page Title Here ---->
  622. </div>
  623.  
  624. <div id="names">
  625. {block:Following}{block:Followed}
  626.  
  627. <div id="name">
  628.  
  629. <a target="_blank" href="{FollowedURL}">{FollowedName}</a>
  630.  
  631. <div id="info">
  632. <img src="{FollowedPortraitURL-64}">
  633. <div id="text">
  634. Username:<b> {FollowedName} </b><br />
  635. Blog Title:<b> {FollowedTitle} </b>
  636. </div>
  637. </div>
  638.  
  639. </div>
  640.  
  641. {/block:Followed}{/block:Following}
  642. </div>
  643.  
  644. <!------------------------ END OF BLOGROLL PAGE ------------------------>
  645.  
  646.  
  647.  
  648. </div>
  649.  
  650. </div>
  651.  
  652.  
  653.  
  654.  
  655. <script type="text/javascript">
  656. var divs = ["about", "message", "links", "blogroll"];
  657. var visibleDivId = null;
  658.  
  659. function toggleVisibility(divId) {
  660. if(visibleDivId === divId) {
  661. visibleDivId = null;
  662. } else {
  663. visibleDivId = divId;
  664. }
  665.  
  666. hideNonVisibleDivs();
  667. }
  668.  
  669. function hideNonVisibleDivs() {
  670. var i, divId, div;
  671.  
  672. for(i = 0; i < divs.length; i++) {
  673. divId = divs[i];
  674. div = document.getElementById(divId);
  675.  
  676. if(visibleDivId === divId) {
  677. div.style.display = "block";
  678. } else {
  679. div.style.display = "none";
  680. }
  681. }
  682. }
  683. </script>
  684.  
  685.  
  686.  
  687. </body>
  688. </html>
  689.  
  690.  
  691. <!--
  692.  
  693. PAGE MADE BY BAKATHEMES OR AKATSUKII @ TUMBLR
  694. Edit/tweak as much as you like but pleeeeaaaase
  695. DO NOT remove the credits, copy and
  696. redistribute the theme as your own.
  697. I will fucking hunt you down if you do.
  698.  
  699. -->
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!