0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-11 06:21:30 -05:00

💄 Redesign design tab phase one

This commit is contained in:
Eva 2023-08-29 13:50:42 +02:00
parent d7dea040af
commit 9ed06c4483
159 changed files with 4150 additions and 1171 deletions

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M.667 14.667V1.333m14.666 13.334V1.333m-3 8c.828 0 1.5.673 1.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1c0-.827.672-1.5 1.5-1.5h1zm-7.666 0c.828 0 1.5.673 1.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1c0-.827.672-1.5 1.5-1.5h1zm7.666-6.666a1.5 1.5 0 011.5 1.5v1c0 .827-.672 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-7.666 0a1.5 1.5 0 011.5 1.5v1c0 .827-.672 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1z"/>
</svg>

After

Width:  |  Height:  |  Size: 602 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M.667 14v-2.167m0 0V5.167m0 6.666a1.5 1.5 0 001.5 1.5h1a1.5 1.5 0 001.5-1.5v-1a1.5 1.5 0 00-1.5-1.5h-1a1.5 1.5 0 00-1.5 1.5m0-5.666V2m0 3.167a1.5 1.5 0 001.5 1.5h1a1.5 1.5 0 001.5-1.5v-1a1.5 1.5 0 00-1.5-1.5h-1a1.5 1.5 0 00-1.5 1.5m14.666 7.666a1.5 1.5 0 01-1.5 1.5h-1c-.827 0-1.5-.672-1.5-1.5v-1c0-.828.673-1.5 1.5-1.5h1a1.5 1.5 0 011.5 1.5m0 0V14m0-3.167V4.167m0 1a1.5 1.5 0 01-1.5 1.5h-1c-.827 0-1.5-.672-1.5-1.5v-1c0-.828.673-1.5 1.5-1.5h1a1.5 1.5 0 011.5 1.5m0 0V2"/>
</svg>

After

Width:  |  Height:  |  Size: 600 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 14V2m5.167 7.333c.827 0 1.5.672 1.5 1.5v1c0 .828-.673 1.5-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-9.334 0a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm9.334-6.666c.827 0 1.5.672 1.5 1.5v1c0 .827-.673 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-9.334 0a1.5 1.5 0 011.5 1.5v1c0 .827-.672 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1z"/>
</svg>

After

Width:  |  Height:  |  Size: 575 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M14.667 14V2M10.5 9.333a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-6.667 0a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zM10.5 2.667a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-6.667 0a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1z"/>
</svg>

After

Width:  |  Height:  |  Size: 555 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M.667 14.667V1.333m14.666 13.334V1.333m-4 8c.828 0 1.5.673 1.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1c0-.827.672-1.5 1.5-1.5h1zm-5.666 0c.828 0 1.5.673 1.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1c0-.827.672-1.5 1.5-1.5h1zm5.666-6.666a1.5 1.5 0 011.5 1.5v1c0 .827-.672 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-5.666 0a1.5 1.5 0 011.5 1.5v1c0 .827-.672 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1z"/>
</svg>

After

Width:  |  Height:  |  Size: 602 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M1.333 14V2m11.834 7.333c.827 0 1.5.672 1.5 1.5v1c0 .828-.673 1.5-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-6.667 0a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5h-1a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm6.667-6.666c.827 0 1.5.672 1.5 1.5v1c0 .827-.673 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1zm-6.667 0a1.5 1.5 0 011.5 1.5v1c0 .827-.672 1.5-1.5 1.5h-1c-.828 0-1.5-.673-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h1z"/>
</svg>

After

Width:  |  Height:  |  Size: 580 B

View file

Before

Width:  |  Height:  |  Size: 595 B

After

Width:  |  Height:  |  Size: 595 B

View file

Before

Width:  |  Height:  |  Size: 600 B

After

Width:  |  Height:  |  Size: 600 B

View file

Before

Width:  |  Height:  |  Size: 600 B

After

Width:  |  Height:  |  Size: 600 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 2.666h3.167c.827 0 1.5.673 1.5 1.5v1c0 .828-.673 1.5-1.5 1.5H8m0-4H4.833c-.828 0-1.5.673-1.5 1.5v1a1.5 1.5 0 001.5 1.5H8m0-4V.667m0 5.999v2.667m0 0h1.833a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5H8m0-4H6.167a1.5 1.5 0 00-1.5 1.5v1a1.5 1.5 0 001.5 1.5H8m0 0v2"/>
</svg>

After

Width:  |  Height:  |  Size: 393 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M14 14.667V1.333M2 4.166c0-.827.672-1.5 1.5-1.5h6.333c.828 0 1.5.673 1.5 1.5v1a1.5 1.5 0 01-1.5 1.5H3.5a1.5 1.5 0 01-1.5-1.5v-1zm2.667 6.667a1.5 1.5 0 011.5-1.5h3.666a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5H6.167a1.5 1.5 0 01-1.5-1.5v-1z"/>
</svg>

After

Width:  |  Height:  |  Size: 371 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 14.7V1.4m12 2.8c0-.8-.7-1.5-1.5-1.5H6.2c-.8 0-1.5.7-1.5 1.5v1c0 .8.7 1.5 1.5 1.5h6.3c.8 0 1.5-.7 1.5-1.5v-1zm-2.7 6.6c0-.8-.7-1.5-1.5-1.5H6.2c-.8 0-1.5.7-1.5 1.5v1c0 .8.7 1.5 1.5 1.5h3.7c.8 0 1.5-.7 1.5-1.5v-1h-.1z"/>
</svg>

After

Width:  |  Height:  |  Size: 348 B

View file

Before

Width:  |  Height:  |  Size: 449 B

After

Width:  |  Height:  |  Size: 449 B

View file

Before

Width:  |  Height:  |  Size: 397 B

After

Width:  |  Height:  |  Size: 397 B

View file

Before

Width:  |  Height:  |  Size: 348 B

After

Width:  |  Height:  |  Size: 348 B

View file

@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path d="m11.833 14c.828 0 1.5-.672 1.5-1.5v-6.333c0-.828-.672-1.5-1.5-1.5h-1c-.828 0-1.5.672-1.5 1.5v6.333c0 .828.672 1.5 1.5 1.5zm-6.666-2.667c.828 0 1.5-.672 1.5-1.5v-3.666c0-.828-.672-1.5-1.5-1.5h-1c-.828 0-1.5.672-1.5 1.5v3.666c0 .828.672 1.5 1.5 1.5zm-3.834-9.333h13.334"/>
</svg>

Before

Width:  |  Height:  |  Size: 432 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M14.667 14.667H1.333m7.334-14a2 2 0 012 2v6.666a2 2 0 01-2 2H7.333c-1.103 0-2-.896-2-2V2.667c0-1.104.897-2 2-2h1.334z"/>
</svg>

After

Width:  |  Height:  |  Size: 248 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M15.333 8h-4.666m0 0V4.667c0-1.104-.897-2-2-2H7.333a2 2 0 00-2 2V8m5.334 0v3.333c0 1.104-.897 2-2 2H7.333a2 2 0 01-2-2V8m0 0H.667"/>
</svg>

After

Width:  |  Height:  |  Size: 260 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M14.667 1.333H1.333m7.334 3.334c1.103 0 2 .896 2 2v6.666c0 1.104-.897 2-2 2H7.333a2 2 0 01-2-2V6.667a2 2 0 012-2h1.334z"/>
</svg>

After

Width:  |  Height:  |  Size: 250 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 .667v4.666m0 0H4.667c-1.104 0-2 .897-2 2v1.334a2 2 0 002 2H8m0-5.334h3.333c1.104 0 2 .897 2 2v1.334a2 2 0 01-2 2H8m0 0v4.666"/>
</svg>

After

Width:  |  Height:  |  Size: 257 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M1.333 1.333v13.334m3.334-7.334c0-1.103.896-2 2-2h6.666c1.104 0 2 .897 2 2v1.334a2 2 0 01-2 2H6.667a2 2 0 01-2-2V7.333z"/>
</svg>

After

Width:  |  Height:  |  Size: 249 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M14.667 1.333v13.334m-14-7.334a2 2 0 012-2h6.666a2 2 0 012 2v1.334c0 1.103-.896 2-2 2H2.667c-1.104 0-2-.897-2-2V7.333z"/>
</svg>

After

Width:  |  Height:  |  Size: 248 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2.5 10v3.5m0 0H6m-3.5 0H1m1.5 0V15m11-9V2.5m0 0H10m3.5 0H15m-1.5 0V1m0 9v3.5m0 0H10m3.5 0H15m-1.5 0V15m-11-9V2.5m0 0H6m-3.5 0H1m1.5 0V1"/>
</svg>

After

Width:  |  Height:  |  Size: 268 B

View file

