Skip to main content
All CollectionsTutorialsLow-code follow along videos
Change the color of success buttons
Change the color of success buttons

The third tutorial shows how to make our first changes to the codebase settings using code.

Thomas Rocca avatar
Written by Thomas Rocca
Updated over a week ago

This is the third tutorial in the low-code development series. Follow-along to learn how to change the color of success buttons. Success buttons are call-to-action buttons like the sign-up button, login button, or checkout button.

An update has been made since the video was published: It is now possible to change the color of buttons without any customization with code, in Console. By default, the success button color now comes from hosted assets configured in Console. Learn more about how to change success color buttons in Console.

The CSS variables mentioned in the tutorial still exist, but they are used more rarely. You can still use this video and information to learn more about the codebase or set more granular button color behavior.

Chapters

  1. Find and change button color in the codebase (00:33)

  2. Push changes to the remote repository (04:26)

Commands and resources used in this video

Run your template locally

yarn run dev

Change the color

Replace the existing colorSuccess and colorSuccessDark rows with these values in src/styles/marketplaceDefaults.js.

  • colorSuccess: #2ecca0

  • colorSuccessDark: #23997c

View your commit history

git log --oneline

To exit the log view

Type q for "quit."

Push your changes to your remote repository

git push origin main

Additional developer documentation

More information on how to change your marketplace look and feel can be found in Sharetribe's Developer Documentation site. We recommend:

Next

The next video tutorial shows how to change the font used in the marketplace. Click here to go to this tutorial.

Did this answer your question?