color crazyness and CSS

Ive been doing some patching to improve CSS support around the site. There are various new classes (add-root-blurb, addnewform, add-title, add-text) and a few new User Settings to tweak. The main change was to how color is supported in the Recently Active Threads. Instead of using font tags for the color blend, dynamically generated style content is used. This means that you can tweak things in your CSS with the main advantage being you can specify how visted links will look.

As part of this support there is a new section in User Settings for controlling Recently Active Threads styling. The first is that you can now specify your own color points for the blend. So for instance putting "00F;0F0;F00" in there will make a Blue to Green to Red transition. You can also override the color blend generation by putting your own style in the text box provided. A third textbox contains the color blend styling from the last view of the R.A.T., this box does nothing but does provide you an up to date template of the current styles used in the RAT so you can easier customize each one.

A nice feature of the CSS textbox is that it will be treated as CSS content and wrapped in a stlye tag unless it already contains a style tag. This means you can put non Style data in this box as well as style data and it will be displayed verbatim on the page. This would probably be useful for those of you that want to add custom javascript to the RAT but don't want to pollute your Personal Nodelet or Free Nodelet to do it.

Anyway, I also recommend a wander over to PerlMonks CSS Examples to see whats available. Also if you have CSS to contribute please do it there. If you have requests for changes to the site to support some aspect that you can't control via CSS right now make them in reply to this node here (not in the style thread) or /msg pmdev. Thanks

---
demerphq

_{First they ignore you, then they laugh at you, then they fight you, then you win.

-- Gandhi

Flux8}

Comment on color crazyness and CSS

Replies are listed 'Best First'.
Re: color crazyness and CSS by grinder (Bishop) on Oct 23, 2004 at 12:37 UTC
some aspect that you can't control via CSS right now One thing that would be sweet is a `<div class="readmore">` for readmore sections. If that existed, it could have a lightly-tinted bgcolor, which would then let you know if a long node that was worthy of being FPed could be so, rather than pushing it through an Edit consideration to have that applied. I mean, it would avoid you having to look at the node from the point of view of the section front page, saving you a pageview. - another intruder with the mooring of the heat of the Perl	[reply]
Re^2: color crazyness and CSS by demerphq (Chancellor) on Oct 23, 2004 at 13:31 UTC
Funny, i was just working readmores the other night so i finished that off and added your request. Readmore tags now get converted to div tags with class="readmore" if the content isn't being removed. You can see this effect on Hanoi Challenge. Also it now shows the size of the removed content in bytes and allows a "title" attribute. pmdevils can enhance the behaviour through handle_readmore. Read more... A bit more, not much (44 Bytes) `div.readmore {background-color: #eee;}` [download] --- demerphq _{First they ignore you, then they laugh at you, then they fight you, then you win. -- Gandhi Flux8}	[reply] [d/l]
Re^3: color crazyness and CSS by grinder (Bishop) on Oct 23, 2004 at 17:40 UTC
Hows that for service eh? :-) And on a Saturday afternoon too! Make me more than happy. Read more... (420 Bytes) - another intruder with the mooring of the heat of the Perl	[reply] [d/l]
Re^4: color crazyness and CSS by demerphq (Chancellor) on Oct 23, 2004 at 17:46 UTC
Re: color crazyness and CSS by hossman (Prior) on Oct 24, 2004 at 22:19 UTC
If you have requests for changes to the site to support some aspect that you can't control via CSS right now make them in reply to this node here As mentioned before in the Recently Active Threads announcement: a new div tag arround the top section would be cool, and special span's and class names for the various codes would help make the page extremely configurable.	[reply]
Re^2: color crazyness and CSS by demerphq (Chancellor) on Oct 25, 2004 at 08:12 UTC
Ok, this was actually mostly done when you posted this, you didn't check silly hacker :-) Anyway, I added the top and bottom sections today and heres a list of what you can use: Read more... CSS Node/Class-Id Breakdown (2 kB) Im open to specific requests to change or enhance things if people can provide that. For instance I'm hoping that what I've done for the codes meets your requirements. --- demerphq _{First they ignore you, then they laugh at you, then they fight you, then you win. -- Gandhi Flux8}	[reply]
Re^3: color crazyness and CSS by hossman (Prior) on Oct 27, 2004 at 07:08 UTC
this was actually mostly done when you posted this, you didn't check silly hacker I checked, i just didn't check very closely. :) nodethreads-head and nodethreads-foot are extremely appreciated. The classes you've added are also very cool for tweaking the way the individual elements look (I've started using a few, but i'm sure i'll find ways to use/tweak the others over time), but there was one part of my initial suggestion that I think you missed (and looking at it now, would probably be the most usefull)... It would also be handy if the information about your vote, front paged, and approved was used in making class names for a span tag arround the whole line -- so that people can highlight nodes that have cetain properties. For example, someone might want all nodes that they have down voted to be striken, all nodes that have been front paged to be in a bigger font size, all nodes that are not approved to be blinking, the number of descendents of each node in italics, and the number of nodes in the selected set to be shown in plain font (instead of bloded as it is now) For example, given the list of classes that exist the individual pieces of data, imagine a corrisponding version of (most of) them that includes "-line-" for use on the whole "p" of the line (I orriginally thought it would make sense on the "li", but you don't want it to apply to the subtree)... <!-- suppose this node is unapproved, and i downvoted it --> <li id='li999999' class='nnt-depth-1 nnt-auth-123291'> <p class='nnt-p-title nnt-p nnt-line-unapproved nnt-line-minusminus' align='left'> ... <!-- all of the existing stuff per node --> ... </p> ... <!-- the subtree of the node (if any) --> ... </li> <!-- suppose this node is frontpaged, and i upvoted it --> <li id='li888' class='nnt-depth-1 nnt-auth-123291'> <p class='nnt-p-title nnt-p nnt-line-approved nnt-line-fplink nnt-line-plusplus' align='left'> ... <!-- all of the existing stuff per node --> </p> <!-- the subtree of the node (if any) --> </li> [download] And then people can setup CSS like this... `.nnt-noderep { font-style: normal; font-weight: bold; color: red; } .nnt-line-minusminus { text-decoration: line-through; } .nnt-line-unapproved { text-decoration: blink; } .nnt-line-fplink { font-size: larger; }` [download]	[reply] [d/l] [select]
Re^4: color crazyness and CSS by demerphq (Chancellor) on Oct 27, 2004 at 22:28 UTC
Re^5: color crazyness and CSS by hossman (Prior) on Oct 28, 2004 at 06:52 UTC


go ahead... be a heretic
	PerlMonks