45 lines
1.3 KiB
SCSS
45 lines
1.3 KiB
SCSS
@use "../colors" as *;
|
|
@use "../vars" as *;
|
|
|
|
// Submit button styling
|
|
@mixin submit-buttons {
|
|
&.submit-buttons {
|
|
flex: 1 1 100%; // Full width of the available space
|
|
display: flex; // Use flex to align the buttons
|
|
justify-content: space-between; // Space between buttons
|
|
margin-top: 20px; // Space above the buttons
|
|
|
|
button {
|
|
width: 48%;
|
|
text-align: center;
|
|
padding: 12px;
|
|
border-radius: $input-field-border-radius;
|
|
|
|
// Add styles for the clear button
|
|
&.clear-button {
|
|
background-color: $add-user-clear-button-color;
|
|
color: $add-user-clear-button-text-color;
|
|
|
|
&:hover {
|
|
background-color: $add-user-clear-button-hover-color; // Hover effect color
|
|
}
|
|
}
|
|
|
|
// Existing styles for submit button
|
|
&.submit {
|
|
background-color: $add-user-button-color;
|
|
color: $add-user-button-text-color;
|
|
border: none;
|
|
|
|
&:hover {
|
|
background-color: $add-user-button-hover-color; // Button hover color
|
|
}
|
|
}
|
|
|
|
&:active {
|
|
transform: translateY(2px); // Subtle press effect
|
|
}
|
|
}
|
|
}
|
|
}
|