37b173071e
if a page uses the reload button, it had only 1 column of space, and only if the viewport was at least "sm". this is not the case for typical smartphones, in which case the reload button would appear on its own row instead of to the right. we now limit the heading to 10 columns if and only if the reload button is to be used, otherwise the heading uses all 12 columns, regardless of the viewport size. the reload buton uses two columns -- if it is displayed at all. the font size of the icon is increased slightly. as the font size of h1 headings changes with the viewport size, we need to center both the heading and the button vertically. |
||
|---|---|---|
| .. | ||
| .vscode | ||
| public | ||
| src | ||
| .gitignore | ||
| .prettierrc.json | ||
| env.d.ts | ||
| eslint.config.js | ||
| index.html | ||
| package.json | ||
| README.md | ||
| tsconfig.config.json | ||
| tsconfig.json | ||
| vite.config.ts | ||
| yarn.lock | ||
OpenDTU web frontend
You can run the webapp locally with yarn dev. If you enter the IP of your ESP in the vite.user.ts beforehand (template can be found in vite.config.ts), all api requests will even be proxied to the real ESP. Then you can develop the webapp as if it were running directly on the ESP. The yarn dev also supports hot reload, i.e. as soon as you save a vue file, it is automatically reloaded in the browser.
Project Setup
yarn install
Compile and Hot-Reload for Development
yarn dev
Type-Check, Compile and Minify for Production
yarn build
Lint with ESLint
yarn lint