tweakcc

To customize your Claude Code interface, you'll need to modify several configuration files. Here's a step-by-step guide based on your request to add a dark theme, customize the input box style, and fix the frozen spinner issue:

1. **Dark Theme**: Add the following CSS to your `styles.css` file:
```css
:root {
  --background-color: #1e1e1e;
  --text-color: #e0e0e0;
  --accent-color: #bb86fc;
}
```

2. **Input Box Style**: Modify the `inputBox.js` file to include rounded corners and a border:
```javascript
const inputBox = document.getElementById('input-box');
inputBox.style.borderRadius = '10px';
inputBox.style.border = '2px solid var(--accent-color)';
```

3. **Fix Frozen Spinner**: Update the `spinner.js` file to include a timeout function:
```javascript
setTimeout(() => {
  if (spinner.isRunning) {
    spinner.stop();
    console.error('Spinner was frozen and has been stopped.');
  }
}, 30000); // 30-second timeout
```

4. **Configuration**: Update your `config.json` to include the new settings:
```json
{
  "theme": "dark",
  "inputBoxStyle": {
    "borderRadius": "10px",
    "border": "2px solid var(--accent-color)"
  },
  "spinnerTimeout": 30000
}
```

After making these changes, restart Claude Code to see the new customizations in effect. If you encounter any issues, check the console for error messages and adjust the code accordingly.