fix: theme override replace logic

[mauliksoni110]

@rogden I think we will need to apply the override replacement logic before we use the resolveTailwindConfig.
So that it applies to all the borderColor, backgroundColor, etc

[rogden]

Thanks for highlighting the issue and the PR! I need to rethink the approach to handle the theme replacements. With your fix, it will operate on the object returned from the tailwind.config file. This makes sense as it will be parsed for replacements before it is resolved by Tailwind and values such as colors are copied to backgroundColor, textColor etc. However, it will get complicated as config values can be nested under extends, at the top level of the theme object, and functions i.e. fill: theme => theme('colors'). My hunch is a to do a simple find/replace for the replacement string in the resolved JSON. Instead of:

module.exports = {
  theme: {
    colors: {
      black: 'var(--color-black)'
    },
    configViewer: {
      themeReplacements: {
        colors: {
          black: '#000000'
        }
      }
    }
  }
}

The new format would be

module.exports = {
  theme: {
    colors: {
      black: 'var(--color-black)'
    },
    configViewer: {
      themeReplacements: {
        'var(--color-black)': '#000000'
      }
    }
  }
}

And the logic will be updated to a simple string find/replace on the resolved JSON.

[rogden]

@mauliksoni110 Hey. What was the issue/bug that this commit fixes?

[mauliksoni110]

@rogden that was something I was trying to install the repo locally from Github.
I see that you have updated the logic in the latest release(s), thanks!
We can disregard this PR.