mirror of
https://github.com/gristlabs/grist-core.git
synced 2024-10-19 14:32:00 +00:00
86062a8c28
Summary: - New styling for forms. - New field options for various field types (spinner, checkbox, radio buttons, alignment, sort). - Improved alignment of form fields in columns. - Support for additional select input keyboard shortcuts (Enter and Backspace). - Prevent submitting form on Enter if an input has focus. - Fix for changing form field type causing the field to disappear. Test Plan: Browser tests. Reviewers: jarek Reviewed By: jarek Differential Revision: https://phab.getgrist.com/D4223
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import {makeT} from 'app/client/lib/localization';
|
|
import {
|
|
buildFormMessagePage,
|
|
cssFormMessageImage,
|
|
cssFormMessageImageContainer,
|
|
cssFormMessageText,
|
|
} from 'app/client/ui/FormContainer';
|
|
import {getPageTitleSuffix} from 'app/common/gristUrls';
|
|
import {getGristConfig} from 'app/common/urlUtils';
|
|
import {Disposable, makeTestId, styled} from 'grainjs';
|
|
|
|
const testId = makeTestId('test-form-');
|
|
|
|
const t = makeT('FormErrorPage');
|
|
|
|
export class FormErrorPage extends Disposable {
|
|
constructor(private _message: string) {
|
|
super();
|
|
document.title = `${t('Error')}${getPageTitleSuffix(getGristConfig())}`;
|
|
}
|
|
|
|
public buildDom() {
|
|
return buildFormMessagePage(() => [
|
|
cssFormErrorMessageImageContainer(
|
|
cssFormErrorMessageImage({src: 'img/form-error.svg'}),
|
|
),
|
|
cssFormMessageText(this._message, testId('error-page-text')),
|
|
], testId('error-page'));
|
|
}
|
|
}
|
|
|
|
const cssFormErrorMessageImageContainer = styled(cssFormMessageImageContainer, `
|
|
height: 281px;
|
|
`);
|
|
|
|
const cssFormErrorMessageImage = styled(cssFormMessageImage, `
|
|
max-height: 281px;
|
|
max-width: 250px;
|
|
`);
|