Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-01-27 21:39:16 -05:00
Code Issues Activity

refactor(console): connector guide readme content scrollbar (#3565)

Browse source
This commit is contained in:
Xiao Yijun 2023-03-22 11:39:07 +08:00 • committed by GitHub
parent f4a21b7c12
commit 3ee26c31cf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/console/src/pages/Connectors/components/Guide/index.module.scss
View file

@ -52,6 +52,7 @@
border: 1.5px solid var(--color-focused-variant);
border-radius: 16px;
margin: 0 _.unit(6) _.unit(6) 0;
overflow-y: auto;
.readmeTitle {
font: var(--font-title-2);
@ -61,9 +62,7 @@
.readmeContent {
flex: 1;
padding: 0 _.unit(6);
overflow-y: auto;
padding-bottom: _.unit(4);
padding: 0 _.unit(6) _.unit(4);
}
}

6
packages/console/src/pages/Connectors/components/Guide/index.tsx
View file

@ -18,6 +18,7 @@ import CardTitle from '@/components/CardTitle';
import DangerousRaw from '@/components/DangerousRaw';
import IconButton from '@/components/IconButton';
import Markdown from '@/components/Markdown';
import OverlayScrollbar from '@/components/OverlayScrollbar';
import { ConnectorsTabs } from '@/consts/page-tabs';
import useApi from '@/hooks/use-api';
import useConfigs from '@/hooks/use-configs';
@ -48,7 +49,6 @@ const Guide = ({ connector, onClose }: Props) => {
const [conflictConnectorName, setConflictConnectorName] = useState<Record<string, string>>();
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
const { type: connectorType, formItems, target, isStandard, configTemplate } = connector ?? {};
const { language } = i18next;
const isSocialConnector =
@ -181,10 +181,10 @@ const Guide = ({ connector, onClose }: Props) => {
/>
</div>
<div className={styles.content}>
<div className={styles.readme}>
<OverlayScrollbar className={styles.readme}>
<div className={styles.readmeTitle}>README: {title}</div>
<Markdown className={styles.readmeContent}>{content}</Markdown>
</div>
</OverlayScrollbar>
<div className={styles.setup}>
<FormProvider {...methods}>
<form autoComplete="off" onSubmit={onSubmit}>

2
packages/console/src/scss/overlayscrollbars.scss
View file

@ -4,6 +4,8 @@
&.os-theme-light {
&.os-scrollbar-vertical {
width: 12px;
padding: 8px 2px;
> .os-scrollbar-track {
> .os-scrollbar-handle {