Finally this site got a new design, which is using white as background and black as the font color. Hopefully with the new design it’ll appeal to most of this site visitors :-)

Actually this new design is based from the web templates by Wolfgang (thanks a lot for your wonderful design). And all i have to do is just porting it into the current theme that i'm using right now (it’s Binary Blue by Countzero) instead of porting it from scratch :-P (although it's not fully completed yet, and this time i choose to use more images .. – judging from the previous vote session by this site visitors – )

The main reason why i choose to port it into Binary Blue is that because if i'm changing my current theme i’ll have to redo everything again (well .. i'm a lazy guy) :-P and another reason is, Binary Blue already included several important features built in .. such as paged comment (which is important for me), and many other features that i couldn't find in other themes (that’s why i choose to stick with Binary Blue) .. although i'm a little bit worried if CountZero released a new version of Binary Blue .. i’ll have to redo everything again .. lol

Okay .. that’s all for this site journal for today .. and now because i haven't sleep since yesterday (it's already morning here) .. because of porting CSS templates from Wolfgang .. i think i'm going to bed .. (maybe if there’s no other activity to do)

As a note, if you found error somewhere .. just let me know so i can fix it right away :-) .. thanks ;-)

Copyright © Reaper-X Technology – www.reaper-x.com | Permalink | 2 comments

0x87485B96 | Tags : CSS, Journal, Personal, Webdesign, Website

I didn't know some of my post here affected by the IE 6 Peekaboo Bug especially when viewed in single post mode (thanks to the Internet Explorer developer for creating this wonderful bug and another CSS related bug on your wonderful browser) ..

