Update about box design.

Tag #963.
This commit is contained in:
wolfbeast 2019-03-04 13:02:25 +01:00 committed by Roy Tam
commit 9fdca8dca9
11 changed files with 110 additions and 113 deletions

View file

@ -2,29 +2,20 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
#PMaboutDialog {
width: 620px;
#aboutPMDialogContainer {
width: 700px;
height: 410px;
}
#PMrightBox {
background-image: url("chrome://branding/content/about-wordmark.png");
background-repeat: no-repeat;
/* padding-top creates room for the wordmark */
padding-top: 38px;
margin-top:20px;
#aboutVersionBox {
height: 38 px;
}
#PMrightBox:-moz-locale-dir(rtl) {
background-position: 100% 0;
}
#PMbottomBox {
padding: 15px 10px 0;
}
#PMversion {
margin-top: 10px;
-moz-margin-start: 0;
#aboutVersion {
text-align: center;
font-size: 18px;
font-weight: bold;
margin: 4px;
}
#distribution,
@ -35,13 +26,10 @@
margin-bottom: 0;
}
.text-blurb {
margin-bottom: 10px;
-moz-margin-start: 0;
-moz-padding-start: 0;
.text-credits {
margin: 5px 0px;
}
.text-link,
.text-link:focus {
margin: 0px;
@ -51,5 +39,15 @@
.bottom-link,
.bottom-link:focus {
text-align: center;
text-decoration: none !important;
padding: 4px;
border-radius: 3px;
color: #244C8A;
background-color: rgba(240, 240, 240, .7);
margin: 0 40px;
transition: background-color 0.5s ease-out;
}
.bottom-link:hover {
background-color: rgba(240, 240, 255, .95);
}

View file

@ -38,48 +38,48 @@
<script type="application/javascript" src="chrome://browser/content/aboutDialog.js"/>
<vbox id="aboutPMDialogContainer">
<hbox id="PMclientBox">
<vbox id="PMleftBox" flex="1"/>
<vbox id="PMrightBox" flex="1">
<vbox id="aboutPMDialogContainer" flex="1">
<vbox id="aboutHeaderBox" />
<vbox id="aboutVersionBox" flex="3">
#ifdef HAVE_64BIT_BUILD
#expand <label id="PMversion">Version: __MOZ_APP_VERSION__ (64-bit)</label>
#expand <label id="aboutVersion">Version: __MOZ_APP_VERSION__ (64-bit)</label>
#else
#expand <label id="PMversion">Version: __MOZ_APP_VERSION__ (32-bit)</label>
#expand <label id="aboutVersion">Version: __MOZ_APP_VERSION__ (32-bit)</label>
#endif
<label id="distribution" class="text-blurb"/>
<label id="distributionId" class="text-blurb"/>
</vbox>
<vbox id="aboutTextBox" flex="1">
<description class="text-credits">
#if defined(MOZ_OFFICIAL_BRANDING) || defined(MC_OFFICIAL)
#ifdef MC_PRIVATE_BUILD
This is a private build of Pale Moon. If you did not manually build this copy from source yourself, then please download an official version from the <label class="text-link" href="http://www.palemoon.org/">Pale Moon website</label>.
#else
Pale Moon is released by <label class="text-link" href="http://www.moonchildproductions.info">Moonchild Productions</label>.
<label class="text-link" href="http://www.palemoon.org">Pale Moon</label> is released by <label class="text-link" href="http://www.moonchildproductions.info">Moonchild Productions</label>.
</description>
<description class="text-pmcreds">
<description class="text-credits">
Special thanks to all our supporters and donors for making this browser possible!
</description>
<description class="text-blurb">
<description class="text-credits">
If you wish to contribute, please consider helping out by providing support to other users on the <label class="text-link" href="https://forum.palemoon.org/">Pale Moon forum</label>
or getting involved in our development by tackling some of the issues found in our GitHub issue tracker.
#endif
#else
&brandFullName; is released by &vendorShortName;.
</description>
<description class="text-blurb">
<description class="text-credits">
This is an unofficial build of Pale Moon. For official builds, please go to <label class="text-link" href="http://www.palemoon.org/">the Pale Moon website</label>.
#endif
</description>
</vbox>
</vbox>
</hbox>
<vbox id="PMbottomBox">
</vbox>
<vbox id="aboutLinkBox">
<hbox pack="center">
<label class="text-link bottom-link" href="about:license">Licensing information</label>
<label class="text-link bottom-link" href="about:rights">End-user rights</label>
<label class="text-link bottom-link" id="releaseNotesURL">Release notes</label>
</hbox>
<description id="PMtrademark">&trademarkInfo.part1;</description>
<description id="aboutPMtrademark">&trademarkInfo.part1;</description>
</vbox>
</vbox>