* Update BB logo to black * Update top nav bar and core layout * Add redesign for apps pages * Update user and groups pages * More WIP portal redesign! * Fix top nav colours and fix selected tab not updating * Remove log * Update copy on settings pages * Update and standardise page headers and subtitles, and remove side nav titles * Update font styles to allow for easy customisation * Update button styles to always use newStyles, update auth page styles * Update settings pages to new designs * Update structure for account pages * Add initial rewrite of app overview section * Update config checklist to properly center * Update app overview version and name/url screens * Add tooltip to explain why URL cannot be changed until unpublishing * Update overview automation history tab * Update overview backups page * Rewrite app overview access tab * Update table hover colours * Remove scrolling from tables when not required and stop selects from updating their own state locally * Update table styles to support flexible column widths much better * Fix extremely long strings in breadcrumbs not wrapping * Fix multiple issues with long text overflow * Fix flashing in version settings page * Fix loading bugs in app backups page * Add sidebar for portal and use it for automation history. Fix multiple overflow and scrolling issues * Tidy up * Update user details page to use tables and match designs * Update users detail page * Update user and group details pages with new tables * Fix automation error linking from apps page and improve automation fetching logic in automation history * Move theme and API key into user profile dropdown instead of settings * Move settings before account and show plugins for devs * Convert plugins page to table and update components and modals * Update links when going back from the builder * Update plugin search placeholder * Fix URLs in app overview * Properly handle text overflow in plugins table * Remove getting started checklist * Fix checklist removal and fix profile modal * Update email details page to match new designs * Cleanup * Add licensing and env logic to determine which account links to show * Update upgrade button URL for cloud accounts * Update app list to use a more compact style * Make core page layout responsive and update apps list to be responsive * Update mobile design of apps page * Update more pages to be responsive and add mobile specific components * Refactor main portal page into multiple components * Update multiple pages to be responsive and improve loading experience * Make automation history page responsive * Update backups page to be responsive * Update pickers to use absolutely positioned root popover so that overflow does not matter * Fix some responsive styles * Fix update link in app overview * Improve dropdown logic * Lint * Update click outside handler to handle modals properly * Remove log * Fix mobile menu upgrade button not closing menu * Hide groups page if disabled at tenant level * Centralise menu logic and show full menu on mobile * Update app access assignment and fix backups table * Ensure avatars cannot be squished * Standardise disabled field text colour * Allow developer users to access users, groups and usage pages * Allow readonly access to users and groups for developer users * Remove logs * Improve users page loading experience * Improve responsiveness on apps list page and fix discussions link styles * Update spacing on user and group detail page and fix usage page showing wrong copy * Fix logo override not working * Pin minio version to an old one that supports the fs backend in dev * Shrink upgrade button * Shrink user dropdown * Update assignment modal text * Remove clickable visual styles from plugins * Always show groups section in app access page * Update app overview button styles to include more CTAs * Hide edit and view links in more menu on overview page unless on mobile * Make usage stats responsive and fix layout issues * Add comment to docker-compose config |
||
---|---|---|
.. | ||
src | ||
.gitignore | ||
LICENSE | ||
package.json | ||
README.md | ||
rollup.config.js | ||
yarn.lock |
Budibase bbui
A package that handles all common components across the Budibase organisation. You can find the current live version Here.
Install
- Clone
npm install
npm run svench
(Note: yarn won't work!)
Example workflow to create a component
- Create a file:
Headline.svelte
- Create a Svench file:
Headline.svench
- Build component and add variants to the Svench file.
- Once done, re-export the file in
src/index.js
. - Publish, update the package in the main project and profit.
Guidelines
Making components
- Think about re-usability
- Use the css custom properties (variables) that are in the css stylesheet. This makes it easy to tweak things later down the line.
- Opt to forward events (
<button on:click>
for example) rather than using callbacks. - Avoid adding margins to the outermost container of the component.
Using components and the styleguide
- Get familiar with the different props that exist on the component. If something vital is missing, make a PR and add it.
- Take advantage of the css custom properties in the stylesheet and avoid writing hard-coded values.
- Since there is no margin on the components, think about the structure of the DOM and how to achieve correct spacing, etc. This can be done using
css grid
+grid gap
or with a container div where you specify a padding or margin. The best solution depends on the circumstance.
TODO
- Figure out a good documentation situation
- Add testing suite (E2E using Playwright?)
Other
The project uses Svench. It is somewhat akin to Storybook but a lot less bloated and much easier to setup. It also supports HMR for quick development.