Manmohanjit Singh

CSS3 brings a lot of productivity. Once its fully ready to roll on most browsers, you wouldn’t need to waste any money for Photoshop. You wouldn’t even think of opening Photoshop if you had it. Rounded corners, box shadows, text shadows, multiple backgrounds and many more. CSS3 is a whole new experience.

Anyway, using only CSS3 and no images, here are some buttons that actually look good. I know I’m bad with color choosing but I tried my best. Its pretty simple actually, I used CSS3 for three things for this buttons which are:

• Rounded Corners
• Box Shadows
• Text Shadows

Rounded corners to give it the Web 2.0 look, box shadows to replace gradients and text shadows to make it look cool.

Here is the CSS code used for the blue button:

button.blue {
	background: #6B90D4;
	height: 32px;
	min-width: 75px;
	border: 3px solid #052A6E;
	/* -- CSS 3 */
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	-khtml-border-radius: 7px;
	border-radius: 7px;
	-moz-box-shadow: inset #1047A9 0 6px 14px;
	-webkit-box-shadow: inset #1047A9 0 6px 14px;
	box-shadow: inset #1047A9 0 6px 14px;
	text-shadow: #6B90D4 1px 1px 1px;
	/* /- CSS 3 */
	padding: 5px;
	text-align: center;
	color: #052A6E;
	font-family: "Lucida Grande", "Verdana", sans-serif;
	font-weight: 600;
	font-size: 14px;
}
button.blue:hover, button.blue:focus {
	/* -- CSS 3 */
	-moz-box-shadow: inset #1047A9 0 8px 14px;
	-webkit-box-shadow: inset #1047A9 0 8px 14px;
	box-shadow: inset #1047A9 0 12px 14px;
	/* /- CSS 3 */
	padding: 5px;
}

HTML:

<button class="blue">Submit Query</button>

Have you used or seen Twitter? The cool way they display the time a tweet was posted on? Example: “8 minutes ago”. I don’t know if you think its cool or not, but I sure think it is.

I have been finding this piece of code either ready for me to use or even a tutorial. I came across the code at snipplr, a place where you can share your code. It’s a useful site, that I suggest you bookmark. Anyway, it uses the time() format to calculate the seconds/minutes/hours/days/years/decades ago. You can view the code here.

function newTime($tm,$rcs = 0) {
	// http://snipplr.com/view/17338/
	$cur_tm = time(); $dif = $cur_tm-$tm;
	$pds = array('second','minute','hour','day','week','month','year','decade');
	$lngh = array(1,60,3600,86400,604800,2630880,31570560,315705600);
	for($v = sizeof($lngh)-1; ($v >= 0)&&(($no = $dif/$lngh[$v])<=1); $v--); if($v < 0) $v = 0; $_tm = $cur_tm-($dif%$lngh[$v]);
	$no = floor($no); if($no <> 1) $pds[$v] .='s'; $x=sprintf("%d %s ",$no,$pds[$v]);
	if(($rcs == 1)&&($v >= 1)&&(($cur_tm-$_tm) > 0)) $x .= time_ago($_tm);
	return $x."ago";
}

To use it, echo newTime(1264837797);. It’ll return “56 minutes ago”.

Right now this site is powered by Wordpress, a second release for the custom publishing system is to be released soon. The development started quite some time back. I remember the first version, I was working on it fast, till I didn’t notice all the bugs that appeared after some time.

I’ve added a log in system, meaning that it won’t be using Apache’s log in system. Reduced the code by 45%. Recoded everything from scratch, I’ve also paid a lot of attention to the front page. It would give a user much more experience.

In the being time, I’ve also added a mobile site. It means if you load up my site on a mobile device, it’ll redirect you to a mobile compatible site. I’ve also integrated it with cookies, so you’ll have a choice to either stick with the full site or get redirected to the mobile site.

You might not notice anything new on the front page, but I’ve fixed some of the XHTML and CSS code to bring improvements. The mobile site is just plain simple, while the iPhone site has a little bit more in store.

Another major improvement is that I’ve added in pagination to all pages which displays post and comments. This would reduce the server load. I’ve also added an Author page so that you can view posts by a single author.

Here are the previews:

Avatar, the movie that took roughly 15 years to create was only pulling in 27 million on its first day while Twilight Saga: New Moon was pulling in $72 million and Transformers, $68 million. Directed by James Cameron, it was sure to be a mind-blowing movie. Now according to TechCrunch(and Wikipedia), Avatar is now nearing $400 million in worldwide box office ticket sales.

The title, ‘Avatar’ was trending for almost a whole week on Twitter. Many had to comment on it, and 75% of everyone on Twitter are commenting that it was awesome, kick ass or amazing.

You could view more comments by just going to Twitter and doing a simple search on ‘Avatar’, you’ll see a few comments stating that it was awesome and a minority saying it was just ‘ok’.

And.. the year is almost over. Time moved fast, never realized that I was only 5 days more to a totally new year. Many things happened this year. A few are, I got my first web-site in 2009 and got to learn many interesting programming languages.

A new year leaps ahead of us, only in another 6 days. Its going to be a great year that I’m really looking forward to. With that I wish everyone a Merry Christmas, Happy Holidays and Happy New Year!

Though many other people that are still in the process of learning languages would wish that they could learn it much more faster, but I wouldn’t. Next year is a very important year for me. I’ll be sitting for my ‘PMR’ exams. I wouldn’t be much on the computer and would be spending most of my time with my books.

This might be my last post too. So Happy New Year to everyone!