diff --git a/design/penpot/krona-components.svg b/design/penpot/krona-components.svg new file mode 100644 index 0000000..cba4b57 --- /dev/null +++ b/design/penpot/krona-components.svg @@ -0,0 +1,45 @@ + + + KRONA UI — базовые компонентыParchment Light · 4 px grid · semantic tokens + + Buttons + Основная + Вторичная + ✦ KRONA AI + Удалить + + + Inputs + НазваниеВведите значение… + ФокусИван Петров + + + Module tabs + МессенджерыEmailКаналыКонтактыНастройки + + + Channel switcher + Все22TelegramWhatsApp＋ Подключить + + + Chat item + ИПИван ПетровДа, можем. Сейчас отправлю…12:412 + + + Message bubbles + Здравствуйте! Интересует новый прайс.12:17Добрый день! Сейчас всё отправлю.12:19 ✓✓ + + + Message composer + ⌕Написать сообщение…✦☺♩➤ + + + Contact card + + ИПИван ПетровООО «Альфа» · Директор + ● Клиент◆ VIP + Каналы контактаTelegram @ivan_petrovWhatsApp +7 900 123-45-67Email ivan@alfa.ru + ✦ AI-сводкаОбщение длится 47 дней.Клиент настроен позитивно.Рекомендуется оперативный ответ. + ДействияОтветитьСоздать задачуСоздать сделку + + diff --git a/design/penpot/krona-tokens.json b/design/penpot/krona-tokens.json new file mode 100644 index 0000000..f9fbb8d --- /dev/null +++ b/design/penpot/krona-tokens.json @@ -0,0 +1,50 @@ +{ + "KRONA/Parchment Light": { + "bg": {"app":{"$value":"#EFE3CC","$type":"color"},"workspace":{"$value":"#F3EAD7","$type":"color"},"section":{"$value":"#F1E6D2","$type":"color"}}, + "surface": {"default":{"$value":"#F8F2E6","$type":"color"},"raised":{"$value":"#FCF8EF","$type":"color"},"muted":{"$value":"#E9DDC5","$type":"color"},"hover":{"$value":"#EDE0C7","$type":"color"},"selected":{"$value":"#E2D0AD","$type":"color"}}, + "text": {"primary":{"$value":"#302A23","$type":"color"},"secondary":{"$value":"#756A5B","$type":"color"},"muted":{"$value":"#9A8E7D","$type":"color"}}, + "border": {"default":{"$value":"#D9C9AC","$type":"color"},"subtle":{"$value":"#E5D8C0","$type":"color"},"focus":{"$value":"#9A743D","$type":"color"}}, + "primary": {"default":{"$value":"#9A743D","$type":"color"},"hover":{"$value":"#7D5B2D","$type":"color"},"active":{"$value":"#684923","$type":"color"},"soft":{"$value":"#EADBC1","$type":"color"}}, + "gold": {"default":{"$value":"#B78335","$type":"color"},"hover":{"$value":"#9E702D","$type":"color"},"active":{"$value":"#805923","$type":"color"},"soft":{"$value":"#EFE0C2","$type":"color"}}, + "success": {"default":{"$value":"#657255","$type":"color"},"soft":{"$value":"#E1E6D8","$type":"color"}}, + "warning": {"default":{"$value":"#A8752F","$type":"color"},"soft":{"$value":"#F2E3C8","$type":"color"}}, + "danger": {"default":{"$value":"#A44E3F","$type":"color"},"soft":{"$value":"#F1DDD5","$type":"color"}}, + "info": {"default":{"$value":"#5F7480","$type":"color"},"soft":{"$value":"#DFE6E5","$type":"color"}}, + "space": {"1":{"$value":"4","$type":"spacing"},"2":{"$value":"8","$type":"spacing"},"3":{"$value":"12","$type":"spacing"},"4":{"$value":"16","$type":"spacing"},"5":{"$value":"20","$type":"spacing"},"6":{"$value":"24","$type":"spacing"},"8":{"$value":"32","$type":"spacing"},"10":{"$value":"40","$type":"spacing"},"12":{"$value":"48","$type":"spacing"},"16":{"$value":"64","$type":"spacing"}}, + "radius": {"xs":{"$value":"6","$type":"borderRadius"},"sm":{"$value":"8","$type":"borderRadius"},"md":{"$value":"10","$type":"borderRadius"},"lg":{"$value":"12","$type":"borderRadius"},"xl":{"$value":"16","$type":"borderRadius"},"pill":{"$value":"999","$type":"borderRadius"}} + }, + "KRONA/Noble Green": { + "bg": {"app":{"$value":"#EDE5D3","$type":"color"},"workspace":{"$value":"#F2EAD9","$type":"color"},"section":{"$value":"#ECE2CE","$type":"color"}}, + "surface": {"default":{"$value":"#F8F2E6","$type":"color"},"raised":{"$value":"#FCF8EF","$type":"color"},"muted":{"$value":"#E6DBC5","$type":"color"},"hover":{"$value":"#E3E9DE","$type":"color"},"selected":{"$value":"#DCE5D7","$type":"color"}}, + "text": {"primary":{"$value":"#2E302A","$type":"color"},"secondary":{"$value":"#6B6C60","$type":"color"},"muted":{"$value":"#8B8C80","$type":"color"}}, + "border": {"default":{"$value":"#D2CCB9","$type":"color"},"subtle":{"$value":"#E2DAC8","$type":"color"},"focus":{"$value":"#315F46","$type":"color"}}, + "primary": {"default":{"$value":"#315F46","$type":"color"},"hover":{"$value":"#294F3B","$type":"color"},"active":{"$value":"#213F30","$type":"color"},"soft":{"$value":"#DDE7DB","$type":"color"}}, + "gold": {"default":{"$value":"#B78335","$type":"color"},"hover":{"$value":"#9E702D","$type":"color"},"active":{"$value":"#805923","$type":"color"},"soft":{"$value":"#EFE0C2","$type":"color"}}, + "success": {"default":{"$value":"#3F7557","$type":"color"},"soft":{"$value":"#DDE9E0","$type":"color"}}, + "warning": {"default":{"$value":"#A8752F","$type":"color"},"soft":{"$value":"#F2E3C8","$type":"color"}}, + "danger": {"default":{"$value":"#A44E3F","$type":"color"},"soft":{"$value":"#F1DDD5","$type":"color"}}, + "info": {"default":{"$value":"#527286","$type":"color"},"soft":{"$value":"#DFE7EA","$type":"color"}}, + "space": {"1":{"$value":"4","$type":"spacing"},"2":{"$value":"8","$type":"spacing"},"3":{"$value":"12","$type":"spacing"},"4":{"$value":"16","$type":"spacing"},"5":{"$value":"20","$type":"spacing"},"6":{"$value":"24","$type":"spacing"},"8":{"$value":"32","$type":"spacing"},"10":{"$value":"40","$type":"spacing"},"12":{"$value":"48","$type":"spacing"},"16":{"$value":"64","$type":"spacing"}}, + "radius": {"xs":{"$value":"6","$type":"borderRadius"},"sm":{"$value":"8","$type":"borderRadius"},"md":{"$value":"10","$type":"borderRadius"},"lg":{"$value":"12","$type":"borderRadius"},"xl":{"$value":"16","$type":"borderRadius"},"pill":{"$value":"999","$type":"borderRadius"}} + }, + "KRONA/Graphite Forest Dark": { + "bg": {"app":{"$value":"#171A18","$type":"color"},"workspace":{"$value":"#1D211E","$type":"color"},"section":{"$value":"#202620","$type":"color"}}, + "surface": {"default":{"$value":"#252A26","$type":"color"},"raised":{"$value":"#2B312C","$type":"color"},"muted":{"$value":"#212621","$type":"color"},"hover":{"$value":"#2B342D","$type":"color"},"selected":{"$value":"#29382E","$type":"color"}}, + "text": {"primary":{"$value":"#EEE7DA","$type":"color"},"secondary":{"$value":"#B7B3A8","$type":"color"},"muted":{"$value":"#888E87","$type":"color"}}, + "border": {"default":{"$value":"#39423A","$type":"color"},"subtle":{"$value":"#303831","$type":"color"},"focus":{"$value":"#6F9A79","$type":"color"}}, + "primary": {"default":{"$value":"#527D60","$type":"color"},"hover":{"$value":"#648E70","$type":"color"},"active":{"$value":"#426A50","$type":"color"},"soft":{"$value":"#29382E","$type":"color"}}, + "gold": {"default":{"$value":"#C99A4D","$type":"color"},"hover":{"$value":"#D5AA63","$type":"color"},"active":{"$value":"#B78335","$type":"color"},"soft":{"$value":"#403522","$type":"color"}}, + "success": {"default":{"$value":"#78916F","$type":"color"},"soft":{"$value":"#29372D","$type":"color"}}, + "warning": {"default":{"$value":"#C08A45","$type":"color"},"soft":{"$value":"#403422","$type":"color"}}, + "danger": {"default":{"$value":"#C06B5F","$type":"color"},"soft":{"$value":"#432B28","$type":"color"}}, + "info": {"default":{"$value":"#7693A0","$type":"color"},"soft":{"$value":"#29363B","$type":"color"}}, + "space": {"1":{"$value":"4","$type":"spacing"},"2":{"$value":"8","$type":"spacing"},"3":{"$value":"12","$type":"spacing"},"4":{"$value":"16","$type":"spacing"},"5":{"$value":"20","$type":"spacing"},"6":{"$value":"24","$type":"spacing"},"8":{"$value":"32","$type":"spacing"},"10":{"$value":"40","$type":"spacing"},"12":{"$value":"48","$type":"spacing"},"16":{"$value":"64","$type":"spacing"}}, + "radius": {"xs":{"$value":"6","$type":"borderRadius"},"sm":{"$value":"8","$type":"borderRadius"},"md":{"$value":"10","$type":"borderRadius"},"lg":{"$value":"12","$type":"borderRadius"},"xl":{"$value":"16","$type":"borderRadius"},"pill":{"$value":"999","$type":"borderRadius"}} + }, + "$themes": [ + {"id":"a8830070-ee3b-8012-8008-a8ade23a2d7b","name":"Parchment Light","group":"KRONA","description":"Тёплая пергаментная тема","isSource":false,"selectedTokenSets":{"KRONA/Parchment Light":"enabled"}}, + {"id":"a8830070-ee3b-8012-8008-a8adfbd2ab7a","name":"Noble Green","group":"KRONA","description":"Светлая рабочая область и благородная зелёная оболочка","isSource":false,"selectedTokenSets":{"KRONA/Noble Green":"enabled"}}, + {"id":"a8830070-ee3b-8012-8008-a8ae0e2ed90b","name":"Graphite Forest Dark","group":"KRONA","description":"Графитовая рабочая среда с forest-акцентами","isSource":false,"selectedTokenSets":{"KRONA/Graphite Forest Dark":"enabled"}} + ], + "$metadata": {"tokenSetOrder":["KRONA/Parchment Light","KRONA/Noble Green","KRONA/Graphite Forest Dark"],"activeThemes":[],"activeSets":[]} +}