0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-01-06 20:40:08 -05:00

feat(console): init api resources (#313)

This commit is contained in:
Gao Sun 2022-03-03 17:44:25 +08:00 committed by GitHub
parent a265a3434b
commit ab15ee8555
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 47 additions and 5 deletions

View file

@ -1,4 +1,7 @@
@use '@/scss/underscore' as _;
.content {
flex-grow: 1;
display: flex;
padding-right: _.unit(5);
}

View file

@ -1,5 +1,5 @@
import React, { useEffect } from 'react';
import { BrowserRouter, useLocation, useNavigate } from 'react-router-dom';
import { BrowserRouter, Route, Routes, useLocation, useNavigate } from 'react-router-dom';
import './scss/normalized.scss';
import * as styles from './App.module.scss';
@ -8,6 +8,7 @@ import Content from './components/Content';
import Sidebar, { getPath, sections } from './components/Sidebar';
import Topbar from './components/Topbar';
import initI18n from './i18n/init';
import ApiResources from './pages/ApiResources';
const isBasenameNeeded = process.env.NODE_ENV !== 'development' || process.env.PORT === '5002';
@ -28,7 +29,11 @@ const Main = () => {
<Topbar />
<div className={styles.content}>
<Sidebar />
<Content />
<Content>
<Routes>
<Route path="api-resources" element={<ApiResources />} />
</Routes>
</Content>
</div>
</AppContent>
);

View file

@ -9,6 +9,7 @@
}
.light {
--color-card-background: #fff;
--color-on-surface-variant: #47464e;
--color-primary: #4f37f9;
--color-primary-90: #e5dfff;

View file

@ -0,0 +1,7 @@
@use '@/scss/underscore' as _;
.card {
background: var(--color-card-background);
border-radius: _.unit(4);
padding: _.unit(6);
}

View file

@ -0,0 +1,13 @@
import React, { ReactNode } from 'react';
import * as styles from './index.module.scss';
type Props = {
children: ReactNode;
};
const Card = ({ children }: Props) => {
return <div className={styles.card}>{children}</div>;
};
export default Card;

View file

@ -1,9 +1,13 @@
import React from 'react';
import React, { ReactNode } from 'react';
import * as styles from './index.module.scss';
const Content = () => {
return <div className={styles.content}>Content</div>;
type Props = {
children: ReactNode;
};
const Content = ({ children }: Props) => {
return <div className={styles.content}>{children}</div>;
};
export default Content;

View file

@ -0,0 +1,9 @@
import React from 'react';
import Card from '@/components/Card';
const ApiResources = () => {
return <Card>ApiResources</Card>;
};
export default ApiResources;