Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-04-07 23:01:25 -05:00
Code Issues Activity

style(console): role scopes transfer component (#2947)

Browse source
This commit is contained in:
Xiao Yijun 2023-01-13 20:52:14 +08:00 • committed by GitHub
parent dd02fb1bfc
commit 0852f06c0b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
packages/console/src/components/RoleScopesTransfer/components/ResourceItem/index.module.scss
View file

@ -7,7 +7,8 @@
.title {
display: flex;
align-items: center;
margin-top: _.unit(1.5);
padding: _.unit(1.5) 0;
.resource {
display: flex;
@ -16,11 +17,10 @@
.caret {
margin-right: _.unit(2);
color: var(--color-text-secondary);
}
.name {
font: var(--font-label-2);
font: var(--font-label-large);
@include _.text-ellipsis;
}

9
packages/console/src/components/RoleScopesTransfer/components/ResourceItem/index.tsx
View file

@ -6,6 +6,7 @@ import { useTranslation } from 'react-i18next';
import CaretExpanded from '@/assets/images/caret-expanded.svg';
import CaretFolded from '@/assets/images/caret-folded.svg';
import Checkbox from '@/components/Checkbox';
import IconButton from '@/components/IconButton';
import { onKeyDownHandler } from '@/utilities/a11y';
import type { DetailedResourceResponse } from '../../types';
@ -47,11 +48,9 @@ const ResourceItem = ({ resource, selectedScopes, onSelectResource, onSelectScop
setIsScopesInvisible(!isScopesInvisible);
}}
>
{isScopesInvisible ? (
<CaretFolded className={styles.caret} />
) : (
<CaretExpanded className={styles.caret} />
)}
<IconButton className={styles.caret}>
{isScopesInvisible ? <CaretFolded /> : <CaretExpanded />}
</IconButton>
<div className={styles.name}>{name}</div>
<div className={styles.scopeInfo}>
({t('role_details.permission.api_permission_count', { value: scopes.length })})

3
packages/console/src/components/RoleScopesTransfer/components/SourceScopeItem/index.module.scss
View file

@ -3,9 +3,10 @@
.sourceScopeItem {
display: flex;
align-items: center;
padding: _.unit(1.5) _.unit(7);
padding: _.unit(1.5) 0 _.unit(1.5) _.unit(8);
.name {
font: var(--font-body-medium);
padding: _.unit(1) _.unit(2);
border-radius: 6px;
background: var(--color-neutral-95);