ByoungSooPark/modeling-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prepare command bar to support modeling commands (#1184)

Browse Source 
* Tweak toaster look and feel

* Add icons, tweak plus icon names

* Rename commandBarMeta to commandBarConfig

* Refactor command bar, add support for icons

* Create a tailwind plugin for aria-pressed button state

* Remove overlay from behind command bar

* Clean up toolbar

* Button and other style tweaks

* Icon tweaks follow-up: make old icons work with new sizing

* Delete unused static icons

* More CSS tweaks

* Small CSS tweak to project sidebar

* Add command bar E2E test

* fumpt

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* fix typo in a comment

* Fix icon padding (built version only)

* Update onboarding and warning banner icons padding

* Misc minor style fixes

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
This commit is contained in:
Frank Noirot
2023-12-06 14:44:13 -05:00
committed by GitHub
parent 38119d5a3b
commit 3ae5393dd7
51 changed files with 1197 additions and 1122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/FileTree.tsx
View File

@ -325,16 +325,17 @@ export const FileTree = ({
return (
<div className={className}>
<div className="flex items-center gap-1 px-4 py-1 bg-chalkboard-30/50 dark:bg-chalkboard-70/50">
<div className="flex items-center gap-1 px-4 py-1 bg-chalkboard-20/50 dark:bg-chalkboard-80/50 border-b border-b-chalkboard-30 dark:border-b-chalkboard-80">
<h2 className="flex-1 m-0 p-0 text-sm mono">Files</h2>
<ActionButton
Element="button"
icon={{
icon: 'createFile',
icon: 'filePlus',
iconClassName: '!text-energy-80 dark:!text-energy-20',
bgClassName: 'hover:bg-energy-10/50 dark:hover:bg-transparent',
bgClassName:
'bg-chalkboard-20/50 hover:bg-energy-10/50 dark:hover:bg-transparent',
}}
className="!p-0 border-none bg-transparent !outline-none"
className="!p-0 bg-transparent !outline-none"
onClick={createFile}
>
<Tooltip position="inlineStart" delay={750}>
@ -345,11 +346,12 @@ export const FileTree = ({
<ActionButton
Element="button"
icon={{
icon: 'createFolder',
icon: 'folderPlus',
iconClassName: '!text-energy-80 dark:!text-energy-20',
bgClassName: 'hover:bg-energy-10/50 dark:hover:bg-transparent',
bgClassName:
'bg-chalkboard-20/50 hover:bg-energy-10/50 dark:hover:bg-transparent',
}}
className="!p-0 border-none bg-transparent !outline-none"
className="!p-0 bg-transparent !outline-none"
onClick={createFolder}
>
<Tooltip position="inlineStart" delay={750}>