Add development + building instructions for both package readmes

Check in with @julianbauer for feedback

1. rounded triangle
2. same size for light & dark theme

it's red in the implementation:

Cleanup folders like out/util, /, config etc

Add parameters needed for different environments: Browser, Electron

Docs

vertical scrolling

• gradient overflow?
• search sticky?

Tabs

• not very clear, which tab is currently selected

It would be great to plug playground into your server without writing too much boilerplate code.
Middleware solves this problem and enables you to write code like this:

import express from 'express';
import { express as middleware } from 'graphql-playground/middleware';

const app = express();

app.use('/playground', middleware({ endpointUrl: '/graphql' }));

app.listen(3000);

Here is how it is implemented in Voyager:
graphql-kit/graphql-voyager@ba35ed1...96009e8
Almost all the code can be reused for playground with minor changes :)

As it is a really strong contrast change, maybe a 0.1s linear transition

• Fix popup
• Replace "Application" & "Electron" with "GraphQL Playground"

Would be cool to have a format for exporting/importing queries and mutations. This way you could easily get started on an existing project, or work on the same project from different machines.

Currently comments are: # ${comment}
But comments are written in markdown. How should we display them?

Thanks a lot to @fson for sharing this prototype:

In either json or sdl format

Like CMD+R or CMD+Alt+J

A simple display: none rule is sufficient here

Maybe that is only possible for the Electron app

Use https://api.graph.cool/system, search for id, click on the first result and multiple results will be selected. Only one should be selected:

otherwise you can't close them anymore