Recent Topics

Members
Stats
  • Total Posts: 10,749
  • Total Topics: 1,374
  • Online today: 313
  • Online ever: 879
  • (Jan 21, 20, 05:49:15 PM)
Users Online
Users: 0
Guests: 281
Total: 281

A blue Flagrantly?

Started by voyager, Jun 06, 11, 02:51:21 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

voyager

How hard would it be to change the red colors of this new theme to blue?

ZarPrime

#1
Well, it would be pretty difficult.  It would be almost like a new theme as all of the background images would need to be redone.  For instance, the main_block.png image for this theme looks like this ...

Changing all the colors in a theme is not as simple as just changing a few css color hex codes as you might think it is.

ZarPrime

voyager

I understand that I'd need to change all of the red text in the css and the red bars in the main_block.png (how do I do that btw?) but what else would I need to do?

ZarPrime

#3
Well, there are more images than just that one that would need to be done.  Best thing I could tell you would be to look, assuming you have the theme downloaded, at the images inside the Themes/Flagrantly/images/theme/ folder on your site, or you could extract the zip file and find all the images and see which ones would need to be changed.

All I'm saying is that manipulating some of these images would be tricky as most of them consist of gradients rather than solid colors.  Maybe Crip or Maxx can give you some pointers on this better than I could.

Out of curiosity, have you looked at some of the other themes that Crip has available for download here?  There are some very nice blue ones.  Maybe one of those would suit your needs.  You might want to look at the various themes on the demo site.  There is a dropdown at the top to select the different themes.  Here's the link --> http://www.jpr62.com/demos/

ZarPrime

Maxx

Yes as far as the images, they will need to be download to your local drive and edited with either Photoshop, or Fireworks or another Image editor, as ZarPrime mentioned these are some what touchy and care needs to be taken, not to miss align any of them.

Image and Fonts colors may need to be changed to keep with the color scheme!

If you do not have the tools or know not how to do these things, then you'll need to request a custom job or like Zar mentioned, chose another theme and there are many od various colors scheme to chose from! (FREE)

Jeff will not charge much for a custom job if you decide to go in this direction.

regards,
Maxx

voyager

http://e-p1.net/forum/

If you can figure out how to set it to theme #67, you can see the changes I've made so far.

Looks like the main problem I've got is the navbar, it doesn't like to be changed. Any ideas?

Maxx

Here is the CSS code you need to play with:
index.css

#toolbar {
    background: url("../images/id/toolbar.png") repeat-x scroll 0 0 transparent;
    height: 35px;
    margin-top: -3.5em;
}
#topnav {
    height: 35px;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1000;
}
#topnav ul {
    margin: 0;
    padding: 0;
}
#topnav li {
    float: left;
    list-style: none outside none;
    margin: 0;
    padding: 0 0 0 2px;
    position: relative;
}
#topnav li a {
    color: #7C7C7C;
    display: block;
    font-size: 11px;
    line-height: 35px;
    padding: 0 16px;
}
#topnav li a.active {
    background: none repeat scroll 0 0 #DBE2EA;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    color: #556272;
    display: block;
    font-weight: 900;
    margin-left: 6px;
    padding: 0 15px;
}
#topnav li a:hover, #topnav li:hover a, #topnav li.sfhover a {
    background: url("../images/theme/ative.png") no-repeat scroll 50% 0 transparent;
    color: #5A6C85;
    text-decoration: none;
}
#topnav li:hover li a, #topnav li ul li a:hover {
    background: url("../images/theme/transbg.png") repeat-x scroll 0 0 #E4EAEF;
    color: #5A6C85;
}
#topnav li li {
    height: auto;
    padding: 0;
    width: 200px;
}
#topnav li li a, #topnav li li a:hover, #topnav li li a, #topnav a.active li a, #topnav li:hover li a, #topnav li.sfhover li a {
    background: none repeat scroll 0 0 transparent;
    color: #777777;
    font-size: 11px;
    font-weight: normal;
    height: 30px;
    line-height: 30px;
    margin: 0;
    text-transform: none;
}
#topnav li ul {
    background: none repeat scroll 0 0 #F6F8FA;
    left: -999em;
    margin-left: -1px;
    position: absolute;
    width: 200px;
}
#topnav li ul ul {
    margin: -27px 0 0 195px;
}
#topnav ul li li:hover, #topnav ul li li.hover {
    position: static;
}
#topnav li:hover ul ul, #topnav li:hover ul ul ul, #topnav li.sfhover ul ul, #topnav li.sfhover ul ul ul {
    left: -999em;
}
#topnav li:hover ul, #topnav li.sfhover ul {
    left: 3px;
}
#topnav li li:hover ul, #topnav li li li:hover ul, #topnav li li.sfhover ul, #topnav li li li.sfhover ul {
    left: 0;
}


and question just ask and the theme looks good so far friend!

Note thata you'll see in the code what image need changes!

regards,
Maxx

willemjan

Yeah, that looks nice! Good luck with the latest bits an pieces ;)

voyager

Alright, I got the colors right, but there's a few small other things I'm wondering if you can help me with (it's not that I wouldn't love to contribute to Crip and have him make me one, but I can't afford it right now).

- I can't set a fixed width (it automatically fills my entire window...I'm assuming it's because I'm using an RC5 theme on RC4?) so can I fix that?

- I love this theme (hence why I'm putting so much work into it) but is there a way to put the quick login on the top right of the forum page instead of just the links? I'd just copy the code over but I don't know where to look for it.

voyager

Oh, one more thing, how do you replace the character on the linktree? Some themes have one that works (such as Threads), but this one shows up as a box on my limited character set, so I'd prefer to use one that has a better chance of being more universally recognized.

E-P1.net - The Original Micro Four Thirds Community � Who's Online