Bona – Health & Medical React JS Template
Documentation

Bona – Health & Medical React JS Template

Welcome

We hope you will enjoy it!

If you have any questions that are beyond the scope of this documentation, please feel free to contact us via our Support System and our support team will be glad to help you out.

  • Documentation Created: January 2021
  • Documentation Last Update: April 2023
  • View Changelog

Template Structure

  • You can find all files in “app” folder
  • In “app” folder you will see “public” and “src” folders
  • “public” folder contains all ready-to-use files required for the project’s latest build
  • “src” folder contains all sources for your work
  • SASS, images, fonts, icons files you can find in “assets” folder
  • SASS files you can find in “src/assets/sass” folder
  • Fonts you can find in “src/assets/fonts” folder
  • The design of blocks can be found in “src/blocks”
  • The design of components can be found in “src/components”
  • The design of pages can be found in “src/pages”
  • The content data of pages, blocks or components can be found in “src/data”
  • You can find all UI elements in “src/pages/UserInterface.js” file or in “src/components/ui” folder

Template Features

  • React JS platform
  • React JS Ajax forms
  • React JS API configuration prepared with Axios
  • No jQuery dependency
  • Professional and creative design
  • Free Google fonts
  • Clean typography
  • Vector icons
  • Bootstrap framework
  • Fully responsive pages
  • SASS
  • W3C validated code
  • Clean & Well-documented code
  • SEO friendly code
  • Easy to customize
  • Easy to find the files name, folder, layers, groups
  • All files are well commented
  • UI included
  • Professional support
  • Lifetime updates

Scripts

Graphic Source

Please note: All images are just used for preview purpose only and not included in the final purchase files.

How to edit the template

If you want to edit some SASS, JS files, the best way to use sources in “src” folder. You need “node.js” and “yarn” already installed.

  1. Open “cmd” and go to the projects folder
  2. Run “yarn” install to install all project dependencies
  3. Run “yarn” start to run the local server and start watching changes

How to work with design

  • Find src folder which includes all React JS files

How to edit content

  • Content of specific blocks can be edited in “data” folder. The data is in “JSON” format

How to edit SASS

  • To change SASS open “src/assets/sass” folder
  • “style.scss” – main file which import all files
  • Blocks files you can find in “blocks” folder
  • Components files you can find in “components” folder
  • Content files you can find in “content” folder
  • Layout files you can find in “layout” folder
  • Utilities files you can find in “utilities” folder
  • You can change colors, padding of global components in “_variables.scss” file. File is well documented
  • You can change fonts globally in “_font.scss” file. File is well documented
  • You can change font-size, line-height and all of typography parameters in “content/_typography.scss”. File is well documented
  • Some of the default Bootstrap variables are rewritten in “_bootstrap-style-rewrite.scss”. Your own values can be defined. File is well documented

Watch “src/pages/UserInterface.js” file to see how you can change buttons’ color, sizes etc.

How to build a project

  • Run “yarn build” to build a production version of the website which will be in “build” folder

Contacts

If you have any questions or need customization, please contact us via our Support System. We will help you as soon as possible!

Support Link: https://store.adveits.com/my-account/tickets/