Template talk:Quality

CSS/HTML

Suggestion for some changes on the template, as well as on the CSS-Source, to provide a) clean(er) HTML and b) less copy/paste if changes have to be made.

CSS-Changes

before

#qualitycontainer {
	postition:relative;
	height:48px;
	width:48px;
	text-align:left
}
#qualitycontainermed {
	postition:relative;
	height:32px;
	width:32px;
	text-align:left
}
#qualitycontainersm {
	postition:relative;
	height:24px;
	width:24px;
	text-align:left
}
#qualityimage img {
	position:absolute
}
#qualityimage img {
	position:absolute
}
#qualityimage p {
	margin:0px
}

after

Easier to manage and according to W3C-standards (and even the "line break if used with the Name-Template"-bug is fixed. Usually we would need only "display:inline-block", but since Firefox 2 and IE6&7 don't understand it, we need all the other crap too):

.qualitycontainer {
	postition:relative;
	height:48px;
	width:48px;
	text-align:left;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        zoom: 1;
        *display: inline;
}
.qualitycontainer.medium {
	height:32px;
	width:32px;
}
.qualitycontainer.small {
	height:24px;
	width:24px;
}
.qualityimage img {
	position:absolute;
}
.qualityimage p {
	margin:0;
}

(Only tested with Firefox-Page-Inspector - but it _should_ work. Maybe change the CSS to have both versions, change/test the templates and delete the old stuff from the CSS if no longer needed?)

Template-Changes

before

<includeonly><div id="{{#switch:{{{3|}}}
|24=qualitycontainersm
|32=qualitycontainermed
|48=qualitycontainer
|#default=qualitycontainer
}}"><div id="qualityimage">[[File:{{{1|}}}.png|{{#if:{{{3|}}}|{{{3|}}}px{{!}}|}}link=]]{{#ifeq: {{{2|}}}|silver|[[File:Silver_Quality_Icon.png|{{#if:{{{3|}}}|{{{3|}}}px{{!}}|}}link=]]|[[File:Gold_Quality_Icon.png|{{#if:{{{3|}}}|{{{3|}}}px{{!}}|}}link=]]}}</div></div></includeonly><noinclude>{{{{FULLPAGENAME}}/doc}}</noinclude>

after

<includeonly><div class="qualitycontainer {{#switch:{{{3|}}}
|24=small
|32=medium
|48
|#default=
}}"><div class="qualityimage">[[File:{{{1|}}}.png|{{#if:{{{3|}}}|{{{3|}}}px{{!}}|}}link=]]{{#ifeq: {{{2|}}}|silver|[[File:Silver_Quality_Icon.png|{{#if:{{{3|}}}|{{{3|}}}px{{!}}|}}link=]]|[[File:Gold_Quality_Icon.png|{{#if:{{{3|}}}|{{{3|}}}px{{!}}|}}link=]]}}</div></div></includeonly><noinclude>{{{{FULLPAGENAME}}/doc}}</noinclude>