javascriptecuador / javascriptecuador/web

[MEJORA] Cambiar los colores de los botones. Sección Comunidad

Offen
#84 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

enhancement
Vorherrschende Sprache
JavaScript
Sterne
24
Forks
22
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

**Tarea a realizar**
En página Home, en la sección Comunidad actualmente hay tres botones:
- Conocer a la comunidad
- Como ayudar?
- Código de Conducta

La mejora a realizar consiste en cambiar la presentación colorista de los mismos. Tanto los estilos base como los estilos en `hover` de cada botón.

**¿Por qué se realizará?**
El color amarillo no permite visualizar con claridad el titulo de cada botón. En pantallas con brillo alto o intensidad muy fuerte no se visualizará con claridad.

**Recomendaciones**
Actualmente los botones se ven así.
![image](https://user-images.githubusercontent.com/20387293/111241791-d1399800-85cb-11eb-88d4-cb614f8514dd.png)
La sugerencia consiste en aplicar colores más oscuros en los estilos base del botón y mantener el color sólido del titulo en `hover`.
![chrome-capture](https://user-images.githubusercontent.com/20387293/111242058-62a90a00-85cc-11eb-9cc5-1ae900aa0378.gif)
Para aplicar esta mejora del código css en `src\components\UI\button\button.module.css`. Se deben reescribir los estilos predeterminados del core css.
```css
.button--secondary {
color: #f7e018;
background-color: transparent;
border-color: #f7e018;
}

.button--secondary:hover {
color: #737373;
background-color: #f7e018;
border-color: #f7e018;
}
```

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Öffne src/components/UI/button/button.module.css und prüfe die Standard- und Hover-Stile der drei Community-Schaltflächen auf der Home-Seite. Aktualisiere die Schaltflächenfarben so, dass die Beschriftungen lesbar bleiben, mit dunkleren Grundfarben und einer einheitlichen Titelfarbe beim Hovern wie beschrieben. Erledigt bedeutet, dass die drei Schaltflächen in beiden Zuständen der vorgeschlagenen Darstellung entsprechen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
css
Bereich
design, frontend
Issue-Typ
Feature
Schwierigkeit
1/5
Geschätzter Aufwand
Unter einer Stunde
Aktivitätsstatus
Veraltet
Klarheit
Klar beschrieben
Anfängerfreundlichkeit
48/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.