Jump to content

MediaWiki talk:Centralnotice-template

Add topic
From Meta, a Wikimedia project coordination wiki
Latest comment: 17 years ago by AmiDaniel in topic Vertical size

Vertical size

[edit]

Can someone please fix the height problem? Reduce the font-size of the donor count and of the "You," remove the unnecessary spaces and bar from between the banner and the quotes, and scootch her up a tad. Should help. This notice is presently about 140% of the vertical height of the previous, already excessively tall, notice. Thanks! AmiDaniel 08:27, 4 November 2007 (UTC)Reply

Try this one out:

<style type="text/css">
#siteNotice {
        text-align: left;
        text-decoration: none;
        margin-top: 16px;
}
#siteNotice table {
        background-color: transparent;
}
.rtl #siteNotice {
        text-align: right;
}
.fundraiser-box,
.fundraiser-quote-box {
        /* width: 622px; */
        width: 700px;
        font-style: normal;
}
.fundraiser-box td {
        padding: 4px;
}
.fundraiser-meter {
        width: 360px;
}
.fundraiser-button {
        width: 180px;
}
.fundraiser-quote-divider {
        margin-top: 12px;
        border-bottom: solid 1px #888;
}

/* Font selections */
.fundraiser-counter,
.fundraiser-headline,
.fundraiser-button {
        font-family: Gill Sans, Arial, sans-serif;
        font-size: 20px;
}
.fundraiser-counter strong,
.fundraiser-headline strong {
        font-size: 28px;
}
.fundraiser-headline strong {
        font-family: Gill Sans Ultra Bold, Arial Black, sans-serif;
}
.fundraiser-button {
        font-weight: bold;
}
.fundraiser-quote {
        font-family: Monaco, monospace;
        font-size: 11px;
}
.fundraiser-box a {
        text-decoration: none; /* hide links */
}


/* Colors */
.fundraiser-box, .fundraiser-box a {
        color: black;
}
.fundraiser-counter, .fundraiser-counter a {
        color: #888;
}
.fundraiser-headline strong, .fundraiser-headline a strong {
        color: #339966;
}
.fundraiser-button, .fundraiser-button a {
        color: white; /* on red bg */
}

/* sigh */
.fundraiser-button-pre,
.fundraiser-button,
.fundraiser-button-post {
        height: 28px;
}

.fundraiser-button-pre,
.fundraiser-button-post {
        width: 8px;
        background-repeat: no-repeat;
}

.ltr .fundraiser-button-pre,
.rtl .fundraiser-button-post {
        background-image: url(http://upload.wikimedia.org/fundraising/2007/red-button-left.png);
        background-position: right center;
}
.fundraiser-button {
        background-image: url(http://upload.wikimedia.org/fundraising/2007/red-button-center.png);
        background-repeat: repeat-x;
        background-position: center;
}
.ltr .fundraiser-button-post,
.rtl .fundraiser-button-pre {
        background-image: url(http://upload.wikimedia.org/fundraising/2007/red-button-right.png);
        background-position: left center;
}

/* Text layout */
.fundraiser-counter { text-align: right; }
.rtl .fundraiser-counter { text-align: left; }

.fundraiser-headline { text-align: left; }
.rtl .fundraiser-headline { text-align: right; }

.fundraiser-button {
        text-align: center;
}
.fundraiser-quote .fundquote {
        padding-right: 1.5em;
}
.siteNoticeToggle {
        text-align: right;
}
.rtl .siteNoticeToggle {
        text-align: left;
}
</style>
<div id="siteNoticeBig">
<table class="fundraiser-box" cellspacing="0" cellpadding="0">
        <tr>
                <td class="fundraiser-meter">
                        <a href="$target" class="hidelink">$progress</a>
                </td>
                <td class="fundraiser-counter">
                        <a href="$target" class="hidelink">$counter</a>
                </td>
        </tr>
</table>
<table class="fundraiser-box" cellspacing="0" cellpadding="0">
        <tr>
                <td class="fundraiser-headline">
                        <a href="$target" class="hidelink">$headline</a>
                </td>
                <td class='fundraiser-button-pre'> </td>
                <td class='fundraiser-button'>
                        <a href="$target" class="hidelink">$donate</a>
                </td>
                <td class='fundraiser-button-post'> </td>
        </tr>
</table>
<table class="fundraiser-quote-box">
        <tr>
                <td class='fundraiser-quote'>
                        $quote
                </td>
                <td class="siteNoticeToggle">
                        [<a href="#" onclick="toggleNotice()">$hide</a>]
                </td>
        </tr>
</table>
</div>
<div id="siteNoticeSmall" class="fundraiser-folded"><a href="$target">$meter</a> <span class="siteNoticeToggle">[<a href="#" onclick="toggleNotice()">$show</a>]</span></div>

Reduces font sizes and removes divider. Should shave off a good 10% of the height. AmiDaniel 09:20, 4 November 2007 (UTC)Reply

Can you e-mail brion about this? Cbrown1023 talk 00:37, 6 November 2007 (UTC)Reply
This has already been taken care of -- as you'll notice from the history of MediaWiki:Centralnotice-template/en, Eagle and I had a long night of fixing up problems with the banner--just posted it here so he could copy and paste. Everything addressed in that excerpt and more has been fixed. AmiDaniel 02:17, 6 November 2007 (UTC)Reply

Img rescaling

[edit]

Alright, I've tried to find a way to scale this image that doesn't decapitate them or otherwise make the image horrendous. I actually think with the valign set on the donor-counter, it doesn't look that bad to leave the image at its default size, so if someone (*cough* Eagle *cough*) would be so kind as to remove the ".fundraiser-meter img { ... }" section for now. I'll see if I can hunt someone down to scale the image correctly server-side. Thanks. AmiDaniel 06:05, 5 November 2007 (UTC)Reply

It's now being generated in 300x42, so this is no longer relevant. AmiDaniel 00:34, 6 November 2007 (UTC)Reply