зеркало из https://github.com/mozilla/bedrock.git
Merge pull request #1706 from kyoshino/bug-973396-locale-fonts
Fix Bug 973396 - Find a better way to serve locale-specific fonts
This commit is contained in:
Craig Cook
Коммит
3957301691
|
|
@ -37,6 +37,8 @@
|
|||
{% include 'includes/canonical-url.html' %}
|
||||
{% endblock shared_meta %}
|
||||
|
||||
{{ l10n_css() }}
|
||||
|
||||
{% block tabzilla_css %}
|
||||
{{ css('tabzilla') }}
|
||||
{% endblock %}
|
||||
|
|
@ -65,8 +67,6 @@
|
|||
{# Extra header stuff (scripts, styles, metadata, etc) seen by all browsers. Use the 'page_css' block for CSS you want to hide from IE7 and lower. #}
|
||||
{% endblock %}
|
||||
|
||||
{% include 'includes/locale-font-faces.html' %}
|
||||
|
||||
{% block favicon %}<link rel="shortcut icon" href="{{ media('img/favicon.ico') }}">{% endblock %}
|
||||
|
||||
{{ js('site') }}
|
||||
|
|
|
|||
|
|
@ -35,6 +35,8 @@
|
|||
{% include 'includes/canonical-url.html' %}
|
||||
{% endblock shared_meta %}
|
||||
|
||||
{{ l10n_css() }}
|
||||
|
||||
{% block tabzilla_css %}
|
||||
{{ css('tabzilla') }}
|
||||
{% endblock %}
|
||||
|
|
@ -63,8 +65,6 @@
|
|||
{# Extra header stuff (scripts, styles, metadata, etc) seen by all browsers. Use the 'page_css' block for CSS you want to hide from IE7 and lower. #}
|
||||
{% endblock %}
|
||||
|
||||
{% include 'includes/locale-font-faces.html' %}
|
||||
|
||||
{% block favicon %}<link rel="shortcut icon" href="{{ media('img/favicon.ico') }}">{% endblock %}
|
||||
|
||||
{{ js('site') }}
|
||||
|
|
|
|||
|
|
@ -1,44 +0,0 @@
|
|||
{%- if LANG in ['ar', 'fa'] -%}
|
||||
{#- bug 958321 -#}
|
||||
<style type="text/css">
|
||||
@font-face {
|
||||
font-family: 'Droid Arabic Naskh';
|
||||
src: url({{ media('fonts/DroidNaskh-Regular.eot?#iefix') }}) format('embedded-opentype'),
|
||||
url({{ media('fonts/DroidNaskh-Regular.woff') }}) format('woff'),
|
||||
url({{ media('fonts/DroidNaskh-Regular.ttf') }}) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Droid Arabic Naskh';
|
||||
src: url({{ media('/fonts/DroidNaskh-Bold.eot?#iefix') }}) format('embedded-opentype'),
|
||||
url({{ media('/fonts/DroidNaskh-Bold.woff') }}) format('woff'),
|
||||
url({{ media('/fonts/DroidNaskh-Bold.ttf') }}) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
{%- endif -%}
|
||||
|
||||
{%- if LANG in ['ff'] -%}
|
||||
{#- bug 776967 -#}
|
||||
<style type="text/css">
|
||||
@font-face {
|
||||
font-family: 'Mplus Fulah Light';
|
||||
src: url({{ media('fonts/mplus-2c-light-fulah-subset.eot?#iefix') }}) format('embedded-opentype'),
|
||||
url({{ media('fonts/mplus-2c-light-fulah-subset.woff') }}) format('woff'),
|
||||
url({{ media('fonts/mplus-2c-light-fulah-subset.ttf') }}) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Mplus Fulah';
|
||||
src: url({{ media('fonts/mplus-2c-regular-fulah-subset.eot?#iefix') }}) format('embedded-opentype'),
|
||||
url({{ media('fonts/mplus-2c-regular-fulah-subset.woff') }}) format('woff'),
|
||||
url({{ media('fonts/mplus-2c-regular-fulah-subset.ttf') }}) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
}
|
||||
</style>
|
||||
{%- endif -%}
|
||||
|
|
@ -9,12 +9,12 @@ from funfactory.settings_base import path as base_path
|
|||
from funfactory.urlresolvers import reverse
|
||||
|
||||
|
||||
L10N_IMG_PATH = base_path('media', 'img', 'l10n')
|
||||
L10N_MEDIA_PATH = base_path('media', '%s', 'l10n')
|
||||
|
||||
|
||||
def _l10n_media_exists(locale, url):
|
||||
def _l10n_media_exists(type, locale, url):
|
||||
""" checks if a localized media file exists for the locale """
|
||||
return path.exists(path.join(L10N_IMG_PATH, locale, url))
|
||||
return path.exists(path.join(L10N_MEDIA_PATH % type, locale, url))
|
||||
|
||||
|
||||
@jingo.register.function
|
||||
|
|
@ -103,16 +103,58 @@ def l10n_img(ctx, url):
|
|||
locale = settings.LANGUAGE_CODE
|
||||
|
||||
# We use the same localized screenshots for all Spanishes
|
||||
if locale.startswith('es') and not _l10n_media_exists(locale, url):
|
||||
if locale.startswith('es') and not _l10n_media_exists('img', locale, url):
|
||||
locale = 'es-ES'
|
||||
|
||||
if locale != settings.LANGUAGE_CODE:
|
||||
if not _l10n_media_exists(locale, url):
|
||||
if not _l10n_media_exists('img', locale, url):
|
||||
locale = settings.LANGUAGE_CODE
|
||||
|
||||
return media(path.join('img', 'l10n', locale, url))
|
||||
|
||||
|
||||
@jingo.register.function
|
||||
@jinja2.contextfunction
|
||||
def l10n_css(ctx):
|
||||
"""
|
||||
Output the URL to a locale-specific stylesheet if exists.
|
||||
|
||||
Examples
|
||||
========
|
||||
|
||||
In Template
|
||||
-----------
|
||||
|
||||
{{ l10n_css() }}
|
||||
|
||||
For a locale that has locale-specific stylesheet, this would output:
|
||||
|
||||
<link rel="stylesheet" media="screen,projection,tv"
|
||||
href="{{ MEDIA_URL }}css/l10n/{{ LANG }}/intl.css">
|
||||
|
||||
For a locale that doesn't have any locale-specific stylesheet, this would
|
||||
output nothing.
|
||||
|
||||
In the Filesystem
|
||||
-----------------
|
||||
|
||||
Put files in folders like the following::
|
||||
|
||||
$ROOT/media/css/l10n/en-US/intl.css
|
||||
$ROOT/media/css/l10n/fr/intl.css
|
||||
|
||||
"""
|
||||
locale = getattr(ctx['request'], 'locale', 'en-US')
|
||||
|
||||
if _l10n_media_exists('css', locale, 'intl.css'):
|
||||
markup = ('<link rel="stylesheet" media="screen,projection,tv" href='
|
||||
'"%s">' % media(path.join('css', 'l10n', locale, 'intl.css')))
|
||||
else:
|
||||
markup = ''
|
||||
|
||||
return jinja2.Markup(markup)
|
||||
|
||||
|
||||
@jingo.register.function
|
||||
def field_with_attrs(bfield, **kwargs):
|
||||
"""Allows templates to dynamically add html attributes to bound
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
/* Some style goes here */
|
||||
|
|
@ -0,0 +1 @@
|
|||
/* Some style goes here */
|
||||
|
|
@ -20,7 +20,7 @@ from bedrock.newsletter.tests.test_views import newsletters
|
|||
|
||||
TEST_FILES_ROOT = os.path.join(os.path.dirname(os.path.abspath(__file__)),
|
||||
'test_files')
|
||||
TEST_L10N_IMG_PATH = os.path.join(TEST_FILES_ROOT, 'media', 'img', 'l10n')
|
||||
TEST_L10N_MEDIA_PATH = os.path.join(TEST_FILES_ROOT, 'media', '%s', 'l10n')
|
||||
|
||||
TEST_DONATE_LOCALE_LINK = {
|
||||
'de': 'https://sendto.mozilla.org/page/contribute/EOYFR2013-webDE',
|
||||
|
|
@ -73,7 +73,7 @@ class TestSecureURL(TestCase):
|
|||
self._test('', 'https://' + self.host + self.test_path, True)
|
||||
|
||||
|
||||
@patch('bedrock.mozorg.helpers.misc.L10N_IMG_PATH', TEST_L10N_IMG_PATH)
|
||||
@patch('bedrock.mozorg.helpers.misc.L10N_MEDIA_PATH', TEST_L10N_MEDIA_PATH)
|
||||
@patch('django.conf.settings.LANGUAGE_CODE', 'en-US')
|
||||
class TestImgL10n(TestCase):
|
||||
rf = RequestFactory()
|
||||
|
|
@ -124,7 +124,50 @@ class TestImgL10n(TestCase):
|
|||
|
||||
self._render('is', 'dino/does-not-exist.png')
|
||||
exists_mock.assert_called_once_with(os.path.join(
|
||||
TEST_L10N_IMG_PATH, 'is', 'dino', 'does-not-exist.png'))
|
||||
TEST_L10N_MEDIA_PATH % 'img', 'is', 'dino', 'does-not-exist.png'))
|
||||
|
||||
|
||||
@patch('bedrock.mozorg.helpers.misc.L10N_MEDIA_PATH', TEST_L10N_MEDIA_PATH)
|
||||
class TestL10nCSS(TestCase):
|
||||
rf = RequestFactory()
|
||||
media_url_dev = '/media/'
|
||||
media_url_prod = '//mozorg.cdn.mozilla.net/media/'
|
||||
cdn_url = '//mozorg.cdn.mozilla.net'
|
||||
markup = ('<link rel="stylesheet" media="screen,projection,tv" href='
|
||||
'"%scss/l10n/%s/intl.css">')
|
||||
|
||||
def _render(self, locale):
|
||||
req = self.rf.get('/')
|
||||
req.locale = locale
|
||||
return render('{{ l10n_css() }}', {'request': req})
|
||||
|
||||
@override_settings(DEV=True)
|
||||
@override_settings(MEDIA_URL=media_url_dev)
|
||||
def test_dev_when_css_file_exists(self):
|
||||
"""Should output a path to the CSS file if exists."""
|
||||
eq_(self._render('de'), self.markup % (self.media_url_dev, 'de'))
|
||||
eq_(self._render('es-ES'), self.markup % (self.media_url_dev, 'es-ES'))
|
||||
|
||||
@override_settings(DEV=True)
|
||||
@override_settings(MEDIA_URL=media_url_dev)
|
||||
def test_dev_when_css_file_missing(self):
|
||||
"""Should output nothing if the CSS file is missing."""
|
||||
eq_(self._render('en-US'), '')
|
||||
eq_(self._render('fr'), '')
|
||||
|
||||
@override_settings(DEV=False)
|
||||
@override_settings(MEDIA_URL=media_url_prod)
|
||||
def test_prod_when_css_file_exists(self):
|
||||
"""Should output a path to the CSS file if exists."""
|
||||
eq_(self._render('de'), self.markup % (self.media_url_prod, 'de'))
|
||||
eq_(self._render('es-ES'), self.markup % (self.media_url_prod, 'es-ES'))
|
||||
|
||||
@override_settings(DEV=False)
|
||||
@override_settings(MEDIA_URL=media_url_prod)
|
||||
def test_prod_when_css_file_missing(self):
|
||||
"""Should output nothing if the CSS file is missing."""
|
||||
eq_(self._render('en-US'), '')
|
||||
eq_(self._render('fr'), '')
|
||||
|
||||
|
||||
class TestVideoTag(TestCase):
|
||||
|
|
|
|||
|
|
@ -129,6 +129,10 @@ CSS Style
|
|||
See the `Mozilla CSS Style Guide
|
||||
<http://mozweb.readthedocs.org/en/latest/css-style.html>`_.
|
||||
|
||||
Use the ``.open-sans``, ``.open-sans-light`` and ``.open-sans-extrabold`` mixins
|
||||
to specify font families to allow using international fonts. See the :ref:
|
||||
`CSS<l10n>` section in the l10n doc for details.
|
||||
|
||||
Configuring your code editor
|
||||
----------------------------
|
||||
|
||||
|
|
|
|||
|
|
@ -318,3 +318,91 @@ You can specify a list of locales to update:
|
|||
|
||||
$ ./manage.py l10n_check fr
|
||||
$ ./manage.py l10n_check fr de es
|
||||
|
||||
CSS
|
||||
---
|
||||
|
||||
If a localized page needs some locale-specific style tweaks, you can add the
|
||||
style rules to the page's stylesheet like this:
|
||||
|
||||
html[lang="it"] {
|
||||
#features li {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
html[dir="rtl"] {
|
||||
#features {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
If a locale needs site-wide style tweaks, font settings in particular, you can
|
||||
add the rules to ``/media/css/l10n/{{LANG}}/intl.css``. Pages on Bedrock
|
||||
automatically includes the CSS in the base templates with the `l10n_css` helper
|
||||
function. The CSS may also be loaded directly from other Mozilla sites with such
|
||||
a URL: ``//mozorg.cdn.mozilla.net/media/css/l10n/{{LANG}}/intl.css``.
|
||||
|
||||
*Open Sans*, the default font on mozilla.org, doesn't offer non-Latin glyphs.
|
||||
``intl.css`` can have ``@font-face`` rules to define locale-specific fonts using
|
||||
custom font families as below:
|
||||
|
||||
* *X-LocaleSpecific-Light*: Used in combination with *Open Sans Light*. The font
|
||||
can come in 2 weights: normal and optionally bold
|
||||
* *X-LocaleSpecific*: Used in combination with *Open Sans Regular*. The font can
|
||||
come in 2 weights: normal and optionally bold
|
||||
* *X-LocaleSpecific-Extrabold*: Used in combination with *Open Sans Extrabold*.
|
||||
The font weight is 800 only
|
||||
|
||||
Here's an example of ``intl.css``:
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific-Light;
|
||||
font-weight: normal;
|
||||
src: local(mplus-2p-light), local(Meiryo);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific-Light;
|
||||
font-weight: bold;
|
||||
src: local(mplus-2p-medium), local(Meiryo-Bold);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: normal;
|
||||
src: local(mplus-2p-regular), local(Meiryo);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: bold;
|
||||
src: local(mplus-2p-bold), local(Meiryo-Bold);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific-Extrabold;
|
||||
font-weight: 800;
|
||||
src: local(mplus-2p-black), local(Meiryo-Bold);
|
||||
}
|
||||
|
||||
Localizers can specify locale-specific fonts in one of the following ways:
|
||||
|
||||
* Choose best-looking fonts widely used on major platforms, and specify those
|
||||
with the ``src: local(name)`` syntax
|
||||
* Find a best-looking free Web font, add the font files to ``/media/fonts/``,
|
||||
and specify those with the ``src: url(path)`` syntax
|
||||
* Create a custom Web font to complement missing glyphs in *Open Sans*, add the
|
||||
font files to ``/media/fonts/``, and specify those with the ``src: url(path)``
|
||||
syntax. The `M+ font family
|
||||
<http://mplus-fonts.sourceforge.jp/mplus-outline-fonts/index-en.html>`_ offers
|
||||
various international glyphs and looks similar to *Open Sans*. You can create a
|
||||
subset of the *M+ 2c* font using a tool found on the Web. See `Bug 776967
|
||||
<https://bugzilla.mozilla.org/show_bug.cgi?id=776967>`_ for the Fulah (ff)
|
||||
locale's example.
|
||||
|
||||
Developers should use the ``.open-sans`` mixin instead of ``font-family: 'Open
|
||||
Sans'`` to specify the default font family in CSS. This mixin has both *Open
|
||||
Sans* and *X-LocaleSpecific* so locale-specific fonts, if defined, will be
|
||||
applied to localized pages. The variant mixins, ``.open-sans-light`` and
|
||||
``.open-sans-extrabold``, are also available.
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@
|
|||
background: radial-gradient(ellipse at center, rgba(234,239,242,1) 0%,rgba(212,221,228,.5) 50%),
|
||||
linear-gradient(to bottom, rgba(202,225,244,1) 0%,rgba(125,185,232,0) 100%);
|
||||
.border-radius(10px);
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,8 @@
|
|||
// 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/.
|
||||
|
||||
@import "../../sandstone/lib.less";
|
||||
|
||||
@baseLine: 20px;
|
||||
|
||||
@font-face {
|
||||
|
|
@ -398,7 +400,7 @@ html[lang^="en"] {
|
|||
right: 30px;
|
||||
width: 220px;
|
||||
min-height: 58px;
|
||||
font-family: 'Open Sans';
|
||||
.open-sans;
|
||||
font-size: 13px;
|
||||
color: #0095dd;
|
||||
background: #fff url(data:image/png;base64,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) 10px 10px no-repeat;
|
||||
|
|
|
|||
|
|
@ -293,7 +293,7 @@ html[lang^="en"] {
|
|||
|
||||
span {
|
||||
display: block;
|
||||
font-family: 'League Gothic', 'Open Sans', sans-serif;
|
||||
font-family: 'League Gothic', @baseFontFamily;
|
||||
text-transform: uppercase;
|
||||
color: #5d7489;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -269,7 +269,7 @@ section p, header p {
|
|||
right: 28px;
|
||||
|
||||
a {
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,12 +7,12 @@
|
|||
@import "../../firefox/mwc-2014-map.less";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans ExtraBoldItalic';
|
||||
font-family: 'Open Sans Extrabold';
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix-2013') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* {{{ Template overrides */
|
||||
|
|
@ -82,10 +82,10 @@ html, body {
|
|||
h1 {
|
||||
color: #fff;
|
||||
text-shadow: none;
|
||||
font-family: 'Open Sans ExtraBoldItalic';
|
||||
.open-sans-extrabold;
|
||||
font-style: italic;
|
||||
font-size: 78px;
|
||||
letter-spacing: -3px;
|
||||
font-weight: normal;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,12 +5,12 @@
|
|||
@import "../sandstone/lib.less";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans ExtraBoldItalic';
|
||||
font-family: 'Open Sans Extrabold';
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix-2013') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@localBlue: #43a6e2;
|
||||
|
|
@ -346,7 +346,8 @@
|
|||
text-align: center;
|
||||
margin-top: 20px;
|
||||
font-size: 28px;
|
||||
font-family: 'Open Sans ExtraBoldItalic';
|
||||
.open-sans-extrabold;
|
||||
font-style: italic;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
|
@ -825,7 +826,7 @@
|
|||
right: 0;
|
||||
|
||||
color: #fff;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
.open-sans;
|
||||
font-size: 16px;
|
||||
padding: 5px 28px 5px 5px;
|
||||
cursor: pointer;
|
||||
|
|
|
|||
|
|
@ -1163,20 +1163,3 @@ html[lang='pt-BR'] .sus-links ul a.sus-faq {
|
|||
html[lang='sv-SE'] .sus-links ul a.sus-faq {
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
|
||||
/* No Italic in Chinese */
|
||||
html[lang='zh-CN'] body h2,
|
||||
html[lang='zh-CN'] body h3,
|
||||
html[lang='zh-CN'] body aside.pull,
|
||||
html[lang='zh-CN'] body p.pull,
|
||||
html[lang='zh-CN'] body .sus-links ul small,
|
||||
html[lang='zh-CN'] body p em,
|
||||
html[lang='zh-TW'] body h2,
|
||||
html[lang='zh-TW'] body h3,
|
||||
html[lang='zh-TW'] body aside.pull,
|
||||
html[lang='zh-TW'] body p.pull,
|
||||
html[lang='zh-TW'] body .sus-links ul small,
|
||||
html[lang='zh-TW'] body p em {
|
||||
font-style: normal ;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -186,7 +186,7 @@
|
|||
|
||||
h5 {
|
||||
font-weight: bold;
|
||||
font-family: 'Open Sans','Droid Arabic Naskh','Mplus Fulah Light',sans-serif;
|
||||
.open-sans;
|
||||
margin: 1em 0 1em 0;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
|
|
@ -199,7 +199,7 @@
|
|||
text-decoration: underline;
|
||||
display: inline;
|
||||
color: #333;
|
||||
font-family: 'Open Sans','Droid Arabic Naskh','Mplus Fulah Light',sans-serif;
|
||||
.open-sans;
|
||||
}
|
||||
|
||||
.section-header + p:not(.new-line-opening-p) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
/* Bug 958321 */
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: normal;
|
||||
src: url('/media/fonts/l10n/DroidNaskh-Regular.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Regular.woff') format('woff'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Regular.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: bold;
|
||||
src: url('/media/fonts/l10n/DroidNaskh-Bold.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Bold.woff') format('woff'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Bold.ttf') format('truetype');
|
||||
}
|
||||
|
||||
/* Bug 944269 */
|
||||
|
||||
* {
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/* Bug 944269 */
|
||||
|
||||
* {
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
/* Bug 958321 */
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: normal;
|
||||
src: url('/media/fonts/l10n/DroidNaskh-Regular.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Regular.woff') format('woff'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Regular.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: bold;
|
||||
src: url('/media/fonts/l10n/DroidNaskh-Bold.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Bold.woff') format('woff'),
|
||||
url('/media/fonts/l10n/DroidNaskh-Bold.ttf') format('truetype');
|
||||
}
|
||||
|
||||
/* Bug 944269 */
|
||||
|
||||
* {
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
/* Bug 776967 */
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific-Light;
|
||||
font-weight: normal;
|
||||
src: url('/media/fonts/l10n/mplus-2c-light-fulah-subset.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/l10n/mplus-2c-light-fulah-subset.woff') format('woff'),
|
||||
url('/media/fonts/l10n/mplus-2c-light-fulah-subset.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: X-LocaleSpecific;
|
||||
font-weight: normal;
|
||||
src: url('/media/fonts/l10n/mplus-2c-regular-fulah-subset.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/l10n/mplus-2c-regular-fulah-subset.woff') format('woff'),
|
||||
url('/media/fonts/l10n/mplus-2c-regular-fulah-subset.ttf') format('truetype');
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/* Bug 944269 */
|
||||
|
||||
* {
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/* Bug 973171 */
|
||||
|
||||
* {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/* Bug 973171 */
|
||||
|
||||
* {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/* Bug 973171 */
|
||||
|
||||
* {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/* Bug 973171 */
|
||||
|
||||
* {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
|
@ -90,8 +90,7 @@
|
|||
margin-bottom: @baseLine / 6;
|
||||
a:after {
|
||||
content: " »";
|
||||
font-family: 'Open Sans Light',sans-serif;
|
||||
font-weight: 300;
|
||||
.open-sans-light;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@
|
|||
|
||||
p {
|
||||
font-size: 150%;
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -108,7 +108,7 @@
|
|||
|
||||
h2 {
|
||||
font-size: 150%;
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0;
|
||||
text-transform: uppercase;
|
||||
|
|
|
|||
|
|
@ -262,7 +262,10 @@
|
|||
|
||||
.message {
|
||||
color: #fff;
|
||||
font: italic 24px/1.15 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
font-size: 24px;
|
||||
line-height: 1.15;
|
||||
font-style: italic;
|
||||
letter-spacing: -.025px;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.1);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -72,8 +72,7 @@ ul.links {
|
|||
margin-bottom: @baseLine / 6;
|
||||
a:after {
|
||||
content: " »";
|
||||
font-family: 'Open Sans Light',sans-serif;
|
||||
font-weight: 300;
|
||||
.open-sans-light;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -56,8 +56,7 @@ ul.links {
|
|||
margin: (@baseLine/2) 5px;
|
||||
a:after {
|
||||
content: " »";
|
||||
font-family: 'Open Sans Light',sans-serif;
|
||||
font-weight: 300;
|
||||
.open-sans-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
h1, h2 {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
font-weight: normal;
|
||||
color: #484848;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75);
|
||||
|
|
@ -94,7 +94,7 @@
|
|||
.download-other {
|
||||
color: #bbb;
|
||||
display: block;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
.open-sans;
|
||||
font-size: 11px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
font-size: 24px;
|
||||
letter-spacing: -0.25px;
|
||||
margin-bottom: 0;
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light;
|
||||
font-weight: normal;
|
||||
margin-bottom:0;
|
||||
line-height: 100%;
|
||||
|
|
@ -58,7 +58,7 @@
|
|||
tbody th {
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-family: 'Open Sans Light',sans-serif;
|
||||
.open-sans-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -59,8 +59,7 @@
|
|||
margin-bottom: @baseLine / 6;
|
||||
a:after {
|
||||
content: " »";
|
||||
font-family: 'Open Sans Light',sans-serif;
|
||||
font-weight: 300;
|
||||
.open-sans-light;
|
||||
}
|
||||
}
|
||||
p {
|
||||
|
|
|
|||
|
|
@ -55,3 +55,28 @@
|
|||
font-weight: normal;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/*
|
||||
* The list above should be minimized to reduce the number of downloaded fonts.
|
||||
* If you'd like to use one of the following font faces on a specific page, just
|
||||
* copy it to the LESS file of that page:
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('/media/fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype');
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans Extrabold';
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix-2013') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype');
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -1,7 +1,11 @@
|
|||
// Fonts and color
|
||||
|
||||
// The custom X-LocaleSpecific font family is defined with a @font-face rule in
|
||||
// locale-specific stylesheets which can be found at /media/css/l10n/. See
|
||||
// /docs/l10n.rst for details.
|
||||
@baseFontFamily: 'Open Sans', X-LocaleSpecific, sans-serif;
|
||||
|
||||
@baseFontSize: 14px;
|
||||
@baseFontFamily: 'Open Sans', 'Droid Arabic Naskh', 'Mplus Fulah', sans-serif;
|
||||
@baseLine: 20px;
|
||||
@smallFontSize: 12px;
|
||||
@largeFontSize: 16px;
|
||||
|
|
@ -27,14 +31,19 @@
|
|||
@buttonBlueDark: #277ac1;
|
||||
|
||||
.open-sans() {
|
||||
font-family: 'Open Sans', 'Droid Arabic Naskh', 'Mplus Fulah', sans-serif;
|
||||
font-family: @baseFontFamily;
|
||||
}
|
||||
|
||||
.open-sans-light() {
|
||||
font-family: 'Open Sans Light', 'Droid Arabic Naskh', 'Mplus Fulah Light', sans-serif;
|
||||
font-family: 'Open Sans Light', X-LocaleSpecific-Light, @baseFontFamily;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.open-sans-extrabold() {
|
||||
font-family: 'Open Sans Extrabold', X-LocaleSpecific-Extrabold, @baseFontFamily;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
// Button shadows
|
||||
|
||||
@shadowPartBottom: 0px 1px 0px 0px rgba(0, 0, 0, 0.2);
|
||||
|
|
|
|||
|
|
@ -7,22 +7,6 @@
|
|||
|
||||
html { background: #fff; }
|
||||
|
||||
// Locales with jointed scripts should always have normal letter-spacing
|
||||
html[lang='ar'] *,
|
||||
html[lang='fa'] *,
|
||||
html[lang='hi-IN'] *,
|
||||
html[lang='bn-IN'] * {
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
|
||||
|
||||
// No italic for CJKT locales (Bug 973171)
|
||||
html[lang='ja'] *,
|
||||
html[lang='ko'] *,
|
||||
html[lang|='zh'] * {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: @baseFontSize;
|
||||
line-height: 1.5;
|
||||
|
|
|
|||
|
|
@ -8,21 +8,6 @@
|
|||
|
||||
html { background: #fff; }
|
||||
|
||||
// Locales with jointed scripts should always have normal letter-spacing
|
||||
html[lang='ar'] *,
|
||||
html[lang='fa'] *,
|
||||
html[lang='hi-IN'] *,
|
||||
html[lang='bn-IN'] * {
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
|
||||
// No italic for CJKT locales (Bug 973171)
|
||||
html[lang='ja'] *,
|
||||
html[lang='ko'] *,
|
||||
html[lang|='zh'] * {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: @baseFontSize;
|
||||
line-height: @baseLine;
|
||||
|
|
|
|||
|
|
@ -40,8 +40,12 @@
|
|||
|
||||
@borderColor: #d6d6d6;
|
||||
|
||||
// The custom X-LocaleSpecific font family is defined with a @font-face rule in
|
||||
// locale-specific stylesheets which can be found at /media/css/l10n/. See
|
||||
// /docs/l10n.rst for details.
|
||||
@baseFontFamily: 'Open Sans', X-LocaleSpecific, sans-serif;
|
||||
|
||||
@baseFontSize: 14px;
|
||||
@baseFontFamily: 'Open Sans', sans-serif;
|
||||
@baseLine: 20px;
|
||||
@smallFontSize: 12px;
|
||||
|
||||
|
|
@ -52,15 +56,20 @@
|
|||
@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
|
||||
|
||||
|
||||
.open-sans {
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
.open-sans() {
|
||||
font-family: @baseFontFamily;
|
||||
}
|
||||
|
||||
.open-sans-light {
|
||||
font-family: 'Open Sans Light', sans-serif;
|
||||
.open-sans-light() {
|
||||
font-family: 'Open Sans Light', X-LocaleSpecific-Light, @baseFontFamily;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.open-sans-extrabold() {
|
||||
font-family: 'Open Sans Extrabold', X-LocaleSpecific-Extrabold, @baseFontFamily;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
zoom: 1;
|
||||
&:after {
|
||||
|
|
|
|||
|
|
@ -359,22 +359,21 @@
|
|||
margin-bottom: 60px;
|
||||
}
|
||||
p.opensans-extra-bold {
|
||||
font-family: 'Open Sans ExtraBold';
|
||||
.open-sans-extrabold;
|
||||
font-style: italic;
|
||||
}
|
||||
p.opensans-bold-italic {
|
||||
font-family: "Open Sans";
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
.open-sans;
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
p.opensans-italic {
|
||||
font-family: "Open Sans";
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
.open-sans;
|
||||
font-style: italic;
|
||||
}
|
||||
p.opensans-light-italic {
|
||||
font-family: "Open Sans Light";
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
.open-sans-light;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -405,14 +404,15 @@
|
|||
margin-bottom: 60px;
|
||||
}
|
||||
p#approved-headlines {
|
||||
font-family: 'Open Sans ExtraBold';
|
||||
.open-sans-extrabold;
|
||||
font-style: italic;
|
||||
font-size: 60px;
|
||||
line-height: 90%;
|
||||
color: #0095dd;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
p#headlines {
|
||||
font-family: "Open Sans Light";
|
||||
.open-sans-light;
|
||||
font-size: 60px;
|
||||
line-height: 90%;
|
||||
color: #0095dd;
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
}
|
||||
|
||||
.top-figcaption {
|
||||
font-family: 'Open Sans Light';
|
||||
.open-sans-light;
|
||||
font-size: 16px;
|
||||
color: #eee;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,29 +2,9 @@
|
|||
// 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/.
|
||||
|
||||
@import "../sandstone/fonts.less";
|
||||
@import "../sandstone/lib.less";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans Light';
|
||||
src: url('/media/fonts/OpenSans-LightItalic-webfont.eot');
|
||||
src: url('/media/fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
|
||||
url('/media/fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('/media/fonts/OpenSans-Bold-webfont.eot');
|
||||
src: url('/media/fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-Bold-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
|
||||
url('/media/fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('/media/fonts/OpenSans-BoldItalic-webfont.eot');
|
||||
|
|
@ -32,17 +12,19 @@
|
|||
url('/media/fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
|
||||
url('/media/fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
|
||||
font-weight: 600;
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans ExtraBold';
|
||||
font-family: 'Open Sans Extrabold';
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot');
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansLightItalic') format('svg');
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@darkThemeText: #9a9ea1;
|
||||
|
|
@ -180,7 +162,7 @@ a[href="#TODO"] { color: #f00 !important; }
|
|||
}
|
||||
&.path > a {
|
||||
.open-sans;
|
||||
font-weight: 600;
|
||||
font-weight: bold;
|
||||
letter-spacing: -0.02em;
|
||||
color: @textColorSecondary;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,19 +3,21 @@
|
|||
// IE does not like file-relative (e.g. '../fonts/*') URLs due to our
|
||||
// redirects. Always use domain-relative urls like the font URLs below.
|
||||
|
||||
@import "../sandstone/lib.less";
|
||||
|
||||
// Fonts
|
||||
|
||||
|
||||
// Open Sans Extra Bold Italic for Firefox OS promo
|
||||
@font-face {
|
||||
font-family: 'Open Sans ExtraBoldItalic';
|
||||
font-family: 'Open Sans Extrabold';
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot');
|
||||
src: url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
|
||||
url('/media/fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraBoldItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
|
@ -103,7 +105,7 @@ html[dir='rtl'] #tabzilla {
|
|||
#tabzilla-panel {
|
||||
height: 0;
|
||||
background: #fff;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
.open-sans;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
line-height: 1.3;
|
||||
|
|
@ -178,7 +180,7 @@ html[dir='rtl'] #tabzilla {
|
|||
#tabzilla-panel #tabzilla-nav h2 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
.open-sans;
|
||||
color: #484848;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
|
|
@ -413,10 +415,10 @@ html[dir='rtl'] #tabzilla {
|
|||
h4 {
|
||||
text-shadow: none;
|
||||
color: #fff;
|
||||
font-family: Open Sans ExtraBoldItalic;
|
||||
.open-sans-extrabold;
|
||||
font-style: italic;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: -.1ex;
|
||||
font-weight: normal;
|
||||
font-size: 40px;
|
||||
line-height: 1;
|
||||
margin-bottom: 10px;
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче