feat: dark theme, font icons

courtesy of https://github.com/tailwindlabs/heroicons
2023-09-26 15:21:03 +00:00
parent 0f30e1fc41
commit 51319b036b
4 changed files with 226 additions and 147 deletions
--- a/16-countries-page-from-api/tailwind.config.js
+++ b/16-countries-page-from-api/tailwind.config.js
@@ -1,11 +1,14 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
  content: ["./src/main/resources/**/*.html"],
+  darkMode: 'class',
  theme: {
    extend: {
      colors: {
-        'dark-gray': 'hsl(0, 0%, 52%)',
-        'very-light-gray': 'hsl(0, 0%, 98%)',
+        'dark-gray': 'hsl(0, 0%, 52%)', // light mode input
+        'very-light-gray': 'hsl(0, 0%, 98%)', // light mode bg
+        'dark-blue': 'hsl(209, 23%, 22%)', // dark mode elements
+        'very-dark-blue': 'hsl(207, 26%, 17%)', // dark mode bg
      },
      fontFamily: {
        'sans': ['NunitoSans', 'sans-serif'],