Skip to content

Commit 1a5c5b3

Browse files
Merge pull request #37 from mikehoffms/user/mikehoffms/1div-readme
Clarify Readme for 1DIV
2 parents 1b2519a + b6f5184 commit 1a5c5b3

File tree

1 file changed

+15
-10
lines changed

1 file changed

+15
-10
lines changed

1DIV/README.md

+15-10
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,28 @@
1-
# 1DIV - A Window Controls Overlay demo
1+
# 1DIV - Window Controls Overlay demo
22

33
➡️ **[Open the demo](https://microsoftedge.github.io/Demos/1DIV/dist/)** ⬅️
44

5-
**1DIV** is a demo web app where you can create CSS designs using just one HTML `div` element. Your designs are saved only locally in the browser's memory. You can create as many as you want. This demo app can be installed locally as a PWA.
5+
**1DIV** is a demo web app that enables you to create multiple CSS designs by using a single HTML `div` element. Your CSS designs are only saved locally, in the browser's memory. This demo app can be installed locally as a Progressive Web App (PWA).
6+
67

78
## Requirements
89

9-
The main goal of this demo is to showcase the [Window Controls Overlay PWA feature](https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/window-controls-overlay), so to make the most use of it, you will need the following things:
10+
The main goal of this demo is to showcase the Window Controls Overlay (WCO) PWA feature, which is described in [Display content in the title bar](https://learn.microsoft.com/microsoft-edge/progressive-web-apps-chromium/how-to/window-controls-overlay). To make the most use of this demo, view it in a browser that's based on the Chromium engine, such as Microsoft Edge.
1011

11-
* Use a 93+ Chromium-based browser.
12-
* Enable the Window Controls Overlay feature in about:flags (`Desktop PWA Window Controls Overlay`).
12+
The demo app also demonstrates using [constructable stylesheets](https://developers.google.com/web/updates/2019/02/constructable-stylesheets). Constructable stylesheets are supported in the following web browsers:
13+
* Browsers that are based on the Chromium engine, such as Microsoft Edge.
14+
* Firefox, by enabling the `layout.css.constructable-stylesheets.enabled` flag.
1315

14-
The demo app also uses [constructable stylesheets](https://developers.google.com/web/updates/2019/02/constructable-stylesheets) which are only supported in Chromium-based browsers, and on Firefox if you enable the `layout.css.constructable-stylesheets.enabled` flag first.
1516

1617
## Building locally
1718

18-
The app is not build automatically in CI. If you make a change to a file in `src` or update a dependency, you will need to build locally and commit the generated files.
19+
To run this demo app as-is, you don't need to build it.
20+
21+
If you make a change to a file in the `src` directory of this demo app, or update a dependency, you must build the app locally, and then commit the generated files. This demo app is not built automatically using Continuous Integration (CI).
1922

20-
To build the app locally:
23+
To build this demo app locally, at a command prompt such as Windows Terminal, run the following commands in the present directory:
2124

22-
* `npm install`,
23-
* and then `npm run build`.
25+
```
26+
npm install
27+
npm run build
28+
```

0 commit comments

Comments
 (0)