API tools faq
paste
Advertisement
leenpamyu

Skin 1: Sugar ♡ Rainbow

leenpamyu
Jul 12th, 2013
192
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 15.30 KB | None | 0 0
raw download clone embed print report
  1. <!------------------------
  2. Espero que este layout te sea de utilidad :3 ♥
  3. Puedes editarlo como más quieras, pero
  4. no quites los créditos por favor > < !!
  5. Layout by Leen ♥
  6. ------------------------!>
  7.  
  8.  
  9.  
  10. <html>
  11. <head>
  12. <title>Sugar ♡ Rainbow</title>
  13. <link rel="Shortcut Icon" href="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Favicons/favcon_umbrella_01.png">
  14. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
  15. <link href='http://fonts.googleapis.com/css?family=Grand+Hotel' rel='stylesheet' type='text/css'>
  16. <script type="text/javascript">
  17. function changeNavigation(id)
  18. {document.getElementById('content').innerHTML=document.getElementById(id).innerHTML}
  19. </script>
  20. <script language="JavaScript" src="http://dl.dropbox.com/u/42322433/qTip.js" type="text/JavaScript"></script>
  21.  
  22. <style type="text/css">
  23. /*Cuerpo
  24. ----------------------------------------------- */
  25. #navbar-iframe{display:none;}
  26. ::selection {color:#FFFFFF; background:#BDE158;}
  27. ::-moz-selection{color:#FFFFFF; background:#BDE158;}
  28.  
  29. ::-webkit-scrollbar-thumb:vertical {background-color:#BDE158; height:6px; border-radius: 10px; }
  30. ::-webkit-scrollbar {height:0px;width: 5px; background-color:#edf9bf;}
  31. ::-moz-scrollbar-thumb:vertical {background-color:#BDE158;height:6px; border-radius: 10px; }
  32. ::-moz-scrollbar {height:0px;width: 5px; background-color:#edf9bf;}
  33.  
  34. body {background:#edf9bf url(http://i39.tinypic.com/ajqaz6.jpg) repeat; margin: 0px; font-family:verdana; color:#999999; font-size:11px;}
  35.  
  36. a:link, a:active, a:visited {color: #ff7799; font-family: georgia; letter-spacing: 1px; text-decoration: none; font-weight: normal; -webkit-transition: all 0.4s linear;-moz-transition: all 0.1s linear; transition: all 0.4s linear;}
  37. a:hover {color: #ff7799; background: #fff49e; padding:3px; -moz-border-radius: 20px; letter-spacing: 1px; border:0px solid #ffffff; cursor: help; -webkit-transition: all 0.4s linear;-moz-transition: all 0.1s linear; transition: all 0.4s linear; moz-border-radius: 5px; border-radius: 5px;}
  38.  
  39. .header {position:absolute; left: -10px; top: -10px;}
  40.  
  41. .navi-box {background: #f6f6f6; font: normal 7pt arial; color: #aaaaaa; border-bottom: 1px solid #f0f0f0; letter-spacing: 1pt; border-right: 1px solid #f0f0f0; display: block; margin: 1px 0; padding: 2px; text-align: left; text-decoration: none; text-transform: uppercase;}
  42. .navi-box:hover{letter-spacing: 0.5pt; text-transform: uppercase; text-decoration: none; background-color: #f7f7f7; border: 1px solid #ddd; border-bottom: transparent; border-right: transparent;}
  43.  
  44. /*Entradas
  45. ----------------------------------------------- */
  46. .layer1 {position: absolute; left: 10px; top: 452px;}
  47.  
  48. .post {width: 455px; color: #999999; background : #ffffff; font-family : verdana; font-size:11px; line-height : 15px; padding : 10px; border:0px solid #81d5dc; -moz-border-radius: 0px 0px 20px 20px; border-radius: 0px 0px 20px 20px; margin-bottom: 20px;}
  49.  
  50. .top-entradas{position: absolute; top:410px; left:10px; background:#BDE158; display:block; width:464px; -moz-border-radius: 20px 20px 0px 0px; border-radius: 20px 20px 0px 0px; padding-top: 15px; padding-bottom: 15px; padding-left: 5px; padding-right: 6px; font: normal 10px verdana; color:#ffffff; text-align:center;}
  51.  
  52. #navi {background: #; font: 7pt arial; letter-spacing: 1px; text-transform: uppercase; color: #fff; padding: 10px 15px 10px 15px; cursor: pointer; font-weight:bold; -webkit-transition: all 0.4s linear;-moz-transition: all 0.4s linear; transition: all 0.4s linear;}
  53.  
  54. #navi:hover {background: #D4F185; font: 7pt arial; letter-spacing: 1px; text-transform: uppercase; color: #A2C542; padding: 10px 15px 10px 15px; cursor: pointer; text-decoration: none; font-weight:bold; -webkit-transition: all 0.4s linear;-moz-transition: all 0.4s linear; transition: all 0.4s linear;}
  55.  
  56. .head {color: #FF799B; font-family: Grand Hotel; font-size: 30px; padding-left: 10px; margin-bottom: 5px; margin-top: 10px; text-align: center;}
  57.  
  58. .icon{padding:8px; background-color:#fff49e; float: right; width:40px; -moz-border-radius:8px;}
  59.  
  60. .datee{background-color:#fff49e; color:#ffa800; line-height:15px; -moz-border-radius:10px; border-radius:10px; padding:6px; text-align: center; }
  61.  
  62.  
  63. /*Sidebar
  64. ----------------------------------------------- */
  65. .c1 {font-weight: bold; color: #91c406; text-align: center; letter-spacing: 3px; background: #c3eb58; -moz-border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px;  padding: 6px;}
  66. .c2 {font-weight: bold; color: #00a5bd; text-align: center; letter-spacing: 3px; background: #70cfdd; -moz-border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px; padding: 6px;}
  67.  
  68. .side-layer {position: absolute; overflow: auto; width: 220px; left: 500px; top: 310px; margin-bottom: 20px;}
  69. .side-box {color: #999999; background : #ffffff; font-family : verdana; font-size:10px; line-height : 14px; padding : 10px; -moz-border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px; border: 0px solid #ffe9f2;}  
  70.  
  71.  
  72. /*Otros (cosas randoms)
  73. ----------------------------------------------- */
  74. blockquote {background: #e6e6e6 url(http://i53.tinypic.com/2cp7vqo.jpg) repeat fixed; border-left: 20px solid #43CFE4; color: #777; font-size: 10px; -moz-border-radius: 20px; border-radius: 20px; padding: 6px; margin: 20px;}
  75.  
  76. li, ol {border-bottom: 1px dotted #dedede;}
  77. ul {list-style-image: url(http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/star_raibow.png); margin-left: 20px; margin-right: 20px; margin-top: -2px; margin-bottom: 0px; padding:0px 0px 0px 0px; }
  78.  
  79. b {font-family: georgia; letter-spacing: 1px; font-weight:bold; color: #ff7799;}
  80. i {font-family: georgia; letter-spacing: 1px; color: #ffbf34;}
  81. em {background: #b0de25; color: #ffffff; padding: 1px;}
  82. u {color:#43cfe4; border-bottom: 1px solid #caee5b;}
  83. s {font-style: strike; color: #cccccc;}
  84.  
  85. #qTip {z-index: 1000; position: absolute; display:none; background:#ff688f;  color:#ffffff; font-family:verdana; font-size:8px; text-transform:uppercase; font-weight:bold; padding:2px; opacity: .8;}
  86.  
  87. .blogger-labels{font: normal 8pt tahoma; color:#00a5bd; text-transform: none; border-bottom: 1px dashed #9ADCE6; margin-bottom:4px; padding:4px; }
  88.  
  89. </style>
  90. </head>
  91.  
  92. <body>
  93. <div class="header"><a style="background: transparent;" class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" onClick="top.focus()"><img src="http://i40.tinypic.com/k1rij9.jpg" border="0"></a></div>
  94. <div class="top-entradas">
  95. <a id="navi" onClick="changeNavigation ('0')" title="home">Home</a>
  96. <a id="navi" onClick="changeNavigation ('1')" title="profile">me</a>
  97. <a id="navi" onClick="changeNavigation ('2')" title="my blog">about</a>
  98. <a id="navi" onClick="changeNavigation ('3')" title="Sweet Affies">friends</a>
  99. </div>
  100.  
  101. <!-- Entradas -->
  102. <div class="layer1">
  103. <table border="0" cellspacing="0" cellpadding="5" style="margin-top: 0px" width="99">
  104. <tr>
  105. <div id="content">
  106. <div class="post">
  107. <blogger>
  108. <div class="head"><$BlogItemTitle$></div>
  109. <div class="datee"><img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/star_15.png" border="0">
  110. <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> {♥} <$BlogItemDateTime$>
  111. <img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/sdaf.png" border="0">
  112. <a title="Comenta!" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> Comments </a> <img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/star_15.png" border="0"></div>
  113. <br>
  114. <$BlogItemBody$>
  115. <br>
  116. </blogger>
  117. <br>
  118. <center>
  119. <newerposts> <a class="next" href=<$newerposts$>>◄ Next</newerposts>
  120. <a class="prev" href="<$BlogURL$>"> H o m e </a>
  121. <olderposts> <a class="prev" href=<$olderposts$>>Previous ▶</a></olderposts></center>
  122. </div>
  123. <!-- Fin Entradas -->
  124.  
  125. <!-- páginas -->
  126. <td id="1" style="display: none;">
  127. <div class="post">
  128. <div class="head">About me</div>
  129. Todo lo que quieras escribir sobre ti c:
  130. <br><br>
  131. </div>
  132. </td>
  133.  
  134. <td id="2" style="display: none;">
  135. <div class="post">
  136. <div class="head">Blog</div>
  137. Sobre tu blog ^^<br>
  138.  
  139. <br>
  140. </div>
  141. </td>
  142.  
  143.  
  144. <td id="3" style="display: none;">
  145. <div class="post">
  146. <div class="head">Affies</div>
  147. Amigos ♥
  148.  
  149. </div>
  150. </td>
  151.  
  152. <td id="0" style="display: none;">
  153. <div class="post">
  154. <blogger>
  155. <div class="head"><$BlogItemTitle$></div>
  156. <div class="datee"><img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/star_15.png" border="0">
  157. <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> {♥} <$BlogItemDateTime$>
  158. <img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/sdaf.png" border="0">
  159. <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$> title="Comenta!" > <$BlogItemCommentCount$> Comments </a> <img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Mis%20Pixels/Bullets/star_15.png" border="0"></div>
  160. <br>
  161. <$BlogItemBody$>
  162. <br>
  163. </blogger>
  164. <br>
  165. <center>
  166. <newerposts> <a class="next" href=<$newerposts$>>◄ Next</newerposts>
  167. <a class="prev" href="<$BlogURL$>"> H o m e </a>
  168. <olderposts> <a class="prev" href=<$olderposts$>>Previous ▶</a></olderposts></center>
  169. </div>
  170. </td>
  171.  
  172. </table>
  173. </div>
  174. <br><br>
  175. <!-- Fin Páginas -->
  176.  
  177.  
  178.  
  179. <!-- Sidebar -->
  180. <div class="side-layer">
  181. <div class="c2">Welcome!</div>
  182. <div class="side-box">
  183. <center>
  184. <a style="background: transparent;" class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" onClick="top.focus()"><img src="http://i1098.photobucket.com/albums/g379/yuseong_13/Star%20Parade/uerukomu.png"></a>
  185. </center>
  186. Bienvenido a mi blog!<br>
  187. Por favor sea bueno, no copie y comente si quiere *^*<br>
  188. Este blog se ve lindo en Chrome y Firefox ♥ (゜ー゜＊）！<br>
  189. (Pon el mouse en la imagen del header y mira el efecto e.e)<br>
  190. <b>bold</b> <u>underline</u> <i>italic</i> <s>strike</s>
  191. <br><br>
  192. <SCRIPT language="JavaScript">
  193.  
  194. monthnames = new Array(
  195. "January &hearts;",
  196. "February &hearts;",
  197. "March &hearts;",
  198. "April &hearts;",
  199. "May &hearts;",
  200. "June &hearts;",
  201. "July &hearts;",
  202. "August &hearts;",
  203. "September &hearts;",
  204. "October &hearts;",
  205. "November &hearts;",
  206. "December &hearts;");
  207. var linkcount=0;
  208. function addlink(month, day, href) {
  209. var entry = new Array(3);
  210. entry[0] = month;
  211. entry[1] = day;
  212. entry[2] = href;
  213. this[linkcount++] = entry;
  214. }
  215. Array.prototype.addlink = addlink;
  216. linkdays = new Array();
  217. monthdays = new Array(12);
  218. monthdays[0]=31;
  219. monthdays[1]=28;
  220. monthdays[2]=31;
  221. monthdays[3]=30;
  222. monthdays[4]=31;
  223. monthdays[5]=30;
  224. monthdays[6]=31;
  225. monthdays[7]=31;
  226. monthdays[8]=30;
  227. monthdays[9]=31;
  228. monthdays[10]=30;
  229. monthdays[11]=31;
  230. todayDate=new Date();
  231. thisday=todayDate.getDay();
  232. thismonth=todayDate.getMonth();
  233. thisdate=todayDate.getDate();
  234. thisyear=todayDate.getYear();
  235. thisyear = thisyear % 100;
  236. thisyear = ((thisyear < 50) ? (2000 + thisyear) : (1900 + thisyear));
  237. if (((thisyear % 4 == 0)
  238. && !(thisyear % 100 == 0))
  239. ||(thisyear % 400 == 0)) monthdays[1]++;
  240. startspaces=thisdate;
  241. while (startspaces > 7) startspaces-=7;
  242. startspaces = thisday - startspaces + 1;
  243. if (startspaces < 0) startspaces+=7;
  244. document.write("<FONT face='verdana'>");
  245. document.write("<table width=100% border=0 " );
  246. document.write("style='font-size : 10px; color : #999999;' cellpadding=0 cellspacing=1>");
  247.  
  248. document.write("<tr><td colspan=7><ce><upper><center><i>"
  249. + monthnames[thismonth] + " " + thisyear
  250. + "</i></center></upper></ce></td></tr>");
  251. document.write("<tr>");
  252. document.write("<td align=center><b><ce>S</ce></b></td>");
  253. document.write("<td align=center><b><ce>M</ce></b></td>");
  254. document.write("<td align=center><b><ce>T</ce></b></td>");
  255. document.write("<td align=center><b><ce>W</ce></b></td>");
  256. document.write("<td align=center><b><ce>T</ce></b></td>");
  257. document.write("<td align=center><b><ce>F</ce></b></td>");
  258. document.write("<td align=center><b><ce>S</ce></b></td>");
  259. document.write("</tr>");
  260. document.write("<tr>");
  261. for (s=0;s<startspaces;s++) {
  262. document.write("<td align=center>♡</td>");
  263. }
  264. count=1;
  265. while (count <= monthdays[thismonth]) {
  266. for (b = startspaces;b<7;b++) {
  267. linktrue=false;
  268. document.write("<td align=center>");
  269. for (c=0;c<linkdays.length;c++) {
  270. if (linkdays[c] != null) {
  271. if ((linkdays[c][0]==thismonth + 1) && (linkdays[c][1]==count)) {
  272. document.write("<a href=\"" + linkdays[c][2] + "\">");
  273. linktrue=true;
  274. }
  275. }
  276. }
  277. if (count==thisdate) {
  278. document.write("<u>");
  279. }
  280. if (count <= monthdays[thismonth]) {
  281. document.write(count);
  282. }
  283. else {
  284. document.write("♡");
  285. }
  286. if (count==thisdate) {
  287. document.write("</em>");
  288. }
  289. if (linktrue)
  290. document.write("</a>");
  291. document.write("</td>");
  292. count++;
  293. }
  294. document.write("</tr>");
  295. document.write("<tr>");
  296. startspaces=0;
  297. }
  298. document.write("</table>");
  299. document.write("</FONT>");
  300. // End -->
  301. </SCRIPT>
  302. </div>
  303. <br>
  304.  
  305. <div class="c1">Tagboard</div>
  306. <div class="side-box">
  307. Ancho máximo del tagboard: <u>180 pixeles</u>
  308. </div>
  309. <br>
  310.  
  311. <div class="c2">Past entries</div>
  312. <div class="side-box">
  313. <select
  314. style="color:#91c406; font-size:11px; background:#ddfb8d; width:200px; font-family: verdana; border:1px solid #91c406; "
  315. onChange="location.href=this.options[this.selectedIndex].value;">
  316.    <option value=''>R E M E M B E R ❤</option>
  317.    <BloggerArchives>
  318.    <option value="<$BlogArchiveURL$>">» <$BlogArchiveName$></option>
  319.    </BloggerArchives>
  320.    </select></form>
  321. <br><br>
  322. <BloggerPreviousItems>
  323. <ul><li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a><br></li></ul>
  324. </BloggerPreviousItems>
  325. <br>
  326. <a style="color:#ff6b90; font-size: 18px;" href="/">Labels</a>
  327. <a style="color:#00a5bd; font-size: 16px;" href="/">Labels</a>
  328. <a style="color:#91c406; font-size: 14px;" href="/">Labels</a>
  329. <a style="color:#ffa800; font-size: 12px;" href="/">Labels</a>
  330. <a style="color:#ff6b90; font-size: 10px;" href="/">Labels</a>
  331. <a style="color:#00a5bd; font-size: 8px;" href="/">Labels</a>
  332. <a style="color:#91c406; font-size: 6px;" href="/">Labels</a>
  333. </div>
  334. <br>
  335.  
  336. <div class="c1">Credits</div>
  337. <div class="side-box">
  338. Por favor, no quitar los crétidos<br>
  339. Layout and pixels by <a href="http://chokokuki.blogspot.com/">Leen</a>, image header from <a href="http://www.zerochan.net/">zerochan</a>.
  340. </div>
  341. </div>
  342.  
  343. <!-- Fin Side -->
  344. </td>
  345.  
  346. </div>
  347.  
  348. <style>
  349. .shakeimage{
  350. position:relative
  351. }
  352. </style>
  353. <script language="JavaScript1.2">
  354.  
  355. /*
  356. Shake image script (onMouseover)-
  357. © Dynamic Drive (www.dynamicdrive.com)
  358. For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
  359. */
  360.  
  361. //configure shake degree (where larger # equals greater shake)
  362. var rector=8
  363.  
  364. ///////DONE EDITTING///////////
  365. var stopit=0
  366. var a=1
  367.  
  368. function init(which){
  369. stopit=0
  370. shake=which
  371. shake.style.left=0
  372. shake.style.top=0
  373. }
  374.  
  375. function rattleimage(){
  376. if ((!document.all&&!document.getElementById)||stopit==1)
  377. return
  378. if (a==1){
  379. shake.style.top=parseInt(shake.style.top)+rector+"px"
  380. }
  381. else if (a==2){
  382. shake.style.left=parseInt(shake.style.left)+rector+"px"
  383. }
  384. else if (a==3){
  385. shake.style.top=parseInt(shake.style.top)-rector+"px"
  386. }
  387. else{
  388. shake.style.left=parseInt(shake.style.left)-rector+"px"
  389. }
  390. if (a<4)
  391. a++
  392. else
  393. a=1
  394. setTimeout("rattleimage()",50)
  395. }
  396.  
  397. function stoprattle(which){
  398. stopit=1
  399. which.style.left=0
  400. which.style.top=0
  401. }
  402.  
  403. </script>
  404.  
  405.  
  406. </body>
  407. </html>
  408. </body>
  409. </html>
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!