Skip to content

Commit

Permalink
feat: v3.1
Browse files Browse the repository at this point in the history
  • Loading branch information
lulu-tro committed Jul 31, 2024
1 parent 9056cb0 commit 7d439e1
Show file tree
Hide file tree
Showing 19 changed files with 641 additions and 12 deletions.
Binary file added src/assets/img/login-img.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions src/assets/styles/color.scss
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,9 @@ $text-color-sub-info: #a1a7c4;
$text-color-gray-info: #424242;
$text-color-white: $white;
$text-color-menuItem:#989CB0;

$text-color-desc: #72717D;

//functional color
$success-color: #06a561;
$warning-color: #f99600;
Expand Down Expand Up @@ -59,3 +62,4 @@ $dark-success-color: #06a561;
$dark-warning-color: #f99600;
$dark-info-color: #2ebbb9;
$dark-error-color: #dc4242;

46 changes: 46 additions & 0 deletions src/assets/styles/main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -275,3 +275,49 @@
}
}


.login-bg {
background: #F2F5F7;

}

.login-form{
padding-left: 5.5rem;
}

.login-title{
font-family: Gilroy, Gilroy;
font-weight: bold;
font-size: 36px;
color: #171418;
line-height: 43px;
text-align: left;
font-style: normal;
margin-bottom: 15px;
}
.login-desc {
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 15px;
color: #232427;
line-height: 21px;
text-align: left;
font-style: normal;
margin-bottom: 55px;
}
.min-h-400 {
min-height: 400px;
}
.max-w-515px {
max-width: 515px;
}
.min-w-334px{
min-width: 334px;

}

.login-btn{
min-width: 155px;
font-size: 14px;
font-weight: bold;
}
3 changes: 3 additions & 0 deletions src/assets/styles/overwrite.scss
Original file line number Diff line number Diff line change
Expand Up @@ -62,3 +62,6 @@
}
}

.ant-form-item-label .ant-form-item-required {
width: 100%;
}
15 changes: 15 additions & 0 deletions src/assets/styles/tailwind.css
Original file line number Diff line number Diff line change
Expand Up @@ -1650,10 +1650,16 @@ video {
margin-bottom: 1.25rem;
}

.mt-5 {
margin-top: 1.25rem;
}


.mt-6 {
margin-top: 1.5rem;
}


.mr-6 {
margin-right: 1.5rem;
}
Expand Down Expand Up @@ -1922,6 +1928,10 @@ video {
padding-right: 2rem;
}

.pr-12 {
padding-right: 3rem;
}

.pb-12 {
padding-bottom: 3rem;
}
Expand Down Expand Up @@ -2492,3 +2502,8 @@ video {

@media (min-width: 1536px) {
}


.min-h-screen{
min-height: 100vh;
}
3 changes: 3 additions & 0 deletions src/assets/styles/themeDark.scss
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,9 @@
.theme-text-sub-info {
color: $dark-text-color-sub-info;
}
.theme-text-desc {
color: $dark-text-color-sub-info;
}
.theme-text-gray-info {
color: $dark-text-color-gray-info;
}
Expand Down
5 changes: 4 additions & 1 deletion src/assets/styles/themeLight.scss
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@
.theme-text-sub-info {
color: $text-color-sub-info;
}
.theme-text-desc {
color: $text-color-desc;
}
.theme-text-gray-info {
color: $text-color-gray-info;
}
Expand Down Expand Up @@ -358,4 +361,4 @@ svg {
padding: 10px 10px;
color: #5E6364;
flex-wrap: wrap;
}
}
15 changes: 9 additions & 6 deletions src/components/Cards/CardSettings.js
Original file line number Diff line number Diff line change
Expand Up @@ -47,12 +47,15 @@ export default function CardSettings({ color }) {
};
const [copyUrl, setCopyUrl] = useState(getCopyUrl(NODE_URL));
const reveal = async () => {
let { privateKey } = await getPrivateKey();
if (privateKey) {
Emitter.emit('openMessageModal', { message: privateKey });
} else {
Emitter.emit('showMessageAlert', { message: 'api_not_set', status: 'error', type: 'frontEnd' });
}
// e.preventDefault();
Emitter.emit('openCheckPrivateKeyModal');

// let { privateKey } = await getPrivateKey();
// if (privateKey) {
// Emitter.emit('openMessageModal', { message: privateKey });
// } else {
// Emitter.emit('showMessageAlert', { message: 'api_not_set', status: 'error', type: 'frontEnd' });
// }
};

const getPath = async () => {
Expand Down
54 changes: 54 additions & 0 deletions src/components/Login/Endpoint.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import React, { useContext } from 'react';
import { mainContext } from 'reducer';
import { Dropdown, Menu } from 'antd';
import themeStyle from 'utils/themeStyle.js';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Tooltip } from 'antd';
import { Truncate } from 'utils/text.js';
import { t } from 'utils/text.js';
import ClipboardCopy from 'components/Utils/ClipboardCopy';

const Endpoint = ({ color }) => {
// const { dispatch, state } = useContext(mainContext);
// const { account } = state;

const save = (e, wallet) => {
// connect(wallet, dispatch);
};

const handleChange = () => {
// disConnect(dispatch);
};

return (
<div className="flex flex-col justify-center max-w-515px">
<div className=" min-h-400">
<div className="login-title">{t('login')}</div>
<div className="text-gray-900 text-sm font-bold mb-12">
{t('login_endpoint_desc')}
</div>
<div className="mb-2 setting-header">
<h5 className="font-bold theme-text-main" htmlFor="grid-password">
API {t('endpoint')}
</h5>
<Tooltip overlayInnerStyle={{ width: '180px' }} placement="top" title={<p>{t('copy_url_tips')}</p>}>
{/* <i className="far fa-question-circle ml-1 text-xs"></i> */}
<QuestionCircleOutlined className="inline-flex items-center ml-1 text-xs" />
</Tooltip>
</div>
<input
type="text"
className="mr-2 common-input theme-bg theme-border-color"
defaultValue="http://localhost:5001"
// ref={inputRef}
onChange={handleChange}
/>
<button className="mt-5 common-btn theme-common-btn login-btn" type="button" onClick={save}>
{t('next')}
</button>
</div>
</div>
);
};

