psmattas/Netflix-Clone
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed primary button styling

Browse Source
This commit is contained in:
andres alcocer
2022-11-28 21:31:32 -05:00
parent 695e72b83a
commit bf335e09f4
1 changed files with 17 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/Button/button.scss
View File

@@ -3,7 +3,8 @@
.n-button { .n-button {
cursor: pointer; cursor: pointer;
outline: none; outline: none;
border: none; appearance: none;
border: 0;
border-radius: 4px; border-radius: 4px;
padding: 0.8rem; padding: 0.8rem;
opacity: 1; opacity: 1;
@@ -20,14 +21,14 @@
} }
&.with-icon { &.with-icon {
fill: #fff;
display: flex; display: flex;
padding-left: 2rem; justify-content: center;
padding-right: 2.4rem; align-items: center;
align-self: center;
& > * { & > * {
width: 25px; width: 24px;
height: 25px; height: 24px;
fill: #fff; fill: #fff;
margin-right: 1rem; margin-right: 1rem;
} }
@@ -56,9 +57,18 @@
color: rgba(0, 0, 0, 0.7); color: rgba(0, 0, 0, 0.7);
} }
&:not(:disabled):focus { &:not(:disabled):focus::before {
box-sizing: content-box;
content: '';
display: block;
height: 100%;
width: 100%;
border: 2px solid white; border: 2px solid white;
border-radius: 8px; border-radius: 8px;
padding: 2px;
position: absolute;
left: -4px;
top: -4px;
} }
} }