refactor: deduplicate modal/button styles and enforce global utility usage
- Consolidated all modal-related styles into Modal.module.css; ValidationModal.module.css is now deprecated - All main action/navigation buttons in NewGame and GameDetail use global .btn/.nav-buttons utility classes - Removed duplicate utility classes from component CSS files - Fixed .fullscreenToggle class naming for consistency - Cleaned up component CSS to only contain component-specific styles - Updated GameCompletionModal to use shared modal styles This ensures DRY, maintainable, and consistent styling across the app.
This commit is contained in:
@@ -60,7 +60,7 @@ const NewGame = ({ onCreateGame, playerNameHistory, onCancel, onGameCreated, ini
|
||||
<form className={styles['new-game-form']} onSubmit={handleSubmit} aria-label="Neues Spiel Formular">
|
||||
<div className={styles['screen-title']}>Neues Spiel</div>
|
||||
<div style={{ display: 'flex', justifyContent: 'flex-end', marginBottom: 16 }}>
|
||||
<button type="button" className={styles['btn']} onClick={handleClear} aria-label="Felder leeren">Felder leeren</button>
|
||||
<button type="button" className="btn" onClick={handleClear} aria-label="Felder leeren">Felder leeren</button>
|
||||
</div>
|
||||
<div className={styles['player-inputs']}>
|
||||
<div className={styles['player-input']}>
|
||||
@@ -106,9 +106,9 @@ const NewGame = ({ onCreateGame, playerNameHistory, onCancel, onGameCreated, ini
|
||||
</div>
|
||||
</div>
|
||||
{error && <div className={styles['validation-error']}>{error}</div>}
|
||||
<div className={styles['nav-buttons']}>
|
||||
<button type="button" className={styles['btn']} onClick={onCancel} aria-label="Abbrechen">Abbrechen</button>
|
||||
<button type="submit" className={styles['btn']} aria-label="Spiel starten">Spiel starten</button>
|
||||
<div className="nav-buttons">
|
||||
<button type="button" className="btn" onClick={onCancel} aria-label="Abbrechen">Abbrechen</button>
|
||||
<button type="submit" className="btn" aria-label="Spiel starten">Spiel starten</button>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user