Beefy Boxes and Bandwidth Generously Provided by pair Networks
Syntactic Confectionery Delight
 
PerlMonks  

User CSS Repository

by radiantmatrix (Parson)
on Dec 02, 2004 at 15:41 UTC ( #411806=monkdiscuss: print w/ replies, xml ) Need Help??

I was inspired by Aristotle's Perl-Blue theme; by indicating /index.pl?node_id=167905&displaytype=displaycode in one's User Settings (under Link to External CSS stylesheet:), one can use Aristotle's theme. There has been some discussion before about a way for users to submit CSS for other Perlmonks to use.

I would suggest a section, if the Gods so choose. But, otherwise, why not just make this node the home node for a User CSS Repository? Post your theme CSS in code tags as a reply, and we will quickly have a list of interesting themes that we can use simply by linking to "/index.pl?node_id=id&displaytype=displaycode"

Be sure that you have only the one code block containing the CSS, and that includes making sure code blocks in your signature are trimmed out for this thread...

Comment on User CSS Repository
A Soothing Green Theme I've been using
by radiantmatrix (Parson) on Dec 02, 2004 at 15:50 UTC

    Here is a green theme I've used for a while. It is based upon the Green Web Safe Theme in User Settings. It includes code boxes and an indication of what is covered by ReadMore tags.

    body { color: #000000; background-color: #F3F3F3; } td { color: #000; } tr.titlebar { background-color: #8ccf8c; } tr.section_title { color: #333333; background-color: #acefac; } td.section_title { color: #333333; background-color: #acefac; } tr.post_head, tr.highlight { background-color: #CCC; } td.titlebar { color: #333333; } table.nodelet_container { background-color: #030; } a:link { color: #060 } a:visited { color: #666 } a.titlebar:link, a.titlebar:visited { color: #333333; } tbody.nodelet td, td.nodebody { background-color: #FFF; } tbody.nodelet th, th.nodehead { color: #333333; background-color: #8ccf8c; } tbody.nodelet th a:link, tbody.nodelet th a:visited { color: #FFF; } .code { display: block; background-color: #dce2dc; color: inherit; border-top: 1px solid #ddffdd; border-left: 1px solid #ddffdd; border-right: 1px solid #334433; border-bottom: 1px solid #334433; //margin-left: 1em; padding: 1em; } .pmsig { background: #e6e6e6; border-top: 1px solid #777777; border-left: 1px solid #777777; border-right: 1px solid #ffffff; border-bottom: 1px solid #ffffff; } .readmore { display: block; background: #ecf2ec; color: inherit; border: 1px dashed #334433; padding: 3px; }
Re: User CSS Repository
by Roy Johnson (Monsignor) on Dec 02, 2004 at 17:41 UTC
    why not just make this node the home node for a User CSS Repository?
    I think that was the intent of the thread in which Aristotle's code appeared.

    ++ for the idea of how to use code-display as a CSS URL, though.


    Caution: Contents may have been coded under pressure.

      Cool and all, but my title is better. ;-)

      Seriously, though, I would love to see a section -- even if it is just a "hidden" section accessible from a link on the User Settings page -- devoted to collecting CSS themes for PM.

      radiantmatrix
      require General::Disclaimer;
      s//2fde04abe76c036c9074586c1/; while(m/(.)/g){print substr(' ,JPacehklnorstu',hex($1),1)}

      Credit for the idea goes to jeffa, though.

      Makeshifts last the longest.

Re: User CSS Repository
by hossman (Prior) on Dec 02, 2004 at 20:12 UTC

    perhaps, better still, some inclined pmdev'er might consider adding a User Setting " make my CSS public" and another user setting: "use _______'s CSS" showing a pulldown of all monks who have made their CSS public for you to try out.

    That way monks wouldn't have to remember to update this thread (or a new section) anytime they added somethig cool to their custom CSS.

      ++hossman! I see two ways this could work:
        Filling in the Monk Name would simply link to the other's CSS, leaving you vulnerable to what the other monk did to his CSS.
      or
        The CSS code would be copied into your settings with no further connection to the original.
      I think I would prefer the latter, though others may disagree.

      -Theo-
      (so many nodes and so little time ... )

      Ive had plans to implement something like this for some time. Other things have priority, but I think its workable. However it would involve a new nodetype (something like a code node) and some other features so it will probably be some time before I do.

      Ideally id like it that when directly viewing a node of this new type it overrides all other CSS involved. Again, ive not had the tuits to do a feasability analysis yet.

      ---
      demerphq

Fun with Aristotle's Perl-Blue theme
by radiantmatrix (Parson) on Dec 02, 2004 at 21:04 UTC

    I know, I know... this is starting to be odd. But since poking around for CSS themes, I have developed a sick fascination with them. ;-)

    Here's a modification of Aristotle's Perl-Blue theme. The monospace fonts are set small because I use ProFont Windows. Still, they should work pretty well. Comments welcome, of course.

    Most of the modification is with input fields: making them nice and wide for those of us using higher resolutions with programmer-tiny fonts. ;-) Also, I added some things to account for new PM features, like the ability to highlight sections placed in readmore tags. A nice separator for sigs is included, as well.

    body { color: #000; background-color: #eee; font-size: 10pt; font-family: "Bitstream Vera Sans", Verdana, Arial, Lucida, Helvet +ica, sans-serif; } td, th { color: #000; font-size: 10pt; font-family: "Bitstream Vera Sans", Verdana, Arial, Lucida, Helvet +ica, sans-serif; } a:link { color: #036; } a:visited { color: #06c; } h3.other, h3.superdoc, h3.categorized_answer, h3.categorized_question +{ font-size: 28px; font-style: italic; font-family: Georgia, serif; padding: 10px; } textarea { height: 25em; width : 72em; border: 1px solid #ccf } input, select { margin: 3px; font-size: 9pt; font-family: "Bitstream Vera Sans", Verdana, Arial, Lucida, Helvet +ica, sans-serif; } input[type="text"] { border: 1px solid #aac; background-color: #dde; } table[bgcolor="#000066"] { border: solid 1px black; background-color: #069; } .code { display: block; border: 1px solid #ccf; -moz-border-radius: 6px; color: #06c; padding: 6px; font-size: 9pt; } .readmore { display: block; border: 1px dashed #ccf; -moz-border-radius: 6px; background-color: #ddf; padding: 6px; } .pmsig { border-top: 2px dashed #aad; } .vote { border: 1px solid #dde; } .vote tt { font-size: 7pt; } .vote input { height: 15px; } td.section_title { color: #fff; background-color: #069; font-size: 18px; font-family: Georgia, serif; font-weight: bold; } tr.titlebar, td.titlebar, table.titlebar { background-color: #069; font-size: 18px; font-family: Georgia, serif; } table.nodelet_container { background-color: #069; } tbody.nodelet th, th.nodehead { color: #fff; background-color: #069; padding-right: 0.5em; text-align: right; } tbody.nodelet td, td.nodebody { background-color: #eee; } #approval_nodelet input[type="text"], #approval_nodelet input[type="ch +eckbox"] { background: #ccf; border: 1px solid #00c; } textarea[name="note_doctext"], input[name="note_title"] { font-family: monospace; width: 80%; } .titlebar input[name="node"] { width: 28em; border: 1px solid #eee; /*background-color: #469;*/ } .addnewform input[name="node"] { width: 45em; border: 1px solid #ccf; } .spacer[height~="75"], a[href="http://pair.com"] { display: none; } pre { font-size: 9pt; } tt { font-size: 9pt; } input[name="go_button"] { font-size: 10pt; font-family: monospace; border: 1px solid #eee; }
Re: User CSS Repository
by theorbtwo (Prior) on Dec 02, 2004 at 23:57 UTC

    BTW, it's no longer neccessary to do that to use Aristotle's lovely theme -- it's been promoted to a proper theme, with a place on the drop-down in user settings. This puts much less load on PM, and is the prefered Way To Do It now. It also means that maintance can be shared amongst the pmdevils, and doesn't have to be just on Aristotle's sholders. (If you're a pmdev, remember that you can explicitly give the displaytype=viewcode parameter -- and have to, in this case.)


    Warning: Unless otherwise stated, code is untested. Do not use without understanding. Code is posted in the hopes it is useful, but without warranty. All copyrights are relinquished into the public domain unless otherwise stated. I am not an angel. I am capable of error, and err on a fairly regular basis. If I made a mistake, please let me know (such as by replying to this node).

      So it seems to be the Perl Blue Theme. Althoug something seems to be working incorrectly. After selecting a new theme and submitting, I still see the old theme. After submitting (the same user settings page) for a second time, it works.

        That's normal behavior for the settings page, unfornatly -- it doesn't actually do the settings changes until it renders the bits that change the settings, which is /after/ it's sent out the <head> of the page. Similar effects can be seen all over, including elsewhere on that same page, and on the nodelet settings page. Similar, but not quite the same, is the behavior of the approval nodelet. There is a mechanisim that could be used to fix these cases, but it's in general not worth the effort.


        Warning: Unless otherwise stated, code is untested. Do not use without understanding. Code is posted in the hopes it is useful, but without warranty. All copyrights are relinquished into the public domain unless otherwise stated. I am not an angel. I am capable of error, and err on a fairly regular basis. If I made a mistake, please let me know (such as by replying to this node).

      Thanks for the tipps. I changed my settings!
