Merge pull request #290 from pybricks/dlech

final updates for 1.0.0-beta.6
This commit is contained in:
David Lechner
2021-02-01 14:25:11 -06:00
committed by GitHub
13 changed files with 78 additions and 53 deletions
+1
View File
@@ -1 +1,2 @@
REACT_APP_NAME="Pybricks Code"
REACT_APP_VERSION=$npm_package_version
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@pybricks/pybricks-code",
"version": "1.0.0-beta.5",
"version": "1.0.0-beta.6",
"license": "MIT",
"author": "The Pybricks Authors",
"repository": {
+1 -1
View File
@@ -24,7 +24,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>Pybricks Code</title>
<title>%REACT_APP_NAME%</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

+9 -1
View File
@@ -10,7 +10,14 @@
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
"sizes": "192x192",
"purpose": "any"
},
{
"src": "logo192m.png",
"type": "image/png",
"sizes": "192x192",
"purpose": "maskable"
},
{
"src": "logo512.png",
@@ -20,6 +27,7 @@
],
"start_url": ".",
"display": "fullscreen",
"orientation": "landscape",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+2 -3
View File
@@ -9,6 +9,7 @@ import React from 'react';
import { connect } from 'react-redux';
import {
appName,
appVersion,
legoDisclaimer,
pybricksCopyright,
pybricksWebsiteUrl,
@@ -20,8 +21,6 @@ import en from './i18n.en.json';
import './about.scss';
const version = process.env.REACT_APP_VERSION;
type OwnProps = { isOpen: boolean; onClose: () => void };
type AboutDialogProps = OwnProps & WithI18nProps;
@@ -35,7 +34,7 @@ class AboutDialog extends React.Component<AboutDialogProps> {
const { isOpen, onClose, i18n } = this.props;
return (
<Dialog
title={`${appName} v${version}`}
title={`${appName} v${appVersion}`}
isOpen={isOpen}
onClose={() => onClose()}
>
+1 -1
View File
@@ -8,7 +8,7 @@
.pb-app-body {
// height makes everything fit without scrolling
height: calc(
var(--pb-vh, 100vh) - #{$pt-navbar-height} - #{$pb-status-bar-height}
var(--pb-vh, 100vh) - #{$pb-toolbar-height} - #{$pb-status-bar-height}
) !important;
}
+5 -1
View File
@@ -7,7 +7,11 @@
export const tooltipDelay = 1000;
/** Official name of the app. */
export const appName = 'Pybricks Code';
export const appName = process.env.REACT_APP_NAME || 'REACT_APP_NAME is undefined';
/** The version of the app (without the "v" prefix). */
export const appVersion =
process.env.REACT_APP_VERSION || 'REACT_APP_VERSION is undefined';
/** URL to main Pybricks website. */
export const pybricksWebsiteUrl = 'https://pybricks.com';
+2 -1
View File
@@ -11,6 +11,7 @@ import { createLogger } from 'redux-logger';
import createSagaMiddleware from 'redux-saga';
import './index.scss';
import App from './app/App';
import { appVersion } from './app/constants';
import { i18nManager } from './i18n';
import * as I18nToaster from './notifications/I18nToaster';
import { rootReducer } from './reducers';
@@ -65,7 +66,7 @@ store.subscribe(() => {
});
// special styling for beta versions
if (process.env.REACT_APP_VERSION?.match(/beta/)) {
if (appVersion.match(/beta/)) {
document.body.classList.add('pb-beta');
}
+28 -37
View File
@@ -1,7 +1,7 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2020 The Pybricks Authors
import { Alignment, ButtonGroup, Navbar } from '@blueprintjs/core';
import { ButtonGroup } from '@blueprintjs/core';
import React from 'react';
import OpenButton from '../editor/OpenButton';
import SaveAsButton from '../editor/SaveAsButton';
@@ -22,44 +22,35 @@ class Toolbar extends React.Component {
render(): JSX.Element {
return (
<Navbar
<div
role="toolbar"
onContextMenu={(e): void => e.preventDefault()}
className="no-box-shadow"
className="pb-toolbar no-box-shadow"
>
<Navbar.Group>
<ButtonGroup>
<OpenButton id="open" />
<SaveAsButton id="saveAs" />
</ButtonGroup>
<Navbar.Divider />
<ButtonGroup>
<RunButton id="run" keyboardShortcut="F5" />
<StopButton id="stop" keyboardShortcut="F6" />
<ReplButton id="repl" />
</ButtonGroup>
<Navbar.Divider />
<ButtonGroup>
<FlashButton id="flash" />
<BluetoothButton id="bluetooth" />
</ButtonGroup>
</Navbar.Group>
<Navbar.Group align={Alignment.RIGHT}>
<ButtonGroup>
<SettingsButton
id="settings"
onAction={() =>
this.setState({ settingsDrawerIsOpen: true })
}
/>
<SettingsDrawer
isOpen={this.state.settingsDrawerIsOpen}
onClose={() =>
this.setState({ settingsDrawerIsOpen: false })
}
/>
</ButtonGroup>
</Navbar.Group>
</Navbar>
<ButtonGroup className="pb-toolbar-group pb-align-left">
<OpenButton id="open" />
<SaveAsButton id="saveAs" />
</ButtonGroup>
<ButtonGroup className="pb-toolbar-group pb-align-left">
<RunButton id="run" keyboardShortcut="F5" />
<StopButton id="stop" keyboardShortcut="F6" />
<ReplButton id="repl" />
</ButtonGroup>
<ButtonGroup className="pb-toolbar-group pb-align-left">
<FlashButton id="flash" />
<BluetoothButton id="bluetooth" />
</ButtonGroup>
<ButtonGroup className="pb-toolbar-group pb-align-right">
<SettingsButton
id="settings"
onAction={() => this.setState({ settingsDrawerIsOpen: true })}
/>
<SettingsDrawer
isOpen={this.state.settingsDrawerIsOpen}
onClose={() => this.setState({ settingsDrawerIsOpen: false })}
/>
</ButtonGroup>
</div>
);
}
}
+27 -3
View File
@@ -5,7 +5,31 @@
@import '../variables.scss';
.#{$ns}-navbar-divider {
// don't draw vertical line since we are just using button groups
border-left: unset;
.#{$ns}-dark .pb-toolbar {
background-color: $pt-dark-app-background-color;
}
.pb-toolbar {
height: $pb-toolbar-height;
background-color: $pt-app-background-color;
padding: 0 $pt-grid-size * 1.5;
position: relative;
width: 100%;
z-index: $pt-z-index-content;
}
.pb-toolbar-group {
align-items: center;
display: flex;
height: $pb-toolbar-height;
&.pb-align-left {
float: left;
margin-right: $pt-grid-size * 2;
}
&.pb-align-right {
float: right;
margin-left: $pt-grid-size * 2;
}
}
+1 -4
View File
@@ -10,13 +10,10 @@ $pt-font-size: $pt-grid-size * 1.6;
$pt-font-size-large: $pt-grid-size * 1.8;
$pt-font-size-small: $pt-grid-size * 1.4;
$pt-navbar-height: 72px;
$pb-toolbar-height: 72px;
$pb-status-bar-height: 24px;
$pb-pybricks-blue: #0088ce;
$pt-app-background-color: #e8e8e8;
$pt-intent-primary: $pb-pybricks-blue;
$pt-outline-color: rgba($pb-pybricks-blue, 0.6);
$navbar-background-color: $pt-app-background-color;
$dark-navbar-background-color: $pt-dark-app-background-color;