NW6 | Fikret-Ellek | HTML-CSS | Bikes-For-Refugees | week 1 #478
Conversation
✅ Deploy Preview for cyf-bfr ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
| .orange { | ||
| background-color: #e95b1e; | ||
| color: white; | ||
| margin-left: 25px; | ||
| border-radius: 4px; | ||
| padding: 6px 6px; | ||
| border: 0px; | ||
| } | ||
|
|
||
| .white { | ||
| color: #c05326; | ||
| background-color: white; | ||
| border-radius: 4px; | ||
| padding: 6px 6px; | ||
| border: 0px; | ||
| } |
There was a problem hiding this comment.
You have successfully applied the desired styles to your buttons. However, I wanted to bring up an important concept in programming called DRY code, which stands for "Don't Repeat Yourself."
In your code, I see that you have repeated the same set of styles for different button classes, such as "orange" and "white."
Next time, you can consider creating a single CSS class that contains the common styles like;
button { //common styles
border-radius: 4px;
padding: 6px 6px;
border: 0px;
}
.orange {
background-color: #e95b1e;
color: white;
margin-left: 25px;
}
//same idea for the white one
|
|
||
| button:hover { | ||
| background-color: rgb(55, 178, 235); |
There was a problem hiding this comment.
You have used both RGB and hexadecimal color codes. To improve consistency, you can choose one format. Both RGB and hexadecimal color codes are valid and widely supported, so it's up to your personal preference.
| <img | ||
| class="article__thumbnail" | ||
| src="images/spring-fundraisers_thumbnail.jpg" | ||
| alt="pink sakura tree branch" |
There was a problem hiding this comment.
Great catch on adding the alt text for the image! Including alt text is a great accessibility practice. Well done.
|
Thank you very much @musayuksel |
No description provided.