mirror of
https://github.com/IRBorisov/ConceptPortal.git
synced 2025-06-26 13:00:39 +03:00
Firefox UI fixes
This commit is contained in:
IRBorisov
parent
1316089fc9
commit
2d9c4936b3
|
|
@ -10,7 +10,7 @@ function Logo() {
|
|||
return (
|
||||
<img
|
||||
alt='Логотип КонцептПортал'
|
||||
className={clsx('max-h-[1.6rem] min-w-fit', {
|
||||
className={clsx('max-h-[1.6rem] w-fit', {
|
||||
'min-w-[11.5rem]': size.isSmall
|
||||
})}
|
||||
src={size.isSmall ? '/logo_sign.svg' : !darkMode ? '/logo_full.svg' : '/logo_full_dark.svg'}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ function BadgeHelp({ topic, ...restProps }: BadgeHelpProps) {
|
|||
return null;
|
||||
}
|
||||
return (
|
||||
<div id={`help-${topic}`} className='p-1'>
|
||||
<div tabIndex={-1} id={`help-${topic}`} className='p-1'>
|
||||
<IconHelp size='1.25rem' className='icon-primary' />
|
||||
<Tooltip clickable anchorSelect={`#help-${topic}`} layer='z-modal-tooltip' {...restProps}>
|
||||
<div className='relative' onClick={event => event.stopPropagation()}>
|
||||
|
|
|
|||
|
|
@ -140,7 +140,7 @@ function DataTable<TData extends RowData>({
|
|||
}, [rows, dense, noHeader, contentHeight]);
|
||||
|
||||
return (
|
||||
<div id={id} className={className} style={{ minHeight: fixedSize, maxHeight: fixedSize, ...style }}>
|
||||
<div tabIndex={-1} id={id} className={className} style={{ minHeight: fixedSize, maxHeight: fixedSize, ...style }}>
|
||||
<table className='w-full'>
|
||||
{!noHeader ? (
|
||||
<TableHeader
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ function Dropdown({ isOpen, stretchLeft, className, children, ...restProps }: Dr
|
|||
return (
|
||||
<div className='relative'>
|
||||
<motion.div
|
||||
tabIndex={-1}
|
||||
className={clsx(
|
||||
'z-modal-tooltip',
|
||||
'absolute mt-3',
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@ function DropdownButton({
|
|||
}: DropdownButtonProps) {
|
||||
return (
|
||||
<motion.button
|
||||
tabIndex={-1}
|
||||
type='button'
|
||||
onClick={onClick}
|
||||
className={clsx(
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ function DropdownCheckbox({ title, setValue, disabled, ...restProps }: DropdownC
|
|||
!!setValue && !disabled && 'clr-hover'
|
||||
)}
|
||||
>
|
||||
<Checkbox disabled={disabled} setValue={setValue} {...restProps} />
|
||||
<Checkbox tabIndex={-1} disabled={disabled} setValue={setValue} {...restProps} />
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ function DropdownIndicator<Option, Group extends GroupBase<Option> = GroupBase<O
|
|||
return (
|
||||
components.DropdownIndicator && (
|
||||
<components.DropdownIndicator {...props}>
|
||||
{props.selectProps.menuIsOpen ? <IconDropArrow size='1.25rem' /> : <IconDropArrowUp size='1.25rem' />}
|
||||
{props.selectProps.menuIsOpen ? <IconDropArrowUp size='1.25rem' /> : <IconDropArrow size='1.25rem' />}
|
||||
</components.DropdownIndicator>
|
||||
)
|
||||
);
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ function DropdownIndicator<Option, Group extends GroupBase<Option> = GroupBase<O
|
|||
return (
|
||||
components.DropdownIndicator && (
|
||||
<components.DropdownIndicator {...props}>
|
||||
{props.selectProps.menuIsOpen ? <IconDropArrow size='1.25rem' /> : <IconDropArrowUp size='1.25rem' />}
|
||||
{props.selectProps.menuIsOpen ? <IconDropArrowUp size='1.25rem' /> : <IconDropArrow size='1.25rem' />}
|
||||
</components.DropdownIndicator>
|
||||
)
|
||||
);
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ function TextArea({
|
|||
'leading-tight',
|
||||
{
|
||||
'border': !noBorder,
|
||||
'flex-grow': dense,
|
||||
'flex-grow max-w-full': dense,
|
||||
'clr-outline': !noOutline
|
||||
},
|
||||
colors,
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ function TextInput({
|
|||
'leading-tight truncate hover:text-clip',
|
||||
{
|
||||
'px-3': !noBorder || !disabled,
|
||||
'flex-grow': dense,
|
||||
'flex-grow max-w-full': dense,
|
||||
'border': !noBorder,
|
||||
'clr-outline': !noOutline
|
||||
},
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@ function AnimateFade({
|
|||
}
|
||||
return (
|
||||
<motion.div
|
||||
tabIndex={-1}
|
||||
initial={{ ...(!noFadeIn ? animateFade.initial : {}) }}
|
||||
animate={hideContent ? 'hidden' : 'active'}
|
||||
variants={animateFade.variants}
|
||||
|
|
|
|||
|
|
@ -139,7 +139,7 @@ function DlgConstituentaTemplate({ hideWindow, schema, onCreate, insertAfter }:
|
|||
<Modal
|
||||
header='Создание конституенты из шаблона'
|
||||
submitText='Создать'
|
||||
className='w-[43rem] h-[36rem] px-6'
|
||||
className='w-[43rem] h-[36.5rem] px-6'
|
||||
hideWindow={hideWindow}
|
||||
canSubmit={validated}
|
||||
onSubmit={handleSubmit}
|
||||
|
|
|
|||
|
|
@ -104,6 +104,7 @@ function FormCreateCst({ schema, state, partialUpdate, setValidated }: FormCreat
|
|||
<button
|
||||
key='dlg_cst_show_comment'
|
||||
id='dlg_cst_show_comment'
|
||||
tabIndex={-1}
|
||||
type='button'
|
||||
className='self-start cc-label clr-text-url hover:underline'
|
||||
onClick={() => setForceComment(true)}
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ import { IconSave } from '@/components/Icons';
|
|||
import RefsInput from '@/components/RefsInput';
|
||||
import SubmitButton from '@/components/ui/SubmitButton';
|
||||
import TextArea from '@/components/ui/TextArea';
|
||||
import TextInput from '@/components/ui/TextInput';
|
||||
import AnimateFade from '@/components/wrap/AnimateFade';
|
||||
import { useRSForm } from '@/context/RSFormContext';
|
||||
import { CstType, IConstituenta, ICstUpdateData } from '@/models/rsform';
|
||||
|
|
@ -154,18 +155,14 @@ function FormConstituenta({
|
|||
disabled={disabled}
|
||||
onChange={newValue => setTerm(newValue)}
|
||||
/>
|
||||
<TextArea
|
||||
<TextInput
|
||||
id='cst_typification'
|
||||
dense
|
||||
noBorder
|
||||
disabled={true}
|
||||
label='Типизация'
|
||||
rows={typification.length > ROW_SIZE_IN_CHARACTERS ? 2 : 1}
|
||||
value={typification}
|
||||
colors='clr-app'
|
||||
style={{
|
||||
resize: 'none'
|
||||
}}
|
||||
/>
|
||||
<AnimatePresence>
|
||||
<AnimateFade key='cst_expression_fade' hideContent={!!state && !state?.definition_formal && isElementary}>
|
||||
|
|
@ -225,6 +222,7 @@ function FormConstituenta({
|
|||
<button
|
||||
key='cst_disable_comment'
|
||||
id='cst_disable_comment'
|
||||
tabIndex={-1}
|
||||
type='button'
|
||||
className='self-start cc-label clr-text-url hover:underline'
|
||||
onClick={() => setForceComment(true)}
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ function ParsingResult({ isOpen, data, disabled, onShowError }: ParsingResultPro
|
|||
|
||||
return (
|
||||
<motion.div
|
||||
tabIndex={-1}
|
||||
className='text-sm border dense cc-scroll-y'
|
||||
initial={false}
|
||||
animate={isOpen ? 'open' : 'closed'}
|
||||
|
|
@ -29,6 +30,7 @@ function ParsingResult({ isOpen, data, disabled, onShowError }: ParsingResultPro
|
|||
{data?.errors.map((error, index) => {
|
||||
return (
|
||||
<p
|
||||
tabIndex={-1}
|
||||
key={`error-${index}`}
|
||||
className={`clr-text-red ${disabled ? '' : 'cursor-pointer'}`}
|
||||
onClick={disabled ? undefined : () => onShowError(error)}
|
||||
|
|
|
|||
|
|
@ -39,6 +39,7 @@ function StatusBar({ isModified, processing, constituenta, parseData, onAnalyze
|
|||
|
||||
return (
|
||||
<div
|
||||
tabIndex={-1}
|
||||
className={clsx(
|
||||
'w-[10rem] h-[1.75rem]',
|
||||
'px-2 flex items-center justify-center gap-2',
|
||||
|
|
|
|||
|
|
@ -154,6 +154,7 @@ function FormRSForm({ id, isModified, setIsModified }: FormRSFormProps) {
|
|||
/>
|
||||
<div className='flex justify-between whitespace-nowrap'>
|
||||
<Checkbox
|
||||
tabIndex={-1}
|
||||
id='schema_common'
|
||||
label='Общедоступная схема'
|
||||
title='Общедоступные схемы видны всем пользователям и могут быть изменены'
|
||||
|
|
@ -162,6 +163,7 @@ function FormRSForm({ id, isModified, setIsModified }: FormRSFormProps) {
|
|||
setValue={value => setCommon(value)}
|
||||
/>
|
||||
<Checkbox
|
||||
tabIndex={-1}
|
||||
id='schema_immutable'
|
||||
label='Неизменная схема'
|
||||
title='Только администраторы могут присваивать схемам неизменный статус'
|
||||
|
|
|
|||
|
|
@ -41,6 +41,7 @@ html {
|
|||
|
||||
:root {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
font-family: var(--font-main);
|
||||
|
||||
color: var(--cl-fg-100);
|
||||
|
|
@ -57,6 +58,7 @@ html {
|
|||
@media only screen and (max-width: 639px) {
|
||||
:root {
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -64,9 +66,10 @@ html {
|
|||
outline-width: 2px;
|
||||
outline-style: solid;
|
||||
outline-color: transparent;
|
||||
.dark & {
|
||||
outline-color: transparent;
|
||||
}
|
||||
|
||||
:focus-visible {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
::selection {
|
||||
|
|
@ -123,6 +126,10 @@ div:not(.dense) > p {
|
|||
@apply font-semibold;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
li::marker {
|
||||
content: '– ';
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user