And after searching around the web, i’ve found that simply by adding height:1% to the affected element, this problem can be solved easily .. (although there’s some left in my site .. but im not going to fix it because it's not important)

And thanks to Six Shooter Media for posting this fix so i can fix it within minutes, because the Positioniseverything site is hard to navigate to find a fix for this wonderful bug on internet explorer

Copyright © Reaper-X Technology – www.reaper-x.com | Permalink | One comment

0x87485B96 | Tags : Browsers, CSS, Guide, Journal, Personal, Tutorials, Webdesign

I just released another Sandbox skins or themes to use for free to anyone who already buy the Wordpress upgrades or to everyone who already own a hosting service! I’ve already test this using Opera, Internet Explorer, and Mozilla Firefox. Hopefully its not going to break in another browsers. This theme originally created by Steve Mooradian for Wordpress, but like you already know that wordpress doesn't allow you to upload your created themes except by editing the CSS file only, so that’s why i converted the Greenery theme into Sandbox format (as long as you already have the upgrades, you can use it). And here’s the screenshot :

as for the css code and instructions you can look into this the full story here

Note:

• If you has more than five pages, you should edit the css manually so it’ll only display on the sidebar instead of the top pages
• Use Sidebar 1 only because i use Sidebar 2 for something else
• You can download the default images from the greenery homepage, because its not included

and here’s the css code :


/*
Skin Name:X-Greenery
Skin URI:http://www.reaper-x.com
Description:Snazzy dark grey theme with splashs of greenery (hence the name). This is a port of
the open-source template by Pat Heard ( FullAhead.org ) of the same name. Converted and modified into Sandbox Theme by Reaper-X
Author:Steve Mooradian
Author URI:http://www.negative99.com
Live Demo:http://demo.negative99.com/wordpress/?wptheme=Greenery
The CSS,XHTML and design is released under GPL:
http://www.opensource.org/licenses/gpl-license.php
Send feedback to steve at negative99 dot com
Changelog:
v1.0
First Release
v1.1
Added Widgets support (special thanks to x2nie at yahoo dot com)
*/
body{
margin:0;
border:0;
text-align:center;
font:0.63em verdana,arial,sans-serif;
line-height:170%;
color:#EEEEEE;
background:url(xgreenery/bg_body.jpg) #585858 repeat-y top center
}
#header{
width:100%;
margin:0 auto;
border:0;
height:4.2em;
background:url(xgreenery/bg_header.jpg) #585858 repeat-y top center
}
#blog-title{
padding:0 55px 20px 0;
float:right;
background-image:url(xgreenery/logo_greenery.gif);
background-repeat:no-repeat;
background-position:right;
color:#000000
}
#blog-description{display:none}
#wrapper{
position:relative;
display:block;
width:767px;
height:auto;
margin:0 auto;
padding:0;
text-align:left
}
#container{margin-top:-50px}
#content{
float:left;
position:absolute;
display:block;
width:410px;
padding:10px 5px 20px 10px;
text-align:justify
}
.hfeed{text-align:justify}
#content ul{}
.sidebar{display:block;width:185px}
#primary{float:right}
html>body #primary{float:right;position:relative}
#secondary{
background-image:url(xgreenery/plants.jpg);
background-repeat:no-repeat;
height:604px;
width:166px;
float:left;
margin-left:220px;
margin-top:-19px
}
html>body #secondary{
float:left;
position:absolute;
margin-left:44em;
margin-top:-4.6em;
clear:left
}
#footer{
background-image:url(xgreenery/reaper-logo.gif);
background-repeat:no-repeat;
background-position:left;
float:right;
clear:both;
display:block;
margin:0 auto;
text-align:center;
padding:20px;
width:60px;
height:34px;
color:#888888;
font-size:0.9em
}
html > body #footer{float:right}
p.access a{display:none}
#secondary li{display:none}
#menu li{
float:left;
margin-top:-71px;
padding-right:20px;
background-color:#86E160
}
html>body #menu li{
width:8em;
float:left;
list-style:none;
text-align:center;
margin-top:-62px;
padding:0 0 42px 0;
background-color:transparent;
line-height:normal
}
#menu li a{
display:block;
padding-bottom:1em;
text-decoration:none;
text-transform:uppercase;
color:#222222
}
#menu li a:hover{
font-weight:bold;
color:#111111;
background:url(xgreenery/menu_tab.gif) no-repeat bottom center
}
h1{
display:inline;
color:#222222;
background-color:#86E160;
background-image:none;
clear:both;
margin:10px 0;
font:700 1em verdana,sans-serif;
text-transform:uppercase
}
h1 a{
margin:10px 0;
font:700 1em verdana,sans-serif;
text-transform:uppercase;
color:#000000;
text-decoration:none
}
h2{
margin:10px 0;
font:700 1em verdana,sans-serif;
text-transform:uppercase;
color:#7BD32C;
background:url(xgreenery/rounded_tr.gif) #686868 no-repeat top right
}
h3{
margin:10px 0;
font:700 1em verdana,sans-serif;
text-transform:uppercase;
color:#7BD32C
}
#wrapper ul{padding-bottom:6px}
#wrapper ul li{margin-left:2px;padding-left:2px}
p{
padding-top:10px !important;
padding-top:3px;
padding-bottom:10px !important;
padding-bottom:3px
}
a,#content a:visited,.hfeed a:visited,.sidebar a,.sidebar a:visited{color:#7BD343;text-decoration:none}
a:hover,.entry-meta a:hover{color:#FFFFFF}
textarea{width:98%}
input,textarea{
padding:1px 3px;
margin:5px 0;
font:1em verdana,arial,sans-serif;
color:#EEEEEE;
background-color:#777777;
border:1px solid #999999
}
input:hover,input:focus,textarea:hover,textarea:focus{
color:#FFFFFF;
background-color:#999999;
border:1px solid #EEEEEE
}
h2 a:hover,h2 a:visited,h2 a{text-decoration:none}
blockquote{
margin:0;
padding:0 15px;
border:1px solid;
background:#555555
}
code{
display:block;
padding:8px;
background:#555555;
font-size:8pt;
border-top:1px dotted;
border-bottom:1px dotted
}
.entry-date{
cursor:help;
border-bottom:1px solid #777777;
letter-spacing:1px
}
.sidebar ul{list-style:none}
.sidebar h3{
text-align:right;
background-color:#686868;
background-image:url(xgreenery/rounded_tl.gif);
background-repeat:no-repeat
}
.sidebar ul h3 span{
display:block;
padding:2px;
background:url(xgreenery/rounded_bl.gif) no-repeat bottom left
}
.sidebar ul ul{list-style:disc}
.commentlist li{
list-style:none;
padding:5px;
margin-top:5px;
border:#555555 1px solid;
background-color:#333333
}
.comment-meta{padding-top:10px;color:#999999}
.commentlist{color:#EEEEEE}
#footer #generator-link,#footer .metasep,#footer #theme-link{display:none}
.commentlist a{color:#7BD32C}
.commentlist a:hover{color:#EEEEEE}
.comment-author{
font-weight:bold;
border-bottom:1px solid;
padding-bottom:3px
}
.entry-meta{
text-align:justify;
padding:10px;
border-top:1px solid #999999;
border-bottom:1px solid #999999
}
.entry-meta a{
color:#7BD343;
text-decoration:none;
border-bottom:1px dotted
}
#searchform{text-align:center}
#searchform input{width:100px}
#searchform #searchsubmit #s{}
#wp-calendar{text-align:center}
#wp-calendar th,#wp-calendar tfoot{background-color:#333333}
#wp-calendar tbody{background-color:#555555;font-weight:bold}
#wp-calendar a,#wp-calendar caption{font-weight:bold}
#footer p{padding-top:0 !important;padding-top:10px}
#footer a{color:#888888}
#footer a:hover{color:#EEEEEE}
.center{text-align:center}
.left{float:left}
.right{float:right}
img.left{padding:5px 5px 5px 0}
img.right{padding:5px 0 5px 5px}
a img{border:none;background:none}
img.left{
display:block;
padding:1px;
float:left;
margin:3px 12px 3px 0
}
img.right{
display:block;
padding:1px;
float:right;
margin:3px 0 3px 12px
}
img.center{display:block;padding:1px;margin:3px auto}


I hope you like it, just like i do

Copyright © Reaper-X Technology – www.reaper-x.com | Permalink | 7 comments

0x87485B96 | Tags : Blogging, CSS, General Blogging, Internet, Sandbox, WPMU, Webdesign, Wordpress, Wordpress Themes

I just converted ChinaRed theme for wordpress into a Sandbox Theme for Wordpress, at first i was trying to create a sandbox theme but since i get stuck at some part of my sandbox theme, yesterday i (in my local time), i’ve decided to convert ChinaRed theme instead :D … anyway here’s the screenshot :

And this time instead of putting it somewhere for you to download, i’ll list the code here (in the next page of course because i don't want to clutter my front page with code) :P … as for the image itself, you can download the ChinaRed theme, or replace it with your own image … hope you’ll like it ;)


/*
skin name:eXs-ChinaRed
skin uri:http://www.bighead.cn/?p=100
description:a chinese theme for wordpress converted by reaper-x
version:1.0
author:bighead (?? ?? ?)
author uri:http://www.bighead.cn/
this theme was designed and built by bighead,
whose blog you will find at http://www.bighead.cn/
the css,xhtml and design is released under gpl:
http://www.opensource.org/licenses/gpl-license.php
feel free to contact me if you have questions,my email:bighead@gmail.com
*/
#globalnav,p.access{display:none}
body{
font-size:66%;/* resets 1em to 10px */
font-family:'lucida grande',verdana,arial,sans-serif;
background-color:#D5D6D7;
background-image:url(chimg/bgcolor.jpg);
color:#CA9B82;
margin:0;
padding:0;
text-align:center
}
#wrapper{
margin:0px auto;
width:760px;
background-image:url(chimg/kubrickbg.jpg);
background-repeat:repeat-y
}
#container{
background-color:#FFFFFF;
color:#CA9B82;
padding:0;
text-align:left
}
#header{
background-color:#73A0C5;
color:#CA9B82;
background-image:url(chimg/kubrickheader.jpg);
height:200px
}
#content{font-size:1.2em}
.hfeed .entry-content{line-height:1.4em}
.hfeed{
float:left;
padding:0 0 20px 45px;
margin:0px 0 0;
width:450px
}
#footer{
background-color:transparent;
color:#CA9B82;
background-image:url(chimg/kubrickfooter.jpg);
background-position:bottom;
background-repeat:no-repeat;
padding:20px 0 0 1px;
margin:0 auto;
height:63px;
width:760px;
clear:both;
}
small{
font-family:arial,helvetica,sans-serif;
font-size:0.9em;
line-height:1.5em
}
h1,h2,h3{
font-family:'trebuchet ms','lucida grande',verdana,arial,sans-serif;
font-weight:bold
}
#blog-title{
font-size:2em;
text-align:center;
text-decoration:none;
float:left;
display:inline;
margin-top:73px;
margin-left:80px;
padding:0px
}
.sidebar h3{
font-family:'lucida grande',verdana,sans-serif;
font-size:1.2em
}
#blog-description{
float:right;
display:inline;
text-transform:capitalize;
color:#D1B059;
background-color:transparent;
margin-top:77px;
margin-right:100px;
padding-top:0px;
text-align:center
}
h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited{color:#D7B963;background-color:transparent}
h2,h2 a,h2 a:hover,h2 a:visited,h3,h3 a,h3 a:hover,h3 a:visited,.sidebar h2,#wp-calendar caption{text-decoration:none}
.entry-content p a:visited{
font-weight:bold;
background-color:transparent;
color:#999999;
text-decoration:none
}
.entry-content p a:link{
font-weight:bold;
background-color:transparent;
color:#DCDF4F;
text-decoration:none
}
.entry-content a:link{
font-weight:bold;
background-color:transparent;
color:#DCDF4F;
text-decoration:none;
border-bottom:#DCDF4F 1px dotted
}
.entry-content a:visited{
background-color:transparent;
color:#DCDF4F;
text-decoration:none;
border-bottom:#DCDF4F 1px dotted
}
.commentlist li,#commentform .form-input,#commentform .form-textarea{
font:0.9em 'lucida grande',verdana,arial,sans-serif
}
.commentlist cite,.commentlist cite a{
font-weight:bold;
font-style:normal;
font-size:1.1em
}
.commentlist p{
font-weight:normal;
line-height:1.5em;
text-transform:none;
margin:10px 5px 10px 0
}
#commentform p{
font-family:'lucida grande',verdana,arial,sans-serif;
margin:5px 0
}
small,.sidebar ul ul li,.sidebar ul ol li,.nocomments,.entry-meta,blockquote,strike{color:#999999;background-color:transparent}
code{font:1.1em 'courier new',courier,fixed,sans-serif}
a,h2 a:hover,h3 a:hover{
color:#BA9830;
background-color:transparent;
text-decoration:none
}
a:hover{
color:#BA9830;
background-color:transparent;
text-decoration:none;
border-bottom:#D7B963 1px dotted
}
.entry-content{margin:0 0 40px;text-align:justify}
.entry-meta{
padding:8px 5px 8px 5px;
margin-left:2px;
text-align:justify;
border-top:1px solid #B99070;
border-bottom:1px solid #B99070;
background-color:#722012
}
h2{font-size:1.6em;margin:30px 0 0}
h2.entry-title{margin-top:30px;text-align:left}
.sidebar h2{margin:5px 0 0;padding:0}
h3{padding:0;margin:30px 0 0}
h3.comment-header{padding:0;margin:40px auto 20px}
p img{padding:0}
img.centered{display:block;margin-left:auto;margin-right:auto}
img.alignright{padding:4px;margin:0 0 2px 7px;display:inline}
img.alignleft{padding:4px;margin:0 7px 2px 0;display:inline}
.alignright{float:right}
.alignleft{float:left}
html>body .entry-content ul{
margin-left:0px;
padding:0 0 0 30px;
list-style:none;
padding-left:10px;
text-indent:-10px
}
html>body .entry-content li{margin:7px 0 8px 10px}
.entry-content ul li:before,.sidebar ul ul li:before{content:"0bb 020"}
.entry-content ol{padding:0 0 0 35px;margin:0}
.entry-content ol li{margin:0;padding:0}
.entry-meta ul,.entry-meta li{
display:inline;
list-style-type:none;
list-style-image:none
}
.sidebar ul,.sidebar ul ol{margin:0;padding:0}
.sidebar ul li{
list-style-type:none;
list-style-image:none;
margin-bottom:15px
}
.sidebar ul p,.sidebar ul select{margin:5px 0 8px}
.sidebar ul ul,.sidebar ul ol{margin:5px 0 0 10px}
.sidebar ul ul ul,.sidebar ul ol{margin:0 0 0 10px}
ol li,.sidebar ul ol li{list-style:decimal outside}
.sidebar ul ul li,.sidebar ul ol li{margin:3px 0 0;padding:0}
.searchform{margin:0px auto;padding:0px 0px;text-align:left}
.sidebar #searchform #s{
width:115px;
padding:2px;
background-color:#722012;
color:#CA9B82;
border:1px solid #B39571
}
.sidebar #searchsubmit{
padding:1px;
background-color:#722012;
color:#CA9B82;
border:1px solid #B39571
}
#commentform .form-input #author,#commentform .form-input #email,#commentform .form-input #url{
width:170px;
padding:2px;
margin:5px 5px 1px 0;
background-color:#722012;
color:#CA9B82;
border:1px solid #B39571
}
#commentform .form-textarea #comment{
width:100%;
padding:2px;
margin-bottom:4px;
background-color:#722012;
color:#CA9B82;
border:1px solid #B39571
}
#commentform .form-submit #submit{
margin:0px auto;
background-color:#722012;
color:#CA9B82;
border:1px solid #B39571;
padding:2px
}
#commentform .form-submit #submit:hover{background-color:#852A25;color:#CA9B82}
#comment-notes{font-size:10px;padding:2px}
.commentlist{
padding:0;
text-align:justify;
border-top:1px solid #B99070;
border-bottom:1px solid #B99070;
background-color:#722012
}
.commentlist li{
margin:15px 0 3px;
padding:5px 10px 3px;
list-style:none;
font-weight:bold
}
.nocomments{text-align:center;margin:0;padding:0}
.comment-metadata{margin:0;display:block;font-weight:normal}
.sidebar{
padding:10px 0 0px 0;
margin-left:540px;
width:200px;
font:1.2em 'lucida grande',verdana,arial,sans-serif;
text-align:left
}
.sidebar form{margin:0}
#wp-calendar{empty-cells:show;width:155px}
#wp-calendar th{font-style:normal;text-transform:capitalize}
#wp-calendar #next a{padding-right:10px;text-align:right}
#wp-calendar #prev a{padding-left:10px;text-align:left}
#wp-calendar a{display:block;font-size:9pt;text-decoration:none}
#wp-calendar caption{
font:bold 1.2em 'lucida grande',verdana,arial,sans-serif;
text-align:center;
width:100%
}
.entry-date{
border-bottom:1px dashed #999999;
font-size:0.9em;
letter-spacing:.07em;
cursor:help
}
blockquote{
margin:15px 30px 0 10px;
padding:5px;
border-left:5px solid #996633;
border-right:5px solid #996633;
background-color:#722012
}
blockquote cite{margin:5px 0 0;display:block}
.center{text-align:center}
hr{display:none}
a img{border:none}
.navigation{
display:block;
text-align:center;
margin-top:10px;
margin-bottom:60px
}


