Skip navigation.

Technolosity

Random rant about technical things.

Posts tagged with "css"

What if Digg was made by Girls

, , ,

There was an article on Digg which gave me an idea to make custom User Style in Opera to resemble the girls' version of Digg.

I used basic CSS to replace some colors and a lot of CSS3 selectors to replace some texts and give happy colors for the comments. This is why this stylesheet works the best in a browser supporting CSS3.

How the heck do I use this in Opera?
I'm going to tell you how to enable this stylesheet on Opera 9.5. If someone have an idea how to enable these on any other browsers (preferably supporting CSS3), please send a comment.

  1. Download digg-by-girls.css and save it to <your Opera directory>\profile\styles\user\
  2. Open Opera and go to Digg's website
  3. Right-click on the background, select Edit Site Preferences...
  4. Open Display tab
  5. Under the My Stylesheet, browse to that file you just saved.
  6. Now refresh the page
And there you go! Now the only problem I had with this CSS was that this stylesheet makes your profile icon disappear on the top.

If you want to make your own version, I'll give you few tips.

Custom version
Basically you should know CSS markup, but if not, now is your time to learn.
  1. Duplicate girls-by-digg.css and rename it to, for example, digg-custom.css
  2. Restart Opera to show the new file it in the stylesheets list
  3. Now select digg-custom.css
  4. Note that using stylesheets this way affects all the sites you visit.
  5. Make changes in the stylesheet and reload stylesheets (see below)

Make stylesheet editing faster
I myself am using a keyboard shortcut to reload edited CSS file. Without this function you'd have to restart Opera after changes, so it makes things faster.

  1. Go to Preferences -> Advanced -> Shortcuts -> edit Keyboard shortcuts.
  2. Now you can decide which keyboard shortcut you want to use to reload styles, I used ctrl-q
  3. Quick-search for "q ctrl" and if it's used, delete it
  4. Select application and click new and write "q ctrl" (or whatever you want)
  5. On the action, enter "Reload stylesheets"
  6. Now everytime you press ctrl-q, Opera reloads stylesheets from the drive, which makes stylesheet editing faster

That's all for today.

digg-by-girls.css

Download Opera, the fastest and most secure browser
January 2010
M T W T F S S
December 2009February 2010
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31