Re: User CSS Repository
by Anonymous Monk on Dec 03, 2004 at 09:15 UTC
    The gods should allow users to create css type nodes.
Re: User CSS Repository
by Mr. Lee (Scribe) on Dec 12, 2004 at 12:23 UTC
    I have now installed the Aristotle theme. I like it better than the original style. Hope your idea of the repository can be made.
Pumpkin Theme!
by radiantmatrix (Parson) on Oct 06, 2005 at 20:24 UTC

    It's October. And I like Orange. Give this theme a tickle...

    Major features:

    • code block highlighting.
    • highlighting of things in code tags and <tt> tags
    • widening of textareas for posting.
    /* PerlMonks custom CSS : Pumpkin (c) 2005 Radiantmatrix [id://375088] */ body { color: #000; background-color: #ffe9ae; font-family: tahoma, sans-serif; } td { color: #000; font-family: tahoma, sans-serif; } th { background-color: #ffae00; color: #000 !important; } tr.titlebar { background-color: #ffae00; padding: 0; margin: 0; font-size: 14pt; } tr.section_title { color: #B64234; background-color: #ffae00; } td.section_title { color: #B64234; background-color: #ffae00; } tr.post_head, tr.highlight { background-color: #EDD; } td.titlebar { color: #B64234; padding-right: 8px; padding-left: 8px; } table.nodelet_container { background-color: #B64234; } a { text-decoration: none; } a:link { color: #933; border-bottom: 1px dotted #933; } a:visited { color: #363; border-bottom: 1px dotted #363; } a.titlebar:link, a.titlebar:visited { color: #FFF; } tbody.nodelet td { background-color: #ffcd63; } td.nodebody { background-color: #FFF; } tbody.nodelet th, th.nodehead { color: #B64234 !important; background-color: #ffae00; } tbody.nodelet th a:link, tbody.nodelet th a:visited { color: #000; } td.reply-new, td.reply { background-color: #ffde87; } table#monkbar img { display: none !important; } .titlebar input { font-size: 10pt; border: 0; color: #000; } input[type=text] { font-family: monospace; background: #ffe9ae; border: 1px solid #B64234; color: #000; } textarea { width: 90%; background-color: #ffcd63; color: #b00; border: 1px solid #B64234; } p tt, li tt { font-size: 110%; color: #a00; background: #ffcd63; } .code .codetext { border: 2px dashed #700; /* border-top: 2px dashed #700; border-bottom: 2px dashed #700; */ -moz-border-radius: 0.5em; margin-left: 8px; margin-right: 8px; background: #ffcd63; color: #a00; font-size: 130%; display: block; padding: 0.25em; } .readmore { border-left: 2px dotted #733; background-color: #e0e0e0; } li { padding-bottom: 0.5em; }
    <-radiant.matrix->
    A collection of thoughts and links from the minds of geeks
    The Code that can be seen is not the true Code
    "In any sufficiently large group of people, most are idiots" - Kaa's Law

Log In?
Username:
Password:

What's my password?
Create A New User
Node Status?
node history
Node Type: monkdiscuss [id://411806]
Approved by zejames
Front-paged by Old_Gray_Bear
help
Chatterbox?
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others contemplating the Monastery: (12)
As of 2014-07-22 13:43 GMT
Sections?
Information?
Find Nodes?
Leftovers?
    Voting Booth?

    My favorite superfluous repetitious redundant duplicative phrase is:









    Results (113 votes), past polls