[opensuse-web] Templates: Box-footer
Is currently broken in Firefox. Length is bigger then box that it suppose to close. -- Regards, Rajko -- To unsubscribe, e-mail: opensuse-web+unsubscribe@opensuse.org To contact the owner, e-mail: opensuse-web+owner@opensuse.org
On Saturday, December 17, 2011 05:22:28 AM Rajko M. wrote:
Is currently broken in Firefox. Length is bigger then box that it suppose to close.
Nice about CSS clasess, they are short way to write CSS styles. Bad, is that debugging is horror. Before, I would see all styles in one place. Now guess what, I have to wade trough MediaWiki:Common.css, look at the page source to see how is that rendered, use Firebug to test changes, iterate trough all that back and forth to get simple runover footer under control. Good about that is that made me see what we actually have in MediaWiki:Common.css. I think that guy that made all that did the job just as described in the GCI task, with one catch, we missed to describe task properly. Classes are there to make code text shorter and as in any programming they make no sense if you don't save some typing. It is absolutely not waranted if you introduce new commands that mean learning effort with no benefits: .clear { clear:both; } .clear-left { clear:left; } .clear-right { clear:right; } .32-icon { width: 36px; } .vertical-align-mid { vertical-align:middle; } .single-right-pad { padding-right: 1em; } .single-pad { padding: 1em; } .vertical-align-top { vertical-align: top; } .smalltext { font-size: 80%; } .bigtext { font-size: 120%; } .width49 { width: 49%; } .no-margin { margin:0 0 0 0; } .single-margin { margin: 1em; } .edu { } .move_to_hcl { width:95%; } .move_to_portal { width:100%; } .move_to_sdb { width:100%; } .moved_to_external { width:96.5%; } Duplicates: .expand { background:#ffeecc; border:2px solid #FF9900; } .forbidden-wrapper { background:#ffeecc; border:2px solid #FF9900; } Or, what to do with classes for single template, like one below and many more: .step-screenshot-image { width: 215px; text-align:right; vertical-align:center; padding:0 .5em 0 0; color: #fff; } .step-screenshot-text { width:75%; margin:0 1em 0 0; padding:0 1em 0 .5em; font-size:100%; border-left: 1px solid #babdb6; } .step-screenshot-big-image { width: 415px; } Did I mention that somewhere on TODO list that I fill with tasks, but seldom empty it: * Step_screenshot template, and similar is to be replaced with Text_and_image, or Image_and_text. * Weekly news related templates are not used, besides archives. There was no need to put any effort in this. Like with any program, and CSS is programming language interpreted by browser rendering engine, before you jump you must see what you want as end effect, otherwise you replace one one hackish solution (problem) with another. -- Regards, Rajko -- To unsubscribe, e-mail: opensuse-web+unsubscribe@opensuse.org To contact the owner, e-mail: opensuse-web+owner@opensuse.org
Hello, Am Samstag, 17. Dezember 2011 schrieb Rajko M.:
On Saturday, December 17, 2011 05:22:28 AM Rajko M. wrote:
Is currently broken in Firefox. Length is bigger then box that it suppose to close.
Nice about CSS clasess, they are short way to write CSS styles. Bad, is that debugging is horror.
I wouldn't call it "horror", but you are right that it is slightly more difficult than before. (Personally I would say it is easier now - but that's probably because you could wake me up at 4 AM and I would find the correct buttons in firebug ;-)
Before, I would see all styles in one place. Now guess what, I have to wade trough MediaWiki:Common.css, look at the page source to see how is that rendered, use Firebug to test changes, iterate trough all that back and forth to get simple runover footer under control.
... and the final result was that firebug was quite helpful to find the correct solution because the problem came from an underlying stylesheet - see my other mail yesterday ;-) I know it's slightly harder for now, but we also get the benefit of avoiding (CSS) code duplication [1]. If you are stuck somehow, just ask on the mailinglist. I can't promise an instant reply (unless you attach a day with more than 24 hours to your mail ;-) but I'll do what I can.
Good about that is that made me see what we actually have in MediaWiki:Common.css.
Indeed.
I think that guy that made all that did the job just as described in the GCI task, with one catch, we missed to describe task properly.
I'm afraid you are right. Nevertheless the current situation is an improvement IMHO because we have a good overview over all styles now even if some class names are not perfect. Additionally we had the issues with load.php (aka "browsers can't load Mediawiki:Common.css"), which didn't make it easier for the student :-(
Classes are there to make code text shorter and as in any programming they make no sense if you don't save some typing. It is absolutely not waranted if you introduce new commands that mean learning effort with no benefits:
There is a big benefit - we can include the CSS in all wikis and use the classes there, which means less duplication and having the same design everywhere.
Duplicates:
.expand { background:#ffeecc; border:2px solid #FF9900; }
.forbidden-wrapper { background:#ffeecc; border:2px solid #FF9900; }
Good catch - I merged them to .expand, .forbidden-wrapper { ... } We could use a single class name if we are sure that both templates (Template:Forbidden and Template:Expand) will look similar forever. OTOH, naming the CSS similar to the template makes it easier to understand.
Or, what to do with classes for single template, like one below and many more:
See above - most of them are used in several (or all) wikis, so there's probably no class that is only used once ;-)
Did I mention that somewhere on TODO list that I fill with tasks, but seldom empty it: * Step_screenshot template, and similar is to be replaced with Text_and_image, or Image_and_text.
Indeed, that makes sence (and would give better class names). BTW: If you think some classes should get a better name, please speak up now so that we get the final names _before_ using the classes in all wikis.
Like with any program, and CSS is programming language interpreted by browser rendering engine, before you jump you must see what you want as end effect, otherwise you replace one one hackish solution (problem) with another.
Using CSS classes is definitively not hackish ;-) Regards, Christian Boltz [1] I have some[tm] experience with code cleanup on the PostfixAdmin code - basically I'm doing code cleanup (which mostly means removing duplicated code) since more than 4 years there... -- Seit wann schaut hier noch irgendeiner aufs Subject? Das hab ich mir nur angesehen, als ich noch relativ neu war. Mittlerweile nehme ich es nur mehr wahr, wenn es mehr als den halben Bildschirm verdeckt. [Adalbert Michelic in suse-talk] -- To unsubscribe, e-mail: opensuse-web+unsubscribe@opensuse.org To contact the owner, e-mail: opensuse-web+owner@opensuse.org
Hello, Am Samstag, 17. Dezember 2011 schrieb Rajko M.:
Is currently broken in Firefox. Length is bigger then box that it suppose to close.
I've seen your solution to use width:99.36 (which is not really valid CSS - I guess you meant 99.36_%_) Anyway - such a strange number is usually a sign that something smells fishy ;-) (and, not a big surprise, your 99.36 doesn't look correct on my 12.1 system in Firefox and Konqueror.) The correct solution is to use "width:auto" to override a "width:100%" in base.css. Needless to say that I found this out using your beloved ;-) Firebug which is a great tool IMHO. I fixed this in common.css and removed your temporary fix from Template:Box-footer again. The more interesting question is if the following CSS still makes sense (base.css around line 181) .box-header, .box-subheader, .box-footer { [...] width: 100%; } We already (have to) override it for box-footer, and removing the width:100% doesn't seem to change anything (tested with firebug on Portal:Project). Does someone (Robert? Thomas?) know why the width: 100% is there? IMHO it is superfluous and only causes problems, but of course I can't do a final judgement from testing on a single wiki page ;-) Regards, Christian Boltz -- Weil ich einen Airbag im Auto habe fahre ich ja auch nicht dauernd mit Vollgas gegen einen Baum nur um zu wissen das der Airbag funktioniert. [Uwe Drießen in postfixbuch-users] -- To unsubscribe, e-mail: opensuse-web+unsubscribe@opensuse.org To contact the owner, e-mail: opensuse-web+owner@opensuse.org
On Saturday, December 17, 2011 07:28:53 PM Christian Boltz wrote: ...
I've seen your solution to use width:99.36 (which is not really valid CSS - I guess you meant 99.36_%_)
As you can see in the history MediaWiki:Common.css it was correct there, so another typo in template.
Anyway - such a strange number is usually a sign that something smells fishy ;-)...
I already had to use strange numbers to adjust sizes, so it didn't raise red flag.
The correct solution is to use "width:auto" to override a "width:100%" in base.css.
Good.
Needless to say that I found this out using your beloved ;-) Firebug which is a great tool IMHO.
It is, just it takes some time to learn how to use it. Wiki is for me just one of hobbies, so no need to rush :)
I fixed this in common.css and removed your temporary fix from Template:Box-footer again.
Well for some reason, 99.63% in common.css did not work, so I made another change in template that did not work too ;-) Now that this is over, I can start looking into some stuff mentioned in another email (ignoring rant part there).
... Christian Boltz
-- Regards, Rajko -- To unsubscribe, e-mail: opensuse-web+unsubscribe@opensuse.org To contact the owner, e-mail: opensuse-web+owner@opensuse.org
participants (2)
-
Christian Boltz -
Rajko M.