ConceptProd/ConceptPortal-public
1
0
Fork 0
mirror of https://github.com/IRBorisov/ConceptPortal.git synced 2025-06-26 13:00:39 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve icons

Browse Source
This commit is contained in:
IRBorisov 2023-10-16 02:17:31 +03:00
parent 638a59b004
commit a5ae20e325
7 changed files with 24 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
rsconcept/frontend/src/components/Icons.tsx
View File

@ -119,18 +119,10 @@ export function ShareIcon(props: IconProps) {
);
}
export function FilterCogIcon(props: IconProps) {
return (
<IconSVG viewbox='0 0 24 24' {...props}>
<path d='M22.77 19.32l-1.07-.82c.02-.17.04-.33.04-.5s-.01-.33-.04-.5l1.06-.82a.26.26 0 00.06-.32l-1-1.73c-.06-.13-.19-.13-.32-.13l-1.23.5c-.27-.18-.54-.35-.85-.47l-.19-1.32A.236.236 0 0019 13h-2a.26.26 0 00-.26.21l-.19 1.32c-.3.13-.59.29-.85.47l-1.24-.5c-.11 0-.24 0-.31.13l-1 1.73c-.06.11-.04.24.06.32l1.06.82a4.193 4.193 0 000 1l-1.06.82a.26.26 0 00-.06.32l1 1.73c.06.13.19.13.31.13l1.24-.5c.26.18.54.35.85.47l.19 1.32c.02.12.12.21.26.21h2c.11 0 .22-.09.24-.21l.19-1.32c.3-.13.57-.29.84-.47l1.23.5c.13 0 .26 0 .33-.13l1-1.73a.26.26 0 00-.06-.32M18 19.5c-.84 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5M3 3c-.22 0-.43.08-.62.22a1 1 0 00-.17 1.4L7.97 12H8v5.87c-.04.29.06.6.29.83l2.01 2.01c.35.35.89.37 1.28.09-.38-.89-.58-1.84-.58-2.8 0-1.27.35-2.5 1-3.6V12h.03l5.76-7.38a1 1 0 00-.17-1.4c-.19-.14-.4-.22-.62-.22H3z' />
</IconSVG>
);
}
export function FilterIcon(props: IconProps) {
return (
<IconSVG viewbox='0 0 24 24' {...props}>
<path d='M22 3H2l8 9.46V19l4 2v-8.54L22 3z' />
<path d='M21 3H5a1 1 0 00-1 1v2.59c0 .523.213 1.037.583 1.407L10 13.414V21a1.001 1.001 0 001.447.895l4-2c.339-.17.553-.516.553-.895v-5.586l5.417-5.417c.37-.37.583-.884.583-1.407V4a1 1 0 00-1-1zm-6.707 9.293A.996.996 0 0014 13v5.382l-2 1V13a.996.996 0 00-.293-.707L6 6.59V5h14.001l.002 1.583-5.71 5.71z' />
</IconSVG>
);
}
@ -228,10 +220,10 @@ export function DownloadIcon(props: IconProps) {
);
}
export function CrownIcon(props: IconProps) {
export function OwnerIcon(props: IconProps) {
return (
<IconSVG viewbox='0 0 24 24' {...props}>
<path d='M5 16L3 5l5.5 5L12 4l3.5 6L21 5l-2 11H5m14 3c0 .6-.4 1-1 1H6c-.6 0-1-.4-1-1v-1h14v1z' />
<path d='M20.787 9.023c-.125.027-1.803.418-3.953 1.774-.323-1.567-1.279-4.501-4.108-7.485L12 2.546l-.726.767C8.435 6.308 7.483 9.25 7.163 10.827 5.005 9.448 3.34 9.052 3.218 9.024L2 8.752V10c0 7.29 3.925 12 10 12 5.981 0 10-4.822 10-12V8.758l-1.213.265zM8.999 12.038c.002-.033.152-3.1 3.001-6.532C14.814 8.906 14.999 12 15 12v.125a18.933 18.933 0 00-3.01 3.154 19.877 19.877 0 00-2.991-3.113v-.128zM12 20c-5.316 0-7.549-4.196-7.937-8.564 1.655.718 4.616 2.426 7.107 6.123l.841 1.249.825-1.26c2.426-3.708 5.425-5.411 7.096-6.122C19.534 15.654 17.304 20 12 20z' />
</IconSVG>
);
}
@ -446,7 +438,8 @@ export function CheckIcon(props: IconProps) {
export function CogIcon(props: IconProps) {
return (
<IconSVG viewbox='0 0 24 24' {...props}>
<path d='M2.344 15.271l2 3.46a1 1 0 001.366.365l1.396-.806c.58.457 1.221.832 1.895 1.112V21a1 1 0 001 1h4a1 1 0 001-1v-1.598a8.094 8.094 0 001.895-1.112l1.396.806c.477.275 1.091.11 1.366-.365l2-3.46a1.004 1.004 0 00-.365-1.366l-1.372-.793a7.683 7.683 0 00-.002-2.224l1.372-.793c.476-.275.641-.89.365-1.366l-2-3.46a1 1 0 00-1.366-.365l-1.396.806A8.034 8.034 0 0015 4.598V3a1 1 0 00-1-1h-4a1 1 0 00-1 1v1.598A8.094 8.094 0 007.105 5.71L5.71 4.904a.999.999 0 00-1.366.365l-2 3.46a1.004 1.004 0 00.365 1.366l1.372.793a7.683 7.683 0 000 2.224l-1.372.793c-.476.275-.641.89-.365 1.366zM12 8c2.206 0 4 1.794 4 4s-1.794 4-4 4-4-1.794-4-4 1.794-4 4-4z' />
<path d='M12 16c2.206 0 4-1.794 4-4s-1.794-4-4-4-4 1.794-4 4 1.794 4 4 4zm0-6c1.084 0 2 .916 2 2s-.916 2-2 2-2-.916-2-2 .916-2 2-2z' />
<path d='M2.845 16.136l1 1.73c.531.917 1.809 1.261 2.73.73l.529-.306A8.1 8.1 0 009 19.402V20c0 1.103.897 2 2 2h2c1.103 0 2-.897 2-2v-.598a8.132 8.132 0 001.896-1.111l.529.306c.923.53 2.198.188 2.731-.731l.999-1.729a2.001 2.001 0 00-.731-2.732l-.505-.292a7.718 7.718 0 000-2.224l.505-.292a2.002 2.002 0 00.731-2.732l-.999-1.729c-.531-.92-1.808-1.265-2.731-.732l-.529.306A8.1 8.1 0 0015 4.598V4c0-1.103-.897-2-2-2h-2c-1.103 0-2 .897-2 2v.598a8.132 8.132 0 00-1.896 1.111l-.529-.306c-.924-.531-2.2-.187-2.731.732l-.999 1.729a2.001 2.001 0 00.731 2.732l.505.292a7.683 7.683 0 000 2.223l-.505.292a2.003 2.003 0 00-.731 2.733zm3.326-2.758A5.703 5.703 0 016 12c0-.462.058-.926.17-1.378a.999.999 0 00-.47-1.108l-1.123-.65.998-1.729 1.145.662a.997.997 0 001.188-.142 6.071 6.071 0 012.384-1.399A1 1 0 0011 5.3V4h2v1.3a1 1 0 00.708.956 6.083 6.083 0 012.384 1.399.999.999 0 001.188.142l1.144-.661 1 1.729-1.124.649a1 1 0 00-.47 1.108c.112.452.17.916.17 1.378 0 .461-.058.925-.171 1.378a1 1 0 00.471 1.108l1.123.649-.998 1.729-1.145-.661a.996.996 0 00-1.188.142 6.071 6.071 0 01-2.384 1.399A1 1 0 0013 18.7l.002 1.3H11v-1.3a1 1 0 00-.708-.956 6.083 6.083 0 01-2.384-1.399.992.992 0 00-1.188-.141l-1.144.662-1-1.729 1.124-.651a1 1 0 00.471-1.108z' />
</IconSVG>
);
}

4
rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
View File

@ -3,7 +3,7 @@ import { useCallback } from 'react';
import Dropdown from '../../components/Common/Dropdown';
import DropdownCheckbox from '../../components/Common/DropdownCheckbox';
import SelectorButton from '../../components/Common/SelectorButton';
import { FilterCogIcon } from '../../components/Icons';
import { FilterIcon } from '../../components/Icons';
import { useAuth } from '../../context/AuthContext';
import useDropdown from '../../hooks/useDropdown';
import { LibraryFilterStrategy } from '../../models/miscelanious';
@ -43,7 +43,7 @@ function PickerStrategy({ value, onChange }: PickerStrategyProps) {
tooltip='Список фильтров'
dimensions='w-fit h-full'
transparent
icon={<FilterCogIcon size={5} />}
icon={<FilterIcon size={5} />}
text={labelLibraryFilter(value)}
tabIndex={-1}
onClick={strategyMenu.toggle}

8
rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
View File

@ -165,8 +165,8 @@ function EditorConstituenta({
onClick={onEditTerm}
icon={<PenIcon size={4} color={isEnabled ? 'text-primary' : ''} />}
/>}
<div className='flex items-center justify-center w-full'>
<div className='font-semibold w-fit pointer-events-none'>
<div className='flex items-center justify-center w-full pl-[4rem]'>
<div className='font-semibold pointer-events-none w-fit'>
<span className='small-caps'>Конституента </span>
<span className='ml-1 small-caps'>{alias}</span>
</div>
@ -178,7 +178,7 @@ function EditorConstituenta({
icon={<PenIcon size={4} color={isEnabled ? 'text-primary' : ''} />}
/>
</div>
<div className='flex justify-end items-center'>
<div className='flex items-center justify-end'>
<MiniButton
tooltip='Сохранить изменения'
disabled={!isModified || !isEnabled}
@ -271,7 +271,7 @@ function EditorConstituenta({
</div>
</form>
{(windowSize.width ?? 0) >= SIDELIST_HIDE_THRESHOLD &&
<div className='w-full h-fit border mt-10'>
<div className='w-full mt-10 border h-fit'>
<ViewSideConstituents
expression={expression}
baseHeight={UNFOLDED_HEIGHT}

4
rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
View File

@ -9,7 +9,7 @@ import SubmitButton from '../../components/Common/SubmitButton';
import TextArea from '../../components/Common/TextArea';
import TextInput from '../../components/Common/TextInput';
import HelpRSFormMeta from '../../components/Help/HelpRSFormMeta';
import { CrownIcon, DownloadIcon, DumpBinIcon, HelpIcon, SaveIcon, ShareIcon } from '../../components/Icons';
import { DownloadIcon, DumpBinIcon, HelpIcon, OwnerIcon, SaveIcon, ShareIcon } from '../../components/Icons';
import { useAuth } from '../../context/AuthContext';
import { useRSForm } from '../../context/RSFormContext';
import { useUsers } from '../../context/UsersContext';
@ -96,7 +96,7 @@ function EditorRSForm({ onDestroy, onClaim, onShare, isModified, setIsModified,
/>
<MiniButton
tooltip={isClaimable ? 'Стать владельцем' : 'Невозможно стать владельцем' }
icon={<CrownIcon size={5} color={!isClaimable ? '' : 'text-success'}/>}
icon={<OwnerIcon size={5} color={!isClaimable ? '' : 'text-success'}/>}
disabled={!isClaimable || !user}
onClick={onClaim}
/>

4
rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
View File

@ -10,7 +10,7 @@ import MiniButton from '../../components/Common/MiniButton';
import SelectSingle from '../../components/Common/SelectSingle';
import HelpTermGraph from '../../components/Help/HelpTermGraph';
import InfoConstituenta from '../../components/Help/InfoConstituenta';
import { ArrowsRotateIcon, DumpBinIcon, FilterCogIcon, HelpIcon, SmallPlusIcon } from '../../components/Icons';
import { ArrowsRotateIcon, DumpBinIcon, FilterIcon, HelpIcon, SmallPlusIcon } from '../../components/Icons';
import { useRSForm } from '../../context/RSFormContext';
import { useConceptTheme } from '../../context/ThemeContext';
import useLocalStorage from '../../hooks/useLocalStorage';
@ -422,7 +422,7 @@ function EditorTermGraph({ onOpenEdit, onCreateCst, onDeleteCst }: EditorTermGra
</div>
<div className='flex items-center w-full gap-1'>
<Button
icon={<FilterCogIcon size={6} />}
icon={<FilterIcon size={6} />}
dense
tooltip='Настройки фильтрации узлов и связей'
dimensions='min-h-[2.3rem] min-w-[2.3rem]'

11
rsconcept/frontend/src/pages/RSFormPage/elements/RSTabsMenu.tsx
View File

@ -4,7 +4,10 @@ import Button from '../../../components/Common/Button';
import Dropdown from '../../../components/Common/Dropdown';
import DropdownButton from '../../../components/Common/DropdownButton';
import DropdownCheckbox from '../../../components/Common/DropdownCheckbox';
import { CloneIcon, CrownIcon, DownloadIcon, DumpBinIcon, EyeIcon, EyeOffIcon, MenuIcon, PenIcon, PlusIcon, ShareIcon, UploadIcon } from '../../../components/Icons';
import {
CloneIcon, DownloadIcon, DumpBinIcon, EyeIcon, EyeOffIcon,
MenuIcon, OwnerIcon, PenIcon, ShareIcon, SmallPlusIcon, UploadIcon
} from '../../../components/Icons';
import { useAuth } from '../../../context/AuthContext';
import { useRSForm } from '../../../context/RSFormContext';
import useDropdown from '../../../hooks/useDropdown';
@ -113,7 +116,7 @@ function RSTabsMenu({
</DropdownButton>
<DropdownButton onClick={handleCreateNew}>
<span className='inline-flex items-center justify-start gap-2'>
<PlusIcon color='text-url' size={4} />
<SmallPlusIcon color='text-url' size={4} />
<p>Создать новую схему</p>
</span>
</DropdownButton>
@ -137,8 +140,8 @@ function RSTabsMenu({
onClick={!isOwned ? handleClaimOwner : undefined}
tooltip={!user || !isClaimable ? 'Стать владельцем можно только для общей изменяемой схемы' : ''}
>
<div className='inline-flex items-center gap-1 justify-normal'>
<span><CrownIcon size={4} color={isOwned ? 'text-success' : 'text-controls'} /></span>
<div className='flex items-center gap-2 pl-1'>
<span><OwnerIcon size={5} color={isOwned ? 'text-success' : 'text-controls'} /></span>
<p>
{ isOwned && <b>Владелец схемы</b> }
{ !isOwned && <b>Стать владельцем</b> }

4
rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
View File

@ -4,7 +4,7 @@ import Dropdown from '../../../components/Common/Dropdown';
import DropdownButton from '../../../components/Common/DropdownButton';
import SelectorButton from '../../../components/Common/SelectorButton';
import DataTable, { createColumnHelper, IConditionalStyle, VisibilityState } from '../../../components/DataTable';
import { CogIcon, FilterCogIcon, MagnifyingGlassIcon } from '../../../components/Icons';
import { CogIcon, FilterIcon, MagnifyingGlassIcon } from '../../../components/Icons';
import { useRSForm } from '../../../context/RSFormContext';
import { useConceptTheme } from '../../../context/ThemeContext';
import useDropdown from '../../../hooks/useDropdown';
@ -227,7 +227,7 @@ function ViewSideConstituents({ expression, baseHeight, activeID, onOpenEdit }:
tooltip='Настройка атрибутов для фильтрации'
dimensions='w-fit h-full'
transparent
icon={<FilterCogIcon size={5} />}
icon={<FilterIcon size={5} />}
text={labelCstMathchMode(filterMatch)}
tabIndex={-1}
onClick={matchModeMenu.toggle}