fix: NativeWind color palette broken — colors.json never registered in tailwind.config.js

[Josue19-08]

🔖 Title

Fix NativeWind color system — `colors.json` imported but never spread into Tailwind theme

---

📄 Description

`tailwind.config.js` imports `./theme/colors.json` into `appColors` on line 2 but never uses it:

```js
const appColors = require('./theme/colors.json'); // imported...
module.exports = {
theme: {
extend: {
colors: {
'signin-orange': '#ff9a76', // ...but appColors never spread here
}
}
}
}
```

As a result, every semantic Tailwind class used throughout the app generates no style. Affected classes include: `bg-background`, `text-text`, `text-textMuted`, `text-textSubtle`, `text-textStrong`, `bg-successSoft`, `bg-successBadge`, `text-successDeep`, `bg-purpleSoft`, `text-purple`, `bg-amberSoft`, `text-amber`, `bg-cta`, `bg-ctaStrong`, `bg-primary`, `bg-errorSoft`, `bg-infoSoft`, `border-border`, and all others defined in `colors.json`. Every screen is visually broken — backgrounds are transparent and text falls back to default colors.

Additionally, three leftover Expo template files are never imported by anything in the app and should be deleted:

• `components/Container.tsx`
• `components/EditScreenInfo.tsx` (contains typo "Openssd up the code")
• `components/ScreenContent.tsx`
• `cesconfig.jsonc` (unknown artifact, not used by any tooling)

---

✅ Tasks to complete

• Fix `tailwind.config.js` — spread `appColors` into `theme.extend.colors`:
  ```js
  const appColors = require('./theme/colors.json');
  module.exports = {
  theme: {
  extend: {
  colors: {
  ...appColors,
  'signin-orange': '#ff9a76',
  // ...rest of existing overrides
  }
  }
  }
  }
  ```
• Add `./hooks/**/*.{js,ts,tsx}` to `content` paths in `tailwind.config.js` (currently excluded)
• Update `app.json` — change `"name": "my-expo-app"` and `"slug"` to the real app name (`TrustUp` / `trustup`)
• Delete `components/Container.tsx`, `components/EditScreenInfo.tsx`, `components/ScreenContent.tsx`
• Delete `cesconfig.jsonc` from root
• Verify all screens render correct colors after the fix (spot check `InvestScreen`, `PayScreen`, `SignIn`)

---

📚 Documentation/context for AI

https://github.com/TrustUp-app/TrustUp-Frontend/tree/main/docs

Files to modify:

• `tailwind.config.js`
• `app.json`
• `theme/colors.json` (reference — do not modify, just spread it)

Files to delete:

• `components/Container.tsx`
• `components/EditScreenInfo.tsx`
• `components/ScreenContent.tsx`
• `cesconfig.jsonc`

---

🗒️ Additional notes

• This is a one-line fix with massive visual impact — every screen's color scheme depends on it
• After the fix, run `npx expo start` and verify that backgrounds, text colors, badges, and borders render correctly on both iOS and Android
• Do not modify `colors.json` values — only wire it into the Tailwind config

[OluRemiFour]

Hi! I'd like to work on this issue if it's still available. I'll follow the project's contribution guidelines, implement the requested changes, include the required tests, and submit a PR for review.

[elcabasa]

Hello, I would like to claim this issue and restore the visual theme across the app.My Plan:Fix Color Theme: Spread appColors directly into theme.extend.colors inside tailwind.config.js to restore the broken semantic classes (like bg-background and text-text).Expand Content Paths: Add ./hooks/**/*.{js,ts,tsx} to the content array in tailwind.config.js to prevent missing utility styles.Update Metadata: Rename the project configurations and slug to TrustUp / trustup inside app.json. Clean Codebase: Safely remove the four unused artifact files (Container.tsx, EditScreenInfo.tsx, ScreenContent.tsx, and cesconfig.jsonc).Verification: Run npx expo start to spot-check and ensure correct visual rendering on InvestScreen, PayScreen, and SignIn across mobile environments.I am familiar with NativeWind/Tailwind setups and ready to submit a clean PR right away. Please assign this issue to me! Best regards.