2.04.2012

Edited Template ( Washed Denim ) Part 5

 nihh buat sendiri .. sory sbb x sempat printscreen .. nakk gune , bg thu .. 

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<div style='position: static; top:0px; center: 0px; width:100%; position:fixed; padding:3px; background:#000000; opacity:0.8; color:#ffffff; font-size:11px;'>Welcome to my Online Official Page : <a href='http://www.blogger.com/follow-blog.g?blogID=1049125422002857293'>Follow</a> | <a href='http://blogger.com/'>Dashboard</a></div>
  <head>
    <b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name:     Washed Denim
Designer: Darren Delaye
URL:      www.DarrenDelaye.com
Date:     11 Jul 2006
-----------------------------------------------
*/
#navbar-iframe {
display: none !important;
}
/* Variable definitions
   ====================
 <Variable name="bgColor" description="Page Background Color"
           type="color" default="#ffffff" value="#ffffff">
 <Variable name="textColor" description="Text Color"
           type="color" default="#333333" value="#333333">
 <Variable name="linkColor" description="Link Color"
           type="color" default="#336699" value="#e4b2ff">
 <Variable name="headerBgColor" description="Page Header Background Color"
           type="color" default="#ffffff" value="transparent">
 <Variable name="headerTextColor" description="Page Header Text Color"
           type="color" default="#333333" value="#333333">
 <Variable name="headerCornersColor" description="Page Header Corners Color"
           type="color" default="#ffffff" value="transparent">
 <Variable name="mainBgColor" description="Main Background Color"
           type="color" default="#ffffff" value="#ffffff">
 <Variable name="borderColor" description="Border Color"
           type="color" default="#ffffff" value="transparent">
 <Variable name="dateHeaderColor" description="Date Header Color"
           type="color" default="#999999" value="#333333">
 <Variable name="sidebarTitleBgColor" description="Sidebar Title Background Color"
           type="color" default="#ffffff" value="#ffffff">
 <Variable name="sidebarTitleTextColor" description="Sidebar Title Text Color"
           type="color" default="#333333" value="#333333">
 <Variable name="bodyFont" description="Text Font"
           type="font" default="normal normal 100% Verdana, Arial, Sans-serif;" value="normal normal 100% Verdana, Arial, Sans-serif;">
 <Variable name="headerFont" description="Page Header Font"
           type="font" default="normal normal 210% Verdana, Arial, Sans-serif;" value="normal normal 210% Verdana, Arial, Sans-serif;">
   <Variable name="startSide" description="Start side in blog language"
             type="automatic" default="left" value="left">
   <Variable name="endSide" description="End side in blog language"
             type="automatic" default="right" value="right">
*/
body {
background:$bgcolor;
Background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWfcMT5HXVYbito1qVrjJFH5q3U4g3TObkZCX5VU2jEcj-cwzQ2-x5wog95CRZD3T1oD5vQRa7reMN-sP0umf9V_1_l5ZWBugEF6xxiiFVLriUKcxjldcG1gApltgJn3D39kT4mnPtijk/s1600/backgroundpink.png);
background-repeat: repeat;
background-position:Center center;
background-attachment:Fixed;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
::selection {
background:#FFFFFF;
color:#F5A9E1;
}
a:link {
  text-decoration: none;
  color: $linkColor;
}
a:visited {
  text-decoration: none;
  color: $linkColor;
}
a img {
  border-width: 0;
}
#outer-wrapper {
  font: $bodyFont;
}
u {
text-decoration:none;
border-bottom: 2px solid #F5A9E1;
padding: 0px;
}
/* Header
----------------------------------------------- */
#header-wrapper {
  margin:0;
  padding: 0;
  background-color: $headerCornersColor;
  text-align: $startSide;
}
#header {
  width: 800px;
  margin: 0 auto;
  background-color: $headerBgColor;
  color: $headerTextColor;
  padding: 0;
  font: $headerFont;
}
h1.title {
  padding-top: 38px;
  margin: 0 14px .1em;
  line-height: 1.2em;
  font-size: 100%;
}
h1.title a, h1.title a:visited {
  color: $headerTextColor;
  text-decoration: none;
}
#header .description {
  display: block;
  margin: 0 14px;
  padding: 0 0 40px;
  line-height: 1.4em;
  font-size: 50%;
}
                                                       
/* Content
----------------------------------------------- */
.clear {
  clear: both;
}
#content-wrapper {
-moz-box-shadow: 0 0 5px 5px #FFFFFF;
-webkit-box-shadow: 0 0 5px 5px #FFFFFF;
box-shadow: 0 0 5px 5px #FFFFFF;
width: 800px;
margin: auto;
padding: 15px;
text-align: left;
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWgqPBQlcwHNpO8Y-7sel8LeKuO1FGlMZGiZVjo-ftJ41un7pHL0S5uvOrlpnZDCYvbt50sos20PE9Hd8Wr0kiwybc4-D16ZO2tvQuXNc5qxiICJf83tzTonRpL3wiF2ndLhFlnNldDw/s1600/chomel.gif);
border-top: 0;
-moz-border-radius: 40px;
-webkit-border-radius: 40px;
}
#main-wrapper {
  margin-$startSide: 14px;
  width: 468px;
  float: $startSide;
  background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWgqPBQlcwHNpO8Y-7sel8LeKuO1FGlMZGiZVjo-ftJ41un7pHL0S5uvOrlpnZDCYvbt50sos20PE9Hd8Wr0kiwybc4-D16ZO2tvQuXNc5qxiICJf83tzTonRpL3wiF2ndLhFlnNldDw/s1600/chomel.gif);
  display: inline;       /* fix for doubling margin in IE */
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
  margin-$endSide: 14px;
  width: 240px;
  float: $endSide;
  background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWgqPBQlcwHNpO8Y-7sel8LeKuO1FGlMZGiZVjo-ftJ41un7pHL0S5uvOrlpnZDCYvbt50sos20PE9Hd8Wr0kiwybc4-D16ZO2tvQuXNc5qxiICJf83tzTonRpL3wiF2ndLhFlnNldDw/s1600/chomel.gif);
  display: inline;       /* fix for doubling margin in IE */
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
/* Headings
----------------------------------------------- */
h2, h3 {
  margin: 0;
}
/* Posts
----------------------------------------------- */
.date-header {
  margin: 1.5em 0 0;
  font-weight: normal;
  color: $dateHeaderColor;
  font-size: 100%;
}
.post {
  margin: 0 0 1.5em;
  padding-bottom: 1.5em;
}
.post-title {
margin: .75em 0;
font: normal 13px Century Gothic;
text-align: center;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWfcMT5HXVYbito1qVrjJFH5q3U4g3TObkZCX5VU2jEcj-cwzQ2-x5wog95CRZD3T1oD5vQRa7reMN-sP0umf9V_1_l5ZWBugEF6xxiiFVLriUKcxjldcG1gApltgJn3D39kT4mnPtijk/s1600/backgroundpink.png);
border-top: 1px dashed #FA58D0;
border-bottom: 1px dashed #FA58D0;
border-right: 6px solid #FA58D0;
border-left: 6px solid #FA58D0;
padding: 2px;
}
.post-title a, .post-title a:visited, .post-title strong {
  text-decoration: none;
  color: $textColor;
  font-weight: bold;
}
.post div {
  margin: 0 0 .75em;
  line-height: 1.3em;
}
.post-footer {
  margin: -.25em 0 0;
  color: $textColor;
  font-size: 87%;
}
.post-footer .span {
  margin-$endSide: .3em;
}
.post img, table.tr-caption-container {
  padding: 4px;
  border: 1px solid $borderColor;
}
.tr-caption-container img {
  border: none;
  padding: 0;
}
.post blockquote {
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
background: #FFFFFF;
border: 1px dashed #FF0080;
-webkit-transition-duration: 1s;
margin:1.0em;
padding:5px;
}
.post blockquote:hover {
background-image:url(http://i561.photobucket.com/albums/ss52/angelicxmelody/Kawaii%20Smilies/th_6zlq0y.gif);
background-position:bottom right;
background-repeat:
no-repeat;
}
.post blockquote p {
  margin: .75em 0;
}
/* Comments
----------------------------------------------- */
#comments h4 {
  margin: 1em 0;
  color: $dateHeaderColor;
}
#comments h4 strong {
  font-size: 110%;
}
#comments-block {
  margin: 1em 0 1.5em;
  line-height: 1.3em;
}
#comments-block dt {
  margin: .5em 0;
}
#comments-block dd {
  margin: .25em 0 0;
}
#comments-block dd.comment-footer {
  margin: -.25em 0 2em;
  line-height: 1.4em;
  font-size: 78%;
}
#comments-block dd p {
  margin: 0 0 .75em;
}
.deleted-comment {
  font-style:italic;
  color:gray;
}
.feed-links {
  clear: both;
  line-height: 2.5em;
}
#blog-pager-newer-link {
  float: $startSide;
 }
#blog-pager-older-link {
  float: $endSide;
 }
#blog-pager {
  text-align: center;
 }
/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {
margin: .75em 0;
font: normal 13px Century Gothic;
text-align: center;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWfcMT5HXVYbito1qVrjJFH5q3U4g3TObkZCX5VU2jEcj-cwzQ2-x5wog95CRZD3T1oD5vQRa7reMN-sP0umf9V_1_l5ZWBugEF6xxiiFVLriUKcxjldcG1gApltgJn3D39kT4mnPtijk/s1600/backgroundpink.png);
border-top: 1px dashed #FA58D0;
border-bottom: 1px dashed #FA58D0;
border-right: 6px solid #FA58D0;
border-left: 6px solid #FA58D0;
padding: 2px;
}
                                                       
.sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.sidebar li {
  margin: 0;
  padding-top: 0;
  padding-$endSide: 0;
  padding-bottom: .5em;
  padding-$startSide: 15px;
  text-indent: -15px;
  line-height: 1.5em;
}
.sidebar {
  color: $textColor;
  line-height:1.3em;
}
.sidebar .widget {
  margin-bottom: 1em;
}
.sidebar .widget-content {
  margin: 0 5px;
}
/* Profile
----------------------------------------------- */
.profile-img {
  float: $startSide;
  margin-top: 0;
  margin-$endSide: 5px;
  margin-bottom: 5px;
  margin-$startSide: 0;
  padding: 4px;
  border: 1px solid $borderColor;
}
.profile-data {
  margin:0;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-weight: bold;
  line-height: 1.6em;
  font-size: 78%;
}
.profile-datablock {
  margin:.5em 0 .5em;
}
.profile-textblock {
  margin: 0.5em 0;
  line-height: 1.6em;
}
                                                       
/* Footer
----------------------------------------------- */
#footer {
  clear: both;
  text-align: center;
  color: $textColor;
}
#footer .widget {
  margin:.5em;
  padding-top: 20px;
  font-size: 85%;
  line-height: 1.5em;
  text-align: $startSide;
}
::-webkit-scrollbar {
height:12px;
width: 13px;
background: #FA58D0;
}
::-webkit-scrollbar-thumb {
background-color: #F5A9E1;
-moz-border-radius: 10px;
border-radius: 10px;
}
/* to top */
#toTop { width:100px;background:none;border:0px solid #ccc;text-
align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-
decoration:none; }
</style></head>
<script language="javascript" type="text/javascript">
/* toggle() checks to see if the images has already been faded
or not and sends the appropriate variables to opacity(); */
function toggle(el,milli) {
// Get the opacity style parameter from the image
var currOpacity = document.getElementById(el).style.opacity;
if(currOpacity != 0) { // if not faded
fade(el, milli, 100, 0);
} else { // else the images is already faded
fade(el, milli, 0, 100);
}
}
/* changeOpacity() uses three different opacity settings to
achieve a cross-browser opacity changing function. This
function can also be used to directly change the opacity
of an element. */
function changeOpacity(el,opacity) {
var image = document.getElementById(el);
// For Mozilla
image.style.MozOpacity = (opacity / 100);
// For IE
image.style.filter = "alpha(opacity=" + opacity + ")";
// For others
image.style.opacity = (opacity / 100);
}
/* fade() will fade the image in or out based on the starting
and ending opacity settings. The speed of the fade is
determined by the variable milli (total time of the fade
in milliseconds)*/
function fade(el,milli,start,end) {
var fadeTime = Math.round(milli/100);
var i = 0; // Fade Timer
// Fade in
if(start < end) {
for(j = start; j <= end; j++) {
// define the expression to be called in setTimeout()
var expr = "changeOpacity('" + el + "'," + j + ")";
var timeout = i * fadeTime;
// setTimeout will call 'expr' after 'timeout' milliseconds
setTimeout(expr,timeout);
i++;
}
}
// Fade out
else if(start > end) {
for(j = start; j >= end; j--) {
var expr = "changeOpacity('" + el + "'," + j + ")";
var timeout = i * fadeTime;
setTimeout(expr,timeout);
i++;
}
}
}
</script>
<div class="input" onClick="javascript:toggle('wise', 3000); this.style.display='none';
document.getElementById('june').style.display=''">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAlfwM_F8B6DHK1QnKxQt4PlmPgOSuopT8VzKcf0zlag6zKo497KNE8JNqKDFO5pIoORU5oR0MwqRsAuHLDq-nkGd8x7BbKekG3XIREHhsp9GWjbHJcG-BWfjFHDROmansUIbiMrS6hEk/s1600/freebieswelcomenotepurple.png"
style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=40"/>
</div>
<div id="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">
<div id="june" style="display : none;">
<body>
]]></b:skin>
  </head>
  <body>
  <div id='outer-wrapper'><div id='wrap2'>
    <!-- skip links for text browsers -->
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>skip to main </a> |
      <a href='#sidebar'>skip to sidebar</a>
    </span>
    <div id='header-wrapper'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='BLOG AKU,CERITA AKU (Pengatas)' type='Header'/>
</b:section>
    </div>
    <div id='content-wrapper'>
      <div id='crosscol-wrapper' style='text-align:center'>
        <b:section class='crosscol' id='crosscol'>
<b:widget id='HTML6' locked='false' title='' type='HTML'/>
<b:widget id='HTML15' locked='false' title='' type='HTML'/>
</b:section>
      </div>
      <div id='main-wrapper'>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Catatan Blog' type='Blog'/>
</b:section>
      </div>
      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML2' locked='false' title='Speak Now' type='HTML'/>
<b:widget id='HTML1' locked='false' title='Whiteboard' type='HTML'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='Image7' locked='false' title='AIN SURAYA...' type='Image'/>
<b:widget id='Image8' locked='false' title='MUHAMMAD ARIF NORBANI..' type='Image'/>
<b:widget id='Image5' locked='false' title='KAQ ANA...' type='Image'/>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='Image6' locked='false' title='KAQ SYIDA!!!' type='Image'/>
<b:widget id='Image3' locked='false' title='NURUL AQILA..' type='Image'/>
<b:widget id='Image4' locked='false' title='WANI..' type='Image'/>
<b:widget id='Image1' locked='false' title='SIS SYIDA' type='Image'/>
<b:widget id='Image2' locked='false' title='ECHA LAR...' type='Image'/>
<b:widget id='HTML9' locked='false' title='My Detail' type='HTML'/>
<b:widget id='HTML14' locked='false' title='Facebook Badge' type='HTML'/>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='HTML17' locked='false' title='' type='HTML'/>
</b:section>
      </div>
      <!-- spacer for skins that want sidebar and main to be the same height-->
      <div class='clear'>&#160;</div>
    </div> <!-- end content-wrapper -->
    <div id='footer-wrapper'>
      <b:section class='footer' id='footer'>
<b:widget id='HTML8' locked='false' title='SLIDE SHOW...' type='HTML'/>
<b:widget id='HTML7' locked='false' title='' type='HTML'/>
<b:widget id='HTML10' locked='false' title='' type='HTML'/>
<b:widget id='HTML19' locked='false' title='' type='HTML'/>
</b:section>
    </div>
  </div></div> <!-- end outer-wrapper -->
  <b:include data='blog' name='google-analytics'/>
</body>
<span>Template Design by</span> <a href='http://anapoppop.blogspot.com'>Ogiey</a>
</html>
                

14 comments :

Mimi's Blogger said...

saya nak washed denim yg akak wat tu tau... cantik sangat tapi blog akak lagi nice..thankss..

Rifa Saifanah Nasution said...

woah, really beautiful :) I'll gonna use this. Thx. I will credit you :)

Unknown said...

Akak saya mau gune yang akak wat tu . Cantik . tapi lagi cantik akak punye .

Unknown said...

akak saya mau gune yang akak wat tu . cantik ! tapi akak punye blogger lagi cantik.

Unknown said...

akak saye mau gune yang akak wat tu . Nice !

Syazwani Maslan said...

Saya ambil ya :) terima kasih :)

Alya Jibam said...

comel , guna ya :)

Alya Jibam said...

guna ya , thanks

Clara Jcl said...

Sila komen. Saya da ambil dan ada buat perubahan. :)

http://lasenoritalala.blogspot.com/

Nurhidayati Razali said...

saya nak guna washed denim tuu tau . cantik . :)

Unknown said...

Kita guna ni yea ;)

Unknown said...

akak saya guna ya ! nice la washed denim akak.

Unknown said...

nak ya :)

Unknown said...

nak ye