ini di Plurk.
Saya membuat beberapa perubahan kecil di kode ini.
Pertama, saya gunakan gambar sendiri, bisa juga foto, sebagai background theme ini. Saya ubah di bagian kode seperti berikut ini.
Jika ingin memakai layout seperti di atas, kopi paste semua kode berikut ini.
#page_title {
overflow: hidden;
opacity:0; width: 0;
}
html {
background: url(http://1.bp.blogspot.com/_Uq3WzywZOzU/TRsflsf56UI/AAAAAAAABYE/GZQd9OhBsAE/s1600/SriGuluDARKER.png);
background-repeat: no-repeat;
}
body {
background: none;
padding-left: 210px;
padding-right: 215px;
overflow-x:hidden;
font-family: “Trebuchet MS”, Helvetica, sans-serif;
font-size: 9pt;
}
#top_login {
padding: 2px 10px 0px 0px !important;
margin: 0px 0px 0px 0px;
background-image: url();
background-color: transparent;
background-repeat: repeat;
color: black !important;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
}
#sign_up {
padding: 0px 3px 0px 3px !important;
margin: 0px 0px 0px 0px !important;
position: relative !important;
}
#dash-stats h3 {
font-size: 24px;
}
#alert_beacon {
text-shadow: 1px 1px 1px white;
color: black !important;
}
h1 {
font-weight: bold;
text-shadow: 1px 1px 1px grey;
color: black !important;
}
table, td {
color: black !important;
text-shadow: 1px 1px 1px white;
}
#plurk-dashboard a, #footer a, #top_login a, #top_bar a {
font-family: “Trebuchet MS”, Helvetica, sans-serif;
text-shadow: 1px 1px 1px white;
color: black !important;
}
#karma, .karma_hover {
font-family: “Trebuchet MS”, Helvetica, sans-serif;
text-shadow: 2px 2px 2px black;
color: #99FF33;
font-weight:bold;
}
.browse_button {
margin-left: 210px !important;
}
.tooltip_cnt {
background: #003300;
text-shadow: 1px 1px 1px black;
}
/* —– TIMELINE —— */
#timeline_cnt {
background: url() no-repeat;
background-color: transparent;
}
#timeline_holder {
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat-x;
padding-left: 210px;
padding-right: 215px;
position: relative;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
border: 1px solid #CCCCCC;
}
#bottom_line {
position: relative;
top: 365px !important;
right: 215px;
left: 0px;
}
div#updater {
left: 18em; right: auto;
-moz-border-radius:12px;
-webkit-border-radius:12px;
-khtml-border-radius:12px;
}
#filter_tab .off_tab {
background: #003300;
}
/* ***************************** */
/* Indonesian Plurk Layouter */
/* ***************************** */
/* Layout Founder : Haerul Rijal */
/* eMail : the.trojan.x@gmail.com */
/* Layout editing : blackmask */
/* eMail : blackmask@gmail.com */
/* ***************************** */
/* Thanks For Downloading 🙂 */
/* ********************************* */
/* ——-plurk——— */
.p_img img {
border: 2px solid white;
background: white
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-border-radius:2px;
-webkit-border-radius:2px;
-khtml-border-radius:2px;
}
.response_count {
padding: 2px 2px 2px 2px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-khtml-border-radius:3px;
}
textarea#input_small, textarea#input_big {
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
}
.mini_form {
color: black;
font-weight: bold;
text-shadow: 1px 1px 1px white;
-moz-border-top-left-radius: 10px 10px;
-webkit-border-top-left-radius: 10px 10px;
-khtml-border-top-left-radius: 10px 10px;
-moz-border-top-right-radius: 10px 10px;
-webkit-border-top-right-radius: 10px 10px;
-khtml-border-top-right-radius: 10px 10px;
}
.plurk_box .list .empty {
text-shadow: 1px 1px 1px white;
}
.plurk_box .list {
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
}
.qualifier {
text-shadow: 1px 1px 1px black;
color: white;
padding: 0px 1px 0px 1px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
-khtml-border-radius:2px;
}
#emoticons_show img {
border: 0px !important;
}
#emoticons_show, #emoticons_tabs ul li {
border: 1px solid grey;
padding: 2px 2px 2px 2px !important;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;
}
.plurk_cnt {
text-shadow: 1px 1px 1px grey;
font-size: 9pt;
border: 1px solid #CCCCCC;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
}
.dots .inner {
background: white;
text-shadow: 1px 1px 1px white;
padding: 0px 1px 1px 0px !important;
border: 1px solid #CCCCCC;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-khtml-border-radius:4px;
}
.plurk_cnt table {
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
}
.plurk_cnt {
opacity: .9;
padding: 2.5px 9px;
background: white;
margin-left: 5px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;
-moz-border-radius: 6px;
-o-border-radius: 6px;
border-radius: 6px;
}
.plurk_box .caption {
background: rgb(72,72,72);
color: rgb(231,231,231);
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
}
.info_box {
-moz-border-bottom-left-radius: 10px 10px;
-webkit-border-bottom-left-radius: 10px 10px;
-khtml-border-bottom-left-radius: 10px 10px;
-moz-border-bottom-right-radius: 10px 10px;
-webkit-border-bottom-right-radius: 10px 10px;
-khtml-border-bottom-right-radius: 10px 10px;
}
.plurkaction .qual_holder {
text-shadow: 1px 1px 1px white;
font-weight: bold;
color: #FFFFFF;
}
.emoticon, .p_img {
-webkit-transition-duration: 500ms;
-moz-transition-duration: 500ms;
-khtml-transition-duration: 500ms;
}
.emoticon:hover, .p_img:hover {
-webkit-transform: rotate(390deg) scale(1.2);
-moz-transform: rotate(390deg) scale(1.2);
-khtml-transform: rotate(390deg) scale(1.2);
}
/* —– DASHBOARD —— */
#dash-profile {
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-border-radius:8px;
-webkit-border-radius:8px;
-khtml-border-radius:8px;
position: fixed !important;
opacity : 1 !important;
text-align: center;
color: white;
text-shadow: 1px 1px 1px black;
margin: 0px 0px 0px 20px;
padding: 3px 3px 3px 3px;
border: 1px solid #CCCCCC;
right: 5px;
top: 5px;
height:80px;
width:195px;
}
#dash-additional-info {
-moz-border-radius:8px;
-webkit-border-radius:8px;
-khtml-border-radius:8px;
position: fixed !important;
opacity : 1 !important;
text-align: center;
color: white;
text-shadow: 1px 1px 1px black;
margin: 0px 0px 0px 20px;
padding: 35px 3px 3px 3px;
right: 5px;
top: 10px;
width:190px;
}
div#private_plurk {
margin: 10px 1px 5px 75px !important;
}
#profile_pic {
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
position: fixed !important;
opacity: 1 !important;
margin: 0px 0px 0px 0px;
background-color: white;
left: 5px;
top:5px;
width:195px;
height:195px;
border: 0px solid #CCCCCC;
-webkit-border-radius: 97px;
-khtml-border-radius: 97px;
-moz-border-radius: 97px;
}
p#about_me:hover {
opacity: 1 !important;
}
p#about_me {
position: fixed !important;
opacity: .5 !important;
margin: 0px 00px 0px 0px;
text-shadow: 1px 2px 2px black;
color: white;
left: 5px;
text-align : center;
top: 205px;
width:195px;
}
.award_bar div {
padding: 0px 1px 3px 5px;
margin: 0px 0px 0px 0px;
height: 26px;
width: 26px;
}
.award_bar img {
-moz-transform: scale(0.7);
-khtml-transform: scale(0.7);
-webkit-transform: scale(0.7);
-o-transform: scale(0.7);
}
.award_bar {
position: fixed !important;
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat-x;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
padding: 0px 0px 5px 0px;
border: 1px solid #CCCCCC;
left: 0px;
opacity: 1 !important;
text-align : right;
top: 220px;
width:180px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
}
#dash-friends {
position: fixed !important;
background: url() repeat-x;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
padding: 0px 0px 5px 0px;
border: 1px solid #CCCCCC;
left: 5px;
opacity: 1 !important;
text-align : center;
top: 300px;
width:190px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
}
#dash-fans {
-moz-border-radius:8px;
-webkit-border-radius:8px;
-khtml-border-radius:8px;
position: fixed !important;
background: url() repeat-x;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
opacity : 1 !important;
text-align: center;
margin: 0px 0px 0px 0px;
padding: 3px 3px 3px 3px;
border: 1px solid #CCCCCC;
right: 5px;
top: 363px;
width:195px;
}
.friend_holder td {
padding: 0px 0px 3px 3px;
}
.friend_holder img {
-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
}
#dashboard-invite, #sharePlurk {
width: 0; height: 0 !important;
opacity: 0 !important;
padding: 0px !important;
overflow: hidden !important;
}
#dash-stats {
-moz-border-radius:8px;
-webkit-border-radius:8px;
-khtml-border-radius:8px;
position: fixed !important;
background: url() repeat-x;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
opacity : 1 !important;
text-align: center;
margin: 0px 0px 0px 0px;
padding: 3px 3px 3px 3px;
border: 1px solid #CCCCCC;
right: 5px;
top: 100px;
width:195px;
}
#plurk-dashboard table, #plurk-dashboard td {
color: white !important;
text-shadow: 1px 1px 1px black;
}
#plurk-dashboard {
-moz-border-radius:8px;
-webkit-border-radius:8px;
-khtml-border-radius:8px;
border: 1px solid #CCCCCC;
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat-x;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
background-color: transparent;
}
.dash-segment {
min-height : 60px;
}
/*—– PANE PLURK —-*/
#dashboard_holder {
position: relative;
width:100% !important;
}
#toggle_tab li {
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat-x;
-moz-border-top-left-radius:8px;
-webkit-border-top-left-radius:8px;
-khtml-border-top-left-radius:8px;
-moz-border-top-right-radius:8px;
-webkit-border-top-right-radius:8px;
-khtml-border-top-right-radius:8px;
color: #cccccc;
border: 0px solid #CCCCCC;
background-color: #E0E0E0;
background-color: transparent;
}
#toggle_tab li.tt_selected {
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat-x;
-moz-border-top-left-radius:8px;
-webkit-border-top-left-radius:8px;
-khtml-border-top-left-radius:8px;
-moz-border-top-right-radius:8px;
-webkit-border-top-right-radius:8px;
-khtml-border-top-right-radius:8px;
border: 1px solid #E0E0E0;
background-color: transparent;
}
.plurkaction {
background: url(http://i47.tinypic.com/mhx5d0.jpg) repeat-x;
-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-o-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6);
-moz-border-radius:8px;
-webkit-border-radius:8px;
-khtml-border-radius:8px;
border: 1px solid #E0E0E0;
background-color: transparent;
}
.share_search {
position:relative;
bottom: 5px;
padding-right: 50%;
}
#reply_box {
background-image: url(http://i38.tinypic.com/dfd9wz.png);
background-repeat: repeat;
background-color: transparent;
}
/*— FOOTER —*/
#footer {
top: -85px;
width: 100% !important;
color: black;
padding: 3px 10px 3px 10px;
}
#languge_selector, #footer p {
padding: 3px 25px 3px 25px;
}
.day_bg .div_inner {
background: url(http://www.laymark.com/i/cz/cz04.gif) no-repeat Bottom;
width: 80px; border: none;
}
/* ——-LOADING——- */
.list .loading {
position:absolute;
height:120px; /* jarak dari atas */
background:transparent url(http://www.laymark.com/i/cz/cz12.gif) no-repeat 50% 50%;
}
.loading img {
filter:alpha(opacity=0);
opacity:.0;
}
/* ——————— */
Komentar Terbaru