Responsive solution using tailwind CSS and vanilla JavaScript

Community feedback

• 

  Brian Nelson•150

  @briannelson95Posted over 1 year ago

  Great job completing this challenge!

  My suggestion for using tailwind and adding custom colors to tailwind is to use the extend function in the tailwind config.

  /** @type {import('tailwindcss').Config} */
  module.exports = {
      content: ["./dist/*.{html,js}"], 
      theme: {
          extend: {
              colors: {
                  'rating-orange': 'hsl(25, 97%, 53%)',
                  'rating-white': 'hsl(0, 0%, 100%)',
                  'rating-very-dark-blue': 'hsl(216, 12%, 8%)',
                  'rating-light-gray': 'hsl(217, 12%, 63%)',
                  'rating-medium-gray': 'hsl(216, 12%, 54%)',
                  'rating-dark-blue': 'hsl(213, 19%, 18%)',
              }
          },
      },
      }, plugins: [],
  }
  

  This will allow you to keep all of the built in color options that tailwind comes with while still being able to add custom colors

  Marked as helpful

  1