Advertisement
SeoulChan

Profile : About Page

Mar 17th, 2015
2,235
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
Lua 11.65 KB | None | 0 0
  1. <!----
  2.  _         _             _    
  3. | |       (_)           | |  
  4. | | ____ _ _  __ _ _   _| | __
  5. | |/ / _` | |/ _` | | | | |/ /
  6. |   < (_| | | (_| | |_| |   <
  7. |_|\_\__,_|_|\__, |\__,_|_|\_\
  8.               __/ |          
  9.              |___/
  10. Profile: About me Page by Kaiguk  (http://kaiguk.tumblr.com/)
  11.  
  12. Please don't claim , use as a base page, or fuck with anything like the credit because if you do..I'll slap the shit and piss out you.
  13.  
  14. Notify me if you have any questions or if something goes wrong. I will do my best to help you.
  15.  
  16. Happy using.
  17.  
  18. --->
  19.  
  20. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  21.  
  22. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  23.  
  24. <title>{Title}</title>
  25.  
  26. <link rel="shortcut icon" href="{Favicon}">
  27.  
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29.  
  30. <meta name="description" content="{MetaDescription}" />
  31.  
  32. <head>
  33.  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  34.  
  35. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  36.  
  37. <script>
  38.  
  39. (function($){
  40.  
  41. $(document).ready(function(){
  42.  
  43. $("a[title]").style_my_tooltips({
  44.  
  45. tip_follows_cursor:true,
  46.  
  47. tip_delay_time:30,
  48.  
  49. tip_fade_speed:300,
  50.  
  51. attribute:"title"
  52.  
  53. });
  54.  
  55. });
  56.  
  57. })(jQuery);
  58.  
  59. </script>
  60.  
  61. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  62.  
  63.  
  64. <style type="text/css">
  65.  
  66. /** --------------------------- SCROLLBAR ------------------------------**/
  67.  
  68.  
  69. ::-webkit-scrollbar {
  70. width:3px;
  71. height:3;
  72. background:#fff;
  73. }
  74.  
  75. ::-webkit-scrollbar-corner {
  76. background:#fff;
  77. }
  78.  
  79. ::-webkit-scrollbar-thumb:vertical {
  80. background:#f3f3f3;
  81. }
  82.  
  83. ::-webkit-scrollbar-thumb:horizontal {
  84. background: #fff;
  85. border: 0px solid #fff;
  86. }
  87.  
  88. /** --------------------------- TOP BORDER ------------------------------**/
  89.  
  90. #top {
  91. position:fixed;
  92. left:0px;
  93. top:0px;
  94. width:100%;
  95. height:60px;
  96. z-index:999;
  97. background-color: #000;
  98. }  
  99.  
  100. /** --------------------------- WHOLE CUSTOMIZATION ------------------------------**/
  101.  
  102. body {
  103. margin:0px;
  104. color:#aaa;
  105. font-family:courier;
  106. font-size:9.5px;
  107. text-transform:uppercase;
  108. padding:5px;
  109. background:#fff;
  110. }
  111.  
  112. /** --------------------------- LINKS ------------------------------**/
  113.  
  114. a {
  115. color:#000;
  116. text-decoration:none;
  117. outline:none;
  118. opacity:1 ;
  119. -webkit-transition: all 0.8s;
  120. -moz-transition: all 0.8s;
  121. transition: all 0.8s;
  122. }
  123.  
  124. a:hover {
  125. color:#eee;
  126. -webkit-transition: all 0.8s;
  127. -moz-transition: all 0.8s;
  128. transition: all 0.8s;
  129. }
  130.  
  131. /** --------------------------- BOLD, ITALIC, UNDERLINED ------------------------------**/
  132.  
  133. b, strong {
  134.  color: #111;
  135.  font-weight: bold;
  136.  }
  137.  
  138. i, em {
  139.  color: #888;
  140.  font-style: italic;
  141.  }
  142.    
  143. u {
  144.  color: #ccc;
  145.  }  
  146.  
  147. /** --------------------------- HOVER DESIGN ------------------------------**/
  148.  
  149. #s-m-t-tooltip{
  150. font-size:9.5px;
  151. position:absolute;
  152. margin-top: 15px;
  153. letter-spacing:1px;
  154. z-index:9999;
  155. background:#eee;
  156. color:#aaa;
  157. text-transform:uppercase;
  158. padding:2px 3px 2px 3px;
  159. }
  160.  
  161. /** --------------------------- ICON ------------------------------**/
  162.  
  163. #icon{
  164. padding:3px;
  165. }
  166.  
  167. #icon img{
  168. width:100px;
  169. height:100px;
  170. float:left;
  171. padding:10px;
  172. margin-left:100px;
  173. margin-top:-15px;
  174. position:fixed;
  175. }
  176.  
  177. /** --------------------------- TITLE & TITLE DESC ------------------------------**/
  178.  
  179. #title{
  180. width:500px;
  181. font-size:30px;
  182. text-align:justify;
  183. font-weight:bold;
  184. word-spacing:2px;
  185. letter-spacing:1px;
  186. float:right;
  187. line-height:190%;
  188. margin-left:300px;
  189. margin-top:-10px;
  190. padding:10px;
  191. position:fixed;
  192. }
  193.  
  194. #titledesc{
  195. width:500px;
  196. margin-top:-10px;
  197. line-height:175%;
  198. font-size:10px;
  199. color:#000;
  200. }
  201.  
  202. /** --------------------------- INFO/BIO/FAVES INFO ------------------------------**/
  203.  
  204. #text{
  205. overflow:auto;    
  206. width:730px;
  207. height:100px;
  208. }
  209.  
  210. #tit{
  211. font-size:12px;
  212. text-transform:uppercase;
  213. border-bottom:1px solid #eee;
  214. margin-bottom:10px;
  215. }
  216.  
  217. #tag{
  218. color:#111;
  219. font-size:12px;
  220. text-transform:uppercase;
  221. }
  222.  
  223. /** --------------------------- NAME & SITE INFO ------------------------------**/
  224.  
  225. #info{
  226. width:730px;
  227. float:left;
  228. text-align:left;
  229. font-size:12px;
  230. line-height:120%;
  231. letter-spacing:1px;
  232. line-height:200%;
  233. word-spacing:1px;
  234. margin-top:-400px;
  235. margin-left:150px;
  236. border-top:1px solid #eee;
  237. border-bottom:1px solid #eee;
  238. }
  239.  
  240. #infotag{
  241. margin-top:-25px;
  242. margin-left:200px;  
  243. }
  244.  
  245. /** --------------------------- BIO ------------------------------**/
  246.  
  247. #bio{
  248. width:730px;
  249. height:200px;
  250. text-align:left;
  251. font-size:10px;
  252. line-height:120%;
  253. letter-spacing:1px;
  254. line-height:200%;
  255. word-spacing:1px;
  256. margin-top:-340px;
  257. margin-left:150px;
  258. position:fixed;
  259. }
  260.  
  261. /** --------------------------- FAVE ------------------------------**/
  262.  
  263. #fave{
  264. width:730px;
  265. text-align:left;
  266. font-size:10px;
  267. line-height:120%;
  268. letter-spacing:1px;
  269. line-height:200%;
  270. word-spacing:1px;
  271. margin-top:-190px;
  272. margin-left:150px;
  273. position:fixed;
  274. }
  275.  
  276. /** --------------------------- CONTAINERS ------------------------------**/
  277.    
  278. #boxcon{
  279. width:500px;  
  280. margin-bottom:20px;
  281. margin-top:60px;
  282. margin-left:-20px;
  283. position:fixed;
  284.  
  285. }
  286.  
  287. .box{
  288. width:800px;
  289. height:500px;  
  290. letter-spacing: 2px;
  291. text-align:justify;
  292. margin-bottom:25px;
  293. padding:40px;
  294. border-right:1px solid #eee;
  295. }
  296.  
  297. /** --------------------------- TOP LINKS ------------------------------**/
  298.  
  299. #toplinks{
  300. margin-left:100px;
  301. margin-top:20px;
  302. width:900px;
  303. }
  304.  
  305. #toplinks a{
  306. font-size:12px;
  307. color:#fff;
  308. background: #000;
  309. margin-left:10px;
  310. letter-spacing: 2px;
  311. text-align:center;
  312. padding:10px;
  313. -webkit-transition: all 0.5s;
  314. -moz-transition: all 0.5s;
  315. transition: all 0.5s;
  316. }
  317.  
  318. #toplinks a:hover{
  319. background:#fff;
  320. color:#000;
  321. -webkit-transition: all 0.5s;
  322. -moz-transition: all 0.5s;
  323. transition: all 0.5s;
  324. }
  325.  
  326. /** --------------------------- SIDE INFO ------------------------------**/
  327.  
  328. #side{
  329. width:300px;
  330. margin-left:885px;
  331. margin-top:-500px;
  332. font-size:11px;
  333. line-height:290%;
  334. position:absolute;
  335. }
  336.  
  337. #sidetag{
  338. margin-left:190px;
  339. margin-top:-28px;
  340. line-height:230%;
  341. font-size:11px;
  342. text-transform:uppercase;
  343. }
  344.  
  345. /** --------------------------- NO TOUCH ------------------------------**/
  346.  
  347. #ani {
  348. position:fixed;
  349. left:10px;
  350. bottom:10px;
  351. text-transform:uppercase;
  352. font-size:15px;
  353. letter-spacing:1px;
  354. padding:5px;
  355. -webkit-transition: all 0.3s ease;
  356. -moz-transition: all 0.3s ease;
  357. -ms-transition: all 0.3s ease;
  358. -o-transition: all 0.3s ease;
  359. transition: all 0.3s ease;
  360. }
  361.  
  362. {CustomCSS}
  363.    
  364. </style>
  365.  
  366.  
  367. </head>
  368.  
  369. <body>
  370.  
  371. <!----------------------------- TOP BORDER -------------------------------->
  372.  
  373. <div id="top">
  374. <!----------------------------- TOP LINKS -------------------------------->
  375.  
  376.  <div id="toplinks">
  377.  
  378. <a href="/">Go Home</a>
  379.  
  380. <a href="/">Send Mail</a>
  381.  
  382. <a href="http://tumblr.com/follow/kaiguk">Follow User</a>  
  383.  
  384. <a href="/">To Dashboard</a>  
  385.  
  386. <a href="/">Link</a>  
  387.  
  388. <a href="/">Link</a>  
  389.  
  390. <a href="/">Link</a>  
  391.  
  392. </div>    
  393.    
  394. </div>
  395.  
  396. <!----------------------------- CONTAINERS -------------------------------->
  397.  
  398. <div id="boxcon">
  399.  
  400. <div class="box">  
  401.  
  402. <!----------------------------- ICON -------------------------------->
  403.  
  404. <div style="margin-left:130px;margin-bottom:5px;">
  405.  
  406. <i style="color:#000;"class="fa fa-user"></i>
  407.  
  408. name
  409.    
  410. </div>
  411.  
  412. <div id="icon">
  413.  
  414. <img src="http://i926.photobucket.com/albums/ad102/My_originals_album/icons/icon59.png">
  415.  
  416. </div>
  417. <!----------------------------- TITLE & TITLE DESC -------------------------------->
  418.  
  419. <div id="title">  
  420.  
  421. Title goes here
  422.  
  423. <div id="titledesc">
  424.  
  425. Type whatever you want here :)
  426.  
  427. </div>
  428.  
  429. </div>
  430.  
  431.    
  432. </div>
  433.  
  434. <!----------------------------- NAME & SITE INFO -------------------------------->
  435.  
  436. <div id="info">
  437.  
  438. <div id="tag">Name:</div>
  439.  
  440. <div id="infotag">Your name</div>
  441.  
  442. <div id="tag">Website:</div>
  443.  
  444. <div id="infotag"><a href="http://kgthemes.tumblr.com/">Your link</a>
  445.  
  446. </div>
  447.  
  448. </div>  
  449. <!----------------------------- BIO -------------------------------->
  450.  
  451. <div id="bio">
  452.  
  453. <div id="tit">
  454.  
  455. <i style="color:#000"class="fa fa-pencil-square-o"></i>
  456.  
  457. BIO:</div>
  458.  
  459. <div id="text">
  460.  
  461. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
  462.  
  463. </div>
  464.  
  465. </div>
  466.  
  467. <!----------------------------- FAVES -------------------------------->
  468.  
  469. <div id="fave">
  470.  
  471. <div id="tit">
  472.  
  473. <i style="color:#000"class="fa fa-heart-o"></i>
  474.  
  475. Faves:
  476.    
  477. </div>
  478.  
  479. <div id="text">
  480.  
  481. <div id="tag">Video games:</div>
  482.  
  483. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.<p>
  484.  
  485. <div id="tag">Artists:</div>
  486.  
  487. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.<p>
  488.  
  489. <div id="tag">Songs:</div>
  490.  
  491. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.<p>
  492.  
  493. <div id="tag">TV Shows:</div>
  494.  
  495. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis. <p>
  496.  
  497. <div id="tag">Anime:</div>
  498.  
  499. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
  500.  
  501. </div>
  502.  
  503. </div>
  504.  
  505. <!----------------------------- SIDE INFO -------------------------------->
  506. <div id="side">
  507.  
  508. <div id="tit">
  509.  
  510. <i style="color:#000" class="fa fa-plus fa-lg"></i>
  511.  
  512. More About me:
  513.    
  514. </div>
  515.  
  516. <div id="tag">Sex:</div> <div id="sidetag">Your Gender</div>
  517.  
  518. <div id="tag">Age:</div> <div id="sidetag">Your Age</div>
  519.  
  520. <div id="tag">Place:</div>  <div id="sidetag">Where you live</div>
  521.  
  522. <div id="tag">Birthplace:</div>  <div id="sidetag">Your Birthhome</div>
  523.  
  524. <div id="tag">Sign:</div>  <div id="sidetag">Your Horoscope</div>
  525.  
  526. <div id="tag">Occupation:</div> <div id="sidetag">Your job or whatever</div>
  527.  
  528. </div>
  529.  
  530. </div>
  531.    
  532. </div>
  533.  
  534. </div>
  535.  
  536. <!----------------------------- NO TOUCHING -------------------------------->
  537.  
  538. <div id="ani">
  539.  
  540. <a href="http://kaiguk.tumblr.com/" title="page by Ani">KG</a>
  541.    
  542. </div>
  543.  
  544. </div>
  545.  
  546. </body>
  547.  
  548. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement