styles.scss

/* Import Bootstrap 4 */

// Imports functions, variables, and mixins that are needed by other Bootstrap files
@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables";
@import "~bootstrap/scss/mixins";

// Optional
@import "~bootstrap/scss/reboot";
@import "~bootstrap/scss/type";
@import "~bootstrap/scss/grid";
@import "~bootstrap/scss/nav";
@import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/card";
@import "~bootstrap/scss/breadcrumb";
@import "~bootstrap/scss/buttons";
@import "~bootstrap/scss/button-group";
@import "~bootstrap/scss/transitions";
@import "~bootstrap/scss/dropdown";
@import "~bootstrap/scss/modal";
@import "~bootstrap/scss/tables";
@import "~bootstrap/scss/forms";
@import "~bootstrap/scss/custom-forms";
@import "~bootstrap/scss/badge";
@import "~bootstrap/scss/utilities";

/* Import ngx-toastr bootstrap 4 alert styled design */

@import '~ngx-toastr/toastr-bs4-alert';

/* Global styles */

main {
    margin-top: 100px;
}

.custom-switch label, .custom-radio label {
    cursor: pointer;
}

.card-add {
    background-color: #A8C96E;
    transition: font-size 0.3s;
    height: 289px;
}

.card-add:hover {
    background-color: #9dc25b;
    font-size: 20px;
}

/* Angular forms */
input.ng-valid, select.ng-valid, textarea.ng-valid {
    border-left: 5px solid #42A948; /* green */
}
  
input.ng-invalid, select.ng-invalid, textarea.ng-invalid {
    border-left: 5px solid #a94442; /* red */
}

/* Utilities */

.pointer {
    cursor: pointer;
}