-
Notifications
You must be signed in to change notification settings - Fork 45
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
avatar button Issue 18 #55
Conversation
$image.addEventListener('mouseover', () => ($image.src = imageHover)); | ||
$image.addEventListener('mouseout', () => ($image.src = imageOriginal)); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pq precisou usar JS e não apenas um CSS?
.plus { | ||
padding: 18px; | ||
border-radius: 9999px; | ||
border: 1.5px solid #fff; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pixel com ponto flutuante é bad
@@ -0,0 +1,12 @@ | |||
.plus { | |||
padding: 18px; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Não usar pixel para padding
, margin
e afins, explico melhor nesse artigo: https://www.linkedin.com/pulse/unidades-css-um-guia-completo-alexandre-gomes/
import iconHover from './iconHover.svg'; | ||
|
||
const html = ` | ||
<a href="#" class="avatarButton" data-select="container"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
O nome dessa classe não condiz com o BEM https://getbem.com/introduction/
|
||
const html = ` | ||
<a href="#" class="avatarButton" data-select="container"> | ||
<img class="plus" data-select="image" src="${icon}" alt="" /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Não nomeie a classe com seu conteudo, no caso icon
é melhor que plus
pq se o icone mudar a classe ainda faz sentido
PR fechado decorrente de inatividade |
Closes #18
Feature
- Issue linked
- Build working correctly
- Tests created
Changelog
N/AVisual evidences 🖼️![image](https://private-user-images.githubusercontent.com/132594042/296277491-ca03ddd0-12e3-4744-baf9-c5406818263d.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjUwMjA5MzQsIm5iZiI6MTcyNTAyMDYzNCwicGF0aCI6Ii8xMzI1OTQwNDIvMjk2Mjc3NDkxLWNhMDNkZGQwLTEyZTMtNDc0NC1iYWY5LWM1NDA2ODE4MjYzZC5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwODMwJTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDgzMFQxMjIzNTRaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT1lY2UyZjQ0MjJmMmNhOWViMjAwNTFkODcxNTZkNDdhZDg4MTRlNTBjMTU1ZWNmNGU4YmU1ZGJhMTRlODg0ZGY2JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.IfBRSsm0W3IX4sdctAfGAaJiJa53eYK9ZUwfyR8k24w)
![image](https://private-user-images.githubusercontent.com/132594042/296277933-66f069a0-39e1-453c-9aef-4186641d743a.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjUwMjA5MzQsIm5iZiI6MTcyNTAyMDYzNCwicGF0aCI6Ii8xMzI1OTQwNDIvMjk2Mjc3OTMzLTY2ZjA2OWEwLTM5ZTEtNDUzYy05YWVmLTQxODY2NDFkNzQzYS5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwODMwJTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDgzMFQxMjIzNTRaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT01YjBjOWQyMWRmOWJjNGY4ZGY4MDg3NDdlYmZhMzU3Yzc1ZDlkNGMxZDQyZWE0MTE0MDY0YjNmMTgyMTQ1ODE5JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.bNuYGTfj15XZdsGeiuh3rtBrvYQwdFI_VNCp0-bbtnw)
-- Normal
--Hover
Checklist