message: more styling pass on layout and typography

diff:
.content-docs {
- @mixin h3 {
- font-size: var(--p-large);
line-height: 2rem;
- }
// Typography
h1,
h3,
.h3 {
- @include h3;
+ font-size: var(--p-large);
+ line-height: 2rem;
}
a {
margin: var(--micro) 0;
}
+ ol {
+ margin-left: 2rem;
+ list-style-type: decimal;
+ }
+
li + li {
margin-top: var(--macro);
}
// Code blocks
- code {
- min-height: 2rem;
- padding: 0 0.5rem;
+ :not(pre) > code {
+ padding: 0.35rem 0.5rem;
border-radius: 0.75rem;
background: var(--brand-light);
-
- &:not([class]) {
- display: inline-flex;
- align-items: center;
+ white-space: pre;
}
- &[class*="language"] {
+ pre {
overflow: auto;
display: block;
+ margin: var(--micro) 0;
padding: 1.25rem 1.5rem;
+ border-radius: 0.75rem;
background: var(--sand-dark);
- }
- &.language-Dockerfile {
+ &:not(.language-null) {
background: var(--off-white);
}
}
- pre {
- margin: var(--micro) 0;
- }
-
blockquote {
margin: 2rem 0;
padding: 1.5rem;


message: style pass to embedded videos

change_type: MODIFY

diff:
margin-top: var(--micro);
}
- p > iframe {
+ p + .video-container {
margin-top: var(--medium);
}
@apply border-t border-solid border-gray-400;
}
+ .video-container {
+ position: relative;
+ overflow: hidden;
+ max-width: 100%;
+ max-height: 315px;
+ width: 560px;
+ margin: auto;
+
+ &::after {
+ display: block;
+ content: "";
+ padding-top: 56.25%;
+ }
+
iframe {
+ position: absolute;
+ top: 0;
+ left: 0;
width: 100%;
+ height: 100%;
+ }
}
}

diff:
@@ -6,8 +6,12 @@ section: configuration
Gitpod dev environments are started with a single click. In order to make sure they come fully initialized and with the tools you need, you should provide a configuration file.
+

+
`youtube: ZgY6a78mAnQ`
+

+
## Setup Assistant
The setup assistant can help you get started with this. Once you open a project without a `.gitpod.yml` you should see a notification in the bottom right that lets you start the assistant.

diff:
@@ -15,8 +15,12 @@ You can start using Gitpod with one or more of the following ways:
- Enable [GitLab Integration](#gitlab-integration)
- Quick start using an [Example Project](#example-project) or [OSS Project](#gitpodified-open-source-project)
+

+
`youtube: ZZ0_TQ6UApY`
+

+
## Prefixed URL
You can quickly open a new workspace for your project using a context URL like repository, branch, pull request, issue, or file. Just prefix the URL in the address bar of your browser with `gitpod.io/#`.

diff:
@@ -10,8 +10,12 @@ With Gitpod it is the same - we treat dev environments as automated resources yo
This is what is at the heart of Gitpod: **an open platform that removes all friction of manually setting up and maintaining dev environments** allowing yourself and your team to build applications quicker and more collaboratively.
+

+
`youtube: d6D-OUPnJeg`
+

+

Gitpod Concepts

Gitpod seamlessly integrates in your workflow and works with all major git hosting platforms including GitHub, GitLab and Bitbucket. It understands the context you are in and adjusts your dev environment accordingly. For example, if you create a Gitpod workspace from a Pull or Merge Request, Gitpod will open a fully-initialized dev environment in code-review mode.

diff:
@@ -8,8 +8,12 @@ Whenever your code changes (e.g. when new commits are pushed to your repository)
Then, when you do create a new workspace on a branch, or Pull/Merge Request, for which a prebuild exists, this workspace will load much faster, because all dependencies will have been already downloaded ahead of time, and your code will be already compiled.
+

+
`youtube: KR8ESjGYsXI`
+

+
## Enable Prebuilt Workspaces
### On Bitbucket

diff:
@@ -9,8 +9,12 @@ There are two different ways to share your workspaces:
- [Sharing Running Workspaces](#sharing-running-workspaces)
- [Sharing Snapshots](#sharing-snapshots)
+

+
`youtube: 9RftoWFzJ2s`
+

+
## Sharing Running Workspaces
Sharing running workspaces makes it possible to quickly look at a workspace together with a (remote) colleague.

license: MIT License

repo: gitpod-io/website

original_message: style pass to embedded videos


message: Add styling wrapper in embedded videos utils

diff:
margin-top: var(--micro);
}
- p + .video-container {
+ p > .video-container {
margin-top: var(--medium);
}
.video-container {
position: relative;
overflow: hidden;
+ display: block;
max-width: 100%;
max-height: 315px;
width: 560px;

diff:
@@ -6,12 +6,8 @@ section: configuration
Gitpod dev environments are started with a single click. In order to make sure they come fully initialized and with the tools you need, you should provide a configuration file.
-

-
`youtube: ZgY6a78mAnQ`
-

-
## Setup Assistant
The setup assistant can help you get started with this. Once you open a project without a `.gitpod.yml` you should see a notification in the bottom right that lets you start the assistant.

diff:
@@ -15,12 +15,8 @@ You can start using Gitpod with one or more of the following ways:
- Enable [GitLab Integration](#gitlab-integration)
- Quick start using an [Example Project](#example-project) or [OSS Project](#gitpodified-open-source-project)
-

-
`youtube: ZZ0_TQ6UApY`
-

-
## Prefixed URL
You can quickly open a new workspace for your project using a context URL like repository, branch, pull request, issue, or file. Just prefix the URL in the address bar of your browser with `gitpod.io/#`.

diff:
@@ -10,12 +10,8 @@ With Gitpod it is the same - we treat dev environments as automated resources yo
This is what is at the heart of Gitpod: **an open platform that removes all friction of manually setting up and maintaining dev environments** allowing yourself and your team to build applications quicker and more collaboratively.
-

-
`youtube: d6D-OUPnJeg`
-

-

Gitpod Concepts

Gitpod seamlessly integrates in your workflow and works with all major git hosting platforms including GitHub, GitLab and Bitbucket. It understands the context you are in and adjusts your dev environment accordingly. For example, if you create a Gitpod workspace from a Pull or Merge Request, Gitpod will open a fully-initialized dev environment in code-review mode.

diff:
@@ -8,12 +8,8 @@ Whenever your code changes (e.g. when new commits are pushed to your repository)
Then, when you do create a new workspace on a branch, or Pull/Merge Request, for which a prebuild exists, this workspace will load much faster, because all dependencies will have been already downloaded ahead of time, and your code will be already compiled.
-

-
`youtube: KR8ESjGYsXI`
-

-
## Enable Prebuilt Workspaces
### On Bitbucket

diff:
@@ -9,12 +9,8 @@ There are two different ways to share your workspaces:
- [Sharing Running Workspaces](#sharing-running-workspaces)
- [Sharing Snapshots](#sharing-snapshots)
-

-
`youtube: 9RftoWFzJ2s`
-

-
## Sharing Running Workspaces
Sharing running workspaces makes it possible to quickly look at a workspace together with a (remote) colleague.

diff:
@@ -3,7 +3,7 @@ import visit from "unist-util-visit";
const youtubeEmbedRegex = new RegExp(`\(youtube\):\(\.\*\)`, "i");
const embedVideoHtml = (videoId, options) => `
-<iframe
+ `
${options.noIframeBorder ? 'style="border:0"' : ""}
allowfullscreen
sandbox="allow-same-origin allow-scripts allow-popups">
-`;
+`;
const visitor = (options) => (node) => {
if (node.type === "inlineCode") {


message: fix active menu styling for index page and initial mobile layout wip

diff:
export let menuItem;
- $: isActiveSection = $docsCurrentSectionStore
- ? menuItem.path.endsWith(`${$docsCurrentSectionStore}/`)
- : false;
+ $: sectionPath = $docsCurrentSectionStore
+ ? `${$docsCurrentSectionStore}\/`
+ : "";
+ $: regex = new RegExp(`\/docs\/${sectionPath}$`);
+ $: isActiveSection = regex.test(menuItem.path);
</script>
<style>

diff:
];
</script>
-
-
-

-

+

{#each MENU as menuItem}
<MenuSection {menuItem} />
{/each}

-

diff:
import Search from "../../components/docs/search.svelte";
</script>
-

-

+
+
+

+

<Menu />

-

+

<Search />
<slot />

diff:
+---
+section: ""
+---
+
# Introduction to Gitpod
[Gitpod](https://www.gitpod.io) is an open source platform for automated and **ready-to-code development environments** that blends into your existing workflow. It enables developers to describe their dev environment as code and **start instant and fresh development environments for each new task** directly from your browser.


message: test for docs root

diff:
export let menuItem;
- $: sectionPath = $docsCurrentSectionStore
- ? `${$docsCurrentSectionStore}\/`
- : "";
- $: regex = new RegExp(`\/docs\/${sectionPath}$`);
- $: isActiveSection = regex.test(menuItem.path);
+ $: isActiveSection = $docsCurrentSectionStore
+ ? menuItem.path.endsWith(`${$docsCurrentSectionStore}/`)
+ : /\/docs\/$/.test(menuItem.path);
</script>
<style>

diff:
label: "Blog",
},
{
- href: "/docs",
+ href: "/docs/",
label: "Docs",
},
{

original_message: test for docs root


message: page anchor jump wip

diff:
a {
font-weight: 700;
-
- &:hover {
- color: var(--brand-ripe);
- }
}
h3 em {

diff:
@@ -93,8 +93,8 @@ a {
text-decoration-color: var(--brand-ripe);
text-underline-offset: 0.25em;
}
-a:hover,
-a:focus {
+a[href]:hover,
+a[href]:focus {
text-decoration: underline solid var(--brand-ripe);
}
/* low specificity. easy to overwrite */

diff:
@@ -4,7 +4,7 @@ section: workspaces
# Life of a Workspace
-- [Timeouts](#timeouts)
+- [Timeouts](docs/life-of-workspace/#timeouts)
- [Garbage Collection](#garbage-collection)
- [Changes Are Saved](#changes-are-saved)
@@ -12,7 +12,7 @@ Gitpod makes creating fresh workspaces as easy as [clicking a button on a GitHub
Gitpod's continuous dev environments encourages you to create fresh workspaces rather than restarting older ones.
This ensures that you are starting from a clean slate with proper configuration.
-## Timeouts
+## Timeouts
Any running workspace will automatically stop after some time of inactivity. Normally, this timeout is 30 minutes but is extended to **60 minutes if you have the _Unlimited_ plan**.
Furthermore, _Unlimited_ users can manually boost the timeout of a workspace to 180 minutes. This comes in handy, e.g. in case you want to go out for a longer lunch or meeting and don't like restarting your workspace when coming back.

original_message: page anchor jump wip


message: address PR feedback and tweak side nav styling

diff:
-

+

+

<MenuLink href={menuItem.path} class="text-h6">{menuItem.title}</MenuLink>
{#if menuItem.subMenu && isActiveSection}

{/each}

{/if}
+

diff:
----
-section: ""
----
-
# Introduction to Gitpod
[Gitpod](https://www.gitpod.io) is an open source platform for automated and **ready-to-code development environments** that blends into your existing workflow. It enables developers to describe their dev environment as code and **start instant and fresh development environments for each new task** directly from your browser.

diff:
@@ -4,7 +4,7 @@ section: workspaces
# Life of a Workspace
-- [Timeouts](docs/life-of-workspace/#timeouts)
+- [Timeouts](#timeouts)
- [Garbage Collection](#garbage-collection)
- [Changes Are Saved](#changes-are-saved)
@@ -12,7 +12,7 @@ Gitpod makes creating fresh workspaces as easy as [clicking a button on a GitHub
Gitpod's continuous dev environments encourages you to create fresh workspaces rather than restarting older ones.
This ensures that you are starting from a clean slate with proper configuration.
-## Timeouts
+## Timeouts
Any running workspace will automatically stop after some time of inactivity. Normally, this timeout is 30 minutes but is extended to **60 minutes if you have the _Unlimited_ plan**.
Furthermore, _Unlimited_ users can manually boost the timeout of a workspace to 180 minutes. This comes in handy, e.g. in case you want to go out for a longer lunch or meeting and don't like restarting your workspace when coming back.


message: styling tweaks after updating branch with main

diff:
.content-docs {
- line-height: 1.8;
+ line-height: 190%;
// Typography
h1,
h1,
.h1 {
- font-size: 3rem;
- line-height: 3.5rem;
+ font-size: var(--h3);
}
h2,
.h2 {
font-size: var(--h4);
- line-height: 2.5rem;
}
h3,
.h3 {
font-size: var(--p-large);
- line-height: 2rem;
}
a {
}
li {
+ // overide _forms.scss
+ margin-bottom: 0;
+
+ li {
margin-top: var(--macro);
}

diff:
: /\/docs\/$/.test(menuItem.path);
</script>
-
-

-

- <MenuLink href={menuItem.path} class="text-h6">{menuItem.title}</MenuLink>
+

+

+ <MenuLink href={menuItem.path} class="text-large">{menuItem.title}</MenuLink
+ >
{#if menuItem.subMenu && isActiveSection}

{#each menuItem.subMenu as sub}
-

+

<MenuLink href={sub.path}>{sub.title}</MenuLink>

{/each}

diff:
];
</script>
-

+

{#each MENU as menuItem}
<MenuSection {menuItem} />
{/each}

diff:
type="search"
placeholder="Search"
id={docSearchInputSelector}
- class="block w-full pl-11 pr-3 py-2 border border-transparent rounded-xl leading-5 bg-white text-gray-600 placeholder-gray-500 focus:outline-none focus:bg-white focus:border-white focus:ring-white focus:text-gray-900"
+ class="box-border block w-full pl-11 pr-3 py-2 border border-transparent rounded-xl leading-5 bg-white text-gray-600 placeholder-gray-500 focus:outline-none focus:bg-white focus:border-white focus:ring-white focus:text-gray-900"
/>
</div>
</div>


message: Hide desktop menu in mobile view

diff:
<style>
.docs-layout {
- @apply py-10;
+ @apply pb-10;
@media (min-width: 769px) {
@apply flex;
+ @apply pt-10;
}
}
.menu {
- @media (min-width: 769px) {
@apply w-2/5 pt-24 pr-8;
+
+ @media (max-width: 768px) {
+ display: none;
}
}

original_message: Hide desktop menu in mobile view


message: very rough mobile menu WIP

change_type: ADD

diff:
+
+
+
+
+

+ {#each MENU as menuItem}
+

+
+
{menuItem.title}

+

+
+

+
+

+ {/each}
+

diff: </script>

diff:
<script>
import Menu from "../../components/docs/menu.svelte";
+ import MobileMenu from "../../components/docs/mobile-menu.svelte";
import Search from "../../components/docs/search.svelte";
import "../../assets/docs.scss";
</script>
</div>
<div class="doc-contents">
<Search />
+ <MobileMenu />
<slot />
</div>
</div>

original_message: very rough mobile menu WIP


message: revert anchor styling

diff:
@@ -99,8 +99,8 @@ a {
text-decoration-color: var(--brand-ripe);
text-underline-offset: 0.25em;
}
-a[href]:hover,
-a[href]:focus {
+a:hover,
+a:focus {
text-decoration: underline solid var(--brand-ripe);
}
/* low specificity. easy to overwrite */

original_message: revert anchor styling


message: hide mobile menu in desktop view

diff:
</script>
<style lang="scss">
+ .mobile-menu {
+ @media (min-width: 769px) {
+ display: none;
+ }
+ }
+
// override _forms.scss
.menu-item {
margin-bottom: 0;

original_message: hide mobile menu in desktop view


message: Replace screenshot

diff:
Remote-first. Secure by Design.

<img
class="screenshot"
- src="/images/gitpod-screenshot.png"
+ src="/images/gitpod-screenshot.jpg"
alt="Gitpod"
height="819"
width="1269"

diff: Binary files /dev/null and b/static/images/gitpod-screenshot.jpg differ

change_type: DELETE

diff: Binary files a/static/images/gitpod-screenshot.png and /dev/null differ

original_message: Replace screenshot


message: Add extensions screenshot

diff:
Remote-first. Secure by Design.

<img
class="screenshot"
- src="/images/gitpod-screenshot.jpg"
+ src="/images/gitpod-editor.jpg"
alt="Gitpod"
height="819"
width="1269"

diff:
<!-- TODO: Insert the VS Code Gitpod theme screenshot -->
<img
- src="/images/features/features-screenshot.png"
+ src="/images/features/gitpod-extensions.jpg"
alt=""
role="presentation"
height="1110"

diff: Binary files /dev/null and b/static/images/features/gitpod-extensions.jpg differ

change_type: RENAME

original_message: Add extensions screenshot


message: Style extension activation page

diff:
window.navigator.userAgent.includes(browser)
);
- const repositoryProviders = [
- {
- icon: "",
- label: "Go to GitLab",
- href: "https://gitlab.com",
- },
- {
- icon: "",
- label: "Go to GitHub",
- href: "https://github.com",
- },
- {
- icon: "",
- label: "Go to Bitbucket",
- href: "https://bitbucket.org",
- },
- ];
-
const features = [
{
- icon: "",
+ icon: "/images/extension-activation/prebuild.svg",
title: "Skip the Waiting",
description:
"Gitpod continuously builds your git branches like a CI server. This means no more waiting for dependencies to be downloaded and builds to finish.",
},
{
- icon: "",
+ icon: "/images/extension-activation/collaborate.svg",
title: "Code Together",
description:
"Do code reviews within Gitpod, work together in one workspace in real-time and share reproducible workspaces with your team.",
},
{
- icon: "",
+ icon: "/images/extension-activation/fresh.svg",
title: "Work Remotely",
description:
"You no longer need an over-powered laptop, Gitpod works just as smoothly on a Chromebook or iPad. All you need is a browser.",
];
</script>
+
+
+
+ Extension Installed

Gitpod for {currentBrowser} is Now Active

-
Now you can easily spin up dev environments with a single click.

+
+

+

+

-
-
Get started

-

-
Go to one of your projects at GitLab, GitHub or Bitbucket.

-

- Click on the Gitpod button and start a dev environment for your project.
-

-

-
-

- {#each repositoryProviders as repositoryProvider}
+

-
- {repositoryProvider.label}
+

+ Now you can easily spin up dev environments with a single click.
+

+

+ The extension adds a Gitpod button on every project and branch across
+ GitLab, GitHub, and Bitbucket so you can easily open a new workspace for
+ any existing project.
+

+

+
+ <svg
+ viewBox="0 0 30 28"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <title>Bitbucket</title>
+ <path
+ d="M14.583 27.214L9.21 10.954h10.738l-5.365 16.26z"
+ fill="#fff"
+ /><path
+ d="M27.476 10.954l1.637 4.94c.148.449-.012.944-.403 1.223L14.584 27.214l12.892-16.26z"
+ fill="#fff"
+ fill-opacity=".65"
+ /><path
+ d="M27.476 10.954h-7.527l3.24-9.793c.165-.5.888-.5 1.06 0l3.227 9.793z"
+ fill="#fff"
+ /><path
+ d="M1.685 10.954l-1.63 4.94c-.148.449.012.944.403 1.223l14.127 10.097-12.9-16.26z"
+ fill="#fff"
+ fill-opacity=".65"
+ /><path
+ d="M1.685 10.954H9.21L5.978 1.161c-.166-.5-.888-.5-1.06 0l-3.233 9.793z"
+ fill="#fff"
+ /><path
+ d="M14.585 27.214l-5.373-16.26H1.685l12.9 16.26z"
+ fill="#fff"
+ fill-opacity=".85"
+ /><path
+ d="M14.584 27.214l12.892-16.26h-7.527l-5.365 16.26z"
+ fill="#fff"
+ fill-opacity=".85"
+ /></svg
+ >
+ Open GitLab
+
+
+ <svg
+ viewBox="0 0 29 30"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <title>GitHub Octocat</title>
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="M14.57.5a14.374 14.374 0 00-9.442 3.54 14.947 14.947 0 00-4.94 8.946A15.133 15.133 0 002.106 23.07a14.615 14.615 0 007.862 6.406c.733.137.992-.329.992-.721v-2.528c-4.065.903-4.923-1.999-4.923-1.999a3.97 3.97 0 00-1.617-2.181c-1.314-.913.107-.913.107-.913.46.067.9.24 1.285.505.386.265.707.617.94 1.029.197.366.464.688.784.949a3.047 3.047 0 003.45.292c.057-.751.374-1.457.894-1.99-3.234-.374-6.63-1.652-6.63-7.3a5.82 5.82 0 011.493-3.989 5.529 5.529 0 01.143-3.933s1.224-.402 4.002 1.524a13.49 13.49 0 017.291 0c2.779-1.926 3.994-1.524 3.994-1.524.536 1.233.6 2.627.179 3.906a5.82 5.82 0 011.492 3.988c0 5.713-3.404 6.963-6.648 7.3.348.358.617.787.788 1.26.17.472.24.976.204 1.479v4.079c0 .484.26.858 1 .712a14.623 14.623 0 007.752-6.43 15.134 15.134 0 001.87-10.019 14.949 14.949 0 00-4.89-8.892A14.377 14.377 0 0014.57.5z"
+ fill="#F9F9F9"
+ />
+ </svg>
+ Open GitHub
+
+
+ <svg
+ viewBox="0 0 27 24"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <title>Bitbucket</title>
+ <path
+ d="M.848.25h-.01a.841.841 0 00-.827.971L3.565 22.8c.091.543.563.945 1.114.95h17.053a.84.84 0 00.837-.703l3.554-21.822a.841.841 0 00-.826-.971h-.011L.848.25zm14.968 15.595h-5.443L8.899 8.146h8.236l-1.32 7.7z"
+ fill="#fff"
+ />
+ </svg>
+ Open Bitbucket
+

- {/each}

+

+

-

+

{#each features as feature}
+

-
+

{feature.title}

{feature.description}

- {/each}

+ {/each}
+

-

+

Learn More About Gitpod

- See Docs
-

+ See Docs
+

original_message: Style extension activation page


message: more menu WIP

diff:
-<style>
- .back-button {
- display: inline-flex;
- align-items: center;
- color: black;
- line-height: 138%;
- }
-
- .back-button__icon {
- flex: 0 0 auto;
- margin-right: 1rem;
- color: black;
- }
-
- .back-button__icon-arrow {
- transform: rotate(90deg);
- }
-</style>
-
-<button class="back-button" type="button" on:click={() => console.log("click")}>
- <div class="back-button__icon">
- <img
- class="back-button__icon-arrow"
- src="/arrow.svg"
- alt="See all topics"
- width="12"
- height="7"
- />
- </div>
- All topics
-</button>

diff:
+
+
+

+ {#if $topicsState}
<MobileMenuTopics />
-<MobileMenuButton />
+ {:else}
<MobileMenuSubMenu />
+ {/if}
+

diff:
.menu-item {
margin-bottom: 0;
- + .menu-item {
- border-top: var(--border-light);
+ &:not(:last-child) {
+ border-bottom: var(--border-light);
}
}

diff:
+import { writable } from "svelte/store";
+
+// true: sub menu open
+// false: sub menu closed
+export default writable(false);

diff:
-

+<button
+ class="back-button"
+ type="button"
+ on:click={() => ($topicsState = !$topicsState)}
+>
+

+
+

+ All topics
+</button>
+
+

<button
class="toggle-button w-full"
type="button"
- on:click={() => console.log("click")}
+ on:click={() => ($subMenuState = !$subMenuState)}
>

NAME

<img
- class="toggle-button__icon-arrow"
+ class={`toggle-button__icon-arrow ${$subMenuState ? "open" : ""}`}
src="/arrow.svg"
- alt="See/hide list"
+ alt="Toggle sub menu"
width="12"
height="7"
/>

</button>
+
+ {#if $subMenuState}

<MenuItem />
<MenuItem />
<MenuItem />
<MenuItem />

+ {/if}

diff:
+import { writable } from "svelte/store";
+
+// true: topics open
+// false: topics closed
+export default writable(false);

diff:
</script>

-

+

{#each MENU as menuItem}

original_message: more menu WIP


message: Update from subject style

diff:
@@ -82,9 +82,9 @@ textarea {
border-color: currentColor;
}
[type="radio"]:checked + label {
- background-image: var(--brand-gradient);
- text-shadow: 0 0 1px currentColor;
color: var(--black);
+ border: 1px solid #ffb45b;
+ background: #ffb45b;
}
.btn-conversion:disabled {
background-color: var(--sand-dark);

original_message: Update from subject style


message: Add card shadow

diff:
}
</style>
-

+

-
{contactCard.title}

+
{contactCard.title}

{contactCard.description}

{contactCard.btnText}</a

diff:
-

+

{#each contactCards as contactCard}
<Card {contactCard} />
{/each}

-

+

<form on:submit|preventDefault={handleSubmit} novalidate>

Send us a message

>

- <button
- type="submit"
- class="btn-conversion"
- disabled={isFormDirty && !isFormValid}>Send message</button
+ <button type="submit" class="btn" disabled={isFormDirty && !isFormValid}
+ >Send message</button
>

original_message: Add card shadow


message: more menu show hide updates

diff:
<script lang="ts">
import MenuSection from "./menu-section.svelte";
-
- // This file is used to define entries in the side menu
- interface MenuEntry {
- title: string;
- path: string;
- subMenu?: MenuEntry[];
- }
-
- function M(title: string, path: string, subMenu?: MenuEntry[]): MenuEntry {
- return {
- title,
- path: "/docs/" + (path ? path + "/" : ""),
- subMenu,
- };
- }
-
- const MENU: MenuEntry[] = [
- M("Introduction", ""),
- M("Getting Started", "getting-started", [
- M("Example Projects", "examples"),
- ]),
- M("Workspaces", "workspaces", [
- M("Context URLs", "context-urls"),
- M("Life of a Workspace", "life-of-workspace"),
- M("Collaboration & Sharing", "sharing-and-collaboration"),
- M("Command Line Interface", "command-line-interface"),
- ]),
- M("Configure Your Project", "configuration", [
- M(".gitpod.yml", "config-gitpod-file"),
- M("Docker Configuration", "config-docker"),
- M("Start Tasks", "config-start-tasks"),
- M("VS Code Extensions", "vscode-extensions"),
- M("Exposing Ports", "config-ports"),
- M("Prebuilt Workspaces", "prebuilds"),
- M("Environment Variables", "environment-variables"),
- M("Workspace Location", "checkout-location"),
- M("Editor Configuration", "config-editor"),
- ]),
- M("Integrations", "integrations", [
- M("GitLab Integration", "gitlab-integration"),
- M("GitHub Integration", "github-integration"),
- M("Bitbucket Integration", "bitbucket-integration"),
- M("Browser Extension", "browser-extension"),
- ]),
- M("Languages & Frameworks", "languages-and-frameworks", [
- M("JavaScript", "languages/javascript"),
- M("Python", "languages/python"),
- M("HTML/CSS", "languages/html"),
- M("Java", "languages/java"),
- M("C++", "languages/cpp"),
- M("Go", "languages/go"),
- M("Bash", "languages/bash"),
- M("Ruby", "languages/ruby"),
- M("PHP", "languages/php"),
- M("Vue", "languages/vue"),
- M("Svelte", "languages/svelte"),
- M("Scala", "languages/scala"),
- M("Rust", "languages/rust"),
- M(".NET", "languages/dotnet"),
- M("Dart", "languages/dart"),
- M("Julia", "languages/julia"),
- M("LaTeX", "languages/latex"),
- M("R", "languages/r"),
- M("Kotlin", "languages/kotlin"),
- M("Pandas", "languages/python/#pandas"),
- M("Deno", "languages/deno"),
- ]),
- // M("Feature Preview", "feature-preview"),
- M("Gitpod Self-Hosted", "self-hosted/latest/self-hosted", [
- M(
- "Install on Google Cloud Platform",
- "self-hosted/latest/install/install-on-gcp-script"
- ),
- M(
- "Install on Amazon Web Services",
- "self-hosted/latest/install/install-on-aws-script"
- ),
- M(
- "Install on self-managed Kubernetes",
- "self-hosted/latest/install/install-on-kubernetes"
- ),
- M("Configure Ingress", "self-hosted/latest/install/configure-ingress"),
- M("Configure OAuth", "self-hosted/latest/install/oauth"),
- M("Configure a Database", "self-hosted/latest/install/database"),
- M(
- "Configure a Docker Registry",
- "self-hosted/latest/install/docker-registry"
- ),
- M("Configure Storage", "self-hosted/latest/install/storage"),
- M("Configure Nodes", "self-hosted/latest/install/nodes"),
- M("Configure Workspaces", "self-hosted/latest/install/workspaces"),
- ]),
- M("Subscriptions", "subscriptions", [
- M("Professional Open Source", "professional-open-source"),
- M("Create a Team", "teams"),
- ]),
- M("Changelog", "changelog"),
- ];
+ export let MENU;
</script>
<ul class="space-y-8">

diff:
<script>
+ // Components
import MobileMenuTopics from "./topics.svelte";
import MobileMenuSubMenu from "./sub-menu.svelte";
+ // States
import topicsState from "./topics-state";
+
+ export let MENU;
</script>
<style lang="scss">
<div class="mobile-menu">
{#if $topicsState}
- <MobileMenuTopics />
+ <MobileMenuTopics {MENU} />
{:else}
- <MobileMenuSubMenu />
+ <MobileMenuSubMenu {MENU} />
{/if}
</div>

diff:
+
+

-
-
TITLE

+
+
<slot />

<img
class="menu-item__icon-arrow"

diff:
// States
import topicsState from "./topics-state";
import subMenuState from "./sub-menu-state";
+
+ export let MENU;
</script>

diff:
-
-

{#each MENU as menuItem}
-

-
-
{menuItem.title}

-

-
-

-
-

+ <MenuItem href={menuItem.path} onClick={() => ($topicsState = false)}>
+ {menuItem.title}
+ </MenuItem>
{/each}

original_message: more menu show hide updates


message: hide search in mobile view when not viewing all topics list

diff:
import MobileMenuSubMenu from "./sub-menu.svelte";
// States
- import topicsState from "./topics-state";
+ import topicsState from "../states/topics-state";
export let MENU;
</script>

diff:
<script lang="ts">
import { page } from "$app/stores";
- import topicsState from "./topics-state";
+ import topicsState from "../states/topics-state";
export let href: string;
export let onClick;

diff:
import MenuItem from "./menu-item.svelte";
// States
- import topicsState from "./topics-state";
+ import topicsState from "../states/topics-state";
export let MENU;
</script>

diff:
</svelte:head>
-

+<div class={`input-container ${$topicsState ? "topics-active" : ""}`}>
Search

<input


message: Update text on home page

diff:
-
Ready When
 You Are.

+
Always
 Ready to Code.

Spin up fresh, automated dev environments for each task, in the cloud,
- in seconds. Or take a day to configure them the old way, up to you.
+ in seconds.

Try Now

- Give an example space a try right now.
+ Open a workspace.

- Instantly link to your Git provider.
+ Start from any Git context.

original_message: Update text on home page


message: Update hero paragraph

diff:
id="choose-project-observer-target"
class="hero__intro-text text-large"
>
- Spin up fresh, automated dev environments for each task, in the cloud,
- in seconds.
+ Spin up fresh, automated dev environments

+ for each task, in the cloud, in seconds.

original_message: Update hero paragraph


message: Update strikethrough text

diff:
- Choose project,
+ Select project,

{#each Object.entries(animatedTexts) as [device, texts]}

original_message: Update strikethrough text


message: Update more sections on the homepage

diff:
-
Remote-first. Secure by Design.

+
Remote-first. Secure by design.

<img
class="screenshot"
src="/images/gitpod-editor.jpg"

diff:
-
Widespread already.

+
Used by 350,000 developers.

<Carousel>
{#each testimonials as testimonial}
<Testimonial {testimonial} />

diff:
@@ -3,7 +3,7 @@ import { terminalSource } from "../terminal";
export const features: Feature[] = [
{
- title: "Introducing Pre-builds",
+ title: "Think CI/CD for dev environments",
paragraph:
"We invented prebuilds so application code, configuration and infrastructure can all be stored as machine-executable code in your git repositories and applied to dev environments automatically and continuously.",
moreButton: {

original_message: Update more sections on the homepage


message: add basic a11y

diff:
<button
class="toggle-button w-full"
type="button"
+ aria-controls="sub-menu"
+ aria-expanded={$subMenuState}
on:click={() => ($subMenuState = !$subMenuState)}
>

{currentSection.title}

</button>
- {#if $subMenuState}
-

+ <nav class={`px-4 ${$subMenuState ? "block" : "hidden"}`} id="sub-menu">
+

{#each currentSection.subMenu as sub}
<MenuItem href={sub.path} onClick={() => ($subMenuState = false)}>
{sub.title}
</MenuItem>
{/each}

- {/if}
+

{/if}

diff:
export let MENU;
</script>
+

{#each MENU as menuItem}
<MenuItem href={menuItem.path} onClick={() => ($topicsState = false)}>
</MenuItem>
{/each}

+

original_message: add basic a11y


message: only show right chevron arrow for topics menu items

diff:
export let href: string;
export let onClick;
+ export let showIcon: boolean;
</script>

diff:
<nav>
<ul>
{#each MENU as menuItem}
- <MenuItem href={menuItem.path} onClick={() => ($topicsState = false)}>
+ <MenuItem
+ href={menuItem.path}
+ showIcon={true}
+ onClick={() => ($topicsState = false)}
+ >
{menuItem.title}
</MenuItem>
{/each}


message: adjust button text colours

diff:
.back-button {
display: inline-flex;
align-items: center;
- color: black;
line-height: 138%;
+ color: var(--black);
}
.back-button__icon {
flex: 0 0 auto;
margin-right: 1rem;
- color: black;
}
.back-button__icon-arrow {
align-items: center;
padding: 0.8125rem 1rem;
line-height: 138%;
+ color: var(--black);
}
.toggle-button__label {

original_message: adjust button text colours


message: move current submenu logic to top level

diff:
// States
import topicsState from "../states/topics-state";
+ import docsCurrentSectionStore from "../../../stores/docs-current-section";
export let MENU;
+
+ $: currentSection = MENU.find(({ path }) =>
+ $docsCurrentSectionStore
+ ? path.indexOf($docsCurrentSectionStore) >= 0
+ : /\/docs\/$/.test(path)
+ );
</script>
<style lang="scss">
{#if $topicsState}
<MobileMenuTopics {MENU} />
{:else}
- <MobileMenuSubMenu {MENU} />
+ <MobileMenuSubMenu {currentSection} />
{/if}
</div>

diff:
import topicsState from "../states/topics-state";
import subMenuState from "../states/sub-menu-state";
- import docsCurrentSectionStore from "../../../stores/docs-current-section";
-
- export let MENU;
-
- $: currentSection = MENU.find(({ path }) =>
- $docsCurrentSectionStore
- ? path.indexOf($docsCurrentSectionStore) >= 0
- : /\/docs\/$/.test(path)
- );
+ export let currentSection;
</script>
<style lang="scss">

original_message: move current submenu logic to top level


message: Update font smoothing and button spacing

diff:
@@ -25,7 +25,7 @@ a {
}
}
.btn-conversion {
- padding: 0.75em 2em;
+ padding: 0.75rem 2rem;
font-size: var(--p-medium);
line-height: 1.25;
background-color: var(--brand-almost-ripe);

diff:
*::before,
*::after {
box-sizing: border-box;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
}
:root {
font-size: 16px;


message: Update git providers order

original_message: Update git providers order


message: Fix broken styles from global <nav> styles

diff:
</div>
</button>
- <nav class={`px-4 ${$subMenuState ? "block" : "hidden"}`} id="sub-menu">
+ <div
+ aria-label={currentSection.title}
+ role="navigation"
+ class={`px-4 ${$subMenuState ? "block" : "hidden"}`}
+ id="sub-menu"
+ >
<ul>
{#each currentSection.subMenu as sub}
<MenuItem href={sub.path} onClick={() => ($subMenuState = false)}>
</MenuItem>
{/each}
</ul>
- </nav>
+ </div>
</div>
{/if}

diff:
export let MENU;
</script>
-
+

{#each MENU as menuItem}
<MenuItem
</MenuItem>
{/each}

-
+


message: tweak table styles in docs

diff:
}
}
+ .table-container {
+ overflow-x: auto;
+ }
+
table {
width: 100%;
+ min-width: 31.25rem;
margin: var(--micro) 0;
overflow: hidden;
border-radius: 1rem;
td {
@apply py-4;
+ line-height: 150%;
}
th {

diff:
@@ -53,10 +53,14 @@ In order to make live reload work we need to add a bit of configuration as speci
## Example Projects
+

+
| Repository | Description | Try it |
| ------------------------------------------------------------------- | ---------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
| [SvelteJS template](https://github.com/gitpod-io/sveltejs-template) | A project template for Svelte apps | [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/gitpod-io/sveltejs-template) |
+

+
## VSCode Extensions
### Svelte for VS Code

original_message: tweak table styles in docs


message: Fix search icon flicker Issue

diff:
src="https://cdn.jsdelivr.net/npm/docsearch.js@{docSearchJSVersion}/dist/cdn/docsearch.min.js"></script>
</svelte:head>
-<div class={`input-container ${$topicsState ? "topics-active" : ""}`}>
+

Search
-

+
<input
bind:this={docSearchInput}
type="search"
placeholder="Search"
id={docSearchInputSelector}
- class="box-border block w-full pl-11 pr-3 py-2 border border-transparent rounded-xl leading-5 bg-white text-gray-600 placeholder-gray-500 focus:outline-none focus:bg-white focus:border-white focus:ring-white focus:text-gray-900"
+ class="box-border block w-full pl-11 pr-3 py-2 border border-transparent leading-5 text-gray-600 placeholder-gray-500 focus:outline-none focus:bg-none focus:border-white focus:ring-white focus:text-gray-900"
/>

-

original_message: Fix search icon flicker Issue #250


message: Replace screenshots with accurate product screenshots

diff:
display: block;
margin: 0 auto;
margin-bottom: -48px;
+ margin: 2rem auto;
+ box-shadow: var(--shadow);
+ border-radius: 0.875rem;
@media (max-width: 768px) {
margin-bottom: -20px;

diff: Binary files a/static/images/features/gitpod-extensions.jpg and b/static/images/features/gitpod-extensions.jpg differ

diff: Binary files a/static/images/gitpod-editor.jpg and b/static/images/gitpod-editor.jpg differ


message: blog preview styling pass

diff:
-.posts {
+.posts-grid {
display: grid;
+ margin: auto;
max-width: 78rem;
- width: 98vw;
+ width: 100%;
gap: 1.5rem;
grid-template-columns: repeat(auto-fill, 25rem);
grid-template-rows: auto-fit;
justify-content: center;
}
+
+@media (max-width: 400px) {
+ .posts-grid {
+ grid-template-columns: 1fr;
+ }
+}
+
+.posts-grid__item {
+ display: flex;
+ max-width: 25rem;
+}
+
.blogPreview {
border-radius: 0.75rem;
- min-width: 20rem;
- max-width: 25rem;
display: flex;
flex-flow: column;
align-items: center;
}
.blogPreview h2 a:focus,
.blogPreview h2 a:hover {
- background-color: var(--brand-light);
+ text-decoration: underline solid;
}
.blogPreview p {
margin: 1rem 0 0;
text-decoration: none;
font-size: var(--p-small);
margin-left: 0.5rem;
+ color: var(--light-grey);
}
.blogPreview .blurb {
padding: 3rem 2rem 2rem;
flex-flow: column;
height: calc(100% - 248px);
}
+.blogPreview .blurb:only-child {
+ height: 100%;
+ padding-top: 1.5rem;
+}
.blogPreview > * {
flex: 0 1 auto;
}

diff:
{post.excerpt}

- <Author author={post.author} showIconOnly />
+
+ <Author author={post.author} showIconOnly />

{new Date(Date.parse(post.date)).toLocaleDateString(undefined, {
year: "numeric",

diff:
h2 {
margin-bottom: var(--small);
}
+
+ .blog-layout {
+ @apply pb-10;
+ }
</style>
+

<OpenGraph
data={{
description:

Blog

-

+

{#each posts.slice(0, 6) as post}
+

<PostPreview {post} isMostRecent />
+

{/each}

Previous posts

-

+

{#each posts.slice(6) as post}
+

<PostPreview {post} />
+

{/each}

+

original_message: blog preview styling pass


message: Style pass blog details

diff:
border-radius: 1rem 1rem 0 0;
}
.post .date {
- margin: 2rem 0;
+ margin: 1.875rem 0 1.5rem;
color: var(--light-grey);
}
.post .author a {
color: var(--dark-grey);
}
}
+.post h1 {
+ margin-bottom: var(--x-small);
+}
.post .author img {
margin: 0 0.5em 0 0;
place-self: center;
.post .share h4 {
margin: 1rem 1rem 1rem 0;
}
+
+.post > div:first-of-type {
+ margin-top: 2.5rem;
+}
+
+.post p[class]:not(.date) {
+ margin-top: var(--large);
+ margin-bottom: var(--small);
+}

diff:
height: calc(100% - 248px);
}
.blogPreview .blurb:only-child {
- height: 100%;
+ flex-grow: 1;
padding-top: 1.5rem;
}
.blogPreview > * {

diff:
@@ -19,6 +19,11 @@ title: Next Chapter for Gitpod
margin-top: var(--small);
margin-bottom: var(--x-small);
}
+
+ p > img {
+ border-top-left-radius: 1rem;
+ border-top-right-radius: 1rem;
+ }
</style>
At Gitpod our focus has always been to remove all friction from the developer experience to empower developers to be always ready-to-code. Today we are excited to announce a $13m funding round led by [General Catalyst](https://www.generalcatalyst.com/team/dr-steve-herrod), a fully revamped visual & brand identity as well as several product milestones aimed at defining a new product category in modern software development.

original_message: Style pass blog details


message: clean up border radius styling on blog images

diff:
-.post .headerImage {
+.post .headerImage,
+.post p > img {
border-radius: 1rem 1rem 0 0;
}
.post .date {

diff:
@@ -20,9 +20,8 @@ title: Next Chapter for Gitpod
margin-bottom: var(--x-small);
}
- p > img {
- border-top-left-radius: 1rem;
- border-top-right-radius: 1rem;
+ img[src$="brand.jpg"] {
+ border-bottom-right-radius: 1rem;
}
</style>


message: Home, Features, Pricing, Self Hosted

diff:
Features

- Automated workspaces that supercharge your dev workflow. Squash the time
- between code-to-commit.
+ Automated workspaces that supercharge your development workflow. Squash the
+ time between code-to-commit.

diff:
</style>

-
Open source, self hosting, and Students

+
Open source, self hosting, and students

{#each otherPlans as p}

diff:
existing instance with a purchased license key. Self-hosted Gitpod
licenses can currently only be purchased by request. Please request a
license key here or
- Contact sales if you have any questions.
+ Get in touch if you have any questions.

</Faq>
<Faq title="Can I add more users to my plan at any time?">
<Faq title="How can I install Self-Hosted?">

You can either install Gitpod Self-Hosted on
- Google Cloud Platform, AWS, or on
- Vanilla Kubernetes. Enhanced support for
- Azure
- and OpenShift is coming soon. See
+ Google Cloud Platform or on
+ K3s. See
Self-Hosted Installation for more information.

request. Please request a license key
here
and we'll reach out to you. If you have any questions, please
- Contact sales. All our plans can be paid via
+ Get in touch. All our plans can be paid via
invoice.

</Faq>

diff:
Self-hosted plans

- Install Gitpod Self-Hosted on Google Cloud Platform,
- AWS, or on Vanilla Kubernetes.
+ Install Gitpod Self-Hosted or Google Cloud Platform and
+ K3s.

<PricingBoxes {pricingPlans} />

diff:
@@ -58,8 +58,8 @@ export const otherPlans = [
{
title: "Self Hosted",
paragraphs: [
- "Gitpod Self-Hosted is the best solution for teams who want to keep full data control or use Gitpod in private networks.",
- "Install Gitpod Self-Hosted on Google Cloud Platform, AWS, or on Vanilla Kubernetes.",
+ "Gitpod self-hosted is the best solution for teams who want to keep full data control or use Gitpod in private networks.",
+ "Install Gitpod Self-Hosted on Google Cloud Platform and K3s.",
],
btnText: "Enquire now",
btnHref: "/contact/",

diff:
-
Save Time with Prebuilds

+
Save time with Prebuilds

- Gitpod continuously builds your git branches like a CI server. This
+ Gitpod continuously builds your Git branches like a CI server. This
means no more waiting for dependencies to be downloaded and builds to
finish.

- More about Prebuilt Workspaces
+ More about Prebuilds

<Workspaces />

-
Start Fresh with Ephemeral Dev Environments

+
Start fresh with ephemeral dev environments

- Dev environment as code assures you are always starting from a clean
- state and never gets dragged into long-living stateful environments. The
+ Dev-environments-as-code assure you are always starting from a clean
+ state and never get dragged into long-living stateful environments. The
end of all works-on-my-machine situations.

width="382"
/>

-
Collaboration with Workspace Sharing

+
Collaboration with workspace sharing

Collaborate with your friends, co-workers, and clients. Whenever you want
to share a reproducible example of code or hunt down a bug together,

Full linux machine (incl sudo/docker)

Instantly start a container in the cloud based on your Docker image.
- Install and configure tools easily.
+ Leverage the power of the cloud and free yourself from the limitations of
+ local silicon.

Watch video to learn moreLearn more about sudo/Docker in Gitpod.

Tweak your environment to suit your needs. From themes to extensions you
have full control over it all.

- More about customization
+ More about customization.

-
GitLab, GitHub, and Bitbucket Integration

+
GitLab, GitHub, and Bitbucket integration

- Start your workflow from your Git hosting platform and let Gitpod beam you
- in a ready-to-code dev environment.
+ Start your workflow from the Git hosting platform of your choice and let
+ Gitpod beam you in a ready-to-code dev environment.

- More about Integrations
+ More about integrations.

-
Code Reviews Within the IDE

+
Code reviews within the IDE

Open pull requests in Gitpod to run, navigate, and review the code. Reply
to comments and publish code reviews right within Gitpod.

- More about Code Reviews
+ More about code reviews.

original_message: Home, Features, Pricing, Self Hosted


message: Optimize images for next chapter blog post

diff: Binary files a/static/images/blog/next-chapter-for-gitpod/brand.jpg and b/static/images/blog/next-chapter-for-gitpod/brand.jpg differ

diff: Binary files a/static/images/blog/next-chapter-for-gitpod/devxconf.jpg and b/static/images/blog/next-chapter-for-gitpod/devxconf.jpg differ

diff: Binary files a/static/images/blog/next-chapter-for-gitpod/funding.jpg and b/static/images/blog/next-chapter-for-gitpod/funding.jpg differ

diff: Binary files a/static/images/blog/next-chapter-for-gitpod/product.jpg and b/static/images/blog/next-chapter-for-gitpod/product.jpg differ

diff: Binary files a/static/images/blog/next-chapter-for-gitpod/teaser.jpg and b/static/images/blog/next-chapter-for-gitpod/teaser.jpg differ


message: Fixed typos and aligned messaging

diff:
---
author: anudeepreddy
date: Wed Jun 26 2019 11:57:00 GMT+0000 (UTC)
-excerpt:
+excerpt: Build your webhook for your Google Assistant action and host it temporarily on Gitpod and test your code.
image: Build-and-test-your-webhook.png
slug: build-a-webhook-for-google-assistant
subtitle: Build and test your webhook using Gitpod

diff:
---
author: svenefftinge
date: Wed Aug 07 2019 11:57:00 GMT+0000 (UTC)
-excerpt: DevOps has been all the rage for the last couple of years. Today, something like GitHub / GitLab with Continuous Integration seems to be the
+excerpt: Continuous dev environments reduce friction in onboarding and task switching and improves reproducibility across the project.
image: devops.jpg
slug: continuous-dev-environment-in-devops
subtitle: The Missing Piece in DevOps?

diff:
@@ -4,7 +4,7 @@ date: Fri Sep 21 2018 13:23:34 GMT+0000 (UTC)
author: svenefftinge
title: Developing a Nuxt.js app entirely in your browser
image: developing-nuxtjs-in-a-browser.jpeg
-excerpt: A walkthrough to create a fully working Nuxt.js web application with only a browser, using Gitpod.io the online IDE for GitHub. Version 2
+excerpt: A walkthrough to create a fully working Nuxt.js web application with only a browser, using Gitpod.io the online IDE for GitHub.
slug: developing-nuxtjs-in-browser
---

diff:
---
author: geropl
date: Wed Sep 12 2018 08:25:15 GMT+0000 (UTC)
-excerpt: Since we released Gitpod into Public Beta it has been incredibly exciting to see people from all over the world use our service. Even more
+excerpt: Since we released Gitpod into Public Beta it has been incredibly exciting to see people from all over the world use our service.
image: docker-in-gitpod.jpeg
slug: docker-in-gitpod
title: Bring your own (Docker) image to Gitpod

diff:
---
author: svenefftinge
date: Wed May 06 2020 16:00:00 GMT+0000 (UTC)
-excerpt: Today, GitHub announced the private beta of GitHub Codespaces, which provide container-based dev environments for GitHub projects. At Gitpod
+excerpt: Today, GitHub announced the private beta of GitHub Codespaces, which provide container-based dev environments for GitHub projects.
image: gh-cs-bg.jpg
slug: github-codespaces
subtitle: A Milestone for Automated Development Environments

diff:
---
author: svenefftinge
date: Thu Jul 05 2018 11:49:24 GMT+0000 (UTC)
-excerpt: As software developers, we already spend a lot of our time in browsers. Be it for searching Google/StackOverflow, checking our latest
+excerpt: As software developers, we already spend a lot of our time in browsers.
image: a-better-github-flow.png
slug: github-flow
subtitle: Stop setting up, start coding!

diff:
---
author: svenefftinge
date: Wed Dec 04 2019 13:49:24 GMT+0000 (UTC)
-excerpt: We are happy to announce that you can finally enjoy Gitpod's frictionless ready-to-code dev environments on GitLab as well. Starting a dev
+excerpt: We are happy to announce that you can finally enjoy Gitpod's frictionless ready-to-code dev environments on GitLab as well.
image: teaser-gitlab-cover.png
slug: gitlab-support
subtitle: Your devops toolchain is finally complete!

diff:
---
author: svenefftinge, JohannesLandgraf, csweichel
date: Tue Dec 09 2020 8:00:00 GMT+0000 (UTC)
-excerpt: As described earlier this year, Microsoft's investment into GitHub Codespaces is helping to move more into the mainstream what Gitpod has
+excerpt: Fully automated development environments will be the standard for professional developers in 5-10 years.
image: teaser.jpg
slug: moving-software-development-to-the-cloud
subtitle: Gitpod & GitHub Codespaces

diff:
---
author: svenefftinge
date: Thu Dec 07 2020 11:49:24 GMT+0000 (UTC)
-excerpt: The team has been focussing on shipping some major new features, which mark important milestones on our goal to eliminate all friction
+excerpt: The team has been focussing on shipping some major new features, which mark important milestones on our goal to eliminate all friction.
image: teaser.jpg
slug: root-docker-and-vscode
subtitle: New Release

original_message: Fixed typos and aligned messaging


message: Add new grid and zoom illustrations

diff:
See Features

-
+
<img
src="/images/illustration-small.jpg"
class="small"

diff:
See openings

-
+
<img
src="/images/illustration-small.jpg"
class="small"

diff:
</header>
<img
- src="/images/careers/careers-hero.png"
+ src="/images/illustration-zoom.jpg"
alt=""
role="presentation"
width="1136"

diff: Binary files a/static/images/careers/careers-hero.png and /dev/null differ

diff: Binary files /dev/null and b/static/images/illustration-grid.jpg differ

diff: Binary files /dev/null and b/static/images/illustration-zoom.jpg differ

diff: Binary files a/static/images/illustration.png and /dev/null differ

original_message: Add new grid and zoom illustrations


message: Styling pass to address Issue

diff:
<style lang="scss">
.projects {
- margin: var(--small) 0;
+ margin: var(--x-small) 0;
}
</style>

original_message: Styling pass to address Issue #315


message: Add cropped illustration in screencasts

diff:
import OpenGraph from "../../components/open-graph.svelte";
import Screencast from "../../components/screencasts/screencast.svelte";
import screencasts from "../../contents/screencasts";
+ import Section from "../../components/section.svelte";
import Explore from "../../components/explore.svelte";
</script>

type: "website",
}}
/>
-
Get started with a screencast

+
+

+
Get started with a screencast

+

+

{#each screencasts as screencast, index}
<Screencast {screencast} screencastNumber={index + 1} />
{/each}

-<Explore />
+
+

+

+

+

+
Explore Gitpod

+
Automated and ephemeral dev environments in the cloud.

+
See Features

+

+

+
+
+

+

+

+

diff: Binary files /dev/null and b/static/images/illustration-crop.jpg differ

original_message: Add cropped illustration in screencasts


message: Fix typos on career + self hosted

diff:
Self-hosted plans

- Install Gitpod Self-Hosted or Google Cloud Platform and
+ Install Gitpod Self-Hosted on Google Cloud Platform and
K3s.

original_message: Fix typos on career + self hosted


message: Update link on self-hosted section

diff:
@@ -67,8 +67,8 @@ export const otherPlans = [
"Gitpod self-hosted is the best solution for teams who want to keep full data control or use Gitpod in private networks.",
"Install Gitpod Self-Hosted on Google Cloud Platform and K3s.",
],
- btnText: "Enquire now",
- btnHref: "/contact",
+ btnText: "Learn more",
+ btnHref: "/self-hosted",
},
{
title: "Student",

original_message: Update link on self-hosted section (#451)


message: Fixed some typos and links

diff:
@@ -21,7 +21,7 @@ With Gitpod this stops. Instead you treat dev environments as automated resource
You even start switching between workspaces - one for your feature, one for reviewing a PR/MR, one for a bug, one for another MR/PR.
-Only then you are **always ready-to-code** - immediately creative, immediately productive with the click of a button and without any friction. allowing yourself and your team to build applications quicker and more collaboratively.
+Only then you are **always ready-to-code** - immediately creative, immediately productive with the click of a button and without any friction. Allowing yourself and your team to build applications quicker and more collaboratively.

Your computer in the cloud

@@ -54,4 +54,4 @@ We are living in a remote world, where copies of your source code stored locally

Next Steps

- [Quickstart with example project](/docs/quickstart) - understand the benefits in a learning environment
-- [Getting started with your project](/docs/configure) - configure one of your own existing projects
+- [Getting started with your project](/docs/getting-started) - configure one of your own existing projects

diff:
@@ -29,4 +29,4 @@ The Gitpod extension adds a Gitpod button on every project and branch across Git
With Gitpod you start treating your dev environments as something ephemeral: you start them, you code, you push your code, and you forget about them. For your next task, you'll use a fresh dev environment.
-- [Getting started with your own project](/docs/configure)
+- [Getting started with your own project](/docs/getting-started)

original_message:
Fixed some typos and links (#536)

Co-authored-by: Mike Nikles <mikenikles@gmail.com>


message: Update changelog header image

diff:
@@ -6,7 +6,7 @@ date: 2021-05-31
import Contributors from "../../components/changelog/contributors.svelte";
</script>
-![Incremental prebuilds](/images/changelog/2021-05-31.png)
+![Incremental prebuilds](/images/changelog/2021-05-31.jpg)
## Faster, incremental prebuilds

diff: Binary files /dev/null and b/static/images/changelog/2021-05-31.jpg differ

diff: Binary files a/static/images/changelog/2021-05-31.png and /dev/null differ

original_message: Update changelog header image (#586)


diff:
const MENU: MenuEntry[] = [
M("Introduction", ""),
M("Quickstart", "quickstart", [
- M("Node or TypeScript example", "quickstart/typescript"),
- M("Go example", "quickstart/go"),
- M("Rust example", "quickstart/rust"),
- M("Java example", "quickstart/java"),
- M("Svelte example", "quickstart/svelte"),
+ M("Node/TypeScript", "quickstart/typescript"),
+ M("Python Django", "quickstart/python"),
+ M("Go", "quickstart/go"),
+ M("Rust", "quickstart/rust"),
+ M("Java Spring", "quickstart/java"),
+ M("Svelte", "quickstart/svelte"),
]),
M("Getting Started", "getting-started"),
M("Configure", "configure", [

diff:
---
section: quickstart
-title: Go example
+title: Go template
---
<script context="module">
@@ -9,7 +9,7 @@ title: Go example
# Go Quickstart
-Learn how to set-up and understand the benefits of Gitpod **in less than 5 min** with our [Go](https://github.com/gitpod-io/example-golang-cli) example.
+Learn how to set-up and understand the benefits of Gitpod **in less than 5 min** with our [Go](https://github.com/gitpod-io/example-golang-cli) template.
The following guide will:
@@ -22,6 +22,7 @@ For simplicity we use a GitHub template, but Gitpod works similiarly with GitLab
### Step 1: Clone Git repository
- Create a new repository based on the [Go template](https://github.com/gitpod-io/example-golang-cli/generate).
+- Name it e.g. `my-go-example`.
### Step 2: Install Gitpod app

diff:
@@ -9,14 +9,14 @@ title: Quickstart
# Quickstart
-Learn how to start using Gitpod on an example project that is hosted on GitHub in less than 5 minutes. For simplicity we use GitHub as the git hoster but the steps outlined work equally well for GitLab and Bitbucket. This section helps you understand the features and advantages of Gitpod in a learning environment based on the [Gitpod example](/docs/examples) projects. The example projects are pre-configured to use Gitpod:
-
-- [Node or TypeScript example](/docs/quickstart/typescript)
-- [Python example](/docs/quickstart/python)
-- [Go example](/docs/quickstart/go)
-- [Rust example](/docs/quickstart/rust)
-- [Java example](/docs/quickstart/java)
-- [Svelte example](/docs/quickstart/svelte)
+Learn how to start using Gitpod on an example project that is hosted on GitHub in less than 5 minutes. For simplicity we use GitHub as the git hoster but the steps outlined work equally well for GitLab and Bitbucket. This section helps you understand the features and advantages of Gitpod in a learning environment. All templates are pre-configured to use Gitpod and ready-to-code:
+
+- [Node/TypeScript template](/docs/quickstart/typescript)
+- [Python Django template](/docs/quickstart/python)
+- [Go template](/docs/quickstart/go)
+- [Rust template](/docs/quickstart/rust)
+- [Java Spring template](/docs/quickstart/java)
+- [Svelte template](/docs/quickstart/svelte)
## Installing the Gitpod browser extension

diff:
---
section: quickstart
-title: Java example
+title: Java template
---
<script context="module">
@@ -9,7 +9,7 @@ title: Java example
# Java Quickstart
-Learn how to set-up and understand the benefits of Gitpod **in less than 5 min** with our [Java](https://github.com/gitpod-io/spring-petclinic) example.
+Learn how to set-up and understand the benefits of Gitpod **in less than 5 min** with our [Java Spring](https://github.com/gitpod-io/spring-petclinic) template.
The following guide will:
@@ -22,6 +22,7 @@ For simplicity we use a GitHub template, but Gitpod works similiarly with GitLab
### Step 1: Clone Git repository
- Create a new repository based on the [Java template](https://github.com/gitpod-io/spring-petclinic/generate).
+- Name it e.g. `my-java-template`.
### Step 2: Install Gitpod app

diff:
---
section: quickstart
-title: Python example
+title: Python template
---
<script context="module">
@@ -9,7 +9,7 @@ title: Python example
# Python Django Quickstart
-Learn how to set-up and understand the benefits of Gitpod **in less than 5 min** with our [Python](https://github.com/gitpod-io/example-python-django) example.
+Learn how to set-up and understand the benefits of Gitpod **in less than 5 min** with our [Python](https://github.com/gitpod-io/example-python-django) template.
The following guide will:
@@ -22,7 +22,7 @@ For simplicity we use a GitHub template, but Gitpod works similiarly with GitLab
### Step 1: Clone Git repository
- Create a new repository based on the [Python template](https://github.com/gitpod-io/example-python-django/generate).
-- Name it e.g. `my-python-example`.
+- Name it e.g. `my-python-template`.
### Step 2: Install the Gitpod app

diff:
---
section: quickstart
-title: Rust example
+title: Rust template
---
<script context="module">
@@ -22,6 +22,7 @@ For simplicity we use a GitHub template, but Gitpod works similiarly with GitLab
### Step 1: Clone Git repository
- Create a new repository based on the [Rust template](https://github.com/gitpod-io/example-rust-cli/generate).
+- Name it e.g. `my-rust-template`.
### Step 2: Install Gitpod app

diff:
---
section: quickstart
-title: Svelte example
+title: Svelte template
---
<script context="module">
@@ -22,6 +22,7 @@ For simplicity we use a GitHub template, but Gitpod works similiarly with GitLab
### Step 1: Clone Git repository
- Create a new repository based on the [SvelteJS template](https://github.com/gitpod-io/sveltejs-template/generate).
+- Name it e.g. `my-svelte-template`.
### Step 2: Install Gitpod app

diff:
---
section: quickstart
-title: Node/TypeScript example
+title: Node/TypeScript template
---
<script context="module">
@@ -22,6 +22,7 @@ For simplicity we use a GitHub template, but Gitpod works similiarly with GitLab
### Step 1: Clone Git repository
- Create a new repository based on the [Node/TypeScript template](https://github.com/gitpod-io/example-typescript-node/generate).
+- Name it e.g. `my-typescript-template`.
### Step 2: Install Gitpod app

original_message:
Fixed typos & replaced example with template (#588)

Co-authored-by: Mike Nikles <mikenikles@gmail.com>


message: Update docs for port visibility

diff:
@@ -58,10 +58,10 @@ Any changes to the `.gitpod.yml` will have effect immediately.
## Configure port visibility
-By default, all ports are in public visibiltiy state.
+By default, all ports are in private visibility state.
To change this behavior you can provide the property `visibility`.
It has two possible values:
-- `public` (default) - Allows everyone with the port URL to access the port.
-- `private` - Only allow users with workspace access to access the port.
+- `private` (default) - Only allow users with workspace access to access the port.
+- `public` - Allows everyone with the port URL to access the port.

diff:
@@ -258,8 +258,8 @@ Define whether to expose the port publicly or keep it private.
A public port allows you to share a URL for a given port with team members, for example if you want to get their feedback on a new feature you develop.
| Type | Default | Values |
-| -------- | -------- | -------------------------- |
-| `string` | `public` | `private`,

`public` |
+| -------- | --------- | -------------------------- |
+| `string` | `private` | `private`,

`public` |
## `tasks`

original_message: Update docs for port visibility


message: Update VS Code extensions example

diff:
@@ -29,11 +29,12 @@ Your project's `.gitpod.yml` is updated automatically and lists the given extens
Here is an example of what a `.gitpod.yml` with installed extensions may look like:
-```yml
+```yaml
vscode:
extensions:
- - scala-lang.scala
- - scalameta.metals
+ - svelte.svelte-vscode
+ - bradlc.vscode-tailwindcss@0.6.11
+ - https://example.com/abc/releases/extension-0.26.0.vsix
```
You can share the installed extensions with your team by committing the `.gitpod.yml` change and pushing it to your Git repository.

original_message: Update VS Code extensions example


diff:
@@ -290,6 +290,50 @@ export const careers: Career[] = [
rendered: false,
date: "2021-01-26T14:00:00.000Z",
},
+ {
+ title: "Senior Container Runtime Engineer",
+ intro: `At its core Gitpod provisions, secures and orchestrates containers. We deploy the latest open-source container technology working at the intersection of Linux and cloud native technologies. We want your help to run, secure and advance our container runtime.`,
+ paragraphs: `We are a highly-motivated, fully-remote team, organized in a flat hierarchy, and led by technical founders. We love open-source, have started and lead many popular open-source projects, and contribute to many others.
+ We celebrate diversity and strive for an equal, inclusive, empathetic and welcoming environment. Bringing diversity to the team is a big plus. If you are part of a marginalised community, and are not sure if you should apply, please get in touch.`,
+ lists: [
+ {
+ title: "As part of the team you will ...",
+ items: [
+ "Shape the latest container-tech and Linux. You will use the latest and greatest Linux kernels, containerd and K8s versions. OCI, Linux namespaces, runc, containerd should excite you. As well as this [talk](https://www.youtube.com/watch?v=l4I2TVAnBuw). eBPF knowledge is a plus.",
+ "Help Gitpod being a good K8s app. You know the best practices for running an app in Kubernetes and you will help to translate those best practices to the lower leves and help the team to follow the best practices of the community. Strong appreciation of container security is of particular interest.",
+ "Co-own the product and work self-directed. We work with a very flat hierarchy, organizing our tasks in iterations with a lot of freedom.",
+ "Work with the community and in the open. Our DNA is deeply rooted in open source and we are building Gitpod in public. We expect the same from you.",
+ ],
+ },
+ {
+ title: "What we need",
+ items: [
+ "You share our values. We are developer-led and aim for a frictionless experience when interacting with our product, our company and our brand: no hurdles, no BS, no unnecessary extra steps. We are open minded, inclusive, transparent and curious. We always remain students of the game, not masters of the game. We have opinions, but are not opinionated. We integrate, don't dictate.",
+ "You care for our mission. Developers architect our future. Gitpod democratises software development by making it more accessible to all developers. Ready-to-code, cloud-based development environments streamline how software is written today.",
+ "You embrace Open Source. You follow relevant open-source projects, maybe you contributed, maybe you know the maintainers. Gitpod itself is open-source and built on open-source projects, such as Kubernetes, Helm, Terraform, Grafana, Prometheus and many more. Knowledge about such projects will help you work on Gitpod and knowledge about Open Source will help you make Gitpod a better Open Source project.",
+ "You are pragmatic. You understand that doing the right thing gives you momentum while doing a thing perfectly can cost a lot of time.",
+ "You are a curious deep diver. You know that humans and documentation often do not have an answer. That is when you dive. You read code, issues, explore metrics, traces, logs or conduct experiments. When you surface, you know the answer and the team will love you.",
+ "You are a good communicator. We work remote, our users are remote too. You value writing and express yourself concisely. You may hold strong opinions, but you are not ideological. You communicate thoughtfully, always assume others speak in good faith, aim to understand opposing perspectives and compromise when needed.",
+ ],
+ },
+ {
+ title: "Our stack:",
+ items: [
+ "Gitpod is an open source Kubernetes application. Services are written in Go and TypeScript (Node.JS), while all things frontend are React and TypeScript. We communicate using gRPC, RabbitMQ and JSON-RPC. We develop Gitpod in Gitpod, build using leeway and werft and automatically deploy preview environments for every branch.",
+ "Browser-based productivity tools for the rest. Gitpod for development, GitHub for issue tracking and as git hoster, Slack for comms, Figma for design, Notion as our virtual HQ, Pitch for slides, Loom for screencasts and a few others.",
+ "We run gitpod.io on Google Cloud Platform. There we use GKE, Buckets, BigQuery and more. We may expand to other cloud providers. We make Gitpod self-hosted available for vanilla Kubernetes, AWS, GKE and more platforms in the future.",
+ "We describe infrastructure using Helm and Terraform. We maintain a single helm chart to install Gitpod on Kubernetes. To create the cluster and other infrastructure around it, we use Terraform scripts.",
+ ],
+ },
+ {
+ title: "We're about balance",
+ items: perks.map((perk) => perk.title),
+ },
+ ],
+ textAfterTheLists: "",
+ rendered: false,
+ date: "2021-01-26T14:00:00.000Z",
+ },
{
title: "Senior Site Reliability Engineer (SRE)",
intro: `The infrastructure behind gitpod.io runs services and workspaces on a global scale and many professionals depend on it. We want your help to achieve the required reliability.`,

original_message: Add job description for container runtime position (#914)


message: Update Self Hosted Plan

diff:
Self-hosted plans

- Install Gitpod Self-Hosted on Google Cloud Platform and
+ Install Gitpod Self-Hosted on GKE, EKS  and
K3s.

diff:
/>

-
Request License Key

-

- Please fill out your order to receive a license key for Gitpod Self-Hosted.
-

+
Contact our sales team

+
Tell us how we can help and we will be in touch shortly.

original_message: Update Self Hosted Plan


message: Update job openings

diff:
@@ -156,49 +156,6 @@ export const careers: Career[] = [
rendered: false,
date: "2021-01-26T14:00:00.000Z",
},
- {
- title: "Senior Software Engineer (Observability)",
- intro: `The infrastructure behind gitpod.io runs services and workspaces on a global scale. Want your help to get the best insights via metrics, traces, logs, and more.`,
- paragraphs: `We are a highly-motivated, fully-remote team, organized in a flat hierarchy, and led by technical founders. We love open-source, have started and lead many popular open-source projects, and contribute to many others. We celebrate diversity and strive for an equal, inclusive, empathetic and welcoming environment. Bringing diversity to the team is a big plus. If you are part of a marginalised community, and are not sure if you should apply, please get in touch.`,
- lists: [
- {
- title: "As part of the team you will ...",
- items: [
- "Create observability for our global infrastructure. We run dev environments (Kubernetes Pods) in Kubernetes clusters around the globe. You will improve and enhance our systems for collecting, storing and visualizing observability data, such as logs, metrics, alerts, traces and profiling data. We heavily build on pre-existing solutions, such as Grafana, Prometheus, and the cloud platforms native solutions.",
- "Make Gitpod more observable. You will identify the best metrics endpoints Gitpod should expose and implement them or help colleagues to implement them. Same goes for proper tracing and logging. ",
- "Co-own the product and work self-directed. We work with a very flat hierarchy, organizing our tasks in iterations with a lot of freedom.",
- "Work with the community and in the open. Our DNA is deeply rooted in open source and we are building Gitpod in public. We expect the same from you.",
- ],
- },
- {
- title: "What we need",
- items: [
- "You share our values. We are developer-led and aim for a frictionless experience when interacting with our product, our company and our brand: no hurdles, no BS, no unnecessary extra steps. We are open minded, inclusive, transparent and curious. We always remain students of the game, not masters of the game. We have opinions, but are not opinionated. We integrate, don't dictate.",
- "You care for our mission. Developers architect our future. Gitpod democratises software development by making it more accessible to all developers. Ready-to-code, cloud-based developer environments streamline how software is written today.",
- "You embrace Open Source. You follow relevant open-source projects, maybe you contributed, maybe you know the maintainers. Gitpod itself is open-source and built on open-source projects, such as Kubernetes, Helm, Terraform, Grafana, Prometheus and many more. Knowledge about such projects will help you work on Gitpod and knowledge about Open Source will help you make Gitpod a better Open Source project.",
- "You are pragmatic. You understand that doing the right thing gives you momentum while doing a thing perfectly can cost a lot of time.",
- "You are a curious deep diver. You know that humans and documentation often do not have an answer. That is when you dive. You read code, issues, explore metrics, traces, logs or conduct experiments. When you surface, you know the answer and the team will love you.",
- "You are a good communicator. We work remote, our users are remote too. You value writing and express yourself concisely. You may hold strong opinions, but you are not ideological. You communicate thoughtfully, always assume others speak in good faith, aim to understand opposing perspectives and compromise when needed.",
- ],
- },
- {
- title: "Our stack:",
- items: [
- "Gitpod is an open source Kubernetes application. Services are written in Go and TypeScript (Node.JS), while all things frontend are React and TypeScript. We communicate using gRPC, RabbitMQ and JSON-RPC. We develop Gitpod in Gitpod, build using leeway and werft and automatically deploy preview environments for every branch.",
- "Browser-based productivity tools for the rest. Gitpod for development, GitHub for issue tracking and as git hoster, Slack for comms, Figma for design, Notion as our virtual HQ, Pitch for slides, Loom for screencasts and a few others.",
- "We run gitpod.io on Google Cloud Platform. There we use GKE, Buckets, BigQuery and more. We may expand to other cloud providers. We make Gitpod self-hosted available for vanilla Kubernetes, AWS, and more platforms in the future.",
- "We describe infrastructure using Helm and Terraform. We maintain a single helm chart to install Gitpod on Kubernetes. To create the cluster and other infrastructure around it, we use Terraform scripts.",
- ],
- },
- {
- title: "We're about balance",
- items: perks.map((perk) => perk.title),
- },
- ],
- textAfterTheLists: "",
- rendered: false,
- date: "2021-01-26T14:00:00.000Z",
- },
{
title: "Senior Kubernetes Engineer",
intro: `We want to run Gitpod workspaces in self-managed Kubernetes clusters to benefit from the latest and greatest advancements from the open source community. We want your help to create, automate and operate such clusters.`,
@@ -287,51 +244,6 @@ export const careers: Career[] = [
rendered: false,
date: "2021-01-26T14:00:00.000Z",
},
- {
- title: "Senior Site Reliability Engineer (SRE)",
- intro: `The infrastructure behind gitpod.io runs services and workspaces on a global scale and many professionals depend on it. We want your help to achieve the required reliability.`,
- paragraphs: `We are a highly-motivated, fully-remote team, organized in a flat hierarchy, and led by technical founders. We love open-source, have started and lead many popular open-source projects, and contribute to many others. We celebrate diversity and strive for an equal, inclusive, empathetic and welcoming environment. Bringing diversity to the team is a big plus. If you are part of a marginalised community, and are not sure if you should apply, please get in touch.`,
- lists: [
- {
- title: "As part of the team you will ...",
- items: [
- "Make gitpod more reliable. You apply best practices and lessons-learned from incidents to prevent future incidents. you implement the changes or work with colleagues and other teams to get the needed changes implemented.",
- "Conduct Root-Cause analysis of incidents. Post-Incident, you dive deep to understand what caused the incident and apply your knowledge to make gitpod.io more reliable.",
- "Mitigate incidents. If there is an incident, you know which switches to flip to quickly re-establish reliable service of Gitpod. You participate in on-call rotation.",
- "Drive application health. You help to establish SLIs and SLOs, so that we, as a company, can find a healthy balance between rolling out new features and fixing bugs.",
- "Co-own the product and work self-directed. We work with a very flat hierarchy, organizing our tasks in iterations with a lot of freedom.",
- "Work with the community and in the open. Our DNA is deeply rooted in open source and we are building Gitpod in public. We expect the same from you.",
- ],
- },
- {
- title: "What we need",
- items: [
- "You share our values. We are developer-led and aim for a frictionless experience when interacting with our product, our company and our brand: no hurdles, no BS, no unnecessary extra steps. We are open minded, inclusive, transparent and curious. We always remain students of the game, not masters of the game. We have opinions, but are not opinionated. We integrate, don't dictate.",
- "You care for our mission. Developers architect our future. Gitpod democratises software development by making it more accessible to all developers. Ready-to-code, cloud-based developer environments streamline how software is written today.",
- "You embrace Open Source. You follow relevant open-source projects, maybe you contributed, maybe you know the maintainers. Gitpod itself is open-source and built on open-source projects, such as Kubernetes, Helm, Terraform, Grafana, Prometheus and many more. Knowledge about such projects will help you work on Gitpod and knowledge about Open Source will help you make Gitpod a better Open Source project.",
- "You are pragmatic. You understand that doing the right thing gives you momentum while doing a thing perfectly can cost a lot of time.",
- "You are a curious deep diver. You know that humans and documentation often do not have an answer. That is when you dive. You read code, issues, explore metrics, traces, logs or conduct experiments. When you surface, you know the answer and the team will love you.",
- "You are a good communicator. We work remote, our users are remote too. You value writing and express yourself concisely. You may hold strong opinions, but you are not ideological. You communicate thoughtfully, always assume others speak in good faith, aim to understand opposing perspectives and compromise when needed.",
- ],
- },
- {
- title: "Our stack:",
- items: [
- "Gitpod is an open source Kubernetes application. Services are written in Go and TypeScript (Node.JS), while all things frontend are React and TypeScript. We communicate using gRPC, RabbitMQ and JSON-RPC. We develop Gitpod in Gitpod, build using leeway and werft and automatically deploy preview environments for every branch.",
- "Browser-based productivity tools for the rest. Gitpod for development, GitHub for issue tracking and as git hoster, Slack for comms, Figma for design, Notion as our virtual HQ, Pitch for slides, Loom for screencasts and a few others.",
- "We run gitpod.io on Google Cloud Platform. There we use GKE, Buckets, BigQuery and more. We may expand to other cloud providers. We make Gitpod self-hosted available for vanilla Kubernetes, AWS, and more platforms in the future.",
- "We describe infrastructure using Helm and Terraform. We maintain a single helm chart to install Gitpod on Kubernetes. To create the cluster and other infrastructure around it, we use Terraform scripts.",
- ],
- },
- {
- title: "We're about balance",
- items: perks.map((perk) => perk.title),
- },
- ],
- textAfterTheLists: "",
- rendered: false,
- date: "2021-01-26T14:00:00.000Z",
- },
/*{
title: "Working Student / Intern - Finance",
intro: `You are a "jack of all trades, master of some" student with a background in business, finance or a related field and want to gain valuable experience by working between 10h and 20h per week? You are a "jack of all trades, master of some" student with a background in business, finance or a related field and want to gain valuable experience by working between 10h and 20h per week?`,

original_message: Update job openings (#951)


message: Clarified Let's Encrypt Requirement

diff:
@@ -74,7 +74,7 @@ gitpod.your-domain.com
### SSL
-- Gitpod requires trusted HTTPS certificates. We recommend using [Let's Encrypt](https://letsencrypt.org/) for retrieving certificates as we do for [gitpod.io](https://gitpod.io).
+- Gitpod requires trusted HTTPS certificates. While there is no hard requirement on any certificate authority, we recommend using [Let's Encrypt](https://letsencrypt.org/) for retrieving certificates as we do for [gitpod.io](https://gitpod.io).
- Installation of Gitpod with SSL certificates signed with your own CA are not currently supported. This scenario is desired and we would welcome help getting [this community pull-request](https://github.com/gitpod-io/gitpod/pull/2984) merged.
- The HTTPS certificates for your domain must include `your-domain.com`, `*.your-domain.com` and `*.ws.your-domain.com`. Beware that wildcard certificates are valid for one level only (i.e. `*.a.com` is not valid for `c.b.a.com`)

original_message: Clarified Let's Encrypt Requirement (#1011)


message: Update links for openvscode server guides

diff:
@@ -62,7 +62,7 @@ Getting started is as simple as a one-line `docker run` command and starting [lo
docker run -it --init -p 3000:3000 -v "$(pwd):/home/workspace:cached" gitpod/openvscode-server
```
-To run VS Code on the cloud provider of your choice we created [guides](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/) for [AWS](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/aws-ec2), [Azure](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/azure-vm), [Digital Ocean](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/digital-ocean), [GCP](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/gcp-gce), [Railway](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/railway) and [Render](https://github.com/gitpod-io/openvscode-server/tree/main/docs/guides/render).
+To run VS Code on the cloud provider of your choice we created [guides](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/) for [AWS](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/aws-ec2), [Azure](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/azure-vm), [Digital Ocean](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/digital-ocean), [GCP](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/gcp-gce), [Railway](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/railway) and [Render](https://github.com/gitpod-io/openvscode-server/tree/docs/guides/render).
A big thank you to all our engineers involved in making this happen, specifically [Anton](https://github.com/akosyakov), [Jean Pierre](https://github.com/jeanp413), [Filip](https://github.com/filiptronicek) and [Mike](https://github.com/mikenikles)!


message: Update teams and projects blog post

diff: Binary files a/static/images/blog/teams-and-projects/invite-members.png and /dev/null differ

diff: Binary files a/static/images/blog/teams-and-projects/new-team.png and /dev/null differ

diff: Binary files /dev/null and b/static/images/blog/teams-and-projects/prebuild-in-progress.jpg differ

diff: Binary files a/static/images/blog/teams-and-projects/prebuild-in-progress.png and /dev/null differ

diff: Binary files a/static/images/blog/teams-and-projects/project-type-detected.png and /dev/null differ

diff: Binary files a/static/images/blog/teams-and-projects/teams.jpg and b/static/images/blog/teams-and-projects/teams.jpg differ

diff: Binary files a/static/images/blog/teams-and-projects/teams.png and /dev/null differ

diff: Binary files a/static/images/blog/teams-and-projects/teaser.jpg and b/static/images/blog/teams-and-projects/teaser.jpg differ

original_message: Update teams and projects blog post


message: Add team deletion permission

diff:
@@ -97,6 +97,7 @@ You can remove a project by using the more actions button while hovering over a
| Permission | Owner | Member |
| ------------------- | ----- | ------ |
| Manage Team Members | Yes | No |
+| Delete Team | Yes | No |
| Invite Team Members | Yes | Yes |
| Add Projects | Yes | Yes |
| Remove Projects | Yes | Yes |

original_message: Add team deletion permission


message: Giving more context on workspace-full

diff:
@@ -9,7 +9,7 @@ title: Custom Docker Image
# Custom Docker Image
-By default, Gitpod uses a [standard Docker image](https://github.com/gitpod-io/workspace-images/blob/master/full/Dockerfile) as the foundation for workspaces.
+By default, Gitpod uses a standard Docker Image called [`Workspace-Full`](https://github.com/gitpod-io/workspace-images/blob/master/full/Dockerfile) as the foundation for workspaces. Workspaces started based on this default image come pre-installed with Docker, Go, Java, Node.js, C/C++, Python, Ruby, Rust, PHP as well as tools such as Homebrew, Tailscale, Nginx and several more.
If this image does not include the tools you need for your project, you can provide a public Docker image or your own [Dockerfile](#using-a-dockerfile). This provides you with the flexibility to install the tools & libraries required for your project.

original_message: Giving more context on workspace-full (#1221)


message: Change environment variable scope reference

diff:
@@ -81,7 +81,7 @@ You can also configure and view the persistent environment variables in [your ac
You can add as many environment variables as you wish.
The repository pattern of each variable determines in what workspace it will be available.
-Repository patterns follow the `repo/owner` pattern. You can use a wildcard on either of the two, e.g. `gitpod-io/*` would make that variable available in all repositories owned by `gitpod-io`.
+Repository patterns follow the `owner/repository` pattern. You can use a wildcard on either of the two, e.g. `gitpod-io/*` would make that variable available in all repositories owned by `gitpod-io`.
Conversely `*/vscode` would make that variable available on all repositories called `vscode`; this is especially useful for forks.
Subsequently `*/*` makes that variable available in every workspace.


message: Upate usage number

diff:
<Features {features} />
</div>
<SectionScreenshot />
-<UsedBy title="Used by 400k+ developers" />
+<UsedBy title="Used by 500k+ developers" />
<Features features={otherFeatures} />
<Section>
<SecondaryFeatures {secondaryFeatures} />

diff:
Security at Gitpod

- Gitpod is trusted by over 450k developers and companies that are moving
+ Gitpod is trusted by over 500k developers and companies that are moving
their dev environments to the cloud.

Talk to an expert

original_message: Upate usage number (#1336)


message: Fix AORs link

diff:
@@ -29,7 +29,7 @@ When it comes to the people you work with, quality matters more than quantity. H
- **Defer the entire C-Suite**. As a company grows, you need to build out its structures, so that information flows efficiently and effectively. Director, VP, and C-Level layers are the standard answer to scaling companies. But adding such a layer comes at a cost (longer information flow). As a single CEO, you'll feel the need to delegate to a CFO, COO, etc., much earlier. With two CEOs, you can defer adding that layer because you cover more ground (fewer blindspots). With [Chris](https://twitter.com/csweichel) as our CTO, our executive team consists of three people that are highly aligned while adding different perspectives to the conversations.
-- **Grounded Decisions**. A common preconception is that decision-making would be less efficient with two CEOs. The contrary is the case if you do it right. For one, if you have two CEOs, each needs to have clear [Areas of Responsibilities (AORs)](https://gitpod.notion.site/Areas-of-Responsibilities-AORs-b28196be96b94a50a85de14112a57d010). It becomes straightforward for everyone who makes the call. There are, however, some shared AORs as well. For those critical areas, you get more grounded decisions. When we reach out with a significant change, the whole team knows we've at least run this by the two of us (of course, we consult with others in the decision process).
+- **Grounded Decisions**. A common preconception is that decision-making would be less efficient with two CEOs. The contrary is the case if you do it right. For one, if you have two CEOs, each needs to have clear [Areas of Responsibilities (AORs)](https://gitpod.notion.site/Areas-of-Responsibilities-AORs-b28196be96b94a50a85de14112a57d01). It becomes straightforward for everyone who makes the call. There are, however, some shared AORs as well. For those critical areas, you get more grounded decisions. When we reach out with a significant change, the whole team knows we've at least run this by the two of us (of course, we consult with others in the decision process).
- **Team over individual**. Company culture is essential for a modern tech startup. Not only to attract the best talent but to make sure everyone is having a great time building a superb product for your users. Our culture at Gitpod is based on openness, humbleness, empathy, and generally an egoless team spirit. A dual leadership embraces and emphasizes these values, while a single CEO model quickly leads to throne building.

original_message: Fix AORs link (#1706)


message: Change blindspot

diff:
@@ -25,9 +25,9 @@ Whether a Co-CEO setup is good or not has been a matter of contention throughout
When it comes to the people you work with, quality matters more than quantity. Hence, one great CEO is better than two mediocre ones. Conversely, if both CEOs think too similarly and care about the same parts of the business, you don't get many of the benefits below. But if you run your company with two CEOs who operate with high trust and full transparency, are aligned in terms of [direction and culture](https://www.notion.so/gitpod/Gitpod-s-Direction-be35d064c0704fbda61c542b84e07ef6), and have complementary skill sets, your company will see a lot of benefits:
-- **Fewer blind spots**. Let's face it, we all have our strengths and weaknesses. We are motivated differently and are more or less passionate about the various responsibilities of a CEO. With two complementary CEOs, you can cover much more ground effectively.
+- **Fewer skill gaps**. Let's face it, we all have our strengths and weaknesses. We are motivated differently and are more or less passionate about the various responsibilities of a CEO. With two complementary CEOs, you can cover much more ground effectively.
-- **Defer the entire C-Suite**. As a company grows, you need to build out its structures, so that information flows efficiently and effectively. Director, VP, and C-Level layers are the standard answer to scaling companies. But adding such a layer comes at a cost (longer information flow). As a single CEO, you'll feel the need to delegate to a CFO, COO, etc., much earlier. With two CEOs, you can defer adding that layer because you cover more ground (fewer blindspots). With [Chris](https://twitter.com/csweichel) as our CTO, our executive team consists of three people that are highly aligned while adding different perspectives to the conversations.
+- **Defer the entire C-Suite**. As a company grows, you need to build out its structures, so that information flows efficiently and effectively. Director, VP, and C-Level layers are the standard answer to scaling companies. But adding such a layer comes at a cost (longer information flow). As a single CEO, you'll feel the need to delegate to a CFO, COO, etc., much earlier. With two CEOs, you can defer adding that layer because you cover more ground (fewer skill gaps). With [Chris](https://twitter.com/csweichel) as our CTO, our executive team consists of three people that are highly aligned while adding different perspectives to the conversations.
- **Grounded Decisions**. A common preconception is that decision-making would be less efficient with two CEOs. The contrary is the case if you do it right. For one, if you have two CEOs, each needs to have clear [Areas of Responsibilities (AORs)](https://gitpod.notion.site/Areas-of-Responsibilities-AORs-b28196be96b94a50a85de14112a57d01). It becomes straightforward for everyone who makes the call. There are, however, some shared AORs as well. For those critical areas, you get more grounded decisions. When we reach out with a significant change, the whole team knows we've at least run this by the two of us (of course, we consult with others in the decision process).

original_message: Change blindspot (#1739)


message: Make language around pricing more clear

diff:
@@ -19,7 +19,7 @@ export const pricingPlans: Pricing[] = [
"Public & private repos",
{
text: "4 parallel workspaces",
- tooltip: "Open up to 4 workspaces in parallel.",
+ tooltip: "Open up to 4 workspaces per user in parallel.",
},
{
text: "30min inactivity timeout",
@@ -49,7 +49,7 @@ export const pricingPlans: Pricing[] = [
"Unlimited hours",
{
text: "8 parallel workspaces",
- tooltip: "Open up to 8 workspaces in parallel.",
+ tooltip: "Open up to 8 workspaces per user in parallel.",
},
{
text: "Team Plans",
@@ -70,7 +70,7 @@ export const pricingPlans: Pricing[] = [
"All in Professional",
{
text: "16 parallel workspaces",
- tooltip: "Open up to 16 workspaces in parallel.",
+ tooltip: "Open up to 16 workspaces per user in parallel.",
},
"1hr inactivity timeout",
{

original_message: Make language around pricing more clear (#1760)


message: Remove link to private repository

diff:
/blog/gitlab-integration/+ /blog/gitlab-integration 301
/careers https://gitpod.crew.work/jobs 301
/chat https://discord.com/invite/gitpod 301
-/cla https://www.github.com/gitpod-io/cla
/code-of-conduct https://github.com/gitpod-io/.github/blob/main/CODE_OF_CONDUCT.md
/configure/editor /docs/editors/vscode 301
/direction https://www.notion.so/gitpod/Gitpod-s-Direction-be35d064c0704fbda61c542b84e07ef6 301

diff:
@@ -13,7 +13,6 @@ Gitpod is developed as an open core product under an [OSI-approved open source l
Gitpodders have built-in the open for the last decade. Transparency is key and as a company Gitpod strives to be as open about as many things as possible. This refers to both developing Gitpod in the open (public issues, public roadmap, public milestones) as well as how employees interact on a personal level with other human beings. Gitpodders are strong believers in the benefits that an open culture provides. At Gitpod we are open-minded, inclusive, transparent, and curious. We always remain students of the game, not masters of the game.
-- [Contributor license agreement](https://www.gitpod.io/cla)
- [Code Style](features-and-patches/code-style)
- [Commit message convention](features-and-patches/commit-message-convention)
- [Submitting a pull request](features-and-patches/submitting-a-pull-request)

diff:
@@ -41,8 +41,6 @@ git push origin my-fix-branch
In GitHub, send a pull request to `gitpod-io:main`.
-- Sign the [Contributor License Agrement](https://www.gitpod.io/cla) if prompted by the robots.
-
If we suggest changes, then:
- Make the required updates.
@@ -59,8 +57,6 @@ Before you submit your pull request, please:
- If you are considering submitting a pull-request that is more than a simple fix, open a discussion on GitHub first with your proposal.
- Search [GitHub](https://github.com/gitpod-io/gitpod/pulls) for an open or closed Pull Request that relates to your submission.
-- Sign the [Contributor License Agrement](https://www.gitpod.io/cla) if prompted by the robots.
-
If we suggest changes, then:
- Make the required updates.

original_message: Remove link to private repository (#1789)


message: Update GitLab logo

original_message: Update GitLab logo (#2001)


diff:
@@ -94,12 +94,14 @@ You can remove a project by using the more actions button while hovering over a
## Roles
| Permission | Owner | Member |
-| ------------------- | ----- | ------ |
+| ---------------------- | ----- | ------ |
| Manage Team Members | Yes | No |
| Delete Team | Yes | No |
+| Edit Project Settings | Yes | No |
+| Edit Project Variables | Yes | No |
| Invite Team Members | Yes | Yes |
-| Add Projects | Yes | Yes |
-| Remove Projects | Yes | Yes |
+| Add Projects. | Yes | Yes |
+| Remove Projects. | Yes | Yes |
| Add Projects | Yes | Yes |
| View Branches | Yes | Yes |
| View Prebuilds | Yes | Yes |

original_message: fix: update teams and projects roles table (#2132)


message: Add missing key feature in changelog

diff:
@@ -17,6 +17,7 @@ Now they are available in stable release as well via VS Code settings. Key highl
- **[Connection improvements for VS Code Desktop](#connection-improvements-for-vs-code-desktop)** to bring stability and performance.
- **[New ports explorer in VS Code Browser](#new-ports-explorer-in-vs-code-browser)** to align interface with VS Code Desktop.
+- **[Latest changelog view in VS Code](#latest-changelog-view-in-vs-code)** to access the latest changelog directly from VS Code Browser or Desktop.
> You can enable `Latest Release` in [your preferences](https://gitpod.io/preferences) and try the latest updates as soon as they are available.
@@ -50,9 +51,6 @@ The new VS Code command `Gitpod: Show Release Notes` let you access latest chang
### Fixes and improvements
- `gp` has now a new `timeout` namespace letting you to [show](/docs/command-line-interface#show) and [extend](/docs/command-line-interface#extend) timeout of a running workspace.
-
-![Control workspace timeout with `gp`](/images/changelog/2022-08-01/timeout.png)
-
- [#11642](https://github.com/gitpod-io/gitpod/pull/11642) - [local-preview] Add separated anonymous telemetry <Contributors usernames="MrSimonEmms,Pothulapati" />
- [#11592](https://github.com/gitpod-io/gitpod/pull/11592) - [dashboard] Replace workspace search alert <Contributors usernames="andrew-farries,easyCZ,geropl,gtsiolis" />
- [#11652](https://github.com/gitpod-io/gitpod/pull/11652) - [dashboard] Fix persistence of checkbox values on settings page <Contributors usernames="andrew-farries,easyCZ" />

diff: Binary files a/static/images/changelog/2022-08-01/timeout.png and /dev/null differ

original_message: Add missing key feature in changelog (#2536)


message: fix: team page link in about page

diff:
textClassNames="mb-x-small"
>
<div slot="content" class="flex flex-col items-center">
- <LinkButton href="#" variant="primary" size="large" class="mb-small">
+ <LinkButton
+ href="/about/team"
+ variant="primary"
+ size="large"
+ class="mb-small"
+ >
Meet the team
</LinkButton>

original_message: fix: team page link in about page (#2994)


diff:
title: November Gitpod Release 2022
excerpt: The latest Gitpod updates for November 2022, including new JetBrains IDEs, more reliable Vs Code extensions and lots of other fixes and improvements.
date: 2022-11-30
-image: 2022-11-30-og.jpg
-ogImage: 2022-11-31-og.jpg
+image: 2022-11-30.jpg
+ogImage: 2022-11-30.jpg
alt: 2022-11-30 image
---

diff: Binary files a/static/images/changelog/2022-11-30-og.jpg and /dev/null differ

diff: Binary files /dev/null and b/static/images/changelog/2022-11-30.jpg differ

original_message: fix: update changelog header image for November 2022 (#3091)


message: Update team page statistics

diff:
@@ -44,24 +44,14 @@ export const teamImages: Image[] = [
export const featureTitles: FeatureTitle[] = [
{
main: "More than",
- sub: "60",
+ sub: "70",
third: "remote team members",
},
{
main: "From",
- sub: "23",
+ sub: "53",
third: "countries",
},
- {
- main: "Distributed across",
- sub: "13",
- third: "time zones",
- },
- {
- main: "From",
- sub: "4",
- third: "continents",
- },
];
export const coreValues: Card[] = [

original_message: Update team page statistics (#3113)


message: Update explore component description

diff:
const {
title = "Get Started for Free",
- description = " for each task, fully automated, in secoSpin up fresh cloud development environmentsnds.",
+ description = "Spin up fresh cloud development environments for each task, in the cloud, in seconds.",
note = "",
link = {
text: "Try now",

original_message: Update explore component description (#3234)


message: Update team permissions table

diff:
@@ -51,13 +51,14 @@ You can leave a team using the more actions button in the Members list while hov
| Permission | Owner | Member |
| ---------------------- | ----- | ------ |
| Manage Team Members | Yes | No |
-| Delete Team | Yes | No |
-| Manage Team billing | Yes | No |
+| Edit Team Settings | Yes | No |
+| Manage Team Billing | Yes | No |
| Edit Project Settings | Yes | No |
| Edit Project Variables | Yes | No |
+| View Team Usage | Yes | No |
| Invite Team Members | Yes | Yes |
-| Add Projects. | Yes | Yes |
-| Remove Projects. | Yes | Yes |
+| Add Projects | Yes | Yes |
+| Remove Projects | Yes | Yes |
| Add Projects | Yes | Yes |
| View Branches | Yes | Yes |
| View Prebuilds | Yes | Yes |

original_message: Update team permissions table (#3241)


message: Update permissions for project settings

diff:
@@ -53,9 +53,9 @@ You can leave a team using the more actions button in the Members list while hov
| Manage Team Members | Yes | No |
| Edit Team Settings | Yes | No |
| Manage Team Billing | Yes | No |
-| Edit Project Settings | Yes | No |
-| Edit Project Variables | Yes | No |
| View Team Usage | Yes | No |
+| Edit Project Settings | Yes | Yes |
+| Edit Project Variables | Yes | Yes |
| Invite Team Members | Yes | Yes |
| Add Projects | Yes | Yes |
| Remove Projects | Yes | Yes |

original_message: Update permissions for project settings (#3252)