THT Community
Abstract Theme - Printable Version

+- THT Community (https://thehostingtool.com/forum)
+-- Forum: THT Resource Center (https://thehostingtool.com/forum/forum-13.html)
+--- Forum: Style Center (https://thehostingtool.com/forum/forum-14.html)
+--- Thread: Abstract Theme (/thread-520.html)



Abstract Theme - Jonathan - 11-23-2009

Hello everyone!

Just put together this abstract theme!


Features:
Mouse over images - When you hover over items in the menu it will light up

Professional photoshopped background

A menu to make the hover over / menu items look good


You CANNOT install this theme from the administrator control panel!

-How-to install-
1. Go to /themes in your THT installation directory
2. Upload the zip called "Abstract - JonathanT.zip"
3. Extract the ZIP file to a directory called "/abstract/"
4.Go to your administrator control panel
5. Click on "Look and Feel"
6. In the selection menu select "abstract" then press APPLY.
7. Done!

Notes:
The mouseover image cannot stretch to how long your menu item name is, So use this special character to make MORE spaces or decrease your character count as much as possible for it to work.
This character: " " It's not just a SPACE made by the space bar, It is a BLANK character that still counts!

Want to remove the mouseover images because you're unable to adjust?

Open up style.css in >Themes > Abstract then search for "active" remove the line below it saying:

"background:url(<IMG>mouseover2.png) no-repeat;"



-Screenshot-
http://www.upffs.com/files/744_screenshot.png

Download:

Download is attached to this post.

-Credits-
Whoever made Reloaded2 ( I took a bit of CSS code (Hope you don't mind Sad )
Mouseover / BG image - Jonathan
Jonny - For making THT!


RE: Abstract Theme - Kevin - 11-23-2009

Very nice! Big Grin


RE: Abstract Theme - macaws - 11-23-2009

That background gives me De Ja Vu... I swear I've seen it... Anyways, nice. nice. Smile


RE: Abstract Theme - Nick - 11-24-2009

hmm, for a workaround to the mouseover images in FF3 and Safari, you can make the mouseover background a single pixel wide bar the height of your current mouseover image and then use:

background: #CCC url(Images/top_bg.png) repeat-x;

replcaing the image there with your single pixel image. Then just use:

-moz-border-radius: 10px;
-webkit-border-radius: 10px;

replacing the 10px with the radius of your border curves. all of this code goes where your current mouseover css is.

Nice theme, nonetheless.


RE: Abstract Theme - Jonathan - 11-24-2009

Thanks alot guys,

@Nick, Wouldn't that kill off the rounded edges?

I know the method of making a 5x5 image for a background/button using a gradient, etc. However it's hard to use edges on buttons w/ repeating.


RE: Abstract Theme - Nick - 11-24-2009

no, thats what the border-radiuses do. however, that method will only work in FF3 and Safari, because IE doesn't support CSS3. because of this, you might want to leave the current method in an IE conditional comment for the IE users.


RE: Abstract Theme - Jonathan - 11-25-2009

Hmm!

Maybe add a system on CSS e.g <----IF IE---> Show StyleIE.css, maybe...


RE: Abstract Theme - Kevin - 11-25-2009

(11-24-2009, 10:52 PM)Nick Wrote: no, thats what the border-radiuses do. however, that method will only work in FF3 and Safari, because IE doesn't support CSS3. because of this, you might want to leave the current method in an IE conditional comment for the IE users.

It should also work in Chrome because it's webkit based. Wink


RE: Abstract Theme - Jimmie - 12-05-2009

Well, if you want an exhaustive list,

Gecko (-moz): Firefox (Nightly builds like Namoroka, Shiretoko, Minefield also), Epiphany Gecko, Flock
WebKit (-webkit): Google Chrome Frame, Google Chrome, Chromium, Safari, Midori, WebKitLauncher