@ -1 +1,3 @@
<svg fill="none" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h16v16h-16z"/></clipPath><g clip-path="url(#a)"><path d="m0 0h16v16h-16z"/><g fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="m12.488 8.667-4 4m0 0-4-4m4 4v-9.334" rx="0" ry="0"/><path d="m12.488 8.667-4 4m0 0-4-4m4 4v-9.334" rx="0" ry="0" stroke="#aab5ba"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M12.488 8.667l-4 4m0 0l-4-4m4 4V3.333"/>
</svg>

Before

Width:  |  Height:  |  Size: 460 B

After

Width:  |  Height:  |  Size: 168 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M11.5 4l4 4-4 4m-7-8l-4 4 4 4"/>
</svg>

After

Width:  |  Height:  |  Size: 161 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 4.5V8m0 0v3.5M15 8H1m0 0V4.5M1 8v3.5"/>
</svg>

After

Width:  |  Height:  |  Size: 172 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="m.667 2h.666c.553 0 1 .448 1 1v10c0 .552-.447 1-1 1h-.666m14.666-12h-.666c-.553 0-1 .448-1 1v10c0 .552.447 1 1 1h.666m-8-8.667v5.334c0 .368.299.666.667.666s.667-.298.667-.666v-5.334c0-.368-.299-.666-.667-.666s-.667.298-.667.666z"/>
</svg>

After

Width:  |  Height:  |  Size: 359 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="m14 .667v.666c0 .553-.448 1-1 1h-10c-.552 0-1-.447-1-1v-.666m12 14.666v-.666c0-.553-.448-1-1-1h-10c-.552 0-1 .447-1 1v.666m8.667-8h-5.334c-.368 0-.666.299-.666.667s.298.667.666.667h5.334c.368 0 .666-.299.666-.667s-.298-.667-.666-.667z"/>
</svg>

After

Width:  |  Height:  |  Size: 365 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M1 8a4 4 0 014-4h6a4 4 0 010 8H5a4 4 0 01-4-4z"/>
</svg>

After

Width:  |  Height:  |  Size: 178 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M1.333.667h13.334M1.333 15.333h13.334M12 3.75a1.5 1.5 0 00-1.5-1.5h-5A1.5 1.5 0 004 3.75v1a1.5 1.5 0 001.5 1.5h5a1.5 1.5 0 001.5-1.5v-1zm0 7.5a1.5 1.5 0 00-1.5-1.5h-5a1.5 1.5 0 00-1.5 1.5v1a1.5 1.5 0 001.5 1.5h5a1.5 1.5 0 001.5-1.5v-1z"/>
</svg>

After

Width:  |  Height:  |  Size: 365 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 .667h12M2 15.333h12m-2-13.14C12 1.369 11.328.7 10.5.7h-5C4.672.7 4 1.369 4 2.193v.996c0 .824.672 1.493 1.5 1.493h5c.828 0 1.5-.669 1.5-1.493v-.996zm0 10.618c0-.824-.672-1.493-1.5-1.493h-5c-.828 0-1.5.669-1.5 1.493v.996c0 .824.672 1.493 1.5 1.493h5c.828 0 1.5-.669 1.5-1.493v-.996z"/>
</svg>

After

Width:  |  Height:  |  Size: 413 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 8h12m-2-5.834c0-.827-.672-1.5-1.5-1.5h-5c-.828 0-1.5.673-1.5 1.5v1a1.5 1.5 0 001.5 1.5h5a1.5 1.5 0 001.5-1.5v-1zm0 10.667a1.5 1.5 0 00-1.5-1.5h-5a1.5 1.5 0 00-1.5 1.5v1a1.5 1.5 0 001.5 1.5h5a1.5 1.5 0 001.5-1.5v-1z"/>
</svg>

After

Width:  |  Height:  |  Size: 347 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 .667h12M12 5.5A1.5 1.5 0 0010.5 4h-5A1.5 1.5 0 004 5.5v1A1.5 1.5 0 005.5 8h5A1.5 1.5 0 0012 6.5v-1zm0 7.333a1.5 1.5 0 00-1.5-1.5h-5a1.5 1.5 0 00-1.5 1.5v1a1.5 1.5 0 001.5 1.5h5a1.5 1.5 0 001.5-1.5v-1z"/>
</svg>

After

Width:  |  Height:  |  Size: 333 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M1.333.667h13.334M1.333 15.333h13.334M12 4.471a1.5 1.5 0 00-1.5-1.5h-5a1.5 1.5 0 00-1.5 1.5v1c0 .827.672 1.5 1.5 1.5h5c.828 0 1.5-.673 1.5-1.5v-1zm0 6a1.5 1.5 0 00-1.5-1.5h-5a1.5 1.5 0 00-1.5 1.5v1c0 .827.672 1.5 1.5 1.5h5c.828 0 1.5-.673 1.5-1.5v-1z"/>
</svg>

After

Width:  |  Height:  |  Size: 380 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 15.333h12M12 10.5a1.5 1.5 0 01-1.5 1.5h-5A1.5 1.5 0 014 10.5v-1A1.5 1.5 0 015.5 8h5A1.5 1.5 0 0112 9.5v1zm0-7.333a1.5 1.5 0 01-1.5 1.5h-5a1.5 1.5 0 01-1.5-1.5v-1a1.5 1.5 0 011.5-1.5h5a1.5 1.5 0 011.5 1.5v1z"/>
</svg>

After

Width:  |  Height:  |  Size: 339 B

View file

Before

Width:  |  Height:  |  Size: 369 B

After

Width:  |  Height:  |  Size: 369 B

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M4 11V5a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1zM1.337 10.328a.335.335 0 10-.67 0 .335.335 0 00.67 0zM1.337 7.998a.335.335 0 10-.67 0 .335.335 0 00.67 0zM1.337 5.668a.335.335 0 10-.67 0 .335.335 0 00.67 0zM15.33 10.328a.335.335 0 10-.67 0 .335.335 0 00.67 0zM15.33 7.998a.335.335 0 10-.67 0 .335.335 0 00.67 0zM15.33 5.668a.335.335 0 10-.67 0 .335.335 0 00.67 0zM5.671 1.338a.335.335 0 10-.002-.67.335.335 0 00.002.67zM8.001 1.338a.335.335 0 10-.002-.67.335.335 0 00.002.67zM10.331 1.338a.336.336 0 10-.001-.671.336.336 0 00.001.671zM5.671 15.332a.336.336 0 000-.67.335.335 0 100 .67zM8.001 15.332a.336.336 0 000-.67.335.335 0 100 .67zM10.331 15.332a.335.335 0 100-.67.335.335 0 000 .67z"/>
</svg>

After

Width:  |  Height:  |  Size: 835 B

View file

@ -10,39 +10,54 @@
background-color: var(--button-primary-background-color-rest);
border: $s-1 solid var(--button-primary-border-color-rest);
color: var(--button-primary-foreground-color-rest);
border-radius: $br-8;
svg,
span svg {
stroke: var(--button-primary-foreground-color-rest);
}
&:hover {
background-color: var(--button-primary-background-color-hover);
border: $s-1 solid var(--button-primary-border-color-hover);
color: var(--button-primary-foreground-color-hover);
svg {
svg,
span svg {
stroke: var(--button-primary-foreground-color-hover);
}
}
&:focus {
&:focus,
&:focus-visible {
outline: none;
background-color: var(--button-primary-background-color-focus);
border: $s-1 solid var(--button-primary-boder-color-focus);
border: $s-1 solid var(--button-primary-border-color-focus);
color: var(--button-primary-foreground-color-focus);
svg {
svg,
span svg {
stroke: var(--button-primary-foreground-color-focus);
}
}
&:active {
border: 1px solid var(--button-border-focus);
outline: none;
}
&:focus-visible {
border: none;
background-color: var(--button-primary-background-color-active);
border: $s-1 solid var(--button-primary-border-color-active);
color: var(--button-primary-foreground-color-active);
outline: none;
svg,
span svg {
stroke: var(--button-primary-foreground-color-active);
}
}
}
.button-secondary {
@include buttonStyle;
@include flexCenter;
border-radius: $br-8;
background-color: var(--button-secondary-background-color-rest);
border: $s-1 solid var(--button-secondary-border-color-rest);
color: var(--button-secondary-foreground-color-rest);
svg,
span svg {
stroke: var(--button-secondary-foreground-color-rest);
}
&:hover {
background-color: var(--button-secondary-background-color-hover);
border: $s-1 solid var(--button-secondary-border-color-hover);
@ -52,55 +67,112 @@
stroke: var(--button-secondary-foreground-color-hover);
}
}
&:focus {
&:focus,
&:focus-visible {
outline: none;
background-color: var(--button-secondary-background-color-focus);
border: $s-1 solid var(--button-secondary-boder-color-focus);
border: $s-1 solid var(--button-secondary-border-color-focus);
color: var(--button-secondary-foreground-color-focus);
svg {
svg,
span svg {
stroke: var(--button-secondary-foreground-color-focus);
}
}
&:active {
border: none;
background-color: transparent;
}
&:focus-visible {
border: none;
outline: none;
background-color: var(--button-secondary-background-color-active);
border: $s-1 solid var(--button-secondary-border-color-active);
color: var(--button-secondary-foreground-color-active);
svg,
span svg {
stroke: var(--button-secondary-foreground-color-active);
}
}
}
.button-tertiary {
@include buttonStyle;
@include flexCenter;
border-radius: $br-8;
color: var(--button-tertiary-foreground-color-rest);
svg {
background-color: transparent;
border: $s-1 solid transparent;
svg,
span svg {
stroke: var(--button-tertiary-foreground-color-rest);
}
&:hover {
background-color: var(--button-tertiary-background-color-hover);
color: var(--button-tertiary-foreground-color-hover);
svg {
border: $s-1 solid var(--button-secondary-border-color-hover);
svg,
span svg {
stroke: var(--button-tertiary-foreground-color-hover);
}
}
&:focus {
&:focus,
&:focus-visible {
outline: none;
border: $s-1 solid var(--button-tertiary-border-color-focus);
background-color: var(--button-tertiary-background-color-focus);
color: var(--button-tertiary-foreground-color-focus);
svg {
svg,
span svg {
stroke: var(--button-tertiary-foreground-color-focus);
}
}
&:active {
border: $s-1 solid var(--button-tertiary-border-color-focus);
outline: none;
border: $s-1 solid transparent;
background-color: var(--button-tertiary-background-color-active);
color: var(--button-tertiary-foreground-color-active);
svg,
span svg {
stroke: var(--button-tertiary-foreground-color-active);
}
}
}
.button-radio {
@include buttonStyle;
@include flexCenter;
border-radius: $br-8;
color: var(--button-radio-foreground-color-rest);
background-color: var(--button-radio-background-color-rest);
border: $s-1 solid var(--button-radio-background-color-rest);
svg,
span svg {
stroke: var(--button-radio-foreground-color-rest);
}
&:hover {
background-color: transparent;
color: var(--button-radio-foreground-color-hover);
border: $s-1 solid transparent;
svg,
span svg {
stroke: var(--button-radio-foreground-color-hover);
}
}
&:focus,
&:focus-visible {
border: none;
outline: none;
border: $s-1 solid var(--button-radio-border-color-focus);
background-color: var(--button-radio-background-color-focus);
color: var(--button-radio-foreground-color-focus);
svg,
span svg {
stroke: var(--button-radio-foreground-color-focus);
}
}
&:active {
outline: none;
border: $s-1 solid transparent;
background-color: var(--button-radio-background-color-active);
color: var(--button-radio-foreground-color-active);
svg,
span svg {
stroke: var(--button-radio-foreground-color-active);
}
}
}
@ -153,7 +225,6 @@
width: $s-16;
color: transparent;
fill: none;
stroke: var(--icon-foreground);
stroke-width: 1px;
}
@ -178,10 +249,9 @@
align-items: center;
height: $s-32;
border-radius: $br-8;
margin-bottom: $s-4;
padding: $s-8 $s-12;
background-color: var(--assets-item-background-color);
color: var(--assets-item-name-foreground-color);
color: var(--assets-item-name-foreground-color-hover);
&:hover,
&:focus-within {
background-color: var(--assets-item-background-color-hover);
@ -189,6 +259,37 @@
}
}
.input-element {
@include titleTipography;
display: flex;
align-items: center;
height: $s-32;
border-radius: $br-8;
background-color: var(--input-background-color);
color: var(--input-foreground-color);
span {
color: var(--input-foreground-color);
}
input {
@include removeInputStyle;
@include titleTipography;
color: var(--input-foreground-color);
height: $s-32;
}
::placeholder {
color: var(--input-placeholder-color);
}
&:hover,
&:focus-within {
span {
color: var(--input-foreground-color);
}
input {
color: var(--input-foreground-color-active);
}
background-color: var(--input-background-color-hover);
}
}
.new-scrollbar {
::-webkit-scrollbar {
background-color: transparent;

View file

@ -14,13 +14,10 @@
--panel-background-color: var(--color-background-primary);
--panel-title-background-color: var(--color-background-secondary);
--button-background-hover: var(--color-background-quaternary);
--button-foreground-hover: var(--color-accent-primary);
--button-foreground-active: var(--color-foreground-primary);
--button-background-focus: var(--color-background-secondary);
--button-foreground-focus: var(--color-foreground-primary);
--button-border-focus: var(--color-accent-primary);
--button-border: var(--color-background-tertiary);
--button-foreground-color-disabled: var(--color-background-quaternary);
--button-primary-background-color-rest: var(--color-accent-primary);
@ -29,22 +26,22 @@
--button-primary-background-color-hover: var(--color-accent-tertiary);
--button-primary-border-color-hover: var(--color-accent-tertiary);
--button-primary-foreground-color-hover: var(--color-background-secondary);
--button-primary-background-color-selected: var(--color-background-secondary);
--button-primary-border-color-selected: var(--color-background-secondary);
--button-primary-foreground-color-selected: var(--color-accent-primary);
--button-primary-background-color-active: var(--color-background-secondary);
--button-primary-border-color-active: var(--color-background-secondary);
--button-primary-foreground-color-active: var(--color-accent-primary);
--button-primary-background-color-focus: var(--color-background-tertiary);
--button-primary-border-color-focus: var(--color-accent-primary);
--button-primary-foreground-color-focus: var(--color-foreground-secondary);
--button-secondary-background-color-rest: var(--color-background-tertiary);
--button-secondary-border-color-rest: var(--color-background-quaternary);
--button-secondary-border-color-rest: var(--color-background-tertiary);
--button-secondary-foreground-color-rest: var(--color-foreground-secondary);
--button-secondary-background-color-hover: var(--color-background-quaternary);
--button-secondary-border-color-hover: var(--color-background-quaternary);
--button-secondary-foreground-color-hover: var(--color-accent-primary);
--button-secondary-background-color-selected: var(--color-background-secondary);
--button-secondary-border-color-selected: var(--color-background-quaternary);
--button-secondary-foreground-color-selected: var(--color-accent-primary);
--button-secondary-background-color-active: var(--color-background-secondary);
--button-secondary-border-color-active: var(--color-background-quaternary);
--button-secondary-foreground-color-active: var(--color-accent-primary);
--button-secondary-background-color-focus: var(--color-background-tertiary);
--button-secondary-border-color-focus: var(--color-accent-primary);
--button-secondary-foreground-color-focus: var(--color-foreground-secondary);
@ -53,13 +50,25 @@
--button-tertiary-background-color-hover: var(--color-background-quaternary);
--button-tertiary-border-color-hover: var(--color-background-quaternary);
--button-tertiary-foreground-color-hover: var(--color-accent-primary);
--button-tertiary-background-color-selected: var(--color-background-secondary);
--button-tertiary-border-color-selected: var(--color-background-quaternary);
--button-tertiary-foreground-color-selected: var(--color-accent-primary);
--button-tertiary-background-color-active: var(--color-background-secondary);
--button-tertiary-border-color-active: var(--color-background-quaternary);
--button-tertiary-foreground-color-active: var(--color-accent-primary);
--button-tertiary-background-color-focus: var(--color-background-tertiary);
--button-tertiary-border-color-focus: var(--color-accent-primary);
--button-tertiary-foreground-color-focus: var(--color-foreground-primary);
--button-radio-background-color-rest: var(--color-background-tertiary);
--button-radio-border-color-rest: var(--color-background-tertiary);
--button-radio-foreground-color-rest: var(--color-foreground-secondary);
--button-radio-border-color-hover: var(--color-background-quaternary);
--button-radio-foreground-color-hover: var(--color-accent-primary);
--button-radio-background-color-active: var(--color-background-quaternary);
--button-radio-border-color-active: var(--color-background-quaternary);
--button-radio-foreground-color-active: var(--color-accent-primary);
--button-radio-background-color-focus: var(--color-background-tertiary);
--button-radio-border-color-focus: var(--color-accent-primary);
--button-radio-foreground-color-focus: var(--color-foreground-secondary);
--button-warning-background-color-rest: var(--warning-color);
--button-warning-border-color-rest: var(--warning-color);
--button-warning-foreground-color-rest: var(--color-background-secondary);
@ -109,7 +118,9 @@
--input-placeholder-color: var(--color-foreground-secondary);
--input-foreground-color: var(--color-foreground-secondary);
--input-foreground-color-active: var(--color-foreground-primary);
--input-foreground-color-disabled: var(--color-foreground-secondary);
--input-border-color-active: var(--color-accent-primary);
--input-border-color-disabled: var(--color-background-quaternary);
--input-border-outline-color-active: var(--color-accent-primary-muted);
--input-border-color-focus: var(--color-accent-primary);

View file

@ -33,22 +33,29 @@ $s-80: calc(var(--s-4) * 20);
$s-84: calc(var(--s-4) * 21);
$s-92: calc(var(--s-4) * 23);
$s-96: calc(var(--s-4) * 24);
$s-104: calc(var(--s-4) * 25);
$s-104: calc(var(--s-4) * 26);
$s-108: calc(var(--s-4) * 27);
$s-116: calc(var(--s-4) * 29);
$s-120: calc(var(--s-4) * 30);
$s-124: calc(var(--s-4) * 31);
$s-136: calc(var(--s-4) * 34);
$s-140: calc(var(--s-4) * 35);
$s-148: calc(var(--s-4) * 37);
$s-156: calc(var(--s-4) * 39);
$s-152: calc(var(--s-4) * 38);
$s-160: calc(var(--s-4) * 40);
$s-168: calc(var(--s-4) * 42);
$s-180: calc(var(--s-4) * 45);
$s-184: calc(var(--s-4) * 46);
$s-188: calc(var(--s-4) * 47);
$s-192: calc(var(--s-4) * 48);
$s-196: calc(var(--s-4) * 49);
$s-200: calc(var(--s-4) * 50);
$s-216: calc(var(--s-4) * 54);
$s-220: calc(var(--s-4) * 55);
$s-240: calc(var(--s-4) * 60);
$s-248: calc(var(--s-4) * 62);
$s-252: calc(var(--s-4) * 63);
$s-256: calc(var(--s-4) * 64);
$s-272: calc(var(--s-4) * 68);
$s-276: calc(var(--s-4) * 69);

View file

@ -86,6 +86,33 @@
:else `(if ~v ~cls ""))))))
(interpose " ")))
;; A macro that simplifies setting up classes using css-modules and enhaces the
;; migration process from the old approach.
;;
;; Using this as example:
;;
;; (stl/css-case new-css-system
;; :left-settings-bar true
;; :old-css/settings-bar true
;; :global/two-row (<= size 300))
;;
;; The first argument to the `css-case` macro is optional an if you don't
;; provide it, it will behave in the same ways as if the `new-css-system` has
;; value of `true`.
;;
;; The non-namespaces keywords passed are treated conditionally on the
;; `new-css-system` value. If is `true`, it will perform a lookup on modules for
;; corresponding (hashed) class-name; if no class name is found, the keyword
;; will be stringigied and used as-is (with no changes). If the `new-css-system`
;; is false, it will perform the same operation as if no class is found on
;; modules (leaving it as string with no modification).
;;
;; Later, we have two modifiers (namespaces): `global` which specifies
;; explicitly that no modules lookup should be performed; and `old-css` which
;; only puts the class if `new-css-system` is `false`.
;;
;; NOTE: the same behavior applies to the `css` macro
(defmacro css-case
[& params]
(let [fname (-> *ns* meta :file)

View file

@ -1 +1 @@
{"button-primary":"components_color_bullet_new_button-primary_pDkQg","button-secondary":"components_color_bullet_new_button-secondary_y3A8V","button-tertiary":"components_color_bullet_new_button-tertiary_zPQ8t","button-warning":"components_color_bullet_new_button-warning_OxPWp","button-disabled":"components_color_bullet_new_button-disabled_Zx4Ur","button-tag":"components_color_bullet_new_button-tag_2Ur4i","button-icon":"components_color_bullet_new_button-icon_uAC1e","button-icon-small":"components_color_bullet_new_button-icon-small_rz5pc","link":"components_color_bullet_new_link_S2meo","asset-element":"components_color_bullet_new_asset-element_s3Yqx","new-scrollbar":"components_color_bullet_new_new-scrollbar_7U23G","menu-dropdown":"components_color_bullet_new_menu-dropdown_tyRPJ","menu-item":"components_color_bullet_new_menu-item_fPc3j","shortcut":"components_color_bullet_new_shortcut_qAY-Y","shortcut-key":"components_color_bullet_new_shortcut-key_sq-iu","user-icon":"components_color_bullet_new_user-icon_0LhmU","color-bullet":"components_color_bullet_new_color-bullet_b1w8U","mini":"components_color_bullet_new_mini_B261Z","is-not-library-color":"components_color_bullet_new_is-not-library-color_PSveA","color-bullet-wrapper":"components_color_bullet_new_color-bullet-wrapper_clt4r","is-gradient":"components_color_bullet_new_is-gradient_6RdV2","is-transparent":"components_color_bullet_new_is-transparent_g0iwn","color-text":"components_color_bullet_new_color-text_HM6mp","small-text":"components_color_bullet_new_small-text_Y4OeK","no-text":"components_color_bullet_new_no-text_pbTQf","spin-animation":"components_color_bullet_new_spin-animation_X38rj"}
{"button-primary":"components_color_bullet_new_button-primary_pDkQg","button-secondary":"components_color_bullet_new_button-secondary_y3A8V","button-tertiary":"components_color_bullet_new_button-tertiary_zPQ8t","button-radio":"components_color_bullet_new_button-radio_gpyOW","button-warning":"components_color_bullet_new_button-warning_OxPWp","button-disabled":"components_color_bullet_new_button-disabled_Zx4Ur","button-tag":"components_color_bullet_new_button-tag_2Ur4i","button-icon":"components_color_bullet_new_button-icon_uAC1e","button-icon-small":"components_color_bullet_new_button-icon-small_rz5pc","link":"components_color_bullet_new_link_S2meo","asset-element":"components_color_bullet_new_asset-element_s3Yqx","input-element":"components_color_bullet_new_input-element_jCoxE","new-scrollbar":"components_color_bullet_new_new-scrollbar_7U23G","menu-dropdown":"components_color_bullet_new_menu-dropdown_tyRPJ","menu-item":"components_color_bullet_new_menu-item_fPc3j","shortcut":"components_color_bullet_new_shortcut_qAY-Y","shortcut-key":"components_color_bullet_new_shortcut-key_sq-iu","user-icon":"components_color_bullet_new_user-icon_0LhmU","color-bullet":"components_color_bullet_new_color-bullet_b1w8U","mini":"components_color_bullet_new_mini_B261Z","is-not-library-color":"components_color_bullet_new_is-not-library-color_PSveA","color-bullet-wrapper":"components_color_bullet_new_color-bullet-wrapper_clt4r","is-gradient":"components_color_bullet_new_is-gradient_6RdV2","is-transparent":"components_color_bullet_new_is-transparent_g0iwn","color-text":"components_color_bullet_new_color-text_HM6mp","small-text":"components_color_bullet_new_small-text_Y4OeK","no-text":"components_color_bullet_new_no-text_pbTQf","spin-animation":"components_color_bullet_new_spin-animation_X38rj"}

View file

@ -1 +1 @@
{"button-primary":"components_context_menu_a11y_button-primary_FTrG6","button-secondary":"components_context_menu_a11y_button-secondary_tIeiM","button-tertiary":"components_context_menu_a11y_button-tertiary_0A2mW","button-warning":"components_context_menu_a11y_button-warning_7dlJY","button-disabled":"components_context_menu_a11y_button-disabled_WROtA","button-tag":"components_context_menu_a11y_button-tag_iLpM-","context-menu":"components_context_menu_a11y_context-menu_bS2vM","context-menu-items":"components_context_menu_a11y_context-menu-items_lQC7H","context-menu-item":"components_context_menu_a11y_context-menu-item_E2GpJ","selected":"components_context_menu_a11y_selected_on-en","selected-icon":"components_context_menu_a11y_selected-icon_H2S7W","button-icon":"components_context_menu_a11y_button-icon_eOLGl","button-icon-small":"components_context_menu_a11y_button-icon-small_bQvvB","context-menu-action":"components_context_menu_a11y_context-menu-action_E53yg","submenu-back":"components_context_menu_a11y_submenu-back_AboXg","submenu-icon-back":"components_context_menu_a11y_submenu-icon-back_gy-B6","submenu":"components_context_menu_a11y_submenu_MuyM8","submenu-icon":"components_context_menu_a11y_submenu-icon_tWTVU","link":"components_context_menu_a11y_link_86RaE","asset-element":"components_context_menu_a11y_asset-element_r3q1-","new-scrollbar":"components_context_menu_a11y_new-scrollbar_tgX6p","menu-dropdown":"components_context_menu_a11y_menu-dropdown_-wxYa","menu-item":"components_context_menu_a11y_menu-item_J-5tZ","shortcut":"components_context_menu_a11y_shortcut_xHDI7","shortcut-key":"components_context_menu_a11y_shortcut-key_kpESe","user-icon":"components_context_menu_a11y_user-icon_Z4800","is-open":"components_context_menu_a11y_is-open_FbqIp","fixed":"components_context_menu_a11y_fixed_iJxPr","separator":"components_context_menu_a11y_separator_DrZoB","min-width":"components_context_menu_a11y_min-width_w-ron","is-selected":"components_context_menu_a11y_is-selected_UPMXx","is-selectable":"components_context_menu_a11y_is-selectable_n7sdb","spin-animation":"components_context_menu_a11y_spin-animation_QUc-i"}
{"button-primary":"components_context_menu_a11y_button-primary_FTrG6","button-secondary":"components_context_menu_a11y_button-secondary_tIeiM","button-tertiary":"components_context_menu_a11y_button-tertiary_0A2mW","button-radio":"components_context_menu_a11y_button-radio_vymcq","button-warning":"components_context_menu_a11y_button-warning_7dlJY","button-disabled":"components_context_menu_a11y_button-disabled_WROtA","button-tag":"components_context_menu_a11y_button-tag_iLpM-","context-menu":"components_context_menu_a11y_context-menu_bS2vM","context-menu-items":"components_context_menu_a11y_context-menu-items_lQC7H","context-menu-item":"components_context_menu_a11y_context-menu-item_E2GpJ","selected":"components_context_menu_a11y_selected_on-en","selected-icon":"components_context_menu_a11y_selected-icon_H2S7W","button-icon":"components_context_menu_a11y_button-icon_eOLGl","button-icon-small":"components_context_menu_a11y_button-icon-small_bQvvB","context-menu-action":"components_context_menu_a11y_context-menu-action_E53yg","submenu-back":"components_context_menu_a11y_submenu-back_AboXg","submenu-icon-back":"components_context_menu_a11y_submenu-icon-back_gy-B6","submenu":"components_context_menu_a11y_submenu_MuyM8","submenu-icon":"components_context_menu_a11y_submenu-icon_tWTVU","link":"components_context_menu_a11y_link_86RaE","asset-element":"components_context_menu_a11y_asset-element_r3q1-","input-element":"components_context_menu_a11y_input-element_QQ1zU","new-scrollbar":"components_context_menu_a11y_new-scrollbar_tgX6p","menu-dropdown":"components_context_menu_a11y_menu-dropdown_-wxYa","menu-item":"components_context_menu_a11y_menu-item_J-5tZ","shortcut":"components_context_menu_a11y_shortcut_xHDI7","shortcut-key":"components_context_menu_a11y_shortcut-key_kpESe","user-icon":"components_context_menu_a11y_user-icon_Z4800","is-open":"components_context_menu_a11y_is-open_FbqIp","fixed":"components_context_menu_a11y_fixed_iJxPr","separator":"components_context_menu_a11y_separator_DrZoB","min-width":"components_context_menu_a11y_min-width_w-ron","is-selected":"components_context_menu_a11y_is-selected_UPMXx","is-selectable":"components_context_menu_a11y_is-selectable_n7sdb","spin-animation":"components_context_menu_a11y_spin-animation_QUc-i"}

View file

@ -1 +1 @@
{"button-primary":"components_editable_label_button-primary_fp-ma","button-secondary":"components_editable_label_button-secondary_QPaT-","button-tertiary":"components_editable_label_button-tertiary_wOORv","button-warning":"components_editable_label_button-warning_4iYB7","button-disabled":"components_editable_label_button-disabled_oVR0N","button-tag":"components_editable_label_button-tag_pwEqY","button-icon":"components_editable_label_button-icon_acX7H","button-icon-small":"components_editable_label_button-icon-small_tSz5O","link":"components_editable_label_link_pHsNR","asset-element":"components_editable_label_asset-element_Bs5bh","new-scrollbar":"components_editable_label_new-scrollbar_wEEzl","menu-dropdown":"components_editable_label_menu-dropdown_3EWKG","menu-item":"components_editable_label_menu-item_lLMBv","shortcut":"components_editable_label_shortcut_sumJi","shortcut-key":"components_editable_label_shortcut-key_ZxlB1","user-icon":"components_editable_label_user-icon_bNZJf","editable-label-input":"components_editable_label_editable-label-input_q2Puk","spin-animation":"components_editable_label_spin-animation_ziMDb"}
{"button-primary":"components_editable_label_button-primary_fp-ma","button-secondary":"components_editable_label_button-secondary_QPaT-","button-tertiary":"components_editable_label_button-tertiary_wOORv","button-radio":"components_editable_label_button-radio_nKlBJ","button-warning":"components_editable_label_button-warning_4iYB7","button-disabled":"components_editable_label_button-disabled_oVR0N","button-tag":"components_editable_label_button-tag_pwEqY","button-icon":"components_editable_label_button-icon_acX7H","button-icon-small":"components_editable_label_button-icon-small_tSz5O","link":"components_editable_label_link_pHsNR","asset-element":"components_editable_label_asset-element_Bs5bh","input-element":"components_editable_label_input-element_VRvJr","new-scrollbar":"components_editable_label_new-scrollbar_wEEzl","menu-dropdown":"components_editable_label_menu-dropdown_3EWKG","menu-item":"components_editable_label_menu-item_lLMBv","shortcut":"components_editable_label_shortcut_sumJi","shortcut-key":"components_editable_label_shortcut-key_ZxlB1","user-icon":"components_editable_label_user-icon_bNZJf","editable-label-input":"components_editable_label_editable-label-input_q2Puk","spin-animation":"components_editable_label_spin-animation_ziMDb"}

View file

@ -8,7 +8,6 @@
(:require-macros [app.main.style :as stl])
(:require
[app.common.data :as d]
[app.common.math :as math]
[app.main.ui.formats :as fmt]
[app.util.dom :as dom]
[rumext.v2 :as mf]))
@ -21,55 +20,80 @@
[props]
(let [context (mf/use-ctx context)
icon (unchecked-get props "icon")
id (unchecked-get props "id")
value (unchecked-get props "value")
icon (unchecked-get props "icon")
id (unchecked-get props "id")
value (unchecked-get props "value")
disabled (unchecked-get props "disabled")
title (unchecked-get props "title")
unique-key (unchecked-get props "unique-key")
icon-class (unchecked-get props "icon-class")
on-change (unchecked-get context "on-change")
selected (unchecked-get context "selected")
name (unchecked-get context "name")
on-change (unchecked-get context "on-change")
selected (unchecked-get context "selected")
name (unchecked-get context "name")
encode-fn (unchecked-get context "encode-fn")
encode-fn (unchecked-get context "encode-fn")
checked? (= selected value)]
checked? (= selected value)]
[:label {:for id
:title title
:key unique-key
:tabIndex "0"
:class (stl/css-case
:radio-icon true
:checked checked?)}
:checked checked?
:disabled disabled)}
(when (some? icon) icon)
(if (some? icon)
[:span {:class (when icon-class icon-class)}
icon]
[:span {:class (stl/css :title-name)}
(encode-fn value)])
[:input {:id id
:on-change on-change
:type "radio"
:name name
:disabled disabled
:value (encode-fn value)
:checked checked?}]]))
(mf/defc nilable-option
{::mf/wrap-props false}
[props]
(let [context (mf/use-ctx context)
icon (unchecked-get props "icon")
id (unchecked-get props "id")
value (unchecked-get props "value")
(let [context (mf/use-ctx context)
icon (unchecked-get props "icon")
id (unchecked-get props "id")
value (unchecked-get props "value")
disabled (unchecked-get props "disabled")
unique-key (unchecked-get props "unique-key")
icon-class (unchecked-get props "icon-class")
on-change (unchecked-get context "on-change")
selected (unchecked-get context "selected")
name (unchecked-get context "name")
on-change (unchecked-get context "on-change")
selected (unchecked-get context "selected")
name (unchecked-get context "name")
encode-fn (unchecked-get context "encode-fn")
checked? (= selected value)]
encode-fn (unchecked-get context "encode-fn")
checked? (= selected value)]
[:label {:for id
:key unique-key
:class (stl/css-case
:radio-icon true
:disabled disabled
:checked checked?)}
icon
(if (some? icon)
[:span {:class (when icon-class icon-class)}
icon]
[:span {:class (stl/css :title-name)}
(encode-fn value)])
[:input {:id id
:on-change on-change
:type "checkbox"
:name name
:disabled disabled
:value (encode-fn value)
:checked checked?}]]))
@ -80,6 +104,8 @@
on-change (unchecked-get props "on-change")
selected (unchecked-get props "selected")
name (unchecked-get props "name")
class (unchecked-get props "class")
wide (unchecked-get props "wide")
encode-fn (d/nilv (unchecked-get props "encode-fn") identity)
decode-fn (d/nilv (unchecked-get props "encode-fn") identity)
@ -89,9 +115,11 @@
1)
width (mf/with-memo [nitems]
(fmt/format-pixels
(+ (math/pow 2 nitems)
(* 28 nitems))))
(if (= wide true)
"unset"
(fmt/format-pixels
(+ (* 4 (- nitems 1))
(* 28 nitems)))))
on-change'
(mf/use-fn
@ -110,6 +138,7 @@
:decode-fn decode-fn})]
[:& (mf/provider context) {:value context-value}
[:div {:class (stl/css :radio-btn-wrapper)
:style {:width width}}
[:div {:class (stl/css-case :radio-btn-wrapper true
class true)
:style {:width width}}
children]]))

View file

@ -1 +1 @@
{"button-primary":"components_radio_buttons_button-primary_-XZNO","button-secondary":"components_radio_buttons_button-secondary_yj3Oe","button-tertiary":"components_radio_buttons_button-tertiary_s2RvI","radio-icon":"components_radio_buttons_radio-icon_1OnG1","button-warning":"components_radio_buttons_button-warning_lkAzy","button-disabled":"components_radio_buttons_button-disabled_C-rUC","button-tag":"components_radio_buttons_button-tag_4VTp-","button-icon":"components_radio_buttons_button-icon_jP0XC","button-icon-small":"components_radio_buttons_button-icon-small_3AO-R","link":"components_radio_buttons_link_cdc3r","asset-element":"components_radio_buttons_asset-element_l2wMX","new-scrollbar":"components_radio_buttons_new-scrollbar_m-Mwb","menu-dropdown":"components_radio_buttons_menu-dropdown_Qn0oF","menu-item":"components_radio_buttons_menu-item_SWV2N","shortcut":"components_radio_buttons_shortcut_25Uf9","shortcut-key":"components_radio_buttons_shortcut-key_S2Y64","user-icon":"components_radio_buttons_user-icon_Ab9su","radio-btn-wrapper":"components_radio_buttons_radio-btn-wrapper_mH6QX","checked":"components_radio_buttons_checked_sjVzy","spin-animation":"components_radio_buttons_spin-animation_iz1sC"}
{"button-primary":"components_radio_buttons_button-primary_-XZNO","button-secondary":"components_radio_buttons_button-secondary_yj3Oe","button-tertiary":"components_radio_buttons_button-tertiary_s2RvI","button-radio":"components_radio_buttons_button-radio_AfWrP","radio-icon":"components_radio_buttons_radio-icon_1OnG1","button-warning":"components_radio_buttons_button-warning_lkAzy","button-disabled":"components_radio_buttons_button-disabled_C-rUC","button-tag":"components_radio_buttons_button-tag_4VTp-","button-icon":"components_radio_buttons_button-icon_jP0XC","button-icon-small":"components_radio_buttons_button-icon-small_3AO-R","link":"components_radio_buttons_link_cdc3r","asset-element":"components_radio_buttons_asset-element_l2wMX","input-element":"components_radio_buttons_input-element_iC9Tc","new-scrollbar":"components_radio_buttons_new-scrollbar_m-Mwb","menu-dropdown":"components_radio_buttons_menu-dropdown_Qn0oF","menu-item":"components_radio_buttons_menu-item_SWV2N","shortcut":"components_radio_buttons_shortcut_25Uf9","shortcut-key":"components_radio_buttons_shortcut-key_S2Y64","user-icon":"components_radio_buttons_user-icon_Ab9su","radio-btn-wrapper":"components_radio_buttons_radio-btn-wrapper_mH6QX","title-name":"components_radio_buttons_title-name_UZBUe","checked":"components_radio_buttons_checked_sjVzy","disabled":"components_radio_buttons_disabled_V4CO5","spin-animation":"components_radio_buttons_spin-animation_iz1sC"}

View file

@ -10,12 +10,12 @@
@include flexCenter;
border-radius: $br-8;
height: $s-32;
background-color: var(--radio-btns-background-color);
background-color: var(--input-background-color);
}
.radio-icon {
@extend .button-tertiary;
@extend .button-radio;
height: $s-28;
width: 100%;
flex-grow: 1;
border-radius: $s-6;
border: solid $s-2 transparent;
box-sizing: content-box;
@ -26,17 +26,38 @@
@extend .button-icon;
stroke: var(--radio-btn-foreground-color);
}
&:hover {
border: solid $s-2 var(--radio-btns-background-color);
.title-name {
@include tabTitleTipography;
color: var(--radio-btn-foreground-color);
}
&.checked {
background-color: var(--radio-btn-background-color-selected);
border: $s-2 solid var(--radio-btn-border-color-selected);
svg {
stroke: var(--radio-btn-foreground-color-selected);
}
.title-name {
color: var(--radio-btn-foreground-color-selected);
}
}
&.disabled {
cursor: default;
svg {
stroke: var(--button-foreground-color-disabled);
}
.title-name {
color: var(--button-foreground-color-disabled);
}
&:hover {
border: $s-2 solid var(--radio-btn-border-color-selected);
border: none;
background-color: transparent;
svg {
stroke: var(--button-foreground-color-disabled);
}
.title-name {
color: var(--button-foreground-color-disabled);
}
}
}
}

View file

@ -1 +1 @@
{"button-primary":"components_search_bar_button-primary_-9D1J","button-secondary":"components_search_bar_button-secondary_GbDgI","button-tertiary":"components_search_bar_button-tertiary_VTCfX","button-warning":"components_search_bar_button-warning_A-XnD","button-disabled":"components_search_bar_button-disabled_Y9B7M","button-tag":"components_search_bar_button-tag_dKink","search-box":"components_search_bar_search-box_AFEzz","search-input-wrapper":"components_search_bar_search-input-wrapper_Djsml","clear":"components_search_bar_clear_B6lfz","button-icon":"components_search_bar_button-icon_CdwNa","button-icon-small":"components_search_bar_button-icon-small_gSOsT","link":"components_search_bar_link_VjGo-","asset-element":"components_search_bar_asset-element_rH-5k","new-scrollbar":"components_search_bar_new-scrollbar_rN-Bt","menu-dropdown":"components_search_bar_menu-dropdown_BDHD4","menu-item":"components_search_bar_menu-item_7wbp0","shortcut":"components_search_bar_shortcut_sPxgB","shortcut-key":"components_search_bar_shortcut-key_fp81A","user-icon":"components_search_bar_user-icon_QZlpB","has-children":"components_search_bar_has-children_u-VSq","spin-animation":"components_search_bar_spin-animation_Uxq5m"}
{"button-primary":"components_search_bar_button-primary_-9D1J","button-secondary":"components_search_bar_button-secondary_GbDgI","button-tertiary":"components_search_bar_button-tertiary_VTCfX","button-radio":"components_search_bar_button-radio_vMkry","button-warning":"components_search_bar_button-warning_A-XnD","button-disabled":"components_search_bar_button-disabled_Y9B7M","button-tag":"components_search_bar_button-tag_dKink","search-box":"components_search_bar_search-box_AFEzz","search-input-wrapper":"components_search_bar_search-input-wrapper_Djsml","clear":"components_search_bar_clear_B6lfz","button-icon":"components_search_bar_button-icon_CdwNa","button-icon-small":"components_search_bar_button-icon-small_gSOsT","link":"components_search_bar_link_VjGo-","asset-element":"components_search_bar_asset-element_rH-5k","input-element":"components_search_bar_input-element_9SCvY","new-scrollbar":"components_search_bar_new-scrollbar_rN-Bt","menu-dropdown":"components_search_bar_menu-dropdown_BDHD4","menu-item":"components_search_bar_menu-item_7wbp0","shortcut":"components_search_bar_shortcut_sPxgB","shortcut-key":"components_search_bar_shortcut-key_fp81A","user-icon":"components_search_bar_user-icon_QZlpB","has-children":"components_search_bar_has-children_u-VSq","spin-animation":"components_search_bar_spin-animation_Uxq5m"}

View file

@ -56,6 +56,7 @@
svg {
@extend .button-icon-small;
color: transparent;
stroke: var(--icon-foreground);
}
}
}

View file

@ -107,8 +107,6 @@
[:span {:class (css :label)} label]
[:span {:class (css :check-icon)} i/tick-refactor]])))]]]
[:div.custom-select {:on-click open-dropdown :class class}
[:span current-label]
[:span.dropdown-button i/arrow-down]

View file

@ -1 +1 @@
{"button-primary":"components_select_button-primary_peYzv","button-secondary":"components_select_button-secondary_Kse6w","button-tertiary":"components_select_button-tertiary_srwoV","button-warning":"components_select_button-warning_i4KNg","button-disabled":"components_select_button-disabled_1r9-1","button-tag":"components_select_button-tag_AJXtX","button-icon":"components_select_button-icon_86LWm","custom-select":"components_select_custom-select_OM8-6","dropdown-button":"components_select_dropdown-button_IcpuR","button-icon-small":"components_select_button-icon-small_H0Bue","checked-element":"components_select_checked-element_c5-i4","check-icon":"components_select_check-icon_9x082","link":"components_select_link_tQfh4","asset-element":"components_select_asset-element_5vxj7","new-scrollbar":"components_select_new-scrollbar_-E7lz","menu-dropdown":"components_select_menu-dropdown_kxQ7x","menu-item":"components_select_menu-item_ZCcV2","shortcut":"components_select_shortcut_RvVt6","shortcut-key":"components_select_shortcut-key_CLR8L","user-icon":"components_select_user-icon_tLWU4","current-label":"components_select_current-label_CUaQs","custom-select-dropdown":"components_select_custom-select-dropdown_2yZj9","label":"components_select_label_kTY8t","is-selected":"components_select_is-selected_nTUGr","spin-animation":"components_select_spin-animation_YEDae"}
{"button-primary":"components_select_button-primary_peYzv","button-secondary":"components_select_button-secondary_Kse6w","button-tertiary":"components_select_button-tertiary_srwoV","button-radio":"components_select_button-radio_xDb5D","button-warning":"components_select_button-warning_i4KNg","button-disabled":"components_select_button-disabled_1r9-1","button-tag":"components_select_button-tag_AJXtX","button-icon":"components_select_button-icon_86LWm","custom-select":"components_select_custom-select_OM8-6","dropdown-button":"components_select_dropdown-button_IcpuR","button-icon-small":"components_select_button-icon-small_H0Bue","checked-element":"components_select_checked-element_c5-i4","check-icon":"components_select_check-icon_9x082","link":"components_select_link_tQfh4","asset-element":"components_select_asset-element_5vxj7","input-element":"components_select_input-element_-7lw0","new-scrollbar":"components_select_new-scrollbar_-E7lz","menu-dropdown":"components_select_menu-dropdown_kxQ7x","menu-item":"components_select_menu-item_ZCcV2","shortcut":"components_select_shortcut_RvVt6","shortcut-key":"components_select_shortcut-key_CLR8L","user-icon":"components_select_user-icon_tLWU4","current-label":"components_select_current-label_CUaQs","custom-select-dropdown":"components_select_custom-select-dropdown_2yZj9","label":"components_select_label_kTY8t","is-selected":"components_select_is-selected_nTUGr","spin-animation":"components_select_spin-animation_YEDae"}

View file

@ -22,6 +22,7 @@
svg {
@extend .button-icon;
transform: rotate(90deg);
stroke: var(--icon-foreground);
}
}
.custom-select-dropdown {
@ -42,7 +43,7 @@
display: flex;
align-items: center;
height: $s-32;
padding: $s-8;
padding: 0 $s-8;
border-radius: $br-6;
color: var(--menu-foreground-color);
.label {
@ -55,6 +56,7 @@
svg {
@extend .button-icon-small;
visibility: hidden;
stroke: var(--icon-foreground);
}
}

View file

@ -36,6 +36,7 @@
collapsable? (unchecked-get props "collapsable?")
handle-collapse (unchecked-get props "handle-collapse")
klass (unchecked-get props "klass")
content-class (unchecked-get props "content-class")
state (mf/use-state #(or selected (-> children first .-props .-id)))
selected (or selected @state)
@ -69,5 +70,6 @@
:class (dom/classnames (css :tab-container-tab-title) true
(css :current) (= selected id))}
title]))]]
[:div {:class (dom/classnames (css :tab-container-content) true)}
[:div {:class (dom/classnames (css :tab-container-content) true
content-class (some? content-class))}
(d/seek #(= selected (-> % .-props .-id)) children)]]))

View file

@ -1 +1 @@
{"button-primary":"components_tab_container_button-primary_ibiAz","button-secondary":"components_tab_container_button-secondary_wZR80","button-tertiary":"components_tab_container_button-tertiary_JHJAx","button-warning":"components_tab_container_button-warning_SFGWo","button-disabled":"components_tab_container_button-disabled_FZXHD","button-tag":"components_tab_container_button-tag_NnL8y","button-icon":"components_tab_container_button-icon_2NhVr","button-icon-small":"components_tab_container_button-icon-small_yU7na","link":"components_tab_container_link_KmrN7","asset-element":"components_tab_container_asset-element_1-YWa","new-scrollbar":"components_tab_container_new-scrollbar_L-puJ","menu-dropdown":"components_tab_container_menu-dropdown_hkr9S","menu-item":"components_tab_container_menu-item_jbhvD","shortcut":"components_tab_container_shortcut_PBP6z","shortcut-key":"components_tab_container_shortcut-key_eFC8J","user-icon":"components_tab_container_user-icon_pY-wv","tab-container":"components_tab_container_tab-container_P6HRr","tab-container-content":"components_tab_container_tab-container-content_yfM9F","tab-element":"components_tab_container_tab-element_gBIwV","tab-container-tabs":"components_tab_container_tab-container-tabs_6gXOY","tab-container-tab-wrapper":"components_tab_container_tab-container-tab-wrapper_-ngrN","tab-container-tab-title":"components_tab_container_tab-container-tab-title_IN1Dx","current":"components_tab_container_current_jrovp","collapse-sidebar":"components_tab_container_collapse-sidebar_e5hFv","collapsed":"components_tab_container_collapsed_lfkjK","spin-animation":"components_tab_container_spin-animation_mPm0p"}
{"button-primary":"components_tab_container_button-primary_ibiAz","button-secondary":"components_tab_container_button-secondary_wZR80","button-tertiary":"components_tab_container_button-tertiary_JHJAx","button-radio":"components_tab_container_button-radio_oNen8","button-warning":"components_tab_container_button-warning_SFGWo","button-disabled":"components_tab_container_button-disabled_FZXHD","button-tag":"components_tab_container_button-tag_NnL8y","button-icon":"components_tab_container_button-icon_2NhVr","button-icon-small":"components_tab_container_button-icon-small_yU7na","link":"components_tab_container_link_KmrN7","asset-element":"components_tab_container_asset-element_1-YWa","input-element":"components_tab_container_input-element_m8IEj","new-scrollbar":"components_tab_container_new-scrollbar_L-puJ","menu-dropdown":"components_tab_container_menu-dropdown_hkr9S","menu-item":"components_tab_container_menu-item_jbhvD","shortcut":"components_tab_container_shortcut_PBP6z","shortcut-key":"components_tab_container_shortcut-key_eFC8J","user-icon":"components_tab_container_user-icon_pY-wv","tab-container":"components_tab_container_tab-container_P6HRr","tab-container-content":"components_tab_container_tab-container-content_yfM9F","tab-element":"components_tab_container_tab-element_gBIwV","tab-container-tabs":"components_tab_container_tab-container-tabs_6gXOY","tab-container-tab-wrapper":"components_tab_container_tab-container-tab-wrapper_-ngrN","tab-container-tab-title":"components_tab_container_tab-container-tab-title_IN1Dx","current":"components_tab_container_current_jrovp","collapse-sidebar":"components_tab_container_collapse-sidebar_e5hFv","collapsed":"components_tab_container_collapsed_lfkjK","spin-animation":"components_tab_container_spin-animation_mPm0p"}

View file

@ -17,7 +17,7 @@
}
.tab-element {
height: 100%;
height: fit-content;
}
}
.tab-container-tabs {

View file

@ -13,14 +13,14 @@
(mf/defc title-bar
{::mf/wrap-props false}
[{:keys [collapsable? collapsed? on-collapsed title children on-btn-click btn-children klass]}]
(let [klass (dm/str (stl/css :title-bar) " " klass)]
[{:keys [collapsable? collapsed? on-collapsed title children on-btn-click btn-children class]}]
(let [klass (dm/str (stl/css :title-bar) " " class)]
[:div {:class klass}
(if collapsable?
[:button {:class (stl/css :toggle-btn) :on-click on-collapsed}
[:span {:class (stl/css-case
:collased-icon true
:rotated collapsed?)}
:rotated collapsed?)}
i/arrow-refactor]
[:div {:class (stl/css :title)} title]]
[:div {:class (stl/css :title-only)} title])

View file

@ -1 +1 @@
{"button-primary":"components_title_bar_button-primary_svLtU","button-secondary":"components_title_bar_button-secondary_JA5NP","button-tertiary":"components_title_bar_button-tertiary_yqQfO","title-bar":"components_title_bar_title-bar_oUkS0","title-button":"components_title_bar_title-button_xTE-7","button-warning":"components_title_bar_button-warning_XpojP","button-disabled":"components_title_bar_button-disabled_X72-5","button-tag":"components_title_bar_button-tag_o9yFT","button-icon":"components_title_bar_button-icon_ROHrz","button-icon-small":"components_title_bar_button-icon-small_WibJp","toggle-btn":"components_title_bar_toggle-btn_9ekUv","collased-icon":"components_title_bar_collased-icon_SJ1ls","link":"components_title_bar_link_m-lOt","asset-element":"components_title_bar_asset-element_64u6f","new-scrollbar":"components_title_bar_new-scrollbar_dkyAb","menu-dropdown":"components_title_bar_menu-dropdown_uk31D","menu-item":"components_title_bar_menu-item_cGiAC","shortcut":"components_title_bar_shortcut_M9Wv0","shortcut-key":"components_title_bar_shortcut-key_w8Q95","user-icon":"components_title_bar_user-icon_FMwxz","title":"components_title_bar_title_qPuju","title-only":"components_title_bar_title-only_aSsdC","rotated":"components_title_bar_rotated_9z7Rn","spin-animation":"components_title_bar_spin-animation_7EFXa"}
{"button-primary":"components_title_bar_button-primary_svLtU","button-secondary":"components_title_bar_button-secondary_JA5NP","button-tertiary":"components_title_bar_button-tertiary_yqQfO","title-bar":"components_title_bar_title-bar_oUkS0","title-button":"components_title_bar_title-button_xTE-7","button-radio":"components_title_bar_button-radio_vhlSa","button-warning":"components_title_bar_button-warning_XpojP","button-disabled":"components_title_bar_button-disabled_X72-5","button-tag":"components_title_bar_button-tag_o9yFT","button-icon":"components_title_bar_button-icon_ROHrz","button-icon-small":"components_title_bar_button-icon-small_WibJp","toggle-btn":"components_title_bar_toggle-btn_9ekUv","collased-icon":"components_title_bar_collased-icon_SJ1ls","link":"components_title_bar_link_m-lOt","asset-element":"components_title_bar_asset-element_64u6f","input-element":"components_title_bar_input-element_Q0DAR","new-scrollbar":"components_title_bar_new-scrollbar_dkyAb","menu-dropdown":"components_title_bar_menu-dropdown_uk31D","menu-item":"components_title_bar_menu-item_cGiAC","shortcut":"components_title_bar_shortcut_M9Wv0","shortcut-key":"components_title_bar_shortcut-key_w8Q95","user-icon":"components_title_bar_user-icon_FMwxz","title":"components_title_bar_title_qPuju","title-only":"components_title_bar_title-only_aSsdC","rotated":"components_title_bar_rotated_9z7Rn","spin-animation":"components_title_bar_spin-animation_7EFXa"}

View file

@ -23,11 +23,11 @@
flex-grow: 1;
height: 100%;
min-height: $s-32;
margin-right: $s-8;
margin-left: $s-8;
color: var(--title-foreground-color);
}
.title-only {
// margin-left: $s-8;
margin-left: $s-8;
}
.toggle-btn {
@ -42,10 +42,11 @@
@include flexCenter;
height: $s-24;
border-radius: $br-8;
padding-left: $s-8;
svg {
@extend .button-icon-small;
transform: rotate(90deg);
stroke: var(--icon-foreground);
}
&.rotated svg {
transform: rotate(0deg);
@ -72,6 +73,7 @@
border-radius: $br-8;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
}

View file

@ -5,7 +5,7 @@
;; Copyright (c) KALEIDOS INC
(ns app.main.ui.debug.components-preview
(:require-macros [app.main.style :refer [css styles]])
(:require-macros [app.main.style :as stl])
(:require [app.common.data :as d]
[app.main.data.users :as du]
[app.main.refs :as refs]
@ -23,8 +23,8 @@
[props]
(let [children (unchecked-get props "children")
title (unchecked-get props "title")]
[:div {:class (dom/classnames (css :component) true)}
[:h4 {:class (dom/classnames (css :component-name) true)} title]
[:div {:class (stl/css :component)}
[:h4 {:class (stl/css :component-name)} title]
children]))
(mf/defc components-preview
@ -77,7 +77,7 @@
on-btn-click (mf/use-fn #(prn "eyy"))]
[:section.debug-components-preview
[:div {:class (dom/classnames (css :themes-row) true)}
[:div {:class (stl/css :themes-row)}
[:h2 "Themes"]
[:select {:label "Select theme color"
:name :theme
@ -86,17 +86,18 @@
:on-change on-change}
[:option {:label "Penpot Dark (default)" :value "default"}]
[:option {:label "Penpot Light" :value "light"}]]
[:div {:class (dom/classnames (css :wrapper) true)}
(let [css (styles)]
[:div {:class (stl/css :wrapper)}
(let [css (stl/styles)]
(for [color colors]
[:div {:key color
:class (dom/classnames (get css color) true
(get css :rect) true)}
(d/name color)]))]]
[:div {:class (dom/classnames (css :components-row) true)}
[:h2 {:class (dom/classnames (css :title) true)} "Components"]
[:div {:class (dom/classnames (css :components-wrapper) true)}
[:div {:class (dom/classnames (css :component-group) true)}
[:div {:class (stl/css :components-row)}
[:h2 {:class(stl/css :title)} "Components"]
[:div {:class (stl/css :components-wrapper)}
[:div {:class (stl/css :components-group)}
[:h3 "Titles"]
[:& component-wrapper
{:title "Title"}
@ -129,7 +130,7 @@
[:& tab-element {:id :second
:title "B tab"}]]]]]
[:div {:class (dom/classnames (css :component-group) true)}
[:div {:class (stl/css :components-group)}
[:h3 "Tabs component"]
[:& component-wrapper
{:title "2 tab component"}
@ -154,7 +155,7 @@
:title "Third tab"}
[:div "This is third tab content"]]]]]
[:div {:class (dom/classnames (css :component-group) true)}
[:div {:class (stl/css :components-group)}
[:h3 "Search bar"]
[:& component-wrapper
{:title "Search bar only"}
@ -166,21 +167,21 @@
[:& search-bar {:on-change update-search
:value input-value
:placeholder "Test value"}
[:button {:class (dom/classnames (css :test-button) true)
[:button {:class (stl/css :test-button)
:on-click on-btn-click}
"X"]]]]
[:div {:class (dom/classnames (css :component-group) true)}
[:div {:class (stl/css :components-group)}
[:h3 "Radio buttons"]
[:& component-wrapper
{:title "Two radio buttons (toggle)"}
[:& radio-buttons {:selected radio-selected
:on-change set-radio-selected
:name "listing-style"}
[:& radio-button {:icon (mf/html i/view-as-list-refactor)
[:& radio-button {:icon i/view-as-list-refactor
:value "first"
:id :list}]
[:& radio-button {:icon (mf/html i/flex-grid-refactor)
[:& radio-button {:icon i/flex-grid-refactor
:value "second"
:id :grid}]]]
[:& component-wrapper
@ -188,14 +189,14 @@
[:& radio-buttons {:selected radio-selected
:on-change set-radio-selected
:name "listing-style"}
[:& radio-button {:icon (mf/html i/view-as-list-refactor)
[:& radio-button {:icon i/view-as-list-refactor
:value "first"
:id :first}]
[:& radio-button {:icon (mf/html i/flex-grid-refactor)
[:& radio-button {:icon i/flex-grid-refactor
:value "second"
:id :second}]
[:& radio-button {:icon (mf/html i/add-refactor)
[:& radio-button {:icon i/add-refactor
:value "third"
:id :third}]]]
@ -204,17 +205,45 @@
[:& radio-buttons {:selected radio-selected
:on-change set-radio-selected
:name "listing-style"}
[:& radio-button {:icon (mf/html i/view-as-list-refactor)
[:& radio-button {:icon i/view-as-list-refactor
:value "first"
:id :first}]
[:& radio-button {:icon (mf/html i/flex-grid-refactor)
[:& radio-button {:icon i/flex-grid-refactor
:value "second"
:id :second}]
[:& radio-button {:icon (mf/html i/add-refactor)
[:& radio-button {:icon i/add-refactor
:value "third"
:id :third}]
[:& radio-button {:icon (mf/html i/board-refactor)
[:& radio-button {:icon i/board-refactor
:value "forth"
:id :forth}]]]]]]]))
:id :forth}]]]]
[:div {:class (stl/css :components-group)}
[:h3 "Buttons"]
[:& component-wrapper
{:title "Button primary"}
[:button {:class (stl/css :button-primary)}
"Primary"]]
[:& component-wrapper
{:title "Button primary with icon"}
[:button {:class (stl/css :button-primary)}
i/add-refactor]]
[:& component-wrapper
{:title "Button secondary"}
[:button {:class (stl/css :button-secondary)}
"secondary"]]
[:& component-wrapper
{:title "Button secondary with icon"}
[:button {:class (stl/css :button-secondary)}
i/add-refactor]]
[:& component-wrapper
{:title "Button tertiary"}
[:button {:class (stl/css :button-tertiary)}
"tertiary"]]
[:& component-wrapper
{:title "Button tertiary with icon"}
[:button {:class (stl/css :button-tertiary)}
i/add-refactor]]]]]]))

View file

@ -1 +1 @@
{"button-primary":"debug_components_preview_button-primary_Q2m40","button-secondary":"debug_components_preview_button-secondary_yPp3n","button-tertiary":"debug_components_preview_button-tertiary_FIKgJ","button-warning":"debug_components_preview_button-warning_Ux7Aq","button-disabled":"debug_components_preview_button-disabled_QAKPy","button-tag":"debug_components_preview_button-tag_NNepE","button-icon":"debug_components_preview_button-icon_J36A6","button-icon-small":"debug_components_preview_button-icon-small_Pf3jb","link":"debug_components_preview_link_uSQr6","asset-element":"debug_components_preview_asset-element_LhcNS","new-scrollbar":"debug_components_preview_new-scrollbar_KrmL7","menu-dropdown":"debug_components_preview_menu-dropdown_1-d0F","menu-item":"debug_components_preview_menu-item_xb46E","shortcut":"debug_components_preview_shortcut_RsfIk","shortcut-key":"debug_components_preview_shortcut-key_5y-OI","user-icon":"debug_components_preview_user-icon_JBBfp","themes-row":"debug_components_preview_themes-row_wEU8d","wrapper":"debug_components_preview_wrapper_535-4","rect":"debug_components_preview_rect_jomnq","bg-primary":"debug_components_preview_bg-primary_Rt4oW","bg-secondary":"debug_components_preview_bg-secondary_rcmll","bg-tertiary":"debug_components_preview_bg-tertiary_7rITE","bg-cuaternary":"debug_components_preview_bg-cuaternary_UEBPN","fg-primary":"debug_components_preview_fg-primary_naliT","fg-secondary":"debug_components_preview_fg-secondary_zT9IX","acc":"debug_components_preview_acc_h3Bia","acc-muted":"debug_components_preview_acc-muted_uingh","acc-secondary":"debug_components_preview_acc-secondary_oHH6y","acc-tertiary":"debug_components_preview_acc-tertiary_SwBjy","components-row":"debug_components_preview_components-row_N3f-J","title":"debug_components_preview_title_TVtzz","components-wrapper":"debug_components_preview_components-wrapper_A8IgV","component-group":"debug_components_preview_component-group_dI55k","component":"debug_components_preview_component_xBMSU","component-name":"debug_components_preview_component-name_3ZJMW","spin-animation":"debug_components_preview_spin-animation_WfTTo"}
{"button-primary":"debug_components_preview_button-primary_Q2m40","components-row":"debug_components_preview_components-row_N3f-J","components-wrapper":"debug_components_preview_components-wrapper_A8IgV","button-secondary":"debug_components_preview_button-secondary_yPp3n","button-tertiary":"debug_components_preview_button-tertiary_FIKgJ","button-radio":"debug_components_preview_button-radio_vSuyW","button-warning":"debug_components_preview_button-warning_Ux7Aq","button-disabled":"debug_components_preview_button-disabled_QAKPy","button-tag":"debug_components_preview_button-tag_NNepE","button-icon":"debug_components_preview_button-icon_J36A6","button-icon-small":"debug_components_preview_button-icon-small_Pf3jb","link":"debug_components_preview_link_uSQr6","asset-element":"debug_components_preview_asset-element_LhcNS","input-element":"debug_components_preview_input-element_gKGKr","new-scrollbar":"debug_components_preview_new-scrollbar_KrmL7","menu-dropdown":"debug_components_preview_menu-dropdown_1-d0F","menu-item":"debug_components_preview_menu-item_xb46E","shortcut":"debug_components_preview_shortcut_RsfIk","shortcut-key":"debug_components_preview_shortcut-key_5y-OI","user-icon":"debug_components_preview_user-icon_JBBfp","themes-row":"debug_components_preview_themes-row_wEU8d","wrapper":"debug_components_preview_wrapper_535-4","rect":"debug_components_preview_rect_jomnq","bg-primary":"debug_components_preview_bg-primary_Rt4oW","bg-secondary":"debug_components_preview_bg-secondary_rcmll","bg-tertiary":"debug_components_preview_bg-tertiary_7rITE","bg-cuaternary":"debug_components_preview_bg-cuaternary_UEBPN","fg-primary":"debug_components_preview_fg-primary_naliT","fg-secondary":"debug_components_preview_fg-secondary_zT9IX","acc":"debug_components_preview_acc_h3Bia","acc-muted":"debug_components_preview_acc-muted_uingh","acc-secondary":"debug_components_preview_acc-secondary_oHH6y","acc-tertiary":"debug_components_preview_acc-tertiary_SwBjy","title":"debug_components_preview_title_TVtzz","component-group":"debug_components_preview_component-group_dI55k","component":"debug_components_preview_component_xBMSU","component-name":"debug_components_preview_component-name_3ZJMW","spin-animation":"debug_components_preview_spin-animation_WfTTo"}

View file

@ -83,6 +83,7 @@
padding: $s-20;
display: flex;
flex-wrap: wrap;
gap: $s-20;
.component-group {
@include flexCenter;
justify-content: flex-start;
@ -107,5 +108,26 @@
}
}
}
.button-primary {
@extend .button-primary;
height: $s-32;
svg {
@extend .button-icon;
}
}
.button-secondary {
@extend .button-secondary;
height: $s-32;
svg {
@extend .button-icon;
}
}
.button-tertiary {
@extend .button-tertiary;
height: $s-32;
svg {
@extend .button-icon;
}
}
}
}

View file

@ -1 +1 @@
{"button-primary":"ui_export_button-primary_dgIrA","button-secondary":"ui_export_button-secondary_5H2Cl","button-tertiary":"ui_export_button-tertiary_8kym9","export-progress-modal-overlay":"ui_export_export-progress-modal-overlay_AAFul","export-progress-modal-container":"ui_export_export-progress-modal-container_1pPaw","export-progress-modal-header":"ui_export_export-progress-modal-header_aulHx","modal-close-button":"ui_export_modal-close-button_zi01-","export-progress-modal-title":"ui_export_export-progress-modal-title_DJyJK","retry-btn":"ui_export_retry-btn_61ygN","button-warning":"ui_export_button-warning_WJIb-","button-disabled":"ui_export_button-disabled_DiGAO","button-tag":"ui_export_button-tag_AaPgd","button-icon":"ui_export_button-icon_xc1O3","button-icon-small":"ui_export_button-icon-small_7Gu5A","link":"ui_export_link_ViAcG","asset-element":"ui_export_asset-element_jhF3N","new-scrollbar":"ui_export_new-scrollbar_sAcwV","menu-dropdown":"ui_export_menu-dropdown_O3IGG","menu-item":"ui_export_menu-item_J9ztX","shortcut":"ui_export_shortcut_PS6FL","shortcut-key":"ui_export_shortcut-key_F--h2","user-icon":"ui_export_user-icon_3goUU","title-text":"ui_export_title-text_B1EGQ","progress":"ui_export_progress_toR5B","progress-bar":"ui_export_progress-bar_Avs-j","spin-animation":"ui_export_spin-animation_aAhh4"}
{"button-primary":"ui_export_button-primary_dgIrA","button-secondary":"ui_export_button-secondary_5H2Cl","button-tertiary":"ui_export_button-tertiary_8kym9","export-progress-modal-overlay":"ui_export_export-progress-modal-overlay_AAFul","export-progress-modal-container":"ui_export_export-progress-modal-container_1pPaw","export-progress-modal-header":"ui_export_export-progress-modal-header_aulHx","modal-close-button":"ui_export_modal-close-button_zi01-","export-progress-modal-title":"ui_export_export-progress-modal-title_DJyJK","retry-btn":"ui_export_retry-btn_61ygN","button-radio":"ui_export_button-radio_EUUXg","button-warning":"ui_export_button-warning_WJIb-","button-disabled":"ui_export_button-disabled_DiGAO","button-tag":"ui_export_button-tag_AaPgd","button-icon":"ui_export_button-icon_xc1O3","button-icon-small":"ui_export_button-icon-small_7Gu5A","link":"ui_export_link_ViAcG","asset-element":"ui_export_asset-element_jhF3N","input-element":"ui_export_input-element_HijtH","new-scrollbar":"ui_export_new-scrollbar_sAcwV","menu-dropdown":"ui_export_menu-dropdown_O3IGG","menu-item":"ui_export_menu-item_J9ztX","shortcut":"ui_export_shortcut_PS6FL","shortcut-key":"ui_export_shortcut-key_F--h2","user-icon":"ui_export_user-icon_3goUU","title-text":"ui_export_title-text_B1EGQ","progress":"ui_export_progress_toR5B","progress-bar":"ui_export_progress-bar_Avs-j","spin-animation":"ui_export_spin-animation_aAhh4"}

View file

@ -57,6 +57,7 @@
@extend .button-tertiary;
svg {
@extend .button-icon-small;
stroke: var(--icon-foreground);
}
}
}

View file

@ -264,20 +264,36 @@
(def asc-sort-refactor (icon-xref :asc-sort-refactor))
(def absolute-refactor (icon-xref :absolute-refactor))
(def align-bottom-refactor (icon-xref :align-bottom-refactor))
(def align-content-center-refactor (icon-xref :align-content-center-refactor))
(def align-content-end-refactor (icon-xref :align-content-end-refactor))
(def align-content-space-around-refactor (icon-xref :align-content-space-around-refactor))
(def align-content-space-between-refactor (icon-xref :align-content-space-between-refactor))
(def align-content-space-evenly-refactor (icon-xref :align-content-space-evenly-refactor))
(def align-content-start-refactor (icon-xref :align-content-start-refactor))
(def align-content-row-center-refactor (icon-xref :align-content-row-center-refactor))
(def align-content-column-around-refactor (icon-xref :align-content-column-around-refactor))
(def align-content-column-between-refactor (icon-xref :align-content-column-between-refactor))
(def align-content-column-center-refactor (icon-xref :align-content-column-center-refactor))
(def align-content-column-evenly-refactor (icon-xref :align-content-column-evenly-refactor))
(def align-content-column-start-refactor (icon-xref :align-content-column-start-refactor))
(def align-content-column-end-refactor (icon-xref :align-content-column-end-refactor))
(def align-content-row-end-refactor (icon-xref :align-content-row-end-refactor))
(def align-content-row-around-refactor (icon-xref :align-content-row-around-refactor))
(def align-content-row-between-refactor (icon-xref :align-content-row-between-refactor))
(def align-content-row-evenly-refactor (icon-xref :align-content-row-evenly-refactor))
(def align-content-row-start-refactor (icon-xref :align-content-row-start-refactor))
(def align-horizontal-center-refactor (icon-xref :align-horizontal-center-refactor))
(def align-vertical-center-refactor (icon-xref :align-vertical-center-refactor))
(def align-items-center-refactor (icon-xref :align-items-center-refactor))
(def align-items-end-refactor (icon-xref :align-items-end-refactor))
(def align-items-start-refactor (icon-xref :align-items-start-refactor))
(def align-items-row-center-refactor (icon-xref :align-items-row-center-refactor))
(def align-items-row-end-refactor (icon-xref :align-items-row-end-refactor))
(def align-items-row-start-refactor (icon-xref :align-items-row-start-refactor))
(def align-items-column-start-refactor (icon-xref :align-items-column-start-refactor))
(def align-items-column-end-refactor (icon-xref :align-items-column-end-refactor))
(def align-items-column-center-refactor (icon-xref :align-items-column-center-refactor))
(def align-left-refactor (icon-xref :align-left-refactor))
(def align-right-refactor (icon-xref :align-right-refactor))
(def align-top-refactor (icon-xref :align-top-refactor))
(def align-self-column-bottom-refactor (icon-xref :align-self-column-bottom-refactor))
(def align-self-column-center-refactor (icon-xref :align-self-column-center-refactor))
(def align-self-column-top-refactor (icon-xref :align-self-column-top-refactor))
(def align-self-row-center-refactor (icon-xref :align-self-row-center-refactor))
(def align-self-row-left-refactor (icon-xref :align-self-row-left-refactor))
(def align-self-row-right-refactor (icon-xref :align-self-row-right-refactor))
(def board-refactor (icon-xref :board-refactor))
(def boards-thumbnail-refactor (icon-xref :boards-thumbnail-refactor))
(def boolean-difference-refactor (icon-xref :boolean-difference-refactor))
@ -285,6 +301,7 @@
(def boolean-flatten-refactor (icon-xref :boolean-flatten-refactor))
(def boolean-intersection-refactor (icon-xref :boolean-intersection-refactor))
(def boolean-union-refactor (icon-xref :boolean-union-refactor))
(def clip-content-refactor (icon-xref :clip-content-refactor))
(def close-refactor (icon-xref :close-refactor))
(def close-small-refactor (icon-xref :close-small-refactor))
(def component-refactor (icon-xref :component-refactor))
@ -296,7 +313,7 @@
(def constraint-vertical-refactor (icon-xref :constraint-vertical-refactor))
(def corner-radius-refactor (icon-xref :corner-radius-refactor))
(def curve-refactor (icon-xref :curve-refactor))
(def distribute-vertical-sapcing-refactor (icon-xref :distribute-vertical-spacing-refactor))
(def distribute-vertical-spacing-refactor (icon-xref :distribute-vertical-spacing-refactor))
(def distribute-horizontally-refactor (icon-xref :distribute-horizontally-refactor))
(def delete-refactor (icon-xref :delete-refactor))
(def delete-text-refactor (icon-xref :delete-text-refactor))
@ -306,7 +323,9 @@
(def drop-refactor (icon-xref :drop-refactor))
(def effects-refactor (icon-xref :effects-refactor))
(def elipse-refactor (icon-xref :elipse-refactor))
(def fill-content-refactor (icon-xref :fill-content-refactor))
(def filter-refactor (icon-xref :filter-refactor))
(def fixed-width-refactor (icon-xref :fixed-width-refactor))
(def flex-refactor (icon-xref :flex-refactor))
(def flex-horizontal-refactor (icon-xref :flex-horizontal-refactor))
(def flex-grid-refactor (icon-xref :flex-grid-refactor))
@ -322,23 +341,31 @@
(def grid-refactor (icon-xref :grid-refactor))
(def group-refactor (icon-xref :group-refactor))
(def graphics-refactor (icon-xref :graphics-refactor))
(def gutter-horizontal-refactor (icon-xref :gutter-horizontal-refactor))
(def gutter-vertical-refactor (icon-xref :gutter-vertical-refactor))
(def gap-horizontal-refactor (icon-xref :gap-horizontal-refactor))
(def gap-vertical-refactor (icon-xref :gap-vertical-refactor))
(def hide-refactor (icon-xref :hide-refactor))
(def history-refactor (icon-xref :history-refactor))
(def hug-content-refactor (icon-xref :hug-content-refactor))
(def img-refactor (icon-xref :img-refactor))
(def icon-refactor (icon-xref :icon-refactor))
(def justify-content-center-refactor (icon-xref :justify-content-center-refactor))
(def justify-content-end-refactor (icon-xref :justify-content-end-refactor))
(def justify-content-start-refactor (icon-xref :justify-content-start-refactor))
(def justify-content-space-between-refactor (icon-xref :justify-content-space-between-refactor))
(def justify-content-space-around-refactor (icon-xref :justify-content-space-around-refactor))
(def justify-content-space-evenly-refactor (icon-xref :justify-content-space-evenly-refactor))
(def justify-content-column-around-refactor (icon-xref :justify-content-column-around-refactor))
(def justify-content-column-between-refactor (icon-xref :justify-content-column-between-refactor))
(def justify-content-column-center-refactor (icon-xref :justify-content-column-center-refactor))
(def justify-content-column-end-refactor (icon-xref :justify-content-column-end-refactor))
(def justify-content-column-evenly-refactor (icon-xref :justify-content-column-evenly-refactor))
(def justify-content-column-start-refactor (icon-xref :justify-content-column-start-refactor))
(def justify-content-row-center-refactor (icon-xref :justify-content-row-center-refactor))
(def justify-content-row-end-refactor (icon-xref :justify-content-row-end-refactor))
(def justify-content-row-start-refactor (icon-xref :justify-content-row-start-refactor))
(def justify-content-row-between-refactor (icon-xref :justify-content-row-between-refactor))
(def justify-content-row-around-refactor (icon-xref :justify-content-row-around-refactor))
(def justify-content-row-evenly-refactor (icon-xref :justify-content-row-evenly-refactor))
(def lock-refactor (icon-xref :lock-refactor))
(def library-refactor (icon-xref :library-refactor))
(def margin-bottom-refactor (icon-xref :margin-bottom-refactor))
(def margin-left-refactor (icon-xref :margin-left-refactor))
(def margin-left-right-refactor (icon-xref :margin-left-right-refactor))
(def margin-refactor (icon-xref :margin-refactor))
(def margin-right-refactor (icon-xref :margin-right-refactor))
(def margin-top-refactor (icon-xref :margin-top-refactor))
(def margin-top-bottom-refactor (icon-xref :margin-top-bottom-refactor))

View file

@ -306,7 +306,7 @@
axis (:resize-axis rect-data)
on-pointer-down
(mf/use-callback
(mf/use-fn
(mf/deps frame-id rect-data padding-num)
(fn [event]
(dom/capture-pointer event)
@ -315,7 +315,7 @@
(reset! original-value (:initial-value rect-data))))
on-lost-pointer-capture
(mf/use-callback
(mf/use-fn
(mf/deps frame-id padding-num padding)
(fn [event]
(dom/release-pointer event)
@ -325,7 +325,7 @@
(st/emit! (dwm/apply-modifiers))))
on-pointer-move
(mf/use-callback
(mf/use-fn
(mf/deps frame-id padding-num padding hover-all? hover-v? hover-h?)
(fn [event]
(let [pos (dom/get-client-position event)]
@ -466,7 +466,7 @@
axis (:resize-axis rect-data)
on-pointer-down
(mf/use-callback
(mf/use-fn
(mf/deps shape-id margin-num margin)
(fn [event]
(dom/capture-pointer event)
@ -475,7 +475,7 @@
(reset! original-value (:initial-value rect-data))))
on-lost-pointer-capture
(mf/use-callback
(mf/use-fn
(mf/deps shape-id margin-num margin)
(fn [event]
(dom/release-pointer event)
@ -485,7 +485,7 @@
(st/emit! (dwm/apply-modifiers))))
on-pointer-move
(mf/use-callback
(mf/use-fn
(mf/deps shape-id margin-num margin hover-all? hover-v? hover-h?)
(fn [event]
(let [pos (dom/get-client-position event)]
@ -618,7 +618,7 @@
axis (:resize-axis rect-data)
on-pointer-down
(mf/use-callback
(mf/use-fn
(mf/deps frame-id gap-type gap)
(fn [event]
(dom/capture-pointer event)
@ -627,7 +627,7 @@
(reset! original-value (:initial-value rect-data))))
on-lost-pointer-capture
(mf/use-callback
(mf/use-fn
(mf/deps frame-id gap-type gap)
(fn [event]
(dom/release-pointer event)
@ -637,7 +637,7 @@
(st/emit! (dwm/apply-modifiers))))
on-pointer-move
(mf/use-callback
(mf/use-fn
(mf/deps frame-id gap-type gap)
(fn [event]
(let [pos (dom/get-client-position event)]

View file

@ -1 +1 @@
{"button-primary":"ui_modal_button-primary_f2CEg","button-secondary":"ui_modal_button-secondary_1wH6N","button-tertiary":"ui_modal_button-tertiary_vNip8","button-warning":"ui_modal_button-warning_1e-75","button-disabled":"ui_modal_button-disabled_n6i2O","button-tag":"ui_modal_button-tag_pLwhJ","button-icon":"ui_modal_button-icon_aRFFQ","button-icon-small":"ui_modal_button-icon-small_HY5lR","link":"ui_modal_link_Uw-ft","asset-element":"ui_modal_asset-element_43PW9","new-scrollbar":"ui_modal_new-scrollbar_zPDI7","modal-wrapper":"ui_modal_modal-wrapper_NLvfo","menu-dropdown":"ui_modal_menu-dropdown_G1sWX","menu-item":"ui_modal_menu-item_5LLIh","shortcut":"ui_modal_shortcut_6E-Cq","shortcut-key":"ui_modal_shortcut-key_GaCtX","user-icon":"ui_modal_user-icon_ZrqXs","spin-animation":"ui_modal_spin-animation_yREim"}
{"button-primary":"ui_modal_button-primary_f2CEg","button-secondary":"ui_modal_button-secondary_1wH6N","button-tertiary":"ui_modal_button-tertiary_vNip8","button-radio":"ui_modal_button-radio_ezjbW","button-warning":"ui_modal_button-warning_1e-75","button-disabled":"ui_modal_button-disabled_n6i2O","button-tag":"ui_modal_button-tag_pLwhJ","button-icon":"ui_modal_button-icon_aRFFQ","button-icon-small":"ui_modal_button-icon-small_HY5lR","link":"ui_modal_link_Uw-ft","asset-element":"ui_modal_asset-element_43PW9","input-element":"ui_modal_input-element_y0flJ","new-scrollbar":"ui_modal_new-scrollbar_zPDI7","modal-wrapper":"ui_modal_modal-wrapper_NLvfo","menu-dropdown":"ui_modal_menu-dropdown_G1sWX","menu-item":"ui_modal_menu-item_5LLIh","shortcut":"ui_modal_shortcut_6E-Cq","shortcut-key":"ui_modal_shortcut-key_GaCtX","user-icon":"ui_modal_user-icon_ZrqXs","spin-animation":"ui_modal_spin-animation_yREim"}

View file

@ -1 +1 @@
{"button-primary":"ui_workspace_button-primary_FZJ-T","button-secondary":"ui_workspace_button-secondary_oDzCJ","button-tertiary":"ui_workspace_button-tertiary_LVpr3","button-warning":"ui_workspace_button-warning_4iQFw","button-disabled":"ui_workspace_button-disabled_--5pl","button-tag":"ui_workspace_button-tag_cU1Th","button-icon":"ui_workspace_button-icon_L5y8h","button-icon-small":"ui_workspace_button-icon-small_Ppp3W","link":"ui_workspace_link_WhQFh","asset-element":"ui_workspace_asset-element_LTbhl","new-scrollbar":"ui_workspace_new-scrollbar_tkRN6","workspace":"ui_workspace_workspace_xutJr","menu-dropdown":"ui_workspace_menu-dropdown_C5UnV","menu-item":"ui_workspace_menu-item_JOhDR","shortcut":"ui_workspace_shortcut_ksV9H","shortcut-key":"ui_workspace_shortcut-key_Npd85","user-icon":"ui_workspace_user-icon_-DyAD","workspace-loader":"ui_workspace_workspace-loader_INSav","spin-animation":"ui_workspace_spin-animation_kD9o3"}
{"button-primary":"ui_workspace_button-primary_FZJ-T","button-secondary":"ui_workspace_button-secondary_oDzCJ","button-tertiary":"ui_workspace_button-tertiary_LVpr3","button-radio":"ui_workspace_button-radio_PMFXa","button-warning":"ui_workspace_button-warning_4iQFw","button-disabled":"ui_workspace_button-disabled_--5pl","button-tag":"ui_workspace_button-tag_cU1Th","button-icon":"ui_workspace_button-icon_L5y8h","button-icon-small":"ui_workspace_button-icon-small_Ppp3W","link":"ui_workspace_link_WhQFh","asset-element":"ui_workspace_asset-element_LTbhl","input-element":"ui_workspace_input-element_Ohf9O","new-scrollbar":"ui_workspace_new-scrollbar_tkRN6","workspace":"ui_workspace_workspace_xutJr","menu-dropdown":"ui_workspace_menu-dropdown_C5UnV","menu-item":"ui_workspace_menu-item_JOhDR","shortcut":"ui_workspace_shortcut_ksV9H","shortcut-key":"ui_workspace_shortcut-key_Npd85","user-icon":"ui_workspace_user-icon_-DyAD","workspace-loader":"ui_workspace_workspace-loader_INSav","spin-animation":"ui_workspace_spin-animation_kD9o3"}

View file

@ -1 +1 @@
{"button-primary":"workspace_color_palette_button-primary_0d2e2","button-secondary":"workspace_color_palette_button-secondary_C8qJL","button-tertiary":"workspace_color_palette_button-tertiary_X6-9C","button-warning":"workspace_color_palette_button-warning_IHf7v","button-disabled":"workspace_color_palette_button-disabled_k7M8X","button-tag":"workspace_color_palette_button-tag_GtZK2","button-icon":"workspace_color_palette_button-icon_-tBR6","color-palette":"workspace_color_palette_color-palette_hfJPA","left-arrow":"workspace_color_palette_left-arrow_PK7sj","right-arrow":"workspace_color_palette_right-arrow_swpS9","button-icon-small":"workspace_color_palette_button-icon-small_RrGTg","link":"workspace_color_palette_link_EW9wm","asset-element":"workspace_color_palette_asset-element_3Q2Mp","new-scrollbar":"workspace_color_palette_new-scrollbar_ChE0u","menu-dropdown":"workspace_color_palette_menu-dropdown_VygMh","menu-item":"workspace_color_palette_menu-item_y2vU0","shortcut":"workspace_color_palette_shortcut_CFccJ","shortcut-key":"workspace_color_palette_shortcut-key_5etoa","user-icon":"workspace_color_palette_user-icon_eRKoT","disabled":"workspace_color_palette_disabled_bz-he","color-palette-content":"workspace_color_palette_color-palette-content_okg18","color-palette-inside":"workspace_color_palette_color-palette-inside_dCIeR","color-cell":"workspace_color_palette_color-cell_ITDgl","is-not-library-color":"workspace_color_palette_is-not-library-color_EqCM6","no-text":"workspace_color_palette_no-text_QMPK0","spin-animation":"workspace_color_palette_spin-animation_LKFRB"}
{"button-primary":"workspace_color_palette_button-primary_0d2e2","button-secondary":"workspace_color_palette_button-secondary_C8qJL","button-tertiary":"workspace_color_palette_button-tertiary_X6-9C","button-radio":"workspace_color_palette_button-radio_6DOOO","button-warning":"workspace_color_palette_button-warning_IHf7v","button-disabled":"workspace_color_palette_button-disabled_k7M8X","button-tag":"workspace_color_palette_button-tag_GtZK2","button-icon":"workspace_color_palette_button-icon_-tBR6","color-palette":"workspace_color_palette_color-palette_hfJPA","left-arrow":"workspace_color_palette_left-arrow_PK7sj","right-arrow":"workspace_color_palette_right-arrow_swpS9","button-icon-small":"workspace_color_palette_button-icon-small_RrGTg","link":"workspace_color_palette_link_EW9wm","asset-element":"workspace_color_palette_asset-element_3Q2Mp","input-element":"workspace_color_palette_input-element_j0uTG","new-scrollbar":"workspace_color_palette_new-scrollbar_ChE0u","menu-dropdown":"workspace_color_palette_menu-dropdown_VygMh","menu-item":"workspace_color_palette_menu-item_y2vU0","shortcut":"workspace_color_palette_shortcut_CFccJ","shortcut-key":"workspace_color_palette_shortcut-key_5etoa","user-icon":"workspace_color_palette_user-icon_eRKoT","disabled":"workspace_color_palette_disabled_bz-he","color-palette-content":"workspace_color_palette_color-palette-content_okg18","color-palette-inside":"workspace_color_palette_color-palette-inside_dCIeR","color-cell":"workspace_color_palette_color-cell_ITDgl","is-not-library-color":"workspace_color_palette_is-not-library-color_EqCM6","no-text":"workspace_color_palette_no-text_QMPK0","spin-animation":"workspace_color_palette_spin-animation_LKFRB"}

View file

@ -21,6 +21,7 @@
z-index: $z-index-4;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
&::after {
content: "";

View file

@ -1 +1 @@
{"button-primary":"workspace_color_palette_ctx_menu_button-primary_2ka4z","button-secondary":"workspace_color_palette_ctx_menu_button-secondary_jfajf","button-tertiary":"workspace_color_palette_ctx_menu_button-tertiary_NLctS","button-warning":"workspace_color_palette_ctx_menu_button-warning_xgQCn","button-disabled":"workspace_color_palette_ctx_menu_button-disabled_PnBDO","button-tag":"workspace_color_palette_ctx_menu_button-tag_GN3ad","button-icon":"workspace_color_palette_ctx_menu_button-icon_cCaY2","button-icon-small":"workspace_color_palette_ctx_menu_button-icon-small_-knT4","palette-menu":"workspace_color_palette_ctx_menu_palette-menu_Vrjfy","palette-library":"workspace_color_palette_ctx_menu_palette-library_0LFV5","selected":"workspace_color_palette_ctx_menu_selected_lfchf","option-wrapper":"workspace_color_palette_ctx_menu_option-wrapper_st9Cq","library-name":"workspace_color_palette_ctx_menu_library-name_BL8b8","icon-wrapper":"workspace_color_palette_ctx_menu_icon-wrapper_v8-ys","recent-colors":"workspace_color_palette_ctx_menu_recent-colors_Q4fss","file-library":"workspace_color_palette_ctx_menu_file-library_8qsbr","link":"workspace_color_palette_ctx_menu_link_ugtX1","asset-element":"workspace_color_palette_ctx_menu_asset-element_pV16m","new-scrollbar":"workspace_color_palette_ctx_menu_new-scrollbar_0BINh","menu-dropdown":"workspace_color_palette_ctx_menu_menu-dropdown_3nduz","menu-item":"workspace_color_palette_ctx_menu_menu-item_hVz--","shortcut":"workspace_color_palette_ctx_menu_shortcut_jqDHK","shortcut-key":"workspace_color_palette_ctx_menu_shortcut-key_VPYPv","user-icon":"workspace_color_palette_ctx_menu_user-icon_wv-bR","lib-name-wrapper":"workspace_color_palette_ctx_menu_lib-name-wrapper_-F9D4","lib-name":"workspace_color_palette_ctx_menu_lib-name_VPSM1","lib-num":"workspace_color_palette_ctx_menu_lib-num_neRQe","color-sample":"workspace_color_palette_ctx_menu_color-sample_jQUGL","spin-animation":"workspace_color_palette_ctx_menu_spin-animation_WUYef"}
{"button-primary":"workspace_color_palette_ctx_menu_button-primary_2ka4z","button-secondary":"workspace_color_palette_ctx_menu_button-secondary_jfajf","button-tertiary":"workspace_color_palette_ctx_menu_button-tertiary_NLctS","button-radio":"workspace_color_palette_ctx_menu_button-radio_PDiB3","button-warning":"workspace_color_palette_ctx_menu_button-warning_xgQCn","button-disabled":"workspace_color_palette_ctx_menu_button-disabled_PnBDO","button-tag":"workspace_color_palette_ctx_menu_button-tag_GN3ad","button-icon":"workspace_color_palette_ctx_menu_button-icon_cCaY2","button-icon-small":"workspace_color_palette_ctx_menu_button-icon-small_-knT4","palette-menu":"workspace_color_palette_ctx_menu_palette-menu_Vrjfy","palette-library":"workspace_color_palette_ctx_menu_palette-library_0LFV5","selected":"workspace_color_palette_ctx_menu_selected_lfchf","option-wrapper":"workspace_color_palette_ctx_menu_option-wrapper_st9Cq","library-name":"workspace_color_palette_ctx_menu_library-name_BL8b8","icon-wrapper":"workspace_color_palette_ctx_menu_icon-wrapper_v8-ys","recent-colors":"workspace_color_palette_ctx_menu_recent-colors_Q4fss","file-library":"workspace_color_palette_ctx_menu_file-library_8qsbr","link":"workspace_color_palette_ctx_menu_link_ugtX1","asset-element":"workspace_color_palette_ctx_menu_asset-element_pV16m","input-element":"workspace_color_palette_ctx_menu_input-element_Tv2e2","new-scrollbar":"workspace_color_palette_ctx_menu_new-scrollbar_0BINh","menu-dropdown":"workspace_color_palette_ctx_menu_menu-dropdown_3nduz","menu-item":"workspace_color_palette_ctx_menu_menu-item_hVz--","shortcut":"workspace_color_palette_ctx_menu_shortcut_jqDHK","shortcut-key":"workspace_color_palette_ctx_menu_shortcut-key_VPYPv","user-icon":"workspace_color_palette_ctx_menu_user-icon_wv-bR","lib-name-wrapper":"workspace_color_palette_ctx_menu_lib-name-wrapper_-F9D4","lib-name":"workspace_color_palette_ctx_menu_lib-name_VPSM1","lib-num":"workspace_color_palette_ctx_menu_lib-num_neRQe","color-sample":"workspace_color_palette_ctx_menu_color-sample_jQUGL","spin-animation":"workspace_color_palette_ctx_menu_spin-animation_WUYef"}

View file

@ -54,6 +54,7 @@
svg {
@include flexCenter;
@extend .button-icon-small;
stroke: var(--icon-foreground);
}
}
}

View file

@ -1 +1 @@
{"button-primary":"workspace_context_menu_button-primary_d6q-P","button-secondary":"workspace_context_menu_button-secondary_bIdqe","button-tertiary":"workspace_context_menu_button-tertiary_vGSns","button-warning":"workspace_context_menu_button-warning_JWgIG","button-disabled":"workspace_context_menu_button-disabled_qth6b","button-tag":"workspace_context_menu_button-tag_rOUbd","button-icon":"workspace_context_menu_button-icon_tXvxe","button-icon-small":"workspace_context_menu_button-icon-small_c0rVU","workspace-context-menu":"workspace_context_menu_workspace-context-menu_2NyvR","icon-menu-item":"workspace_context_menu_icon-menu-item_P3-bA","shape-icon":"workspace_context_menu_shape-icon_xx1Ll","workspace-context-submenu":"workspace_context_menu_workspace-context-submenu_BUNLt","selected-icon":"workspace_context_menu_selected-icon_pZqBp","context-menu-item":"workspace_context_menu_context-menu-item_Tx-Ty","submenu-icon":"workspace_context_menu_submenu-icon_JwYm8","link":"workspace_context_menu_link_Z7rEE","asset-element":"workspace_context_menu_asset-element_jkrbj","new-scrollbar":"workspace_context_menu_new-scrollbar_xGQzu","menu-dropdown":"workspace_context_menu_menu-dropdown_UF-Oq","menu-item":"workspace_context_menu_menu-item_uHHBH","shortcut":"workspace_context_menu_shortcut_rypUe","shortcut-key":"workspace_context_menu_shortcut-key_3rF3t","user-icon":"workspace_context_menu_user-icon_pLDVU","separator":"workspace_context_menu_separator_E9-aR","title":"workspace_context_menu_title_P8iFL","icon-wrapper":"workspace_context_menu_icon-wrapper_n7VO2","spin-animation":"workspace_context_menu_spin-animation_Y8j2J"}
{"button-primary":"workspace_context_menu_button-primary_d6q-P","button-secondary":"workspace_context_menu_button-secondary_bIdqe","button-tertiary":"workspace_context_menu_button-tertiary_vGSns","button-radio":"workspace_context_menu_button-radio_k295n","button-warning":"workspace_context_menu_button-warning_JWgIG","button-disabled":"workspace_context_menu_button-disabled_qth6b","button-tag":"workspace_context_menu_button-tag_rOUbd","button-icon":"workspace_context_menu_button-icon_tXvxe","button-icon-small":"workspace_context_menu_button-icon-small_c0rVU","workspace-context-menu":"workspace_context_menu_workspace-context-menu_2NyvR","icon-menu-item":"workspace_context_menu_icon-menu-item_P3-bA","shape-icon":"workspace_context_menu_shape-icon_xx1Ll","workspace-context-submenu":"workspace_context_menu_workspace-context-submenu_BUNLt","selected-icon":"workspace_context_menu_selected-icon_pZqBp","context-menu-item":"workspace_context_menu_context-menu-item_Tx-Ty","submenu-icon":"workspace_context_menu_submenu-icon_JwYm8","link":"workspace_context_menu_link_Z7rEE","asset-element":"workspace_context_menu_asset-element_jkrbj","input-element":"workspace_context_menu_input-element_Y-yxU","new-scrollbar":"workspace_context_menu_new-scrollbar_xGQzu","menu-dropdown":"workspace_context_menu_menu-dropdown_UF-Oq","menu-item":"workspace_context_menu_menu-item_uHHBH","shortcut":"workspace_context_menu_shortcut_rypUe","shortcut-key":"workspace_context_menu_shortcut-key_3rF3t","user-icon":"workspace_context_menu_user-icon_pLDVU","separator":"workspace_context_menu_separator_E9-aR","title":"workspace_context_menu_title_P8iFL","icon-wrapper":"workspace_context_menu_icon-wrapper_n7VO2","spin-animation":"workspace_context_menu_spin-animation_Y8j2J"}

View file

@ -1 +1 @@
{"button-primary":"workspace_left_header_button-primary_lyfQC","button-secondary":"workspace_left_header_button-secondary_MfwN-","button-tertiary":"workspace_left_header_button-tertiary_fJlY9","workspace-header-left":"workspace_left_header_workspace-header-left_HdnMy","menu-btn":"workspace_left_header_menu-btn_fdwlZ","button-warning":"workspace_left_header_button-warning_PoOGL","button-disabled":"workspace_left_header_button-disabled_k7pJP","button-tag":"workspace_left_header_button-tag_H77gD","button-icon":"workspace_left_header_button-icon_DD7ag","menu":"workspace_left_header_menu_yxGIs","menu-item":"workspace_left_header_menu-item_1wh4b","open-arrow":"workspace_left_header_open-arrow_bcWEe","sub-menu":"workspace_left_header_sub-menu_MMoV5","submenu-item":"workspace_left_header_submenu-item_ZKiY7","button-icon-small":"workspace_left_header_button-icon-small_gYHAj","link":"workspace_left_header_link_E6JUR","asset-element":"workspace_left_header_asset-element_iYXcu","new-scrollbar":"workspace_left_header_new-scrollbar_dOPeK","menu-dropdown":"workspace_left_header_menu-dropdown_3LtHG","shortcut":"workspace_left_header_shortcut_7lGBb","shortcut-key":"workspace_left_header_shortcut-key_31FAP","user-icon":"workspace_left_header_user-icon_ektpZ","main-icon":"workspace_left_header_main-icon_qnAm2","project-tree":"workspace_left_header_project-tree_WoAdo","project-name":"workspace_left_header_project-name_petDL","file-name":"workspace_left_header_file-name_QiMm1","file-name-input":"workspace_left_header_file-name-input_yjzqX","shared-badge":"workspace_left_header_shared-badge_N-vOg","separator":"workspace_left_header_separator_TyuDr","file":"workspace_left_header_file_2A0Xu","edit":"workspace_left_header_edit_XN7-M","view":"workspace_left_header_view_IsL62","preferences":"workspace_left_header_preferences_R20sp","help-info":"workspace_left_header_help-info_NVGJQ","spin-animation":"workspace_left_header_spin-animation_buAeE"}
{"button-primary":"workspace_left_header_button-primary_lyfQC","button-secondary":"workspace_left_header_button-secondary_MfwN-","button-tertiary":"workspace_left_header_button-tertiary_fJlY9","workspace-header-left":"workspace_left_header_workspace-header-left_HdnMy","menu-btn":"workspace_left_header_menu-btn_fdwlZ","button-radio":"workspace_left_header_button-radio_3XqbR","button-warning":"workspace_left_header_button-warning_PoOGL","button-disabled":"workspace_left_header_button-disabled_k7pJP","button-tag":"workspace_left_header_button-tag_H77gD","button-icon":"workspace_left_header_button-icon_DD7ag","menu":"workspace_left_header_menu_yxGIs","menu-item":"workspace_left_header_menu-item_1wh4b","open-arrow":"workspace_left_header_open-arrow_bcWEe","sub-menu":"workspace_left_header_sub-menu_MMoV5","submenu-item":"workspace_left_header_submenu-item_ZKiY7","button-icon-small":"workspace_left_header_button-icon-small_gYHAj","link":"workspace_left_header_link_E6JUR","asset-element":"workspace_left_header_asset-element_iYXcu","input-element":"workspace_left_header_input-element_zkT-i","new-scrollbar":"workspace_left_header_new-scrollbar_dOPeK","menu-dropdown":"workspace_left_header_menu-dropdown_3LtHG","shortcut":"workspace_left_header_shortcut_7lGBb","shortcut-key":"workspace_left_header_shortcut-key_31FAP","user-icon":"workspace_left_header_user-icon_ektpZ","main-icon":"workspace_left_header_main-icon_qnAm2","project-tree":"workspace_left_header_project-tree_WoAdo","project-name":"workspace_left_header_project-name_petDL","file-name":"workspace_left_header_file-name_QiMm1","file-name-input":"workspace_left_header_file-name-input_yjzqX","shared-badge":"workspace_left_header_shared-badge_N-vOg","separator":"workspace_left_header_separator_TyuDr","file":"workspace_left_header_file_2A0Xu","edit":"workspace_left_header_edit_XN7-M","view":"workspace_left_header_view_IsL62","preferences":"workspace_left_header_preferences_R20sp","help-info":"workspace_left_header_help-info_NVGJQ","spin-animation":"workspace_left_header_spin-animation_buAeE"}

View file

@ -78,6 +78,7 @@
border-radius: $br-8;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
.menu {
@ -106,6 +107,7 @@
@include flexCenter;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
&:hover {

View file

@ -1 +1 @@
{"button-primary":"workspace_left_toolbar_button-primary_cOfI2","button-secondary":"workspace_left_toolbar_button-secondary_yztFQ","button-tertiary":"workspace_left_toolbar_button-tertiary_ATxjs","main-toolbar":"workspace_left_toolbar_main-toolbar_QN5ne","main-toolbar-options":"workspace_left_toolbar_main-toolbar-options_xqFsj","button-warning":"workspace_left_toolbar_button-warning_wM68W","button-disabled":"workspace_left_toolbar_button-disabled_-5ubI","button-tag":"workspace_left_toolbar_button-tag_uOY3P","button-icon":"workspace_left_toolbar_button-icon_QXZDp","button-icon-small":"workspace_left_toolbar_button-icon-small_p617J","link":"workspace_left_toolbar_link_dbtrr","asset-element":"workspace_left_toolbar_asset-element_vwVhJ","new-scrollbar":"workspace_left_toolbar_new-scrollbar_CDU0n","menu-dropdown":"workspace_left_toolbar_menu-dropdown_ui5fQ","menu-item":"workspace_left_toolbar_menu-item_chrVQ","shortcut":"workspace_left_toolbar_shortcut_9jPGH","shortcut-key":"workspace_left_toolbar_shortcut-key_MUfgG","user-icon":"workspace_left_toolbar_user-icon_C8ZY7","toolbar-handler":"workspace_left_toolbar_toolbar-handler_VfijE","toolbar-handler-btn":"workspace_left_toolbar_toolbar-handler-btn_vV1IT","hidden-toolbar":"workspace_left_toolbar_hidden-toolbar_w7tu-","main-toolbar-panels":"workspace_left_toolbar_main-toolbar-panels_zT3qk","spin-animation":"workspace_left_toolbar_spin-animation_8Q3nv"}
{"button-primary":"workspace_left_toolbar_button-primary_cOfI2","button-secondary":"workspace_left_toolbar_button-secondary_yztFQ","button-tertiary":"workspace_left_toolbar_button-tertiary_ATxjs","main-toolbar":"workspace_left_toolbar_main-toolbar_QN5ne","main-toolbar-options":"workspace_left_toolbar_main-toolbar-options_xqFsj","button-radio":"workspace_left_toolbar_button-radio_JIUuN","button-warning":"workspace_left_toolbar_button-warning_wM68W","button-disabled":"workspace_left_toolbar_button-disabled_-5ubI","button-tag":"workspace_left_toolbar_button-tag_uOY3P","button-icon":"workspace_left_toolbar_button-icon_QXZDp","button-icon-small":"workspace_left_toolbar_button-icon-small_p617J","link":"workspace_left_toolbar_link_dbtrr","asset-element":"workspace_left_toolbar_asset-element_vwVhJ","input-element":"workspace_left_toolbar_input-element_Lk8B-","new-scrollbar":"workspace_left_toolbar_new-scrollbar_CDU0n","menu-dropdown":"workspace_left_toolbar_menu-dropdown_ui5fQ","menu-item":"workspace_left_toolbar_menu-item_chrVQ","shortcut":"workspace_left_toolbar_shortcut_9jPGH","shortcut-key":"workspace_left_toolbar_shortcut-key_MUfgG","user-icon":"workspace_left_toolbar_user-icon_C8ZY7","toolbar-handler":"workspace_left_toolbar_toolbar-handler_VfijE","toolbar-handler-btn":"workspace_left_toolbar_toolbar-handler-btn_vV1IT","hidden-toolbar":"workspace_left_toolbar_hidden-toolbar_w7tu-","main-toolbar-panels":"workspace_left_toolbar_main-toolbar-panels_zT3qk","spin-animation":"workspace_left_toolbar_spin-animation_8Q3nv"}

View file

@ -248,7 +248,7 @@
[:div {:class (stl/css :section)}
[:& title-bar {:collapsable? false
:title (tr "workspace.libraries.in-this-file")
:klass :title-spacing-lib}]
:class (stl/css :title-spacing-lib)}]
[:div {:class (stl/css :section-list)}
[:div {:class (stl/css :section-list-item)}
@ -294,7 +294,7 @@
[:div {:class (stl/css :section)}
[:& title-bar {:collapsable? false
:title (tr "workspace.libraries.shared-libraries")
:klass :title-spacing-lib}]
:class (stl/css :title-spacing-lib)}]
[:div {:class (stl/css :libraries-search)}
[:& search-bar {:on-change change-search-term
:value search-term

View file

@ -1 +1 @@
{"button-primary":"workspace_libraries_button-primary_Hsioh","modal-overlay":"workspace_libraries_modal-overlay_qC-df","modal-dialog":"workspace_libraries_modal-dialog_Kj293","modal-content":"workspace_libraries_modal-content_4EVEQ","libraries-content":"workspace_libraries_libraries-content_ycQdm","section":"workspace_libraries_section_SUsgi","section-list":"workspace_libraries_section-list_lGSrM","section-list-item":"workspace_libraries_section-list-item_hwASN","item-publish":"workspace_libraries_item-publish_ZMopF","item-unpublish":"workspace_libraries_item-unpublish_1seca","section-list-shared":"workspace_libraries_section-list-shared_XZE10","updates-content":"workspace_libraries_updates-content_lqMoE","button-secondary":"workspace_libraries_button-secondary_l5M0x","item-button":"workspace_libraries_item-button_dKUeX","item-button-shared":"workspace_libraries_item-button-shared_hxOmT","button-tertiary":"workspace_libraries_button-tertiary_C54rH","close":"workspace_libraries_close_bED7B","button-warning":"workspace_libraries_button-warning_xKJqf","item-update":"workspace_libraries_item-update_GklIE","button-disabled":"workspace_libraries_button-disabled_R7I-V","disabled":"workspace_libraries_disabled_Y5O-4","button-tag":"workspace_libraries_button-tag_wAh-s","button-icon":"workspace_libraries_button-icon_kxS7q","item-button-icon":"workspace_libraries_item-button-icon_CeJWg","button-icon-small":"workspace_libraries_button-icon-small_Q9eo3","section-list-empty":"workspace_libraries_section-list-empty_mOKkJ","libraries-search":"workspace_libraries_libraries-search_JS70w","search-icon":"workspace_libraries_search-icon_y7N9S","link":"workspace_libraries_link_a3v8a","libraries-updates-see-all":"workspace_libraries_libraries-updates-see-all_-G5EO","asset-element":"workspace_libraries_asset-element_-FuJl","new-scrollbar":"workspace_libraries_new-scrollbar_9V-Nb","menu-dropdown":"workspace_libraries_menu-dropdown_frrTQ","menu-item":"workspace_libraries_menu-item_1PSqe","shortcut":"workspace_libraries_shortcut_ZBbd3","shortcut-key":"workspace_libraries_shortcut-key_qBs5D","user-icon":"workspace_libraries_user-icon_IjCsd","modal-title":"workspace_libraries_modal-title_Z1xKU","libraries-header":"workspace_libraries_libraries-header_-W6bJ","item-name":"workspace_libraries_item-name_Zjbsw","item-contents":"workspace_libraries_item-contents_EPTF6","section-title":"workspace_libraries_section-title_7rsm7","libraries-updates":"workspace_libraries_libraries-updates_RLtH8","libraries-updates-item":"workspace_libraries_libraries-updates-item_QwZMY","name-block":"workspace_libraries_name-block_RcVh4","ellipsis":"workspace_libraries_ellipsis_I5JtE","element-count":"workspace_libraries_element-count_07SV2","spin-animation":"workspace_libraries_spin-animation_mW-An"}
{"button-primary":"workspace_libraries_button-primary_Hsioh","modal-overlay":"workspace_libraries_modal-overlay_qC-df","modal-dialog":"workspace_libraries_modal-dialog_Kj293","modal-content":"workspace_libraries_modal-content_4EVEQ","libraries-content":"workspace_libraries_libraries-content_ycQdm","section":"workspace_libraries_section_SUsgi","section-list":"workspace_libraries_section-list_lGSrM","section-list-item":"workspace_libraries_section-list-item_hwASN","item-publish":"workspace_libraries_item-publish_ZMopF","item-unpublish":"workspace_libraries_item-unpublish_1seca","section-list-shared":"workspace_libraries_section-list-shared_XZE10","updates-content":"workspace_libraries_updates-content_lqMoE","button-secondary":"workspace_libraries_button-secondary_l5M0x","item-button":"workspace_libraries_item-button_dKUeX","item-button-shared":"workspace_libraries_item-button-shared_hxOmT","button-tertiary":"workspace_libraries_button-tertiary_C54rH","close":"workspace_libraries_close_bED7B","button-radio":"workspace_libraries_button-radio_e8zGB","button-warning":"workspace_libraries_button-warning_xKJqf","item-update":"workspace_libraries_item-update_GklIE","button-disabled":"workspace_libraries_button-disabled_R7I-V","disabled":"workspace_libraries_disabled_Y5O-4","button-tag":"workspace_libraries_button-tag_wAh-s","button-icon":"workspace_libraries_button-icon_kxS7q","item-button-icon":"workspace_libraries_item-button-icon_CeJWg","button-icon-small":"workspace_libraries_button-icon-small_Q9eo3","section-list-empty":"workspace_libraries_section-list-empty_mOKkJ","libraries-search":"workspace_libraries_libraries-search_JS70w","search-icon":"workspace_libraries_search-icon_y7N9S","link":"workspace_libraries_link_a3v8a","libraries-updates-see-all":"workspace_libraries_libraries-updates-see-all_-G5EO","asset-element":"workspace_libraries_asset-element_-FuJl","input-element":"workspace_libraries_input-element_Otka8","new-scrollbar":"workspace_libraries_new-scrollbar_9V-Nb","menu-dropdown":"workspace_libraries_menu-dropdown_frrTQ","menu-item":"workspace_libraries_menu-item_1PSqe","shortcut":"workspace_libraries_shortcut_ZBbd3","shortcut-key":"workspace_libraries_shortcut-key_qBs5D","user-icon":"workspace_libraries_user-icon_IjCsd","modal-title":"workspace_libraries_modal-title_Z1xKU","libraries-header":"workspace_libraries_libraries-header_-W6bJ","title-spacing-lib":"workspace_libraries_title-spacing-lib_A-arJ","item-name":"workspace_libraries_item-name_Zjbsw","item-contents":"workspace_libraries_item-contents_EPTF6","section-title":"workspace_libraries_section-title_7rsm7","libraries-updates":"workspace_libraries_libraries-updates_RLtH8","libraries-updates-item":"workspace_libraries_libraries-updates-item_QwZMY","name-block":"workspace_libraries_name-block_RcVh4","ellipsis":"workspace_libraries_ellipsis_I5JtE","element-count":"workspace_libraries_element-count_07SV2","spin-animation":"workspace_libraries_spin-animation_mW-An"}

View file

@ -36,6 +36,7 @@
border-radius: $br-8;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
.modal-title {
@ -60,7 +61,7 @@
display: flex;
flex-direction: column;
height: calc(100% - $s-12);
:global(.title-spacing-lib) {
.title-spacing-lib {
margin: 0 0 $s-24 calc(-1 * $s-8);
}
.section-list,
@ -119,6 +120,7 @@
margin-right: $s-2;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
.item-button-shared {
@ -130,6 +132,7 @@
height: $s-28;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
}
@ -150,6 +153,7 @@
width: $s-20;
svg {
@extend .button-icon-small;
stroke: var(--icon-foreground);
}
}
}
@ -159,6 +163,7 @@
svg {
@extend .button-icon-small;
stroke: var(--icon-foreground);
width: $s-16;
height: $s-16;
}

View file

@ -1 +1 @@
{"button-primary":"workspace_palette_button-primary_zEUyD","button-secondary":"workspace_palette_button-secondary_ksr24","button-tertiary":"workspace_palette_button-tertiary_91YQK","palettes":"workspace_palette_palettes_JHGUw","palette-actions":"workspace_palette_palette-actions_2GwR6","palette-btn-list":"workspace_palette_palette-btn-list_x7gPS","palette-item":"workspace_palette_palette-item_50uj6","palette-btn":"workspace_palette_palette-btn_kP66y","button-warning":"workspace_palette_button-warning_uC7fd","button-disabled":"workspace_palette_button-disabled_0dQDS","button-tag":"workspace_palette_button-tag_S9v-Z","button-icon":"workspace_palette_button-icon_pmEDv","button-icon-small":"workspace_palette_button-icon-small_vbLDq","link":"workspace_palette_link_UPU5s","asset-element":"workspace_palette_asset-element_4bXi3","new-scrollbar":"workspace_palette_new-scrollbar_3WWqd","menu-dropdown":"workspace_palette_menu-dropdown_2S40O","menu-item":"workspace_palette_menu-item_qSC6U","shortcut":"workspace_palette_shortcut_mZ4Tp","shortcut-key":"workspace_palette_shortcut-key_EeW-I","user-icon":"workspace_palette_user-icon_8VKTf","palette-wrapper":"workspace_palette_palette-wrapper_ciUIx","wide":"workspace_palette_wide_3G4e1","mid-palette":"workspace_palette_mid-palette_rGR5I","small-palette":"workspace_palette_small-palette_18Otk","resize-area":"workspace_palette_resize-area_0LwVu","selected":"workspace_palette_selected_Z6BFo","palette":"workspace_palette_palette_eqp3q","handler":"workspace_palette_handler_4JV0J","handler-btn":"workspace_palette_handler-btn_7lnlF","hidden-bts":"workspace_palette_hidden-bts_mhbc0","spin-animation":"workspace_palette_spin-animation_ezmwC"}
{"button-primary":"workspace_palette_button-primary_zEUyD","button-secondary":"workspace_palette_button-secondary_ksr24","button-tertiary":"workspace_palette_button-tertiary_91YQK","palettes":"workspace_palette_palettes_JHGUw","palette-actions":"workspace_palette_palette-actions_2GwR6","palette-btn-list":"workspace_palette_palette-btn-list_x7gPS","palette-item":"workspace_palette_palette-item_50uj6","palette-btn":"workspace_palette_palette-btn_kP66y","button-radio":"workspace_palette_button-radio_zpcxS","button-warning":"workspace_palette_button-warning_uC7fd","button-disabled":"workspace_palette_button-disabled_0dQDS","button-tag":"workspace_palette_button-tag_S9v-Z","button-icon":"workspace_palette_button-icon_pmEDv","button-icon-small":"workspace_palette_button-icon-small_vbLDq","link":"workspace_palette_link_UPU5s","asset-element":"workspace_palette_asset-element_4bXi3","input-element":"workspace_palette_input-element_z1Q4v","new-scrollbar":"workspace_palette_new-scrollbar_3WWqd","menu-dropdown":"workspace_palette_menu-dropdown_2S40O","menu-item":"workspace_palette_menu-item_qSC6U","shortcut":"workspace_palette_shortcut_mZ4Tp","shortcut-key":"workspace_palette_shortcut-key_EeW-I","user-icon":"workspace_palette_user-icon_8VKTf","palette-wrapper":"workspace_palette_palette-wrapper_ciUIx","wide":"workspace_palette_wide_3G4e1","mid-palette":"workspace_palette_mid-palette_rGR5I","small-palette":"workspace_palette_small-palette_18Otk","resize-area":"workspace_palette_resize-area_0LwVu","selected":"workspace_palette_selected_Z6BFo","palette":"workspace_palette_palette_eqp3q","handler":"workspace_palette_handler_4JV0J","handler-btn":"workspace_palette_handler-btn_7lnlF","hidden-bts":"workspace_palette_hidden-bts_mhbc0","spin-animation":"workspace_palette_spin-animation_ezmwC"}

View file

@ -77,6 +77,7 @@
padding: 0;
svg {
@extend .button-icon-small;
stroke: var(--icon-foreground);
}
&.selected {
border: $s-2 solid var(--palette-btn-border-color-selected);
@ -104,6 +105,7 @@
z-index: $z-index-2;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
.palette {

View file

@ -1 +1 @@
{"button-primary":"workspace_presence_button-primary_As6Ix","button-secondary":"workspace_presence_button-secondary_wChpa","button-tertiary":"workspace_presence_button-tertiary_XLZQY","button-warning":"workspace_presence_button-warning_D0Gxb","button-disabled":"workspace_presence_button-disabled_oxzIp","button-tag":"workspace_presence_button-tag_Hp7-u","button-icon":"workspace_presence_button-icon_wQdM5","button-icon-small":"workspace_presence_button-icon-small_cxrR5","link":"workspace_presence_link_vEQGI","asset-element":"workspace_presence_asset-element_ALwzT","new-scrollbar":"workspace_presence_new-scrollbar_u3DSM","menu-dropdown":"workspace_presence_menu-dropdown_pc2zP","menu-item":"workspace_presence_menu-item_QIKwl","shortcut":"workspace_presence_shortcut_nbmw6","shortcut-key":"workspace_presence_shortcut-key_w0Pys","user-icon":"workspace_presence_user-icon_hDghc","active-users":"workspace_presence_active-users_wkbu6","active-users-list":"workspace_presence_active-users-list_VzK-2","session-icon":"workspace_presence_session-icon_lzaZ6","active-users-opened":"workspace_presence_active-users-opened_EWyvR","users-num":"workspace_presence_users-num_2zRDj","spin-animation":"workspace_presence_spin-animation_g1IPu"}
{"button-primary":"workspace_presence_button-primary_As6Ix","button-secondary":"workspace_presence_button-secondary_wChpa","button-tertiary":"workspace_presence_button-tertiary_XLZQY","button-radio":"workspace_presence_button-radio_2Zu0B","button-warning":"workspace_presence_button-warning_D0Gxb","button-disabled":"workspace_presence_button-disabled_oxzIp","button-tag":"workspace_presence_button-tag_Hp7-u","button-icon":"workspace_presence_button-icon_wQdM5","button-icon-small":"workspace_presence_button-icon-small_cxrR5","link":"workspace_presence_link_vEQGI","asset-element":"workspace_presence_asset-element_ALwzT","input-element":"workspace_presence_input-element_RNUbU","new-scrollbar":"workspace_presence_new-scrollbar_u3DSM","menu-dropdown":"workspace_presence_menu-dropdown_pc2zP","menu-item":"workspace_presence_menu-item_QIKwl","shortcut":"workspace_presence_shortcut_nbmw6","shortcut-key":"workspace_presence_shortcut-key_w0Pys","user-icon":"workspace_presence_user-icon_hDghc","active-users":"workspace_presence_active-users_wkbu6","active-users-list":"workspace_presence_active-users-list_VzK-2","session-icon":"workspace_presence_session-icon_lzaZ6","active-users-opened":"workspace_presence_active-users-opened_EWyvR","users-num":"workspace_presence_users-num_2zRDj","spin-animation":"workspace_presence_spin-animation_g1IPu"}

View file

@ -1 +1 @@
{"button-primary":"workspace_right_header_button-primary_85-jx","button-secondary":"workspace_right_header_button-secondary_3-qmf","button-tertiary":"workspace_right_header_button-tertiary_fRTli","workspace-header-right":"workspace_right_header_workspace-header-right_aEp3-","viewer-btn":"workspace_right_header_viewer-btn_NXJbl","history-section":"workspace_right_header_history-section_-2kJh","history-button":"workspace_right_header_history-button_UqeiD","comments-section":"workspace_right_header_comments-section_jUB3P","comments-btn":"workspace_right_header_comments-btn_1Caqy","zoom-section":"workspace_right_header_zoom-section_8qteN","dropdown":"workspace_right_header_dropdown_5j2hb","basic-zoom-bar":"workspace_right_header_basic-zoom-bar_3NdtC","reset-btn":"workspace_right_header_reset-btn_mvSYS","zoom-btns":"workspace_right_header_zoom-btns_XP7R1","zoom-btn":"workspace_right_header_zoom-btn_RDxOf","button-warning":"workspace_right_header_button-warning_h6czX","button-disabled":"workspace_right_header_button-disabled_DaXuQ","button-tag":"workspace_right_header_button-tag_k9kn3","button-icon":"workspace_right_header_button-icon_ONOzL","persistence-status-widget":"workspace_right_header_persistence-status-widget_wcska","status-icon":"workspace_right_header_status-icon_D6pD5","zoom-icon":"workspace_right_header_zoom-icon_hzk3v","zoom-widget":"workspace_right_header_zoom-widget_zFiLv","icon":"workspace_right_header_icon_4xmYx","button-icon-small":"workspace_right_header_button-icon-small_9J3iP","link":"workspace_right_header_link_d9QnH","asset-element":"workspace_right_header_asset-element_i-xUp","new-scrollbar":"workspace_right_header_new-scrollbar_i-KWQ","menu-dropdown":"workspace_right_header_menu-dropdown_0AKsJ","menu-item":"workspace_right_header_menu-item_ZJVN4","zoom-option":"workspace_right_header_zoom-option_fpEoB","shortcut":"workspace_right_header_shortcut_y3tfM","shortcuts":"workspace_right_header_shortcuts_HBkyp","shortcut-key":"workspace_right_header_shortcut-key_fg92X","user-icon":"workspace_right_header_user-icon_kP9lj","users-section":"workspace_right_header_users-section_kq2VA","label":"workspace_right_header_label_gBAC0","selected":"workspace_right_header_selected_ChwQW","zoom-text":"workspace_right_header_zoom-text_-xaiw","pending-status":"workspace_right_header_pending-status_GAQfv","saving-status":"workspace_right_header_saving-status_pUkV7","spin-animation":"workspace_right_header_spin-animation_XH76b","saved-status":"workspace_right_header_saved-status_kWULe","error-status":"workspace_right_header_error-status_Gchf-"}
{"button-primary":"workspace_right_header_button-primary_85-jx","button-secondary":"workspace_right_header_button-secondary_3-qmf","button-tertiary":"workspace_right_header_button-tertiary_fRTli","workspace-header-right":"workspace_right_header_workspace-header-right_aEp3-","viewer-btn":"workspace_right_header_viewer-btn_NXJbl","history-section":"workspace_right_header_history-section_-2kJh","history-button":"workspace_right_header_history-button_UqeiD","comments-section":"workspace_right_header_comments-section_jUB3P","comments-btn":"workspace_right_header_comments-btn_1Caqy","zoom-section":"workspace_right_header_zoom-section_8qteN","dropdown":"workspace_right_header_dropdown_5j2hb","basic-zoom-bar":"workspace_right_header_basic-zoom-bar_3NdtC","reset-btn":"workspace_right_header_reset-btn_mvSYS","zoom-btns":"workspace_right_header_zoom-btns_XP7R1","zoom-btn":"workspace_right_header_zoom-btn_RDxOf","button-radio":"workspace_right_header_button-radio_3F9rH","button-warning":"workspace_right_header_button-warning_h6czX","button-disabled":"workspace_right_header_button-disabled_DaXuQ","button-tag":"workspace_right_header_button-tag_k9kn3","button-icon":"workspace_right_header_button-icon_ONOzL","persistence-status-widget":"workspace_right_header_persistence-status-widget_wcska","status-icon":"workspace_right_header_status-icon_D6pD5","zoom-icon":"workspace_right_header_zoom-icon_hzk3v","zoom-widget":"workspace_right_header_zoom-widget_zFiLv","icon":"workspace_right_header_icon_4xmYx","button-icon-small":"workspace_right_header_button-icon-small_9J3iP","link":"workspace_right_header_link_d9QnH","asset-element":"workspace_right_header_asset-element_i-xUp","input-element":"workspace_right_header_input-element_93EMC","new-scrollbar":"workspace_right_header_new-scrollbar_i-KWQ","menu-dropdown":"workspace_right_header_menu-dropdown_0AKsJ","menu-item":"workspace_right_header_menu-item_ZJVN4","zoom-option":"workspace_right_header_zoom-option_fpEoB","shortcut":"workspace_right_header_shortcut_y3tfM","shortcuts":"workspace_right_header_shortcuts_HBkyp","shortcut-key":"workspace_right_header_shortcut-key_fg92X","user-icon":"workspace_right_header_user-icon_kP9lj","users-section":"workspace_right_header_users-section_kq2VA","label":"workspace_right_header_label_gBAC0","selected":"workspace_right_header_selected_ChwQW","zoom-text":"workspace_right_header_zoom-text_-xaiw","pending-status":"workspace_right_header_pending-status_GAQfv","saving-status":"workspace_right_header_saving-status_pUkV7","spin-animation":"workspace_right_header_spin-animation_XH76b","saved-status":"workspace_right_header_saved-status_kWULe","error-status":"workspace_right_header_error-status_Gchf-"}

View file

@ -54,10 +54,10 @@
background-color: var(--button-tertiary-background-color-selected);
border: $s-2 solid var(--button-tertiary-border-color-selected);
.label {
color: var(--button-tertiary-foreground-color-selected);
color: var(--button-tertiary-foreground-color-active);
}
.icon svg {
stroke: var(--button-tertiary-foreground-color-selected);
stroke: var(--button-tertiary-foreground-color-active);
}
}
}
@ -83,6 +83,7 @@
@include flexCenter;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
&:hover {
@ -134,6 +135,7 @@
width: $s-28;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
height: $s-16;
width: $s-16;
}
@ -141,7 +143,7 @@
background-color: var(--button-tertiary-background-color-selected);
border: $s-2 solid var(--button-tertiary-border-color-selected);
svg {
stroke: var(--button-tertiary-foreground-color-selected);
stroke: var(--button-tertiary-foreground-color-active);
}
}
}
@ -155,6 +157,7 @@
width: $s-28;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
height: $s-16;
width: $s-16;
}
@ -162,7 +165,7 @@
background-color: var(--button-tertiary-background-color-selected);
border: $s-2 solid var(--button-tertiary-border-color-selected);
svg {
stroke: var(--button-tertiary-foreground-color-selected);
stroke: var(--button-tertiary-foreground-color-active);
}
}
}
@ -209,6 +212,7 @@
height: $s-28;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
height: $s-16;
width: $s-16;
}

View file

@ -5,7 +5,7 @@
;; Copyright (c) KALEIDOS INC
(ns app.main.ui.workspace.sidebar
(:require-macros [app.main.style :refer [css]])
(:require-macros [app.main.style :as stl])
(:require
[app.common.data.macros :as dm]
[app.main.data.workspace :as dw]
@ -59,28 +59,24 @@
[:aside {:ref parent-ref
:id "left-sidebar-aside"
:data-size size
:class (if ^boolean new-css-system
(dom/classnames (css :left-settings-bar) true
:two-row (<= size 300)
:three-row (and (> size 300) (<= size 400))
:four-row (> size 400))
(dom/classnames :settings-bar true
:settings-bar-left true
:two-row (<= size 300)
:three-row (and (> size 300) (<= size 400))
:four-row (> size 400)))
:class (stl/css-case new-css-system
:old-css/settings-bar true
:old-css/settings-bar-left true
:left-settings-bar true
:global/two-row (<= size 300)
:global/three-row (and (> size 300) (<= size 400))
:global/four-row (> size 400))
:style #js {"--width" (dm/str size "px")}}
(when new-css-system
[:& left-header {:file file :layout layout :project project :page-id page-id}])
[:div {:on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move
:class (if ^boolean new-css-system
(dom/classnames (css :resize-area) true)
(stl/css :resize-area)
(dom/classnames :resize-area true))}]
[:div {:class (if ^boolean new-css-system
(dom/classnames (css :settings-bar-inside) true)
(stl/css :settings-bar-inside)
(dom/classnames :settings-bar-inside true))}
(cond
(true? shortcuts?)
@ -91,7 +87,7 @@
:else
(if ^boolean new-css-system
[:div {:class (dom/classnames (css :tabs-wrapper) true)}
[:div {:class (stl/css :tabs-wrapper)}
[:& tab-container
{:on-change-tab on-tab-change
:selected section
@ -100,7 +96,7 @@
:handle-collapse handle-collapse
:klass :tab-spacing}
[:& tab-element {:id :layers :title (tr "workspace.sidebar.layers")}
[:div {:class (dom/classnames (css :layers-tab) true)}
[:div {:class (stl/css :layers-tab)}
[:& sitemap {:layout layout}]
[:& layers-toolbox {:size-parent size}]]]
@ -122,7 +118,7 @@
:handle-collapse handle-collapse}
[:& tabs-element {:id :layers :title (tr "workspace.sidebar.layers")}
[:div {:class (dom/classnames :layers-tab true)}
[:div {:class :layers-tab}
[:& sitemap {:layout layout}]
[:& layers-toolbox {:size-parent size}]]]
@ -174,26 +170,25 @@
(obj/set! "on-change-section" handle-change-section)
(obj/set! "on-expand" handle-expand))]
[:aside {:class (if ^boolean new-css-system
(dom/classnames (css :settings-bar) true
(css :right-settings-bar) true
(css :not-expand) (not can-be-expanded?)
(css :expanded) (> size 276))
(dom/classnames :settings-bar true
:settings-bar-right true
:not-expand (not can-be-expanded?)))
[:aside {:class (stl/css-case new-css-system
:old-css/settings-bar true
:old-css/settings-bar-right true
:right-settings-bar true
:not-expand (not can-be-expanded?)
:expanded (> size 276))
:id "right-sidebar-aside"
:data-size size
:style #js {"--width" (when can-be-expanded? (dm/str size "px"))}}
(when can-be-expanded?
[:div.resize-area
{:on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move}])
[:div {:class (stl/css new-css-system :resize-area)
:on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move}])
(when new-css-system
[:& right-header {:file file :layout layout :page-id page-id}])
[:div.settings-bar-inside
[:div {:class (stl/css new-css-system :settings-bar-inside)}
(cond
(true? is-comments?)
[:& comments-sidebar]

View file

@ -1 +1 @@
{"button-primary":"workspace_sidebar_button-primary_K7xW6","button-secondary":"workspace_sidebar_button-secondary_e2eQE","button-tertiary":"workspace_sidebar_button-tertiary_QKqHT","button-warning":"workspace_sidebar_button-warning_7I8Ar","button-disabled":"workspace_sidebar_button-disabled_ao3sM","button-tag":"workspace_sidebar_button-tag_Xc0Sm","button-icon":"workspace_sidebar_button-icon_OXdmL","button-icon-small":"workspace_sidebar_button-icon-small_EYb9x","link":"workspace_sidebar_link_9CZLn","asset-element":"workspace_sidebar_asset-element_vzrfV","new-scrollbar":"workspace_sidebar_new-scrollbar_zGNNO","menu-dropdown":"workspace_sidebar_menu-dropdown_yPcl7","menu-item":"workspace_sidebar_menu-item_eS58p","shortcut":"workspace_sidebar_shortcut_FO4pn","shortcut-key":"workspace_sidebar_shortcut-key_fS0-y","user-icon":"workspace_sidebar_user-icon_SzjFB","left-settings-bar":"workspace_sidebar_left-settings-bar_7co5t","resize-area":"workspace_sidebar_resize-area_ny1v0","settings-bar-inside":"workspace_sidebar_settings-bar-inside_YnFv8","tabs-wrapper":"workspace_sidebar_tabs-wrapper_YDo4o","layers-tab":"workspace_sidebar_layers-tab_soxRL","right-settings-bar":"workspace_sidebar_right-settings-bar_bGP1x","not-expand":"workspace_sidebar_not-expand_YltWC","expanded":"workspace_sidebar_expanded_SOYSs","spin-animation":"workspace_sidebar_spin-animation_CNSmq"}
{"button-primary":"workspace_sidebar_button-primary_K7xW6","button-secondary":"workspace_sidebar_button-secondary_e2eQE","button-tertiary":"workspace_sidebar_button-tertiary_QKqHT","button-radio":"workspace_sidebar_button-radio_-xIrt","button-warning":"workspace_sidebar_button-warning_7I8Ar","button-disabled":"workspace_sidebar_button-disabled_ao3sM","button-tag":"workspace_sidebar_button-tag_Xc0Sm","button-icon":"workspace_sidebar_button-icon_OXdmL","button-icon-small":"workspace_sidebar_button-icon-small_EYb9x","link":"workspace_sidebar_link_9CZLn","asset-element":"workspace_sidebar_asset-element_vzrfV","input-element":"workspace_sidebar_input-element_I6EUI","new-scrollbar":"workspace_sidebar_new-scrollbar_zGNNO","menu-dropdown":"workspace_sidebar_menu-dropdown_yPcl7","menu-item":"workspace_sidebar_menu-item_eS58p","shortcut":"workspace_sidebar_shortcut_FO4pn","shortcut-key":"workspace_sidebar_shortcut-key_fS0-y","user-icon":"workspace_sidebar_user-icon_SzjFB","left-settings-bar":"workspace_sidebar_left-settings-bar_7co5t","resize-area":"workspace_sidebar_resize-area_ny1v0","settings-bar-inside":"workspace_sidebar_settings-bar-inside_YnFv8","tabs-wrapper":"workspace_sidebar_tabs-wrapper_YDo4o","layers-tab":"workspace_sidebar_layers-tab_soxRL","right-settings-bar":"workspace_sidebar_right-settings-bar_bGP1x","not-expand":"workspace_sidebar_not-expand_YltWC","expanded":"workspace_sidebar_expanded_SOYSs","spin-animation":"workspace_sidebar_spin-animation_CNSmq"}

View file

@ -48,11 +48,22 @@ $width-settings-bar-max: $s-500;
.right-settings-bar {
grid-area: right-sidebar;
width: $width-settings-bar;
background-color: var(--panel-background-color);
height: 100%;
&.not-expand {
max-width: $width-settings-bar;
}
&.expanded {
width: var(--width, $width-settings-bar);
}
.resize-area {
position: absolute;
height: 100%;
width: $s-8;
z-index: $z-index-3;
cursor: ew-resize;
}
.settings-bar-inside {
height: calc(100vh - $s-52);
}
}

View file

@ -1 +1 @@
{"button-primary":"sidebar_assets_button-primary_a9p4J","button-secondary":"sidebar_assets_button-secondary_hbgBA","assets-bar":"sidebar_assets_assets-bar_gzAPj","assets-header":"sidebar_assets_assets-header_aFHCj","search-wrapper":"sidebar_assets_search-wrapper_n5kE7","sort-button":"sidebar_assets_sort-button_UvVYu","libraries-button":"sidebar_assets_libraries-button_cKUY7","button-tertiary":"sidebar_assets_button-tertiary_KoPen","button-warning":"sidebar_assets_button-warning_AZ4xH","button-disabled":"sidebar_assets_button-disabled_NuzXS","button-tag":"sidebar_assets_button-tag_yzpPm","button-icon":"sidebar_assets_button-icon_M5Yy6","libraries-icon":"sidebar_assets_libraries-icon_ikusB","button-icon-small":"sidebar_assets_button-icon-small_xZWe1","link":"sidebar_assets_link_klBJ9","asset-element":"sidebar_assets_asset-element_xHJzG","new-scrollbar":"sidebar_assets_new-scrollbar_2SXio","menu-dropdown":"sidebar_assets_menu-dropdown_YLEyF","menu-item":"sidebar_assets_menu-item_NV7hO","shortcut":"sidebar_assets_shortcut_4ngAb","shortcut-key":"sidebar_assets_shortcut-key_H48e8","user-icon":"sidebar_assets_user-icon_p-VBP","section-button":"sidebar_assets_section-button_RSjn8","sections-container":"sidebar_assets_sections-container_r2YTM","section-item":"sidebar_assets_section-item_u6EYM","section-btn":"sidebar_assets_section-btn_s4h2P","libraries-wrapper":"sidebar_assets_libraries-wrapper_agaHg","spin-animation":"sidebar_assets_spin-animation_ReXkJ"}
{"button-primary":"sidebar_assets_button-primary_a9p4J","button-secondary":"sidebar_assets_button-secondary_hbgBA","assets-bar":"sidebar_assets_assets-bar_gzAPj","assets-header":"sidebar_assets_assets-header_aFHCj","search-wrapper":"sidebar_assets_search-wrapper_n5kE7","sort-button":"sidebar_assets_sort-button_UvVYu","libraries-button":"sidebar_assets_libraries-button_cKUY7","button-tertiary":"sidebar_assets_button-tertiary_KoPen","button-radio":"sidebar_assets_button-radio_d2iG-","button-warning":"sidebar_assets_button-warning_AZ4xH","button-disabled":"sidebar_assets_button-disabled_NuzXS","button-tag":"sidebar_assets_button-tag_yzpPm","button-icon":"sidebar_assets_button-icon_M5Yy6","libraries-icon":"sidebar_assets_libraries-icon_ikusB","button-icon-small":"sidebar_assets_button-icon-small_xZWe1","link":"sidebar_assets_link_klBJ9","asset-element":"sidebar_assets_asset-element_xHJzG","input-element":"sidebar_assets_input-element_IZ5nI","new-scrollbar":"sidebar_assets_new-scrollbar_2SXio","menu-dropdown":"sidebar_assets_menu-dropdown_YLEyF","menu-item":"sidebar_assets_menu-item_NV7hO","shortcut":"sidebar_assets_shortcut_4ngAb","shortcut-key":"sidebar_assets_shortcut-key_H48e8","user-icon":"sidebar_assets_user-icon_p-VBP","section-button":"sidebar_assets_section-button_RSjn8","sections-container":"sidebar_assets_sections-container_r2YTM","section-item":"sidebar_assets_section-item_u6EYM","section-btn":"sidebar_assets_section-btn_s4h2P","libraries-wrapper":"sidebar_assets_libraries-wrapper_agaHg","spin-animation":"sidebar_assets_spin-animation_ReXkJ"}

View file

@ -26,6 +26,7 @@
svg {
@include flexCenter;
@extend .button-icon;
stroke: var(--icon-foreground);
}
}
&:hover {
@ -107,6 +108,7 @@
overflow: auto;
display: flex;
flex-direction: column;
padding-left: $s-8;
height: calc(100% - $s-80);
overflow-y: auto;
overflow-x: hidden;
@ -124,6 +126,7 @@
border-radius: $br-8;
svg {
@extend .button-icon-small;
stroke: var(--icon-foreground);
}
}
}

View file

@ -1 +1 @@
{"button-primary":"assets_colors_button-primary_6ZMmx","button-secondary":"assets_colors_button-secondary_dNSLH","button-tertiary":"assets_colors_button-tertiary_h20-o","assets-btn":"assets_colors_assets-btn_t8DHG","button-warning":"assets_colors_button-warning_e-BA5","button-disabled":"assets_colors_button-disabled_yPxKS","button-tag":"assets_colors_button-tag_ux-NH","button-icon":"assets_colors_button-icon_f-EVH","button-icon-small":"assets_colors_button-icon-small_zq8dv","link":"assets_colors_link_8J5CV","asset-element":"assets_colors_asset-element_XSxD1","new-scrollbar":"assets_colors_new-scrollbar_wIoIr","menu-dropdown":"assets_colors_menu-dropdown_WpZbI","menu-item":"assets_colors_menu-item_jPeYs","shortcut":"assets_colors_shortcut_4XD-P","shortcut-key":"assets_colors_shortcut-key_s2Qcm","user-icon":"assets_colors_user-icon_Pxni6","colors-group":"assets_colors_colors-group_fUsuo","asset-list":"assets_colors_asset-list_wMm1l","asset-list-item":"assets_colors_asset-list-item_ZFtXC","bullet-block":"assets_colors_bullet-block_ZRR2Y","name-block":"assets_colors_name-block_Zvmy3","default-name-only":"assets_colors_default-name-only_JFCGo","name":"assets_colors_name_AjZzr","default-name":"assets_colors_default-name_8gEAb","element-name":"assets_colors_element-name_ADGM8","selected":"assets_colors_selected_ElMu0","editing":"assets_colors_editing_FWnHU","grid-placeholder":"assets_colors_grid-placeholder_7wTFd","drop-space":"assets_colors_drop-space_lbzeC","dragging":"assets_colors_dragging_EmBOk","spin-animation":"assets_colors_spin-animation_zeSlr"}
{"button-primary":"assets_colors_button-primary_6ZMmx","button-secondary":"assets_colors_button-secondary_dNSLH","button-tertiary":"assets_colors_button-tertiary_h20-o","assets-btn":"assets_colors_assets-btn_t8DHG","button-radio":"assets_colors_button-radio_eRpxS","button-warning":"assets_colors_button-warning_e-BA5","button-disabled":"assets_colors_button-disabled_yPxKS","button-tag":"assets_colors_button-tag_ux-NH","button-icon":"assets_colors_button-icon_f-EVH","button-icon-small":"assets_colors_button-icon-small_zq8dv","link":"assets_colors_link_8J5CV","asset-element":"assets_colors_asset-element_XSxD1","input-element":"assets_colors_input-element_EDF5u","new-scrollbar":"assets_colors_new-scrollbar_wIoIr","menu-dropdown":"assets_colors_menu-dropdown_WpZbI","menu-item":"assets_colors_menu-item_jPeYs","shortcut":"assets_colors_shortcut_4XD-P","shortcut-key":"assets_colors_shortcut-key_s2Qcm","user-icon":"assets_colors_user-icon_Pxni6","colors-group":"assets_colors_colors-group_fUsuo","asset-list":"assets_colors_asset-list_wMm1l","asset-list-item":"assets_colors_asset-list-item_ZFtXC","bullet-block":"assets_colors_bullet-block_ZRR2Y","name-block":"assets_colors_name-block_Zvmy3","default-name-only":"assets_colors_default-name-only_JFCGo","name":"assets_colors_name_AjZzr","default-name":"assets_colors_default-name_8gEAb","element-name":"assets_colors_element-name_ADGM8","selected":"assets_colors_selected_ElMu0","editing":"assets_colors_editing_FWnHU","grid-placeholder":"assets_colors_grid-placeholder_7wTFd","drop-space":"assets_colors_drop-space_lbzeC","dragging":"assets_colors_dragging_EmBOk","spin-animation":"assets_colors_spin-animation_zeSlr"}

View file

@ -14,6 +14,7 @@
border-radius: $br-8;
svg {
@extend .button-icon;
stroke: var(--icon-foreground);
}
}

View file

@ -144,7 +144,7 @@
[:& title-bar {:collapsable? true
:collapsed? (not open?)
:on-collapsed #(st/emit! (dw/set-assets-section-open file-id section (not open?)))
:klass :title-spacing
:class (css :title-spacing)
:title (mf/html [:span {:class (dom/classnames (css :title-name) true)}
[:span {:class (dom/classnames (css :section-icon) true)}
[:& section-icon {:section section}]]

View file

@ -1 +1 @@
{"button-primary":"assets_common_button-primary_-eBqD","button-secondary":"assets_common_button-secondary_qo2kg","button-tertiary":"assets_common_button-tertiary_ApdBb","button-warning":"assets_common_button-warning_j5om7","button-disabled":"assets_common_button-disabled_0zHM3","button-tag":"assets_common_button-tag_MHJlj","button-icon":"assets_common_button-icon_0R1zt","button-icon-small":"assets_common_button-icon-small_5kQfO","link":"assets_common_link_LM4Ue","asset-element":"assets_common_asset-element_frsFR","new-scrollbar":"assets_common_new-scrollbar_JN2v-","menu-dropdown":"assets_common_menu-dropdown_l6JLU","menu-item":"assets_common_menu-item_d2IzY","shortcut":"assets_common_shortcut_Uk4nm","shortcut-key":"assets_common_shortcut-key_F0DUJ","user-icon":"assets_common_user-icon_rLf8F","asset-section":"assets_common_asset-section_uKhc8","title-name":"assets_common_title-name_ZOz9E","section-icon":"assets_common_section-icon_Kitcf","section-name":"assets_common_section-name_RVo-u","num-assets":"assets_common_num-assets_Dguaz","spin-animation":"assets_common_spin-animation_7inPz"}
{"button-primary":"assets_common_button-primary_-eBqD","button-secondary":"assets_common_button-secondary_qo2kg","button-tertiary":"assets_common_button-tertiary_ApdBb","button-radio":"assets_common_button-radio_L3d2d","button-warning":"assets_common_button-warning_j5om7","button-disabled":"assets_common_button-disabled_0zHM3","button-tag":"assets_common_button-tag_MHJlj","button-icon":"assets_common_button-icon_0R1zt","button-icon-small":"assets_common_button-icon-small_5kQfO","link":"assets_common_link_LM4Ue","asset-element":"assets_common_asset-element_frsFR","input-element":"assets_common_input-element_dsBzI","new-scrollbar":"assets_common_new-scrollbar_JN2v-","menu-dropdown":"assets_common_menu-dropdown_l6JLU","menu-item":"assets_common_menu-item_d2IzY","shortcut":"assets_common_shortcut_Uk4nm","shortcut-key":"assets_common_shortcut-key_F0DUJ","user-icon":"assets_common_user-icon_rLf8F","asset-section":"assets_common_asset-section_uKhc8","title-name":"assets_common_title-name_ZOz9E","section-icon":"assets_common_section-icon_Kitcf","section-name":"assets_common_section-name_RVo-u","num-assets":"assets_common_num-assets_Dguaz","title-spacing":"assets_common_title-spacing_N2qKx","spin-animation":"assets_common_spin-animation_7inPz"}

Some files were not shown because too many files have changed in this diff Show more