opensource/cloudbeaver
3
0
Fork 0
mirror of https://github.com/dbeaver/cloudbeaver.git synced 2026-09-24 16:04:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

improve(core-connection): CB-319 delete formStyles.ts

Browse Source 
CB-319
This commit is contained in:
Naumov Alexey
2020-10-21 12:46:34 +03:00
parent 81ad29ccb4
commit ca9edd2ad9
6 changed files with 33 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/Options.tsx
+7 -2
View File
@@ -28,7 +28,6 @@ import { useStyles } from '@cloudbeaver/core-theming';
import { EConnectionType } from '../EConnectionType';
import { IConnectionFormModel } from '../IConnectionFormModel';
import { formStyles } from './formStyles';
import { OptionsController } from './OptionsController';
import { ParametersForm } from './ParametersForm';
@@ -52,6 +51,12 @@ const styles = css`
flex-direction: column;
max-width: 630px;
}
connection-type {
margin-left: 180px;
}
Radio {
composes: theme-typography--body2 from global;
}
`;
export const Options = observer(function Options({
@@ -66,7 +71,7 @@ export const Options = observer(function Options({
const translate = useTranslate();
const [focusedRef] = useFocus<HTMLFormElement>({ focusFirstChild: true });
return styled(useStyles(styles, formStyles))(
return styled(useStyles(styles))(
<SubmittingForm ref={focusedRef} onChange={controller.onFormChange} onSubmit={onSave}>
<FormBox>
<FormBoxElement>
webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/ParametersForm.tsx
+8 -4
View File
@@ -7,21 +7,25 @@
*/
import { observer } from 'mobx-react';
import styled, { use, css } from 'reshadow';
import styled, { css, use } from 'reshadow';
import { FormGroup, InputField } from '@cloudbeaver/core-blocks';
import { useTranslate } from '@cloudbeaver/core-localization';
import { ConnectionInfo } from '@cloudbeaver/core-sdk';
import { useStyles } from '@cloudbeaver/core-theming';
import { formStyles } from './formStyles';
interface ParametersFormProps {
connection: ConnectionInfo;
disabled?: boolean;
embedded?: boolean;
}
const parametersFormStyles = css`
sub-label {
composes: theme-typography--caption from global;
line-height: 14px;
}`;
export const ParametersForm = observer(function ParametersForm({
connection,
embedded,
@@ -29,7 +33,7 @@ export const ParametersForm = observer(function ParametersForm({
}: ParametersFormProps) {
const translate = useTranslate();
return styled(useStyles(formStyles))(
return styled(useStyles(parametersFormStyles))(
<>
{!embedded && (
<layout-grid-inner as="div">
webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/formStyles.ts
-31
View File
@@ -1,31 +0,0 @@
/*
* cloudbeaver - Cloud Database Manager
* Copyright (C) 2020 DBeaver Corp and others
*
* Licensed under the Apache License, Version 2.0.
* you may not use this file except in compliance with the License.
*/
import { css } from 'reshadow';
export const formStyles = css`
connection-form {
flex: 1;
display: flex;
overflow: auto;
flex-direction: row;
}
layout-grid {
flex: 1;
}
connection-type {
margin-left: 180px;
}
Radio {
composes: theme-typography--body1 from global;
}
sub-label {
composes: theme-typography--caption from global;
line-height: 14px;
}
`;
webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ConnectionForm.tsx
+10 -2
View File
@@ -17,7 +17,6 @@ import { useTranslate } from '@cloudbeaver/core-localization';
import { useStyles } from '@cloudbeaver/core-theming';
import { ConnectionType } from '../ConnectionFormDialogController';
import { formStyles } from './formStyles';
import { IFormController } from './IFormController';
import { ParametersForm } from './ParametersForm';
@@ -34,6 +33,15 @@ const connectionFormStyles = css`
FormBoxElement {
flex: 1;
}
connection-type {
padding: 12px;
margin-left: 160px;
}
Radio {
composes: theme-typography--body2 from global;
font-weight: 500;
padding: 0 12px;
}
`;
export const ConnectionForm = observer(function ConnectionForm({
@@ -43,7 +51,7 @@ export const ConnectionForm = observer(function ConnectionForm({
const translate = useTranslate();
const [focusedRef] = useFocus<HTMLFormElement>({ focusFirstChild: true });
return styled(useStyles(formStyles, connectionFormStyles))(
return styled(useStyles(connectionFormStyles))(
<SubmittingForm ref={focusedRef}>
<FormBox>
<FormBoxElement>
webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ParametersForm.tsx
+8 -3
View File
@@ -7,13 +7,12 @@
*/
import { observer } from 'mobx-react';
import styled, { use } from 'reshadow';
import styled, { css, use } from 'reshadow';
import { InputField } from '@cloudbeaver/core-blocks';
import { useTranslate } from '@cloudbeaver/core-localization';
import { useStyles } from '@cloudbeaver/core-theming';
import { formStyles } from './formStyles';
import { IFormController } from './IFormController';
interface ParametersFormProps {
@@ -21,13 +20,19 @@ interface ParametersFormProps {
embedded?: boolean;
}
const parametersFormStyles = css`
sub-label {
composes: theme-typography--caption from global;
line-height: 14px;
}`;
export const ParametersForm = observer(function ParametersForm({
controller,
embedded,
}: ParametersFormProps) {
const translate = useTranslate();
return styled(useStyles(formStyles))(
return styled(useStyles(parametersFormStyles))(
<>
{!embedded && (
<layout-grid-inner as="div">
webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/formStyles.ts
-32
View File
@@ -1,32 +0,0 @@
/*
* cloudbeaver - Cloud Database Manager
* Copyright (C) 2020 DBeaver Corp and others
*
* Licensed under the Apache License, Version 2.0.
* you may not use this file except in compliance with the License.
*/
import { css } from 'reshadow';
export const formStyles = css`
connection-form {
flex: 1;
display: flex;
flex-direction: column;
padding: 18px 24px;
padding-top: 4px;
}
connection-type {
padding: 12px;
margin-left: 160px;
}
Radio {
composes: theme-typography--body1 from global;
font-weight: 500;
padding: 0 12px;
}
sub-label {
composes: theme-typography--caption from global;
line-height: 14px;
}
`;