Render technical diagrams with mermaid

This commit is contained in:
Ruslan Bakiev
2026-05-01 14:41:02 +07:00
parent fc6117c8f5
commit 3a3bd09a8c
20 changed files with 1191 additions and 391 deletions

View File

@@ -1,8 +0,0 @@
<svg width="1400" height="900" viewBox="0 0 1400 900" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="900" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="820" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<rect x="134" y="150" width="1132" height="110" rx="22" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="294" width="1132" height="200" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="528" width="1132" height="154" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="998" y="724" width="268" height="64" rx="32" fill="#D9E9D4"/>
</svg>

Before

Width:  |  Height:  |  Size: 665 B

View File

@@ -1,12 +0,0 @@
<svg width="1400" height="860" viewBox="0 0 1400 860" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="860" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="780" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<text x="134" y="116" fill="#111827" font-family="Arial, sans-serif" font-size="34" font-weight="700">Корзина</text>
<rect x="134" y="150" width="1132" height="64" rx="18" fill="#EAF1F8"/>
<rect x="134" y="230" width="1132" height="74" rx="18" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="320" width="1132" height="74" rx="18" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="430" width="1132" height="90" rx="20" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="546" width="1132" height="128" rx="20" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="1032" y="706" width="234" height="64" rx="32" fill="#CFE6D7"/>
<text x="1149" y="746" text-anchor="middle" fill="#1F3B2B" font-family="Arial, sans-serif" font-size="24" font-weight="700">Отправить заявку</text>
</svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -1,37 +0,0 @@
<svg width="1400" height="860" viewBox="0 0 1400 860" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="860" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="780" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<rect x="132" y="86" width="1136" height="70" rx="18" fill="#F9FAFB" stroke="#D9DEE7" stroke-width="2"/>
<text x="182" y="130" fill="#111827" font-family="Arial, sans-serif" font-size="28" font-weight="700">Каталог</text>
<rect x="132" y="196" width="216" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="156" y="220" width="168" height="104" rx="16" fill="#E7EDF5"/>
<rect x="156" y="348" width="140" height="18" rx="9" fill="#D6DEE9"/>
<rect x="156" y="378" width="112" height="14" rx="7" fill="#E5EAF1"/>
<rect x="374" y="196" width="216" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="398" y="220" width="168" height="104" rx="16" fill="#E7EDF5"/>
<rect x="398" y="348" width="140" height="18" rx="9" fill="#D6DEE9"/>
<rect x="398" y="378" width="112" height="14" rx="7" fill="#E5EAF1"/>
<rect x="616" y="196" width="216" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="640" y="220" width="168" height="104" rx="16" fill="#E7EDF5"/>
<rect x="640" y="348" width="140" height="18" rx="9" fill="#D6DEE9"/>
<rect x="640" y="378" width="112" height="14" rx="7" fill="#E5EAF1"/>
<rect x="858" y="196" width="216" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="882" y="220" width="168" height="104" rx="16" fill="#E7EDF5"/>
<rect x="882" y="348" width="140" height="18" rx="9" fill="#D6DEE9"/>
<rect x="882" y="378" width="112" height="14" rx="7" fill="#E5EAF1"/>
<rect x="1100" y="196" width="168" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="1124" y="220" width="120" height="104" rx="16" fill="#E7EDF5"/>
<rect x="1124" y="348" width="104" height="18" rx="9" fill="#D6DEE9"/>
<rect x="1124" y="378" width="88" height="14" rx="7" fill="#E5EAF1"/>
<rect x="132" y="450" width="216" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="156" y="474" width="168" height="104" rx="16" fill="#E7EDF5"/>
<rect x="156" y="602" width="140" height="18" rx="9" fill="#D6DEE9"/>
<rect x="156" y="632" width="112" height="14" rx="7" fill="#E5EAF1"/>
<rect x="374" y="450" width="216" height="220" rx="22" fill="#FCFCFD" stroke="#CAD5E2" stroke-width="2"/>
<rect x="398" y="474" width="168" height="104" rx="16" fill="#E7EDF5"/>
<rect x="398" y="602" width="140" height="18" rx="9" fill="#D6DEE9"/>
<rect x="398" y="632" width="112" height="14" rx="7" fill="#E5EAF1"/>
<text x="132" y="746" fill="#6B7280" font-family="Arial, sans-serif" font-size="18">Схема: на странице отображается только сетка карточек товарных направлений.</text>
</svg>

Before

Width:  |  Height:  |  Size: 2.9 KiB

View File

@@ -1,9 +0,0 @@
<svg width="1400" height="900" viewBox="0 0 1400 900" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="900" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="820" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<text x="134" y="116" fill="#111827" font-family="Arial, sans-serif" font-size="34" font-weight="700">Карточка заявки / заказа</text>
<rect x="134" y="150" width="1132" height="82" rx="20" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="260" width="1132" height="200" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="490" width="1132" height="128" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="648" width="1132" height="164" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
</svg>

Before

Width:  |  Height:  |  Size: 856 B

View File