That's it you're finished ;)

Copyright © Reaper-X Technology – www.reaper-x.com | Permalink | 11 comments

0x87485B96 | Tags : Blogging, CSS, General Blogging, Internet, Sandbox, WPMU, Webdesign, Wordpress, Wordpress Themes

After playing CSS for about 3 days, i finally found that Internet Explorer is the unfriendlist browsers i’ve ever seen (except Mobile Phone browser) that arent accepting any xxx:hover value, some float bug, etc … i though it was going to be easy to play around with css … unfortunately when i found that the wonderfull internet explorer is displaying some strange stuff when i see my created css files on Internet Explorer (unlike the 2 other major browsers like Opera and Firefox which is showing the correct display) … i just dont know what to do again … since its going to be hard to create css that is compatible with all browsers (i’ve already verified my css file using w3c css validator without any error on my css file) … but IE is still showing some strange stuff .. and after searching for it, i found that its actually IE bug, because IE is not using the Standard CSS definition / terms / whatever from W3C or something like that …. This is going to be hard … (i just wondering what did everyone do to overcome the IE CSS bug ?)

Copyright © Reaper-X Technology – www.reaper-x.com | Permalink | Add a comment

0x87485B96 | Tags : Blogging, Browsers, CSS, General Blogging, Webdesign, Wordpress

