Comparing revisions for WikkaCSS
- [16406] 2007-04-19 08:28:21 by HxxN0s (unregistered user)
- [19078] 2008-01-28 00:14:02 by BrianKoontz (unregistered user) [Modified links pointing to docs server]
Additions:
<P class=nextbutton><A href="javascript:history.back()">
Deletions:
tutorial</A> </P></DIV>
<DIV id=footer>Footer stuff here </DIV>
<DIV id=footer2>Footer stuff here </DIV>
<DIV id=footer2>Footer stuff here </DIV></DIV></BODY></HTML>%%
==Better code rendering==
I found that bits of code sometimes are rendered hard to understand, with both loss of original indents and line wrapping. The cause is 1) inheritance of the body's "justify" text alignment, and 2) the fact that lines are allowed to wrap (overflow: auto; doesn't prevent this).
My suggested solution is the following change for the code class in wikka.css:
%%(css)
.code {
color: black;
background: #ffffee;
border: 1px solid #888;
font: 11px "Bitstream Vera Sans Mono","Courier New", monospace;
width: 95%;
margin:auto;
padding: 3px;
text-align: left; /* override justify on body */
overflow: auto; /* allow scroll bar in case of long lines - goes together with white-space: nowrap! */
white-space: nowrap; /* prevent line wrapping */
%%
(BTW, a formatter for css would be nice ;-)) - See [[http://qbnz.com/highlighter/ GeSHi!]] which several other Wikis are already using...)
-- JavaWoman
Thanks for the excellent tip above. Code formatting is looking much better..... -- JsnX
''Sorry for this late reaction. Am I the only one who found the wrapped lines much easier to read? With the new .code class, if I want to read the end of long lines in long block of codes with no line wrap I have to:
1) scroll down until I find the horizontal scrollbar,
1) scroll right to the end of the block,
1) scroll up to the line,
1) read it,
1) rescroll down to the horizontal bar,
1) rescroll left,
1) rescroll up to the line and continue reading, ---
which means 7 operations per line. I found the old version much more intuitive (to me this was one of the biggest layout improvements between wakka and wikka) and I confess I really hate horizontal bars'' --DarTar
~Heh, I generally hate horizontal scroll bars - but I hate wrapped lines of code even more! Just comment out the white-space: nowrap; rule and you should have your wrapped lines back. Do we need a vote? --JavaWoman
~If you need the original version of the code, without wrapped-lines, you just need to switch to the editable version of the page ;-p To me, the "show" method should enable an all-at-once glance to the code, not a cut&paste version, hence I'd vote for wrapped lines as a default -- DarTar
~I agree with both of you. Neither way is ideal. However I'd rather deal with the scrolling inconvenience than scan through a bunch of wrapped lines of code. *shrug* Vote: nowrap. - JsnX
~Any other votes?
~There is no way for something like a user-option (beeing unable to decide :-) NilsLindenberg
~''Possible, although in a roundabout way since our stylesheets are static, not generated. But it //might// be possible to generate a class on the code tag depending on user preference, and then tie CSS styling to that class (as opposed to styling without that class, i.e., the class would be the exception to the default). Such a user option would then need to be stored in the user table (a new column). So yes, possible (technically, at least) - but personally I think it's a bit overkill. :) --JavaWoman''
~I agree with JW and democratically acknowledge the vote of the majority - but I gonna write some private lines of code to make dartarmagically vanish any nowrap attribute while I'm logged in :) -- DarTar
~''Phew! You had me worried there with your 'Giving up' edit note. Glad to learn you're only planning a bit of underhanded "dartarmagic" (any kind of magic being fitting for "Wikka", of course!). --JavaWoman''
~I would be extremely sad if DarTar gave up. DarTar, this is your home now -- no need to ever go away to some other wiki land. Stay forever. :) Anyway.... the real reason I'm writing: how about we revisit JW's idea of having user-specific CSS? I really like this idea. Many months ago I explored this idea in Wikka's defunct sister project, [[http://www.jsnx.com/WikkaRTE/HomePage WikkaRTE]]. Double-click on the homepage, and notice the input box for page level CSS. How about we add a box to UserSettings that allows each user to enter their own CSS that could override the Wikka stylesheets? I'm sure that DarTar is not the only one who would like to customize a certain aspect of the stylesheet. -- JsnX
~''Well, of course any decent, standards-compliant browser //already// provides the user with a way to supply their own user stylesheet instead of whatever a website provides.
~Oh, wait. Not everyone **has** a decent browser or even access to one. :( But with DarTar's WikkaSkinSelector and WikkaSkinEditor and a few extensions, we're already there, I think:
~~-provide a number of basic but sufficiently different skins to choose from
~~-write-protect these
~~-create a "user styles" directory
~~-allow anyone to use the WikkaSkinEditor to edit an existing skin and "save as" a different skin to be stored in the "user styles" directory (not overwriting anyone else's skin)
~~-allow people to edit their own skins (needs some mechanism to record who "owns" what; and one person can own multiple skins)
~~-other people's skins can always be selected with a (modified) WikkaSkinSelector, or used as starting point for the WikkaSkinEditor to create a new skin
~~-store the current selection for skin in the session (not a separate cookie) and allow storing a "permanent" preference in the user profile (extra DB column)
~~-really nice skins can be added to the "standard" set
~How's that sound? I do like the possibility of having people select or build their own stylesheets very much, since it can enhance accessibility! --JavaWoman''
~''Sounds like a great idea. And - don't worry - It will take you much more than a nowrap line to make me leave :-p --DarTar''
Geshi is now hooked into Wikka. Go to SyntaxHighlighter for further discussion about it. -- JsnX
== Alternate stylesheets ==
I really appreciate alternate stylesheets (classical one, more elaborated, aso). To allow them to be configured in WikkaWiki, you could just add :
* In wikka.config.php this line (for exampe just after "stylesheet" => "wikka.css", ) :
%% "alternates_stylesheets" => array("wikka1.css" => 'Wikka 1',
"wikka2.css" => 'Wikka 2',
"wikka3.css" => 'Wikka 3'),%%
* in header.php this two lines just after the last link and before the "style" box :
%%<?php
// Alternate links
foreach ($this->GetConfigValue("alternates_stylesheets") as $alternate_css => $alternate_name)
{
echo '<link rel="alternate stylesheet" type="text/css" href="' . $css_path . $alternate_css . '" media="screen" title="' . $alternate_name . '" />';
}
?>%%
(I've too added a $css_path variable, %%$css_path = 'css/';%%)
I don't thing that various "media=print" CSS would be really usefull.
Of course you need a browser like [[http://mozilla.org Firefox / Mozilla]] to easily switch them, otherwise you have to take care of the stylesheets' switch directly in your pages [ see http://www.openweb.eu.org/ for example ].
--SergiO
CategoryDevelopmentSuggestions CategoryLayout
