0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-02-17 22:04:19 -05:00

refactor(console): fix language editor styles (#2110)

This commit is contained in:
Xiao Yijun 2022-10-11 17:42:19 +08:00 committed by GitHub
parent b9bb78521d
commit c21cc3cab6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 12 additions and 10 deletions

View file

@ -27,6 +27,8 @@
border-radius: 8px; border-radius: 8px;
max-height: 288px; max-height: 288px;
overflow-y: auto; overflow-y: auto;
box-shadow: var(--shadow-2);
.dropDownItem { .dropDownItem {
width: 100%; width: 100%;
@ -34,18 +36,17 @@
padding: _.unit(2); padding: _.unit(2);
list-style: none; list-style: none;
cursor: pointer; cursor: pointer;
font: var(--font-body-medium);
&:hover { &:hover {
background: var(--color-hover); background: var(--color-hover);
} }
.languageName { .languageName {
font: var(--font-label-large);
color: var(--color-text); color: var(--color-text);
} }
.languageTag { .languageTag {
font: var(--font-body-medium);
color: var(--color-caption); color: var(--color-caption);
} }
} }

View file

@ -61,7 +61,7 @@ const AddLanguageSelector = ({ options, onSelect }: Props) => {
className={classNames(style.addLanguageButton, isDropDownOpen && style.hidden)} className={classNames(style.addLanguageButton, isDropDownOpen && style.hidden)}
icon={<Plus className={style.buttonIcon} />} icon={<Plus className={style.buttonIcon} />}
title="sign_in_exp.others.manage_language.add_language" title="sign_in_exp.others.manage_language.add_language"
type="outline" type="default"
size="medium" size="medium"
onClick={() => { onClick={() => {
setIsDropDownOpen(true); setIsDropDownOpen(true);

View file

@ -1,8 +1,10 @@
@use '@/scss/underscore' as _; @use '@/scss/underscore' as _;
.sectionTitle { .sectionTitle {
@include _.subhead-cap; @include _.subhead-cap-small;
color: var(--color-neutral-variant-60);
background-color: var(--color-layer-light); background-color: var(--color-layer-light);
padding: _.unit(1) 0;
} }
.sectionDataKey { .sectionDataKey {

View file

@ -32,7 +32,7 @@
} }
.content { .content {
border-top: 1px solid var(--color-border); border-top: 1px solid var(--color-divider);
height: 481px; height: 481px;
overflow-y: auto; overflow-y: auto;
@ -91,7 +91,7 @@
} }
.footer { .footer {
border-top: 1px solid var(--color-border); border-top: 1px solid var(--color-divider);
display: flex; display: flex;
flex-direction: row-reverse; flex-direction: row-reverse;
padding: _.unit(5); padding: _.unit(5);

View file

@ -5,14 +5,13 @@
margin-bottom: _.unit(1); margin-bottom: _.unit(1);
cursor: pointer; cursor: pointer;
border-radius: 8px; border-radius: 8px;
font: var(--font-label-large);
.languageName { .languageName {
font: var(--font-title-medium);
color: var(--color-text); color: var(--color-text);
} }
.languageTag { .languageTag {
font: var(--font-label-large);
color: var(--color-caption); color: var(--color-caption);
} }

View file

@ -5,7 +5,7 @@
padding: _.unit(3) _.unit(2); padding: _.unit(3) _.unit(2);
flex-shrink: 0; flex-shrink: 0;
background-color: var(--color-layer-light); background-color: var(--color-layer-light);
border-right: 1px solid var(--color-border); border-right: 1px solid var(--color-divider);
.languageItemList { .languageItemList {
margin-top: _.unit(3); margin-top: _.unit(3);

View file

@ -1,7 +1,7 @@
.container { .container {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border: 1px solid var(--color-border); border: 1px solid var(--color-divider);
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
} }