ThiagoDutraSampaioLeite/practice-time-shopping-list
1
0
Fork 0
forked from M3-Academy/practice-time-shopping-list
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'feature' (#4) from feature into main

Browse Source 
Reviewed-on: #4
This commit is contained in:
ThiagoDutraSampaioLeite 2022-11-08 17:10:13 +00:00
commit 0ad9379b7a
1 changed files with 55 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
style/form.css
View File

@ -35,3 +35,58 @@
text-align: center;
margin: 0 4px;
}
.shopping-form-quantity-button {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 32px;
height: 32px;
border: none;
border-radius: 4px;
transition: background-color 0.2s linear;
background: var(--gray-100);
}
.shopping-form-quantity-button:hover {
background: var(--orange-500);
}
.shopping-form-quantity-button:active {
background: var(--orange-300);
}
.shopping-form-quantity-button::before,
.shopping-form-increment::after {
content: "";
position: absolute;
width: 16px;
height: 4px;
border-radius: 4px;
background: var(--white);
}
.shopping-form-increment::after {
transform: rotate(90deg);
}
.shopping-form-submit-button {
max-width: 128px;
width: 100%;
height: 32px;
border: none;
border-radius: 4px;
color: var(--white);
font-weight: 700;
background: var(--orange-500);
transition: background-color 0.2s linear;
}
.shopping-form-submit-button:hover {
background: var(--orange-300);
}
.shopping-form-submit-button:active {
background: var(--orange-500);
}