Skip to content

Commit a361e9f

Browse files
tonypconwaytonypconway
authored
Adds a "supported browsers" page to the gh-pages site (#3132)
* scaffolding for Baseline browser version page * Commit with web version of bbm * add some controls to the UI * Explanatory text * Install b-b-m from remote repository * conditionally add /web-features to script URL * add comment on 11ty conditional requirement * convert lists to tables * Test with [email protected] * Add some view transitions, why not?! * Load baseline-browser-mapping from jsdelivr * Change import strategy to use CDN delivered version of JS library * Remove baseline-browser-mapping package dependency in gh-pages * Run prettier on supported-browsers.html
1 parent 0951255 commit a361e9f

File tree

2 files changed

+424
-54
lines changed

2 files changed

+424
-54
lines changed

‎gh-pages/src/_includes/default.html‎

Lines changed: 58 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,66 +1,70 @@
11
<!DOCTYPE html>
22
<html lang="en-US">
3-
<head>
4-
<meta charset="UTF-8">
5-
<meta property="og:locale" content="en_US" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1">
73

8-
{% if title %}
9-
<title>{{ title }} | Baseline</title>
10-
<meta property="og:title" content="{{ title }}" />
11-
<meta property="twitter:title" content="{{ title }}" />
12-
{% else %}
13-
<title>Baseline</title>
14-
{% endif %}
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta property="og:locale" content="en_US" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
158

16-
{% if description %}
17-
<meta name="description" content="{{ description }}" />
18-
<meta property="og:description" content="{{ description }}">
19-
{% endif %}
9+
{% if title %}
10+
<title>{{ title }} | Baseline</title>
11+
<meta property="og:title" content="{{ title }}" />
12+
<meta property="twitter:title" content="{{ title }}" />
13+
{% else %}
14+
<title>Baseline</title>
15+
{% endif %}
2016

21-
<link rel="canonical" href="{{ page.url | htmlBaseUrl: "https://web-platform-dx.github.io" }}" />
22-
<meta property="og:url" content="{{ page.url | htmlBaseUrl: "https://web-platform-dx.github.io" }}" />
17+
{% if description %}
18+
<meta name="description" content="{{ description }}" />
19+
<meta property="og:description" content="{{ description }}">
20+
{% endif %}
2321

24-
<meta property="og:site_name" content="Baseline" />
25-
<meta property="og:type" content="website" />
26-
<meta name="twitter:card" content="summary" />
22+
<link rel="canonical" href="{{ page.url | htmlBaseUrl: " https://web-platform-dx.github.io" }}" />
23+
<meta property="og:url" content="{{ page.url | htmlBaseUrl: " https://web-platform-dx.github.io" }}" />
2724

28-
<link rel="stylesheet" href="/assets/css/style.css">
29-
<link rel="icon" type="image/png" href="/assets/img/wide-sq-32.png" sizes="32x32" />
30-
<link rel="icon" type="image/png" href="/assets/img/wide-sq-192.png" sizes="192x192" />
31-
</head>
32-
<body>
33-
<div class="wrapper">
34-
<header>
25+
<meta property="og:site_name" content="Baseline" />
26+
<meta property="og:type" content="website" />
27+
<meta name="twitter:card" content="summary" />
3528

36-
<a href="/">
37-
<img src="/assets/img/baseline-wordmark.svg" alt="Baseline logo" />
38-
</a>
29+
<link rel="stylesheet" href="/assets/css/style.css">
30+
<link rel="icon" type="image/png" href="/assets/img/wide-sq-32.png" sizes="32x32" />
31+
<link rel="icon" type="image/png" href="/assets/img/wide-sq-192.png" sizes="192x192" />
32+
</head>
3933

40-
<p>
41-
Baseline gives you clear information about which web platform features work across browsers.
42-
</p>
34+
<body>
35+
<div class="wrapper">
36+
<header>
4337

44-
<ul class="nav">
45-
<li><a href="/">Baseline</a></li>
46-
<li><a href="/web-features/">web-features</a></li>
47-
<li><a href="/webdx-cg/">WebDX Community Group</a></li>
48-
<li><a href="/use-baseline/">Baseline in your project</a></li>
49-
<li><a href="/name-and-logo-usage-guidelines/">Name and logo usage guidelines</a></li>
50-
<li><a href="/baseline-in-the-wild/">Baseline in the wild</a></li>
51-
<li><a href="https://github.com/web-platform-dx/web-features/tree/main/docs">Project documentation</a></li>
52-
<li><a href="https://github.com/web-platform-dx/web-features/">GitHub repository</a></li>
53-
</ul>
54-
</header>
38+
<a href="/">
39+
<img src="/assets/img/baseline-wordmark.svg" alt="Baseline logo" />
40+
</a>
5541

56-
<section>
57-
{% if title %}<h1>{{ title }}</h1>{% endif %}
42+
<p>
43+
Baseline gives you clear information about which web platform features work across browsers.
44+
</p>
5845

59-
{{ content }}
60-
</section>
61-
<footer>
62-
<!-- Footer Content -->
63-
</footer>
64-
</div>
65-
</body>
66-
</html>
46+
<ul class="nav">
47+
<li><a href="/">Baseline</a></li>
48+
<li><a href="/web-features/">web-features</a></li>
49+
<li><a href="/supported-browsers/">Supported browsers</a></li>
50+
<li><a href="/webdx-cg/">WebDX Community Group</a></li>
51+
<li><a href="/use-baseline/">Baseline in your project</a></li>
52+
<li><a href="/name-and-logo-usage-guidelines/">Name and logo usage guidelines</a></li>
53+
<li><a href="/baseline-in-the-wild/">Baseline in the wild</a></li>
54+
<li><a href="https://github.com/web-platform-dx/web-features/tree/main/docs">Project documentation</a></li>
55+
<li><a href="https://github.com/web-platform-dx/web-features/">GitHub repository</a></li>
56+
</ul>
57+
</header>
58+
59+
<section>
60+
{% if title %}<h1>{{ title }}</h1>{% endif %}
61+
62+
{{ content }}
63+
</section>
64+
<footer>
65+
<!-- Footer Content -->
66+
</footer>
67+
</div>
68+
</body>
69+
70+
</html>

0 commit comments

Comments
 (0)