Order Summary Component Using Bootstrap

Community feedback

• 

  Samuel M. Setiawan•200

  @samuelms21Posted about 2 years ago

  Hello there! Good job on making this one. My tips on learning Bootstrap is just to keep making websites and layouts, that's how I got used to it. I would browse on dribbble.com and search for landing page designs, and I try to replicate them using Bootstrap.

  Here are also some improvements you can make to your project:

  • Change your font-family to the specified font family in the style-guide, which is Red Hat Display. You can find this font and import it to your HTML/CSS from Google Fonts. One way to do it, is to copy and paste this following code to the top of your CSS document:

  @import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@500;700;900&display=swap');
  

  And since this project uses the same font-family for all components you can do this in CSS to apply the font-family change:

  * {
      font-family: 'Red Hat Display', sans-serif;
  }
  

  • You can add more border-radius on your call-to-action button. You can do this with plain CSS, or you can use Bootstrap by adding the "rounded-{num}" class in your HTML element. Here is the link to the documentation page: https://getbootstrap.com/docs/5.2/utilities/borders/#radius

  Marked as helpful

  1