export default Endpoint;
75 changes: 75 additions & 0 deletions src/components/Login/PasswordLogin.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
import React, { useContext } from 'react';
import { mainContext } from 'reducer';
import { Dropdown, Menu } from 'antd';
import themeStyle from 'utils/themeStyle.js';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Tooltip, Form, Input, Button } from 'antd';
import { Truncate } from 'utils/text.js';
import { t } from 'utils/text.js';
import ClipboardCopy from 'components/Utils/ClipboardCopy';

const Endpoint = ({ color }) => {
// const { dispatch, state } = useContext(mainContext);
// const { account } = state;

const onFinish = (values: any) => {
console.log(values, '-------aaaa');
};

return (
<div className="flex flex-col justify-center max-w-515px min-w-334px">
<div className="min-h-400">
<div className="login-title">{t('set_login_password')}</div>
<div className="text-gray-900 text-sm font-bold mb-12">{t('set_login_password_desc')}</div>

<Form
name="basic"
layout="vertical"
requiredMark={false}
// labelWrap={true}
labelCol={{ span: 24 }}
// wrapperCol={{ span: 16 }}
// initialValues={{ remember: true }}
onFinish={onFinish}
// onFinishFailed={onFinishFailed}
autoComplete="off">
<Form.Item
label={<div className="font-bold theme-text-main">API {t('endpoint')}</div>}
name="endpoint">
<Input
defaultValue="http://localhost:5001"
className="mr-2 common-input theme-bg theme-border-color"
disabled
/>
</Form.Item>

<Form.Item
label={
<div className="w-full flex justify-between ">
<h5 className="font-bold theme-text-main shrink-0" htmlFor="grid-password">
{t('login_password')}
</h5>
<span className="text-sm font-medium theme-text-base">
{t('lost_password')}
</span>
</div>
}
name="password"
rules={[{ required: true, message: 'Please input your password!' }]}>
<Input.Password className="mr-2 common-input theme-bg theme-border-color" />
</Form.Item>
<Form.Item>
<button
className="mt-5 common-btn theme-common-btn login-btn"
type="primary"
htmlType="submit">
{t('next')}
</button>
</Form.Item>
</Form>
</div>
</div>
);
};

export default Endpoint;
93 changes: 93 additions & 0 deletions src/components/Login/SetPassword.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
import React, { useContext } from 'react';
import { mainContext } from 'reducer';
import { Dropdown, Menu } from 'antd';
import themeStyle from 'utils/themeStyle.js';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Tooltip, Form, Input, Button } from 'antd';
import { Truncate } from 'utils/text.js';
import { t } from 'utils/text.js';
import ClipboardCopy from 'components/Utils/ClipboardCopy';

const Endpoint = ({ color }) => {
// const { dispatch, state } = useContext(mainContext);
// const { account } = state;



const onFinish = (values: any) => {
console.log(values,'-------aaaa');
};

return (
<div className="flex flex-col justify-center max-w-515px">
<div className=" min-h-400">
<div className="login-title">{t('set_login_password')}</div>
<div className="text-gray-900 text-sm font-bold mb-12">{t('set_login_password_desc')}</div>

<Form
name="basic"
layout="vertical"
requiredMark={false}
// labelCol={{ span: 8 }}
// wrapperCol={{ span: 16 }}
// initialValues={{ remember: true }}
onFinish={onFinish}
// onFinishFailed={onFinishFailed}
autoComplete="off">
<Form.Item
label={<div className="font-bold theme-text-main">API {t('endpoint')}</div>}
name="endpoint"
>
<Input
defaultValue="http://localhost:5001"
className="mr-2 common-input theme-bg theme-border-color"
disabled
/>
</Form.Item>
<Form.Item
label={<div className="font-bold theme-text-main">{t('enter_private_key')}</div>}
name="enter_private_key"
rules={[{ required: true, message: 'Please input your username!' }]}>
<Input.TextArea
rows={4}
placeholder="maxLength is 6"
className="mr-2 common-input theme-bg theme-border-color"
maxLength={6}
/>
</Form.Item>

<Form.Item
label={
<div>
<h5 className="font-bold theme-text-main" htmlFor="grid-password">
{t('enter_password')}
</h5>
<span className='text-sm font-medium theme-text-sub-info'>{t('enter_password_desc')}</span>
</div>
}
name="password"
rules={[{ required: true, message: 'Please input your password!' }]}>
<Input.Password className="mr-2 common-input theme-bg theme-border-color" />
</Form.Item>
<Form.Item
label={<div className="font-bold theme-text-main">{t('re_enter_password')}</div>}
name="repassword"
rules={[{ required: true, message: 'Please input your password!' }]}>
<Input.Password className="mr-2 common-input theme-bg theme-border-color" />
</Form.Item>
<Form.Item>
<button
className="mt-5 common-btn theme-common-btn login-btn"
type="primary"
htmlType="submit"
>
{t('next')}
</button>
</Form.Item>
</Form>
</div>
</div>
);
};

export default Endpoint;
Loading

0 comments on commit 7d439e1

Please sign in to comment.