Skip to content

Commit 7c78eeb

Browse files
ortaorta
committed
Adds a lot of polish
1 parent e309fe4 commit 7c78eeb

25 files changed

Lines changed: 518 additions & 475 deletions

File tree

‎dangerfile.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ spellcheck({
1717
// Print out the PR url
1818
const deployURL = `https://typescript-v2-${danger.github.pr.number}.ortam.now.sh`
1919
message(
20-
`Deployed to [a PR branch](${deployURL}) - [playground](${deployURL}/en/play) [tsconfig](${deployURL}/en/tsconfig) [old handbook](${deployURL}/docs/handbook/integrating-with-build-tools.html)`
20+
`Deployed to [a PR branch](${deployURL}) - [playground](${deployURL}/play) [tsconfig](${deployURL}/en/tsconfig) [old handbook](${deployURL}/docs/handbook/integrating-with-build-tools.html)`
2121
)
2222

2323
// Look for new snapshots and show in a HTML table

‎packages/create-typescript-playground-plugin/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ A template for creating new plugins for the TypeScript playground.
66
<p>You need about 5 minutes, Node.js, yarn and a Chromium based browser.</p>
77
<p><b>Step 1</b>: Use the template to bootstrap: <code>npm init typescript-playground-plugin MyPlugin</code></p>
88
<p><b>Step 2</b>: Run <code>yarn start</code> in the new repo, to start up the local dev server</p>
9-
<p><b>Step 3</b>: Open the <a href={withPrefix("/en/play")}>playground</a> in your Chromium browser, click "Options" and enable <code>"Connect to localhost:5000/index.js"</code></p>
9+
<p><b>Step 3</b>: Open the <a href={withPrefix("/play")}>playground</a> in your Chromium browser, click "Options" and enable <code>"Connect to localhost:5000/index.js"</code></p>
1010
<p><b>Step 4</b>: Refresh, and see the new tab. That's your plugin up and running</p>
1111
<p>&nbsp;</p>
1212
<p>That's all the pieces working in tandem, now you can make changes to the template and build out your plugin. The plugin in dev mode will always become forefront when connected, so you can re-load without a lot off clicks. To understand the template's technology, read the <a href='https://github.com/microsoft/TypeScript-Website/blob/v2/packages/create-playground-plugin/template/CONTRIBUTING.md'>CONTRIBUTING.md</a></p>

‎packages/playground/src/index.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -209,8 +209,8 @@ export const setupPlayground = (
209209
const playgroundContainer = document.getElementById('playground-container')!
210210
exampleContainer.style.height = `calc(${playgroundContainer.getBoundingClientRect().height + 26}px - 4rem)`
211211

212-
const width = window.localStorage.getItem('dragbar-x')
213-
exampleContainer.style.width = `calc(100% - ${width}px - 4rem)`
212+
const sideBarWidth = (document.querySelector('.playground-sidebar') as any).offsetWidth
213+
exampleContainer.style.width = `calc(100% - ${sideBarWidth}px - 71px)`
214214
}
215215
}
216216
}

