This repository has been archived by the owner on Aug 26, 2022. It is now read-only.
/
homepage.html
173 lines (154 loc) · 8.02 KB
/
homepage.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
{% extends "base.html" %}
{% block body_attributes %}id="home"{% endblock %}
{% block site_css %}
{{ super() }}
{{ css('home', 'all') }}
{% endblock %}
{% block extrahead %}
<meta name="google-site-verification" content="Phj8dHc2oKwic3FGPsKIhdOBk_1wnCTnKwjcjiLgJPc">
<meta name="google-site-verification" content="TH9rA27HbfjO_XqYWTIPrW1E7E7Dtgsh7ULzHi3UTVA">
{% set seo_description = _('The Mozilla Developer Network (MDN) provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and HTML5 Apps. It also documents Mozilla products, like Firefox OS.') %}
{% set social_title = 'Mozilla Developer Network' %}
<meta property="og:description" content="{{ seo_description }}">
<meta name="description" content="{{ seo_description }}">
<meta name="twitter:description" content="{{ seo_description }}">
<meta name="twitter:title" content="{{ social_title }}">
<meta property="og:title" content="{{ social_title }}">
{% endblock %}
{% block content %}
<!-- top search area -->
<div class="home-masthead"><div class="center">
<h1>{{ _('Shared knowledge <span>for the Open Web</span>') }}</h1>
<div class="home-search-form">
<form action="{{ url('search') }}" method="get">
<label for="home-q" class="offscreen">{{ _('Search') }}</label>
<input type="search" id="home-q" name="q" placeholder="{{ _('Search the docs') }}" />
<button type="submit" class="offscreen">{{ _('Search') }}</button>
</form>
</div>
<div class="home-features">
<h2 class="offscreen">{{ _('Web Technologies') }}</h2>
<div class="column-container">
<div class="column-home-features">
<h3><i aria-hidden="true" class="icon-file-text"></i><span>{{ _('Web<br />Platform') }}</span></h3>
<ul>
<li><a href="{{ devmo_url('Web/Reference/API') }}">{{ _('Web APIs & DOM') }}</a></li>
<li><a href="{{ devmo_url('Web/HTML') }}">{{ _('HTML') }}</a> & <a href="{{ devmo_url('Web/Guide/HTML/HTML5') }}">{{ _('HTML5') }}</a></li>
<li><a href="{{ devmo_url('Web/CSS') }}">{{ _('CSS') }}</a> & <a href="{{ devmo_url('Web/CSS/CSS3') }}">{{ _('CSS3') }}</a></li>
<li><a href="{{ devmo_url('Web/JavaScript') }}">{{ _('JavaScript') }}</a></li>
<li><a href="{{ devmo_url('Web') }}">{{ _('more...') }}</a></li>
</ul>
</div>
<div class="column-home-features">
<h3 class="zones"><i aria-hidden="true" class="icon-suitcase"></i><span>{{ _('Zones') }}</span></h3>
<ul>
<li><a href="{{ devmo_url('Firefox') }}">{{ _('Firefox') }}</a></li>
<li><a href="{{ devmo_url('Firefox_OS') }}">{{ _('Firefox OS') }}</a></li>
<li><a href="{{ devmo_url('Mozilla/Marketplace') }}">{{ _('Firefox Marketplace') }}</a></li>
<li><a href="{{ devmo_url('Apps') }}">{{ _('App Center') }}</a></li>
<li><a href="{{ devmo_url('Mozilla/Add-ons') }}?menu">{{ _('Add-ons') }}</a></li>
</ul>
</div>
<div class="column-home-features">
<h3><i aria-hidden="true" class="icon-wrench"></i><span>{{ _('Developer<br />Tools') }}</span></h3>
<ul>
<li><a href="{{ devmo_url('Mozilla/Firefox_OS/Using_the_App_Manager') }}">{{ _('Firefox OS App Manager') }}</a></li>
<li><a href="{{ devmo_url('Tools/Page_Inspector') }}">{{ _('Page Inspector') }}</a></li>
<li><a href="{{ devmo_url('Tools/Debugger') }}">{{ _('JavaScript Debugger') }}</a></li>
<li><a href="{{ devmo_url('Tools/Web_Console') }}">{{ _('Web Console') }}</a></li>
<li><a href="{{ devmo_url('Tools') }}">{{ _('more...') }}</a></li>
</ul>
</div>
<div class="column-home-features">
<h3 class="connect"><i aria-hidden="true" class="icon-certificate"></i><span>{{ _('Connect') }}</span></h3>
<p>{{ _('Get Web technology news from Mozilla, get help from other developers, and more!') }}</p>
<p><a href="{{ devmo_url('Mozilla/Connect') }}">{{ _('Learn more and sign up!') }}</a></p>
</div>
</div>
</div>
</div></div>
<!-- callout area -->
<div class="home-callouts">
<h2 class="offscreen">{{ _('Open Web and Mobile') }}</h2>
<div class="column-container center">
<div class="column-callout callout-apps">
<a href="{{ devmo_url('Web/Apps') }}"><span>{{ _('Create<br />Web Apps') }}</span><i></i></a>
</div>
<div class="column-callout callout-android">
<a href="{{ devmo_url('Mozilla/Firefox_for_Android') }}"><span>{{ _('Develop<br />Firefox for Android') }}</span><i></i></a>
</div>
<div class="column-callout callout-firefoxos">
<a href="{{ devmo_url('Mozilla/Firefox_OS') }}"><span>{{ _('Build<br />Firefox OS') }}</span><i></i></a>
</div>
</div>
</div>
<!-- hacks area -->
<div class="home-hacks"><div class="column-container center">
<div class="column-hacks" dir="ltr">
<h2><i aria-hidden="true" class="icon-star"></i> Hacks Blog<span class="heading-link">{{ _('<a href="http://hacks.mozilla.org">read more at hacks.mozilla.org <i aria-hidden="true" class="icon-arrow-right"></i></a></span>') }}</h2>
{{ newsfeed(updates, section_headers=True) }}
</div>
<div class="column-involved">
<div class="home-involved-card"><a href="{{ devmo_url('Project:MDN/Contributing') }}">
<h2 class="title">{{ _('Get Involved') }}</h2>
<p class="numbers">{{ _('<span class="row1">Join <span class="number">5,453</span> contributors</span> <span class="row2">in <span class="number">36</span> languages and locales</span> <span class="row3">around the world.</span>') }}</p>
<p><span class="button">{{ _('Help improve MDN') }}</span></p>
</a></div>
</div>
</div></div>
<!-- demos and dev derby -->
{% if demos %}
<div class="home-demos"><div class="center">
{% if not waffle.flag('derby_closed') %}
<div class="preview">
<span>{{ _('Next Dev Derby: <strong>July 2013</strong>') }}</span>
<span>{{ _('Subject: <strong>File API</strong>') }}</span>
</div>
{% endif %}
<h2><i aria-hidden="true" class="icon-magic blue"></i> {{ _('See & submit demos') }}
{% if not waffle.flag('derby_closed') %}
<a href="{{ url('demos_devderby_landing') }}" class="heading-link">{{ _('MDN Dev Derby <i aria-hidden="true" class="icon-arrow-right"></i>') }}</a>
{% else %}
<a href="{{ url('demos') }}" class="heading-link">{{ _('MDN Demo Studio <i aria-hidden="true" class="icon-arrow-right"></i>') }}</a>
{% endif %}
</h2>
<div class="home-demos-list">
{% set extra_class = cycler(' row-first', '')%}
{% for submission in demos %}
{{ submission_thumb(submission, extra_class, thumb_width="180", thumb_height="133", is_homepage=True) }}
{% endfor %}
</div>
</div></div>
{% endif %}
<!-- contributions section -->
<div class="home-contribute"><div class="center">
<h2><i aria-hidden="true" class="icon-smile-o"></i> {{ _('Help improve MDN') }}</h2>
<div class="column-container">
<div class="column-half">
<p>{{ _('All parts of MDN (docs, demos, and the site itself) are created by an open community of developers. Please join us! Pick one of these ways to help:') }}</p>
</div>
<div class="column-half">
<div class="column-container">
<div class="column-half">
<ul>
<li><a href="{{ devmo_url('MDN/Getting_started') }}">{{ _('Getting started') }}</a></li>
<li><a href="{{ devmo_url('MDN/Contribute/Howto/Do_an_editorial_review') }}">{{ _('Editorial review') }}</a></li>
<li><a href="{{ devmo_url('MDN/Contribute/Howto/Do_a_technical_review') }}">{{ _('Technical review') }}</a></li>
</ul>
</div>
<div class="column-half">
<ul>
<li><a href="{{ devmo_url('MDN/Contribute/Localize/Translating_pages') }}">{{ _('Translating') }}</a></li>
<li><a href="{{ devmo_url('MDN/Promote') }}">{{ _('Promoting MDN') }}</a></li>
<li><a href="https://github.com/mozilla/kuma#readme">{{ _('Contributing to the MDN codebase') }}</a></li>
</ul>
</div>
</div>
</div>
</div>
</div></div>
{% endblock %}
{% block js %}
{{ super() }}
{{ js('home', async=True) }}
{% endblock %}