personal-site/blog

// -----------------------------------------------------------------------------
// This file contains all styles related to the BUTTON component.
// -----------------------------------------------------------------------------

.button {
    border-radius: $default-border-radius;
    color: $grey-900;

    &.pigment {
        background-color: $green-a700;

        &:hover {
            background-color: $green-a400;
        }
    }

    &.neon-green {
        background-color: $light-green-a400;

        &:hover {
            background-color: $light-green-a700;
        }
    }

    &.dodger-blue {
        background-color: $dodger-blue;
        border-color: darken($dodger-blue, 25%);
        color: white;
    }
}

.action-button:active {
    transform: translate(0px, 5px);
    -webkit-transform: translate(0px, 5px);
}