From a5ae20e325744126cdb61582211acc761866d121 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Mon, 16 Oct 2023 02:17:31 +0300
Subject: [PATCH] Improve icons

---
 rsconcept/frontend/src/components/Icons.tsx     | 17 +++++------------
 .../src/pages/LibraryPage/PickerStrategy.tsx    |  4 ++--
 .../src/pages/RSFormPage/EditorConstituenta.tsx |  8 ++++----
 .../src/pages/RSFormPage/EditorRSForm.tsx       |  4 ++--
 .../src/pages/RSFormPage/EditorTermGraph.tsx    |  4 ++--
 .../pages/RSFormPage/elements/RSTabsMenu.tsx    | 11 +++++++----
 .../elements/ViewSideConstituents.tsx           |  4 ++--
 7 files changed, 24 insertions(+), 28 deletions(-)

diff --git a/rsconcept/frontend/src/components/Icons.tsx b/rsconcept/frontend/src/components/Icons.tsx
index e2eb5f53..80a226ef 100644
--- a/rsconcept/frontend/src/components/Icons.tsx
+++ b/rsconcept/frontend/src/components/Icons.tsx
@@ -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>
   );
 }
diff --git a/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx b/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
index 8f512f26..cd645267 100644
--- a/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
+++ b/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
@@ -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}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
index 2a008ba1..6fa146f3 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
@@ -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}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
index 6fa31712..6fce2e88 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
@@ -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}
       />
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
index a8ae910c..f6a68f78 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
@@ -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]'
diff --git a/rsconcept/frontend/src/pages/RSFormPage/elements/RSTabsMenu.tsx b/rsconcept/frontend/src/pages/RSFormPage/elements/RSTabsMenu.tsx
index 7d13b61b..77dd5e91 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/elements/RSTabsMenu.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/elements/RSTabsMenu.tsx
@@ -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> }
diff --git a/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx b/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
index a42131a4..9053d265 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
@@ -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}