Joyride for Tabula Rasa

[itsanooray]

Click images above for Image Previews - Live Preview Title: Joyride Credit to: betterdolphin Base style: Tabula Rasa Type: CSS Best resolution: Made on 1280 x 1024, should work at a minimum of 1024 x 600 (netbook) Tested in: IE7-9, latest Firefox and Chrome (see post for notes on IE) Features: 6 different colors (though you're free to edit) and fixed side menu EDIT There was an issue with the profile userpic being distorted on phones/some browsers, I have fixed it, so please grab again if you want! Find it all here!

Comments

[foxfirefey]

The green is so springy!

[itsanooray]

haha, thanks!

[ukefied]

Took the brown version! Love what you did with the userpic inserts.

[itsanooray]

Why thank you!

[got_swagger]

Snagged the blue version!

My only problem is that my default user pic stretches on my screen (my computer has a widescreen). Is there any way to fix this that doesn't involve hiding the default user pic?

[itsanooray]

How do you mean stretches on your screen? What's your resolution and/or can you take a screenshot and show me.

[got_swagger]

It's not a circle like the entry icons, it stretches downwards into kind of an oblong shape.

The work computer I'm using has a resolution of 1680 x 1050 and my personal computer has a res of 1920 x 1080.

I tried to take a screenshot, but it's not letting me.

[got_swagger]

And does the same on my iPhone.

[itsanooray]

AH I assume you're on a mac or use safari on your desktop then? I just opened it in Safari and lo it's doing what you're saying. Try what I said and see if that works, and I'll have to tweek my css later, as I'm at work too haha.

[got_swagger]

I use a Dell at work with Firefox and on my Mac I use Firefox and I use Safari on my iPhone. I tried the tweek you gave and it worked!

[itsanooray]

How weird, it works fine in my firefox and I haven't heard any other issues. I'm just going to assume it has to do with the resolution. I'll just have to switch to px instead of percentages. :|a

[itsanooray]

I'm assuming it's because it's using percentages to resize it, though that's weird yours would be doing that, but then again I don't have a screen large enough to test that.

So what you can do is find this in the CSS:
#secondary .userpic img {
border-top: 1px solid #EACEDC;
border-bottom: 2px solid #541D38;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 30px;
width: 30%;
height: 30%;
}

And change the percentages to whatever px size you want your icon to be, like the normal size is:
width: 100px;
height: 100px;

I was going for something small in the sidebar though, so maybe try
width: 50px;
height: 50px;

I hope that helps

[got_swagger]

PERFECT!

I changed it to 75px and it's perfect on both my computer and my iPhone!

And really, this layout it gorgeous!

[syntheid]

Ooooh, I love this. I'm using the blue one for now.

ETA: Oh, so I checked it out on my phone, Android, using Dolphin as a browser and it was doing the funny resizing on my userpic too. Did the fix you posted above and now it seems okay, but thought I'd let you know.

[itsanooray]

Sure, thanks a lot! :3

[chrestomanci]

This is so neat! I love the circle user pic effect.

[itsanooray]

Thank you :)

[brisus]

I love green and black layouts--nice job!

[sourcherry]

I love this, added to memories! ♥

[caecelia]

Beautiful! Just snatched the blue one and am very happy. <3