M: Simplify color tooltips
Some checks are pending
Frontend CI / build (22.x) (push) Waiting to run
Frontend CI / notify-failure (push) Blocked by required conditions

This commit is contained in:
Ivan 2025-06-24 14:26:36 +03:00
parent 384bf4e924
commit dae47716ea
5 changed files with 56 additions and 40 deletions

View File

@ -12,26 +12,30 @@ export function HelpFormulaTree() {
</ul> </ul>
<h2>Виды узлов</h2> <h2>Виды узлов</h2>
<ul> <p className='m-0'>
<li> <span className='cc-sample-color bg-(--acc-bg-green)' />
<span className='bg-(--acc-bg-green)'>объявление идентификатора</span> объявление идентификатора
</li> </p>
<li> <p className='m-0'>
<span className='bg-(--acc-bg-teal)'>глобальный идентификатор</span> <span className='cc-sample-color bg-(--acc-bg-teal)' />
</li> глобальный идентификатор
<li> </p>
<span className='bg-(--acc-bg-orange)'>логическое выражение</span> <p className='m-0'>
</li> <span className='cc-sample-color bg-(--acc-bg-orange)' />
<li> логическое выражение
<span className='bg-(--acc-bg-blue)'>типизированное выражение</span> </p>
</li> <p className='m-0'>
<li> <span className='cc-sample-color bg-(--acc-bg-blue)' />
<span className='bg-(--acc-bg-red)'>присвоение и итерация</span> типизированное выражение
</li> </p>
<li> <p className='m-0'>
<span className='bg-secondary'>составные выражения</span> <span className='cc-sample-color bg-(--acc-bg-red)' />
</li> присвоение и итерация
</ul> </p>
<p className='m-0'>
<span className='cc-sample-color bg-secondary' />
составные выражения
</p>
<h2>Команды</h2> <h2>Команды</h2>
<ul> <ul>

View File

@ -72,17 +72,16 @@ export function HelpRSEditor() {
<IconChild className='inline-icon' /> отображение наследованных <IconChild className='inline-icon' /> отображение наследованных
</li> </li>
<li> <li>
<span className='bg-selected'>текущая конституента</span> <span className='cc-sample-color bg-selected' />
выбранная конституента
</li> </li>
<li> <li>
<span className='bg-accent-green50'> <span className='cc-sample-color bg-accent-green50' />
<LinkTopic text='основа' topic={HelpTopic.CC_RELATIONS} /> текущей <LinkTopic text='основа' topic={HelpTopic.CC_RELATIONS} /> выбранной
</span>
</li> </li>
<li> <li>
<span className='bg-accent-orange50'> <span className='cc-sample-color bg-accent-orange50' />
<LinkTopic text='порожденные' topic={HelpTopic.CC_RELATIONS} /> текущей <LinkTopic text='порожденные' topic={HelpTopic.CC_RELATIONS} /> выбранной
</span>
</li> </li>
</ul> </ul>
</div> </div>

View File

@ -23,17 +23,18 @@ export function HelpTypeGraph() {
<h2>Цвета узлов</h2> <h2>Цвета узлов</h2>
<ul> <p className='m-0'>
<li> <span className='cc-sample-color bg-secondary' />
<span className='bg-secondary'>ступень-основание</span> ступень-основание
</li> </p>
<li> <p className='m-0'>
<span className='bg-accent-teal'>ступень-булеан</span> <span className='cc-sample-color bg-accent-teal' />
</li> ступень-булеан
<li> </p>
<span className='bg-accent-orange'>ступень декартова произведения</span> <p className='m-0'>
</li> <span className='cc-sample-color bg-accent-orange' />
</ul> ступень декартова произведения
</p>
<h2>Команды</h2> <h2>Команды</h2>
<ul> <ul>

View File

@ -44,12 +44,12 @@ export function SchemasGuide() {
className='grid max-w-100 break-words text-base' className='grid max-w-100 break-words text-base'
> >
<div className='inline-flex items-center gap-2'> <div className='inline-flex items-center gap-2'>
<span className='w-2.5 h-2.5 border rounded-full' style={{ backgroundColor: colorBgSchemas(0) }} /> <span className='w-3 h-3 border rounded-full' style={{ backgroundColor: colorBgSchemas(0) }} />
<span>Текущая схема</span> <span>Текущая схема</span>
</div> </div>
{schemas.map((alias, index) => ( {schemas.map((alias, index) => (
<div key={`${prefixes.schemas_list}${index}`} className='inline-flex items-center gap-2'> <div key={`${prefixes.schemas_list}${index}`} className='inline-flex items-center gap-2'>
<span className='w-2.5 h-2.5 border rounded-full' style={{ backgroundColor: colorBgSchemas(index + 1) }} /> <span className='w-3 h-3 border rounded-full' style={{ backgroundColor: colorBgSchemas(index + 1) }} />
<span>{alias}</span> <span>{alias}</span>
</div> </div>
))} ))}

View File

@ -72,6 +72,18 @@
transition-duration: var(--duration-dropdown); transition-duration: var(--duration-dropdown);
} }
@utility cc-sample-color {
display: inline-block;
width: 0.75rem;
height: 0.75rem;
margin-right: 0.25rem;
transform: translateY(0.125rem);
border-width: 1px;
border-style: solid;
border-radius: calc(infinity * 1px);
}
@utility cc-badge-constituenta { @utility cc-badge-constituenta {
width: 3rem; width: 3rem;
padding-inline: 0.25rem; padding-inline: 0.25rem;