@@ -1,10 +0,0 @@
<svg width="1400" height="860" viewBox="0 0 1400 860" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="860" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="780" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<rect x="132" y="86" width="1136" height="70" rx="18" fill="#F9FAFB" stroke="#D9DEE7" stroke-width="2"/>
<rect x="132" y="190" width="360" height="150" rx="22" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="520" y="190" width="360" height="150" rx="22" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="908" y="190" width="360" height="150" rx="22" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="132" y="378" width="736" height="314" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="896" y="378" width="372" height="314" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
</svg>

Before

Width:  |  Height:  |  Size: 912 B

View File

@@ -1,11 +0,0 @@
<svg width="1400" height="920" viewBox="0 0 1400 920" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="920" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="840" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<text x="134" y="116" fill="#111827" font-family="Arial, sans-serif" font-size="34" font-weight="700">Карточка обработки заявки менеджером</text>
<rect x="134" y="150" width="1132" height="92" rx="22" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="274" width="1132" height="196" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="500" width="548" height="210" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="718" y="500" width="548" height="210" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="880" y="760" width="386" height="64" rx="32" fill="#D5E5FA"/>
<text x="1073" y="800" text-anchor="middle" fill="#1B3658" font-family="Arial, sans-serif" font-size="23" font-weight="700">Опубликовать условия / перевести в работу</text>
</svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -1,9 +0,0 @@
<svg width="1400" height="860" viewBox="0 0 1400 860" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="860" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="780" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<rect x="134" y="150" width="1132" height="80" rx="20" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="264" width="1132" height="60" rx="18" fill="#EAF1F8"/>
<rect x="134" y="344" width="1132" height="78" rx="18" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="438" width="1132" height="78" rx="18" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="134" y="532" width="1132" height="78" rx="18" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
</svg>

Before

Width:  |  Height:  |  Size: 771 B

View File

@@ -1,39 +0,0 @@
<svg width="1400" height="980" viewBox="0 0 1400 980" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="980" fill="#F5F6F8"/>
<rect x="90" y="40" width="1220" height="900" rx="28" fill="white" stroke="#D9DEE7" stroke-width="2"/>
<rect x="134" y="82" width="220" height="36" rx="18" fill="#EEF2F7"/>
<text x="134" y="150" fill="#111827" font-family="Arial, sans-serif" font-size="34" font-weight="700">Карточка товара</text>
<rect x="134" y="190" width="330" height="300" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<rect x="174" y="230" width="250" height="190" rx="18" fill="#E7EDF5"/>
<rect x="500" y="190" width="470" height="300" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<text x="536" y="236" fill="#111827" font-family="Arial, sans-serif" font-size="24" font-weight="700">Параметры выбора</text>
<rect x="536" y="266" width="120" height="42" rx="21" fill="#EAF1F8"/>
<rect x="668" y="266" width="120" height="42" rx="21" fill="#EAF1F8"/>
<rect x="800" y="266" width="120" height="42" rx="21" fill="#EAF1F8"/>
<rect x="536" y="328" width="120" height="42" rx="21" fill="#EAF1F8"/>
<rect x="668" y="328" width="120" height="42" rx="21" fill="#EAF1F8"/>
<rect x="800" y="328" width="120" height="42" rx="21" fill="#EAF1F8"/>
<rect x="536" y="390" width="180" height="14" rx="7" fill="#D5DDE8"/>
<rect x="536" y="416" width="360" height="14" rx="7" fill="#E4EAF1"/>
<rect x="536" y="442" width="300" height="14" rx="7" fill="#E4EAF1"/>
<rect x="1006" y="190" width="260" height="300" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<text x="1042" y="236" fill="#111827" font-family="Arial, sans-serif" font-size="24" font-weight="700">Действие</text>
<rect x="1042" y="276" width="188" height="14" rx="7" fill="#D5DDE8"/>
<rect x="1042" y="302" width="150" height="14" rx="7" fill="#E4EAF1"/>
<rect x="1042" y="382" width="188" height="54" rx="27" fill="#CFE6D7"/>
<text x="1136" y="416" text-anchor="middle" fill="#1F3B2B" font-family="Arial, sans-serif" font-size="22" font-weight="700">В корзину</text>
<rect x="134" y="530" width="1132" height="120" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<text x="170" y="576" fill="#111827" font-family="Arial, sans-serif" font-size="24" font-weight="700">Пояснение по параметрам</text>
<rect x="170" y="606" width="700" height="14" rx="7" fill="#D5DDE8"/>
<rect x="170" y="632" width="980" height="14" rx="7" fill="#E4EAF1"/>
<rect x="134" y="690" width="1132" height="210" rx="24" fill="#F9FAFB" stroke="#CAD5E2" stroke-width="2"/>
<text x="170" y="736" fill="#111827" font-family="Arial, sans-serif" font-size="24" font-weight="700">Таблица доступных вариантов</text>
<rect x="170" y="760" width="1060" height="44" rx="12" fill="#EAF1F8"/>
<rect x="170" y="820" width="1060" height="1" fill="#D8E0EB"/>
<rect x="170" y="850" width="1060" height="1" fill="#D8E0EB"/>
</svg>

Before

Width:  |  Height:  |  Size: 3.0 KiB