I just finished creating a CSS / Stylesheet for Sandbox Theme based on Kubrick Theme (although not completely finished) and i think the results is not bad for a beginner in css thing like me :) (actually i’ve never made something like this before and just learned about this whole CSS stuff yesterday) … so if the results is bad or doesnt suit your taste, feel free to edit it ;) ..

Note : i don’t have the upgrades account at the wordpress so i can’t give you any help on that matters … also since im just a beginner in this css thing dont ask me about advanced css stuff. And there’s one more thing, my css will looks better on Firefox since i test it using Mozilla Firefox browser

and here’s some screenshot of my sandbox theme called X-Cuberik :P (since there’s someone using Kubrick Reloaded i change its name into X-Cuberik) :D

and to use this css style, first you must download my css stylesheet for Sandbox theme from http://d.turboupload.com/d/857580/X-Cuberik.zip.html

and don’t forget to adjust the image path to point to your image directory (in reaper-x.css)

I’d like to give credits to Lorelle , and that’s because of her i was able to write this css stylesheet. Because she is listing the class id for each element from the sandbox theme

also credits to the maker of various Wordpress theme, since my theme inspirated from various wordpress theme especially AndreasViklund

Hope you’ll like my css stylesheet for Sandbox Theme ;)

Edit: don't forget to put this line into reaper-x.css since i forgot to put this line to disable globalnav

div#globalnav, p.access { display: none; }

Copyright © Reaper-X Technology – www.reaper-x.com | Permalink | 6 comments

0x87485B96 | Tags : Blogging, CSS, Computer, General Blogging, Internet, WPMU, Webdesign, Wordpress, Wordpress Themes