‎packages/typescriptlang-org/lib/bootup/ingestion/createPlaygrounds.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ export const createPlaygrounds = async (
5151
.options
5252

5353
// Support backwards compat with urls doing ts.org/play
54-
if (lang === "en") {
54+
if (lang.name === "en") {
5555
createPage({
5656
path: "/play",
5757
component: playPage,

‎packages/typescriptlang-org/src/assets/community/conferences/tsconf-eu-2020-brief.png‎

68.5 KB
Loading

‎packages/typescriptlang-org/src/components/ShowExamples.scss‎

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -34,17 +34,16 @@
3434
}
3535

3636
button.section-name {
37-
font-size: 2em;
37+
font-size: 2rem;
3838
font-weight: 600;
3939

40-
height: 2em;
40+
height: 2.5rem;
4141
text-decoration: none;
4242
border-bottom: none;
43-
padding-bottom: 0.05em;
44-
padding-left: 0;
43+
padding-bottom: 0.05rem;
4544
margin-top: 0;
4645
padding-top: 0;
47-
margin-right: 1em;
46+
margin-right: 1rem;
4847
border: none;
4948
background-color: transparent;
5049
@media (prefers-color-scheme: dark) {
@@ -115,11 +114,11 @@
115114

116115
.example-indicator {
117116
position: absolute;
118-
right: 0.8em;
119-
top: 0.75em;
120-
width: 0.5em;
121-
height: 0.5em;
122-
border-radius: 0.5em;
117+
right: 0.8rem;
118+
top: 0.75rem;
119+
width: 0.5rem;
120+
height: 0.5rem;
121+
border-radius: 0.5rem;
123122

124123
&.done {
125124
background-color: $ts-main-blue-color;

‎packages/typescriptlang-org/src/components/index/MigrationStories.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const ReverseRow = (props: { children: any }) => <div className="row reverse">{p
88

99
const Slack = ({ firstRun }: { firstRun?: boolean }) => (
1010
<ReverseRow>
11-
<div className="slack">
11+
<div className="slack small_full_width">
1212
<div className='illustration'>
1313
<div className="fg">
1414
<p><strong>First</strong>, we were surprised by the number of small bugs we found when converting our code.</p>
@@ -56,7 +56,7 @@ const Slack = ({ firstRun }: { firstRun?: boolean }) => (
5656

5757
const AirBnB = () => (
5858
<ReverseRow>
59-
<div className="airbnb">
59+
<div className="airbnb small_full_width">
6060
<div className='illustration airbnb'>
6161
<div className="fg">
6262
<p><strong>38% [...] bugs preventable with TypeScript</strong> according to postmortem analysis</p>
@@ -104,7 +104,7 @@ const AirBnB = () => (
104104

105105
const Google = () => (
106106
<ReverseRow>
107-
<div className="goog">
107+
<div className="goog small_full_width">
108108
<div className='illustration '>
109109
<div className="fg">
110110
<p>Using TypeScript is <strong>simple and pleasant</strong> for all Google engineers.</p>
@@ -233,7 +233,7 @@ export const OSS = () => (
233233
<path d="M54.2205 43.0847C55.4331 43.0832 56.6189 43.4412 57.6279 44.1135C58.6369 44.7859 59.4239 45.7423 59.8892 46.8618C60.3545 47.9814 60.4772 49.2138 60.2419 50.4031C60.0066 51.5924 59.4238 52.6852 58.5672 53.5433C57.7106 54.4014 56.6187 54.9862 55.4296 55.2238C54.2405 55.4614 53.0077 55.341 51.8871 54.878C50.7664 54.4149 49.8083 53.63 49.1339 52.6224C48.4595 51.6149 48.0991 50.43 48.0983 49.2176C48.0983 47.5921 48.7441 46.0332 49.8938 44.8838C51.0434 43.7344 52.6026 43.0887 54.2284 43.0887L54.2205 43.0847ZM54.2284 34C51.2177 33.9984 48.2742 34.8896 45.7702 36.5608C43.2662 38.232 41.3141 40.6081 40.1609 43.3886C39.0077 46.1691 38.7051 49.2291 39.2915 52.1816C39.8779 55.134 41.3269 57.8463 43.4552 59.9753C45.5835 62.1043 48.2955 63.5545 51.2482 64.1423C54.2009 64.7301 57.2616 64.4292 60.0433 63.2776C62.8249 62.1261 65.2025 60.1756 66.8753 57.6729C68.5481 55.1702 69.4409 52.2277 69.4409 49.2176C69.4367 45.183 67.8318 41.3147 64.9783 38.4618C62.1249 35.6088 58.2559 34.0042 54.2205 34H54.2284Z" fill="#086E12" />
234234
<path d="M87.2205 43.0847C88.4331 43.0832 89.6189 43.4412 90.6279 44.1135C91.6369 44.7859 92.4239 45.7423 92.8892 46.8618C93.3545 47.9814 93.4772 49.2138 93.2419 50.4031C93.0066 51.5924 92.4238 52.6852 91.5672 53.5433C90.7106 54.4014 89.6187 54.9862 88.4296 55.2238C87.2405 55.4614 86.0077 55.341 84.8871 54.878C83.7664 54.4149 82.8083 53.63 82.1339 52.6224C81.4595 51.6149 81.0991 50.43 81.0983 49.2176C81.0983 47.5921 81.7441 46.0332 82.8938 44.8838C84.0434 43.7344 85.6026 43.0887 87.2284 43.0887L87.2205 43.0847ZM87.2284 34C84.2177 33.9984 81.2742 34.8896 78.7702 36.5608C76.2662 38.232 74.3141 40.6081 73.1609 43.3886C72.0077 46.1691 71.7051 49.2291 72.2915 52.1816C72.8779 55.134 74.3269 57.8463 76.4552 59.9753C78.5835 62.1043 81.2955 63.5545 84.2482 64.1423C87.2009 64.7301 90.2616 64.4292 93.0433 63.2776C95.8249 62.1261 98.2025 60.1756 99.8753 57.6729C101.548 55.1702 102.441 52.2277 102.441 49.2176C102.437 45.183 100.832 41.3147 97.9783 38.4618C95.1249 35.6088 91.2559 34.0042 87.2205 34H87.2284Z" fill="#086E12" />
235235
<path d="M69.4387 11.594C72.6409 11.594 75.2368 8.9986 75.2368 5.797C75.2368 2.59541 72.6409 0 69.4387 0C66.2365 0 63.6406 2.59541 63.6406 5.797C63.6406 8.9986 66.2365 11.594 69.4387 11.594Z" fill="white" />
236-
<path d="M50.9299 103.386H54.7518L59.4867 96.0083L63.7197 103.386L66.5456 98.399L69.4743 103.386H74.7112L77.5055 108.906L82.1455 98.9522L84.426 103.386H87.7539" stroke="#086E12" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" />
236+
<path d="M50.9299 103.386H54.7518L59.4867 96.0083L63.7197 103.386L66.5456 98.399L69.4743 103.386H74.7112L77.5055 108.906L82.1455 98.9522L84.426 103.386H87.7539" stroke="#086E12" strokeWidth="4" strokeLinecap="round" strokeLinejoin="round" />
237237
<path d="M84.3904 90.3259C85.2465 90.3269 86.0672 90.6674 86.6726 91.2726C87.2779 91.8779 87.6184 92.6984 87.6195 93.5543V111.665C87.6184 112.52 87.2779 113.341 86.6726 113.946C86.0672 114.551 85.2465 114.892 84.3904 114.893H54.487C53.6309 114.892 52.8102 114.551 52.2049 113.946C51.5995 113.341 51.259 112.52 51.2579 111.665V93.5543C51.259 92.6984 51.5995 91.8779 52.2049 91.2726C52.8102 90.6674 53.6309 90.3269 54.487 90.3259H84.3944H84.3904ZM84.3944 88.7452H54.487C53.2113 88.7452 51.9879 89.2519 51.0858 90.1538C50.1838 91.0557 49.677 92.2789 49.677 93.5543V111.665C49.677 112.94 50.1838 114.163 51.0858 115.065C51.9879 115.967 53.2113 116.474 54.487 116.474H84.3944C85.6694 116.473 86.8918 115.965 87.793 115.064C88.6942 114.162 89.2004 112.939 89.2004 111.665V93.5543C89.2004 92.2789 88.6937 91.0557 87.7916 90.1538C86.8896 89.2519 85.6661 88.7452 84.3904 88.7452H84.3944Z" fill="#086E12" />
238238
</svg>
239239
<p>Probot</p>
@@ -250,7 +250,7 @@ export const OSS = () => (
250250

251251
<a href='https://github.com/zeit/now' target="_blank">
252252
<svg width="113" height="100" viewBox="0 0 113 100" fill="none" xmlns="http://www.w3.org/2000/svg">
253-
<path fill-rule="evenodd" clip-rule="evenodd" d="M56.5 0L113 100H0L56.5 0Z" fill="url(#paint0_linear)" />
253+
<path fillRule="evenodd" clip-rule="evenodd" d="M56.5 0L113 100H0L56.5 0Z" fill="url(#paint0_linear)" />
254254
<defs>
255255
<linearGradient id="paint0_linear" x1="222.127" y1="228.815" x2="80.0337" y2="32.929" gradientUnits="userSpaceOnUse">
256256
<stop stopColor="#43914B" />
@@ -271,7 +271,7 @@ export const OSS = () => (
271271

272272
<a href='https://github.com/desktop/desktop/' target="_blank">
273273
<svg width="98" height="96" viewBox="0 0 98 96" fill="none" xmlns="http://www.w3.org/2000/svg">
274-
<path fill-rule="evenodd" clip-rule="evenodd" d="M49 0C21.9275 0 0 21.9275 0 49C0 70.6825 14.0262 88.9963 33.5037 95.4888C35.9537 95.9175 36.8725 94.4475 36.8725 93.1613C36.8725 91.9975 36.8113 88.1388 36.8113 84.035C24.5 86.3013 21.315 81.0337 20.335 78.2775C19.7837 76.8687 17.395 72.52 15.3125 71.3562C13.5975 70.4375 11.1475 68.1712 15.2513 68.11C19.11 68.0487 21.8663 71.6625 22.785 73.1325C27.195 80.5437 34.2388 78.4613 37.0563 77.175C37.485 73.99 38.7712 71.8462 40.18 70.6212C29.2775 69.3962 17.885 65.17 17.885 46.4275C17.885 41.0987 19.7838 36.6887 22.9075 33.2587C22.4175 32.0337 20.7025 27.0112 23.3975 20.2737C23.3975 20.2737 27.5013 18.9875 36.8725 25.2963C40.7925 24.1938 44.9575 23.6425 49.1225 23.6425C53.2875 23.6425 57.4525 24.1938 61.3725 25.2963C70.7438 18.9263 74.8475 20.2737 74.8475 20.2737C77.5425 27.0112 75.8275 32.0337 75.3375 33.2587C78.4613 36.6887 80.36 41.0375 80.36 46.4275C80.36 65.2312 68.9063 69.3962 58.0038 70.6212C59.78 72.1525 61.3113 75.0925 61.3113 79.6863C61.3113 86.24 61.25 91.5075 61.25 93.1613C61.25 94.4475 62.1688 95.9788 64.6188 95.4888C83.9738 88.9963 98 70.6212 98 49C98 21.9275 76.0725 0 49 0Z" fill="white" />
274+
<path fillRule="evenodd" clip-rule="evenodd" d="M49 0C21.9275 0 0 21.9275 0 49C0 70.6825 14.0262 88.9963 33.5037 95.4888C35.9537 95.9175 36.8725 94.4475 36.8725 93.1613C36.8725 91.9975 36.8113 88.1388 36.8113 84.035C24.5 86.3013 21.315 81.0337 20.335 78.2775C19.7837 76.8687 17.395 72.52 15.3125 71.3562C13.5975 70.4375 11.1475 68.1712 15.2513 68.11C19.11 68.0487 21.8663 71.6625 22.785 73.1325C27.195 80.5437 34.2388 78.4613 37.0563 77.175C37.485 73.99 38.7712 71.8462 40.18 70.6212C29.2775 69.3962 17.885 65.17 17.885 46.4275C17.885 41.0987 19.7838 36.6887 22.9075 33.2587C22.4175 32.0337 20.7025 27.0112 23.3975 20.2737C23.3975 20.2737 27.5013 18.9875 36.8725 25.2963C40.7925 24.1938 44.9575 23.6425 49.1225 23.6425C53.2875 23.6425 57.4525 24.1938 61.3725 25.2963C70.7438 18.9263 74.8475 20.2737 74.8475 20.2737C77.5425 27.0112 75.8275 32.0337 75.3375 33.2587C78.4613 36.6887 80.36 41.0375 80.36 46.4275C80.36 65.2312 68.9063 69.3962 58.0038 70.6212C59.78 72.1525 61.3113 75.0925 61.3113 79.6863C61.3113 86.24 61.25 91.5075 61.25 93.1613C61.25 94.4475 62.1688 95.9788 64.6188 95.4888C83.9738 88.9963 98 70.6212 98 49C98 21.9275 76.0725 0 49 0Z" fill="white" />
275275
</svg>
276276

277277
<p>GitHub<br />Desktop</p>

‎packages/typescriptlang-org/src/components/layout/SiteFooter.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,15 +67,15 @@ const useTypeScriptLinks = [
6767
},
6868
{
6969
title: "Playground",
70-
url: "/en/play",
70+
url: "/play",
7171
},
7272
{
7373
title: "TSConfig Ref",
7474
url: "/en/tsconfig",
7575
},
7676
{
7777
title: "Code Samples",
78-
url: "/en/play/#show-examples",
78+
url: "/play/#show-examples",
7979
},
8080
]
8181

‎packages/typescriptlang-org/src/components/layout/TopNav.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@
7171

7272
a {
7373
display: block;
74-
padding: 0.75rem 0.5em 0.7em;
74+
padding: 0.95rem 0.5em 0.7em;
7575
&:focus {
7676
text-decoration: underline;
7777
}

‎packages/typescriptlang-org/src/components/layout/TopNav.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -73,8 +73,8 @@ export const SiteNav = (props: Props) => {
7373
<ul>
7474
<li className="nav-item"><Link to={withPrefix("/docs/home")}><span className="hide-only-medium">{i("nav_documentation")}</span><span className="show-only-medium">{i("nav_documentation_short")}</span></Link></li>
7575
<li className="nav-item hide-small"><Link to={withPrefix("/download")}>{i("nav_download")}</Link></li>
76-
<li className="nav-item"><Link to={withPrefix("/community")}>{i("nav_connect")}</Link></li>
77-
<li className="nav-item"><Link to={withPrefix("/en/play")}>{i("nav_playground")}</Link></li>
76+
<li className="nav-item"><Link to={withPrefix("/community")}>{i("nav_community")}</Link></li>
77+
<li className="nav-item"><Link to={withPrefix("/tools")}>{i("nav_tools")}</Link></li>
7878
</ul>
7979
</nav>
8080

0 commit comments

Comments
 (0)