rusefi
/
hyper-tuner-cloud
mirror of https://github.com/rusefi/hyper-tuner-cloud.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix for mobile (#379)

This commit is contained in:
Piotr Rogowski 2022-01-16 18:53:36 +01:00 committed by GitHub
parent c53cd0dcc3
commit f637e073bd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 34 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/TopBar.tsx
View File

@ -107,7 +107,7 @@ const TopBar = ({ tuneId }: { tuneId: string | null }) => {
});
const tabs = (
<Col span={10} md={10} sm={16} style={{ textAlign: 'center' }}>
<Col span={14} md={12} sm={16} style={{ textAlign: 'center' }}>
<Radio.Group
key={pathname}
defaultValue={matchedTabPath?.url || matchedTuneRootPath?.url}
@ -146,11 +146,11 @@ const TopBar = ({ tuneId }: { tuneId: string | null }) => {
return (
<Header className="app-top-bar">
<Row>
<Col span={0} md={6} sm={0} />
<Col span={0} md={4} sm={0} />
{tuneId ? tabs : <Col span={10} md={10} sm={16} />}
<Col span={12} md={8} sm={8} style={{ textAlign: 'right' }}>
<Col span={10} md={8} sm={8} style={{ textAlign: 'right' }}>
<Space>
<Tooltip visible={false} title={
{sm && <Tooltip visible={false} title={
<>
<Typography.Text keyboard>{isMac ? '⌘' : 'CTRL'}</Typography.Text>
<Typography.Text keyboard>SHIFT</Typography.Text>
@ -158,7 +158,7 @@ const TopBar = ({ tuneId }: { tuneId: string | null }) => {
</>
}>
<Button disabled icon={<SearchOutlined />} ref={searchInput} />
</Tooltip>
</Tooltip>}
<Link to={Routes.UPLOAD}>
<Button icon={<CloudUploadOutlined />} type={matchedTabPath?.url === Routes.UPLOAD ? 'primary' : 'default'}>
{lg && 'Upload'}
@ -195,7 +195,7 @@ const TopBar = ({ tuneId }: { tuneId: string | null }) => {
>
<Button icon={<CloudDownloadOutlined />}>
{lg && 'Download'}
<DownOutlined />
{sm && <DownOutlined />}
</Button>
</Dropdown>
<Dropdown
@ -224,7 +224,7 @@ const TopBar = ({ tuneId }: { tuneId: string | null }) => {
trigger={['click']}
>
<Button icon={<UserOutlined />}>
<DownOutlined />
{sm && <DownOutlined />}
</Button>
</Dropdown>
</Space>

25
src/pages/Info.tsx
View File

@ -21,6 +21,7 @@ const containerStyle = {
margin: '0 auto',
};
const rowProps = { gutter: 10 };
const colProps = { span: 24, sm: 12 };
const mapStateToProps = (state: AppState) => ({
tuneData: state.tuneData,
@ -40,55 +41,55 @@ const Info = ({ tuneData }: { tuneData: TuneDataState }) => {
<Divider>Details</Divider>
<Form>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.make!} addonBefore="Make" />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.model!} addonBefore="Model" />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.year!} addonBefore="Year" style={{ width: '100%' }} />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.displacement!} addonBefore="Displacement" addonAfter="l" />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.hp!} addonBefore="HP" style={{ width: '100%' }} />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.stockHp!} addonBefore="Stock HP" style={{ width: '100%' }} />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.engineCode!} addonBefore="Engine code" />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.cylindersCount!} addonBefore="No of cylinders" style={{ width: '100%' }} />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item>
<Select placeholder="Aspiration" style={{ width: '100%' }} value={tuneData.details.aspiration}>
<Select.Option value="na">Naturally aspirated</Select.Option>
@ -97,19 +98,19 @@ const Info = ({ tuneData }: { tuneData: TuneDataState }) => {
</Select>
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.fuel!} addonBefore="Fuel" />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.injectorsSize!} addonBefore="Injectors size" addonAfter="cc" />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item>
<Input value={tuneData.details.coils!} addonBefore="Coils" />
</Item>

25
src/pages/Upload.tsx
View File

@ -92,6 +92,7 @@ const containerStyle = {
const maxFileSizeMB = 10;
const descriptionEditorHeight = 260;
const rowProps = { gutter: 10 };
const colProps = { span: 24, sm: 12 };
const tuneIcon = () => <ToolOutlined />;
const logIcon = () => <FundOutlined />;
@ -492,55 +493,55 @@ const UploadPage = () => {
<Space>Details</Space>
</Divider>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item name="make" rules={requiredRules}>
<Input addonBefore="Make"/>
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item name="model" rules={requiredRules}>
<Input addonBefore="Model"/>
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item name="year" rules={requiredRules}>
<InputNumber addonBefore="Year" style={{ width: '100%' }} min={1886} max={2222} />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item name="displacement" rules={requiredRules}>
<InputNumber addonBefore="Displacement" addonAfter="l" min={0} max={100} />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item name="hp">
<InputNumber addonBefore="HP" style={{ width: '100%' }} min={0} />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item name="stockHp">
<InputNumber addonBefore="Stock HP" style={{ width: '100%' }} min={0} />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item name="engineCode">
<Input addonBefore="Engine code"/>
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item name="cylindersCount">
<InputNumber addonBefore="No of cylinders" style={{ width: '100%' }} min={0} />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item name="aspiration">
<Select placeholder="Aspiration" style={{ width: '100%' }}>
<Select.Option value="na">Naturally aspirated</Select.Option>
@ -549,19 +550,19 @@ const UploadPage = () => {
</Select>
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item name="fuel">
<Input addonBefore="Fuel" />
</Item>
</Col>
</Row>
<Row {...rowProps}>
<Col span={12}>
<Col {...colProps}>
<Item name="injectorsSize">
<InputNumber addonBefore="Injectors size" addonAfter="cc" min={0} />
</Item>
</Col>
<Col span={12}>
<Col {...colProps}>
<Item name="coils">
<Input addonBefore="Coils" />
</Item>

2
src/themes/common.less
View File

@ -1,7 +1,7 @@
@primary-color: #126ec3;
@text-light: #fff;
@border-radius-base: 5px;
@border-radius-base: 6px;
@layout-header-padding: 0 15px;
@layout-header-height: 45px;