Skip to content

Commit 5ff8ae0

Browse files
ostafinskimostafinskim
committed
add new landing page templates and navigation components with updated logos
1 parent bc411d5 commit 5ff8ae0

File tree

10 files changed

+771
-0
lines changed

10 files changed

+771
-0
lines changed

‎assets-src/images/w3c-logo-full-color.png‎

2.69 KB
Loading

‎assets-src/svg/w3c-logo-letters.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎design-system-templates/components/header-new-logo-v2.html.twig‎

Lines changed: 277 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,277 @@
1+
<header class="global-header">
2+
<span role="status" aria-live="polite"></span>
3+
<div class="banner">
4+
<div class="banner__inner l-center">
5+
<p>This is a new website. <a href="https://github.com/w3c/w3c-website">Give feedback</a> to help us improve it.</p>
6+
</div>
7+
</div>
8+
<nav id="lang-nav" aria-label="Language options">
9+
<div class="l-center">
10+
<div class="l-cluster">
11+
<ul>
12+
<li><a href="/ja" hreflang="ja" lang="ja">日本語ホームページ<span class="visuallyhidden" lang="en"> (Japanese website)</span></a></li>
13+
<li><a href="/zh" hreflang="zh-hans" lang="zh-hans">简体中文首页<span class="visuallyhidden" lang="en"> (Chinese website)</span></a></li>
14+
</ul>
15+
</div>
16+
</div>
17+
</nav>
18+
<nav id="global-nav" aria-label="Main">
19+
<div class="global-nav__inner l-center">
20+
<a class="logo-link" href="/">
21+
<span class="logo">
22+
<img src="/dist/assets/svg/w3c-logo-letters.svg" alt="W3C" role="img"/>
23+
</span>
24+
<span class="visuallyhidden">Visit the W3C homepage</span>
25+
</a>
26+
<button type="button" class="button button--ghost with-icon--after with-icon--larger" data-trigger="mobile-nav" style="display: none;"></button>
27+
<ul data-component="nav-double-intro">
28+
<li class="top-nav-item has-children">
29+
<a href="path/to/page" class="nav-link">Standards</a>
30+
<div class="nav__submenu" data-nav="submenu" style="display: none;">
31+
<div class="l-center">
32+
<div class="nav__submenu__intro">
33+
<h2 class="nav__submenu__intro__heading">Standards</h2>
34+
<div class="nav__submenu__intro__text">
35+
<p>Understand the various specifications, their maturity levels on the Web Standards track, and their adoption.</p>
36+
<a href="path/to/page">Explore Web Standards</a>
37+
</div>
38+
</div>
39+
<ul>
40+
<li>
41+
<a href="path/to/page">Technical reports</a>
42+
</li>
43+
<li>
44+
<a href="path/to/page">Translations of technical reports</a>
45+
</li>
46+
<li>
47+
<a href="path/to/page"> Liaisons</a>
48+
</li>
49+
<li>
50+
<a href="path/to/page">Promote web standards</a>
51+
</li>
52+
</ul>
53+
</div>
54+
</div>
55+
</li>
56+
<li class="top-nav-item has-children">
57+
<a href="path/to/page" class="nav-link">Groups</a>
58+
<div class="nav__submenu" data-nav="submenu" style="display: none;">
59+
<div class="l-center">
60+
<div class="nav__submenu__intro">
61+
<h2 class="nav__submenu__intro__heading">Groups</h2>
62+
<div class="nav__submenu__intro__text">
63+
<p>A variety of groups develop Web Standards, guidelines, or supporting materials.</p>
64+
<a href="path/to/page">Discover W3C groups</a>
65+
</div>
66+
</div>
67+
<ul>
68+
<li>
69+
<a href="path/to/page">Working groups</a>
70+
</li>
71+
<li>
72+
<a href="path/to/page">Interest groups</a>
73+
</li>
74+
<li>
75+
<a href="path/to/page">Community groups</a>
76+
</li>
77+
<li>
78+
<a href="path/to/page">Business groups</a>
79+
</li>
80+
<li>
81+
<a href="path/to/page">Technical architecture group</a>
82+
</li>
83+
<li>
84+
<a href="path/to/page">Advisory Board</a>
85+
</li>
86+
<li>
87+
<a href="path/to/page">Invited experts</a>
88+
</li>
89+
<li>
90+
<a href="path/to/page">Participant guidebook</a>
91+
</li>
92+
<li>
93+
<a href="path/to/page">Mailing lists</a>
94+
</li>
95+
</ul>
96+
</div>
97+
</div>
98+
</li>
99+
<li class="top-nav-item has-children">
100+
<a href="path/to/page" class="nav-link">Get involved</a>
101+
<div class="nav__submenu" data-nav="submenu" style="display: none;">
102+
<div class="l-center">
103+
<div class="nav__submenu__intro">
104+
<h2 class="nav__submenu__intro__heading">Get involved</h2>
105+
<div class="nav__submenu__intro__text">
106+
<p>W3C works at the nexus of core technology, industry needs, and societal needs.</p>
107+
<a href="path/to/page">Find ways to get involved</a>
108+
</div>
109+
</div>
110+
<ul>
111+
<li>
112+
<a href="path/to/page">Working in business ecosystems</a>
113+
</li>
114+
<li>
115+
<a href="path/to/page">E-commerce</a>
116+
</li>
117+
<li>
118+
<a href="path/to/page">Media &amp; Entertainment</a>
119+
</li>
120+
<li>
121+
<a href="path/to/page">Network &amp; Communications</a>
122+
</li>
123+
<li>
124+
<a href="path/to/page">Publishing</a>
125+
</li>
126+
<li>
127+
<a href="path/to/page">Smart Cities</a>
128+
</li>
129+
<li>
130+
<a href="path/to/page">Transportation</a>
131+
</li>
132+
<li>
133+
<a href="path/to/page">Web Advertising</a>
134+
</li>
135+
<li class="break-after">
136+
<a href="path/to/page">Web of Things</a>
137+
</li>
138+
<li>
139+
<a href="path/to/page">W3C Membership</a>
140+
</li>
141+
<li>
142+
<a href="path/to/page">Donate</a>
143+
</li>
144+
<li>
145+
<a href="path/to/page">Sponsoring W3C</a>
146+
</li>
147+
</ul>
148+
</div>
149+
</div>
150+
</li>
151+
<li class="top-nav-item has-children">
152+
<a href="path/to/page" class="nav-link">Resources</a>
153+
<div class="nav__submenu" data-nav="submenu" style="display: none;">
154+
<div class="l-center">
155+
<div class="nav__submenu__intro">
156+
<h2 class="nav__submenu__intro__heading">Resources</h2>
157+
<div class="nav__submenu__intro__text">
158+
<p>Master Web technology fundamentals, use our developer tools, or contribute code.</p>
159+
<a href="path/to/page">Learn from W3C resources</a>
160+
</div>
161+
</div>
162+
<ul>
163+
<li>
164+
<a href="path/to/page">Validators and tools</a>
165+
</li>
166+
<li>
167+
<a href="path/to/page">Accessibility fundamentals</a>
168+
</li>
169+
<li>
170+
<a href="path/to/page">Internationalization</a>
171+
</li>
172+
<li>
173+
<a href="path/to/page">Learn CSS</a>
174+
</li>
175+
</ul>
176+
</div>
177+
</div>
178+
</li>
179+
<li class="top-nav-item has-children">
180+
<a href="path/to/page" class="nav-link">News and events</a>
181+
<div class="nav__submenu" data-nav="submenu" style="display: none;">
182+
<div class="l-center">
183+
<div class="nav__submenu__intro">
184+
<h2 class="nav__submenu__intro__heading">News and events</h2>
185+
<div class="nav__submenu__intro__text">
186+
<p>Recent content across news, blogs, press releases, media; upcoming events.</p>
187+
<a href="path/to/page">Follow news and events</a>
188+
</div>
189+
</div>
190+
<ul>
191+
<li>
192+
<a href="path/to/page">News</a>
193+
</li>
194+
<li>
195+
<a href="path/to/page">Blog</a>
196+
</li>
197+
<li>
198+
<a href="path/to/page">Press releases</a>
199+
</li>
200+
<li class="break-after">
201+
<a href="path/to/page">In the media</a>
202+
</li>
203+
<li>
204+
<a href="path/to/page">Events</a>
205+
</li>
206+
<li>
207+
<a href="path/to/page">Talks</a>
208+
</li>
209+
<li>
210+
<a href="path/to/page">Workshops</a>
211+
</li>
212+
<li>
213+
<a href="path/to/page">Meetings</a>
214+
</li>
215+
<li>
216+
<a href="path/to/page">Conferences</a>
217+
</li>
218+
</ul>
219+
</div>
220+
</div>
221+
</li>
222+
<li class="top-nav-item has-children">
223+
<a href="path/to/page" class="nav-link">About</a>
224+
<div class="nav__submenu" data-nav="submenu" style="display: none;">
225+
<div class="l-center">
226+
<div class="nav__submenu__intro">
227+
<h2 class="nav__submenu__intro__heading">About</h2>
228+
<div class="nav__submenu__intro__text">
229+
<p>Understand our values and principles, learn our history, look into our policies, meet our people.</p>
230+
<a href="path/to/page">Find out more about us</a>
231+
</div>
232+
</div>
233+
<ul>
234+
<li>
235+
<a href="path/to/page">Our mission</a>
236+
</li>
237+
<li>
238+
<a href="path/to/page">Sponsoring W3C</a>
239+
</li>
240+
<li>
241+
<a href="path/to/page">History</a>
242+
</li>
243+
<li>
244+
<a href="path/to/page">Leadership</a>
245+
</li>
246+
<li>
247+
<a href="path/to/page">Staff</a>
248+
</li>
249+
<li>
250+
<a href="path/to/page">Evangelists</a>
251+
</li>
252+
<li>
253+
<a href="path/to/page">Careers</a>
254+
</li>
255+
<li>
256+
<a href="path/to/page">Press and media</a>
257+
</li>
258+
<li>
259+
<a href="path/to/page">Contact</a>
260+
</li>
261+
<li>
262+
<a href="path/to/page">Policies and legal information</a>
263+
</li>
264+
</ul>
265+
</div>
266+
</div>
267+
</li>
268+
<li class="top-nav-item">
269+
<a href="path/to/page" class="nav-link icon-link"><img class="icon" src="/dist/assets/svg/search.svg" width="24" height="24" alt aria-hidden="true"><span class="hide-at-max-width">Search</span></a>
270+
</li>
271+
<li class="top-nav-item">
272+
<a href="path/to/page" class="account-login icon-link with-icon--after">My account <span class="avatar avatar--small icon"><img src="/dist/assets/svg/avatar.svg" width="32" height="32" alt aria-hidden="true" /></span></a>
273+
</li>
274+
</ul>
275+
</div>
276+
</nav>
277+
</header>

0 commit comments

Comments
 (0)