1. YAF.NET Support Forum
  2. YAF Community
  3. YAF Themes, Modifications and UI
  4. 1.9.6 RC1 - CSS questions
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-11T20:29:15Z
I have now upgraded my forum to 1.9.6 RC1, works quite ok.

However, the topic title header is acting up in an interesting way.

It has always been white for me earlier, but it seems like it is now depending on some new CSS element tag.
Since it now also seems to be a link, I am a bit confused since it shows up with dark grey in my topic header, and in blue if I use the Red-Grey theme - ie it seems to be unadressed in the Red-Grey CSS theme too...

Any help in pinpointing me to the property to be set is appreciated.

JP attached the following image(s):
topicheader.JPG
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
Sponsor
tha_watcha
2012-02-11T20:36:28Z
You need to define the text color for that link, otherwise its overriden by the default link text color

.yafnet a.HeaderTopicLink {
	color: white!important;
}

add this to your theme.css and the link should be white again
UserPostedImage
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-11T22:01:24Z
Does not seem to work, still the same... 😟


Edit:

Ok, seems better now when I moved it around.... 😉 

.yafnet a { color: #000000; text-decoration: none; }
.yafnet a:link { color: #333333; text-decoration: none; }
.yafnet a:visited { color: #333333; text-decoration: none; }
.yafnet a:active { color: #333333; text-decoration: none; }
.yafnet a:hover { color: #cc0000; text-decoration: underline; }
.yafnet a.HeaderTopicLink {color: #FFFFFF; }

Thank you very much!!! 👍
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
tha_watcha
2012-02-11T22:09:17Z
Originally Posted by: JP 

Does not seem to work, still the same... 😟



Is see you forget the important i see that in your theme.css

.yafnet a.HeaderTopicLink {
    color: #FFFFFF;
}

as soon as i add the important to your theme via dom manipulating it works

Quote:

Ok, seems better now when I moved it around...



Yeah that would be the better solution
UserPostedImage
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-11T22:15:23Z
"Important" does not seem to matter.....

But now it works with the code I showed... Will just have to put a :hover to it too so it doesn't get underlined when moused over..

Edit:. Works perfectly now... 

.yafnet a { color: #000000; text-decoration: none; }
.yafnet a:link { color: #333333; text-decoration: none; }
.yafnet a:visited { color: #333333; text-decoration: none; }
.yafnet a:active { color: #333333; text-decoration: none; }
.yafnet a:hover { color: #cc0000; text-decoration: underline; }
.yafnet a.HeaderTopicLink {color: #FFFFFF; }
.yafnet a.HeaderTopicLink:hover {color: #FFFFFF; text-decoration:none; }
JP attached the following image(s):
topicheader2.JPG
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-12T19:32:37Z
And now I am confused...

I have a several URL:s pointing to the same place...

How can it be different, same forum, same CSS??? Is it a browser cache thingy?



Edit - Was a browser cache thingy - Obviously the page/theme is saved locally per site somewhere...
JP attached the following image(s):
url1.JPG
url2.JPG
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-19T19:52:24Z
Have made a new more serious effort with the CSS design for 1.9.6 RC1 since the current "live" sheet on my site originates from 1.9.4, adjusted to 1.9.5(.5) and really needs an overhaul....

Will ask many questions about specific elements later, but have one big issue at the moment...

It's that darn "tiptip" stuff in the CSS....
Great, but it messes up big time since it doesn't keep itself within the forum control but also "attacks" ul & li on the page outside the scope on the forum with tooltips from the forum. I can see that it works in this forum, but how do I make it work just as good in my forum?

I suppose I have to restrict it to the yafnet object space, but I do not know how. I stink at CSS... 😉

Any help is appreciated.
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
tha_watcha
2012-02-20T00:26:44Z
Originally Posted by: JP 

Have made a new more serious effort with the CSS design for 1.9.6 RC1 since the current "live" sheet on my site originates from 1.9.4, adjusted to 1.9.5(.5) and really needs an overhaul....

Will ask many questions about specific elements later, but have one big issue at the moment...

It's that darn "tiptip" stuff in the CSS....
Great, but it messes up big time since it doesn't keep itself within the forum control but also "attacks" ul & li on the page outside the scope on the forum with tooltips from the forum. I can see that it works in this forum, but how do I make it work just as good in my forum?

I suppose I have to restrict it to the yafnet object space, but I do not know how. I stink at CSS... 😉

Any help is appreciated.



You need to modify the script that enables tiptip and restrict it to yaf

jQuery(".yafnet img, .yafnet input, .yafnet a").tipTip();

UserPostedImage
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-20T17:50:13Z
And which script could that be?
I'm using the Red-Grey theme as the base theme...

I'm afraid I have to ask since I know virtually nothing about this jquery stuff... 😞
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
tha_watcha
2012-02-21T00:13:55Z
Originally Posted by: JP 

And which script could that be?
I'm using the Red-Grey theme as the base theme...

I'm afraid I have to ask since I know virtually nothing about this jquery stuff... 😞



If you use my red-grey theme as base take a look in the js folder of the theme there is the ColorGrey js file, simply replace the first line that contains the tiptip code. (Dont forget to clear the Browser Cache to see the changes)
UserPostedImage
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-21T17:19:57Z
Replaced the first statement that ended with ".tiptip" and it got a little better...

But tiptips still show on my ul/li menu at the top....

It behaves differently though, earlier it showed the tiptips of the forum mymenu - now it shows the last hovered tiptip in the forum on all links in my main menu.

A step in the right direction, but not completely there yet...

Edit: Hmmm.... I removed the .tiptip statement in the colorgrey.js and it kinda "works" - ie tooltips only shown in the forum links. But of course no fancy .tiptip formatting so I miss the little red arrow shown in the attachment....

This will have to do for the moment.
JP attached the following image(s):
tiptip1.png
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-24T19:40:36Z
As I'm working with the Red-Grey theme as the base for the 1.9.6 RC1 looks for the site, I have come to the conclusion that much of the stuff does not work in IE.... 😞

Those fancy CSS color gradient thingies for bars and buttons work great in FF, Chrome & Safari - but not IE....

So to keep a consistent look with minimal maintenance, I will have to go back to background images in bars & such to keep it as simple as possible in a baseline.

But I did have fun with playing around with imageless CSS-only and learnt stuff I did not know. Worth the effort.

Since none of the supplied themes really works for me, would it be ok if I upload my simpler theme files in a post here when I'm finished?


More questions about specific CSS elements will probably appear this weekend... Want to get it right this time without compromises... 😁
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
tones
  •  tones
  • 55.4% (Neutral)
  • YAF Camper
2012-02-24T20:06:36Z
Originally Posted by: JP 

As I'm working with the Red-Grey theme as the base for the 1.9.6 RC1 looks for the site, I have come to the conclusion that much of the stuff does not work in IE.... 😞

Those fancy CSS color gradient thingies for bars and buttons work great in FF, Chrome & Safari - but not IE....

So to keep a consistent look with minimal maintenance, I will have to go back to background images in bars & such to keep it as simple as possible in a baseline.

But I did have fun with playing around with imageless CSS-only and learnt stuff I did not know. Worth the effort.

Since none of the supplied themes really works for me, would it be ok if I upload my simpler theme files in a post here when I'm finished?


More questions about specific CSS elements will probably appear this weekend... Want to get it right this time without compromises... 😁



Please do that! Would be great with some simple theme as well! :-d

Edit: Ett par glas fint vin får vi ha på fredagen - SKÅL! :wink:
tha_watcha
2012-02-24T20:06:58Z
Originally Posted by: JP 

As I'm working with the Red-Grey theme as the base for the 1.9.6 RC1 looks for the site, I have come to the conclusion that much of the stuff does not work in IE.... 😞

Those fancy CSS color gradient thingies for bars and buttons work great in FF, Chrome & Safari - but not IE....



That's not fully true, I included background images for most of the gradients as fallback for ie 8 or earlier, there is also a CSS property that can be used for ie 6-10 that supports gradients. But i didn't included them yet.
UserPostedImage
JP
  •  JP
  • 100% (Exalted)
  • YAF Leader Topic Starter
2012-02-24T20:32:17Z
Ok, but even IE9 only takes the background image with the current Red-Grey as I see it...

Of course the bg images act as a fallback with IE, but my main thought is to have a theme that works everywhere without having to resort to adapt different code for different browsers (had enough of that in the old IE vs Netscape days...) so I go for the common denominator for a theme that should work as good as possible everywhere...

Nothing wrong with the fancy stuff, that's how the future is, and a great insight into how it can be done is shown. I myself am more "practically orientated" and wish to do one basic theme that "fits all" with minimal maintenance, so to speak... 😄

Please note, I am not complaining about anything - just trying to learn... It's not about the theme itself, which works fine, but how I wish to make it look like I want to for my site with minimal maintenance efforts from my side... 😉
He who asks a question is a fool for five minutes. He who does not ask a question remains a fool forever. [Old Chinese Proverb]
 Atom Feed Rss Feed
Similar Topics
Users browsing this topic
    1. YAF.NET Support Forum
    2. YAF Community
    3. YAF Themes, Modifications and UI
    4. 1.9.6 RC1 - CSS questions
     

    About Us

    The YAF.NET is an open source .NET forum project. YAF.NET is supported by an team of international developers who are build community by building community software.

    Powered by Resharper Donate with PayPal button

    Project Twitter Updates

    Useful Links

    Our Contacts

    www.yetanotherforum.net

    Copyright © YetAnotherForum.NET & Ingo Herbote. All rights reserved