@nomios/web-uikit/dist/components/split-button/SplitButton.css

Nomios' living web UIKit

/*
  Note: If you add a color here, please add it to "/stories/base/colors.css" as well
*/

.menu {
    margin-top: 0.1rem;
}

.container {
    display: flex;
}

.button {
    width: 100%;
    height: 5rem;
    padding: 0 2rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border: none;
    transition: background-color 0.2s ease-out
}

.button.triggerButton {
        width: 5rem;
        padding: 0 1.7rem
    }

.button.triggerButton > i {
            margin-right: 0;
        }

.button.negative {
        background-color: #fff;
        color: #4b453d
    }

.button.negative:enabled:hover {
                background-color: #f3ece5;
                cursor: pointer;
            }

.button.negative:enabled:focus {
                background-color: #f3ece5;
                cursor: pointer;
            }

.button.negative:enabled.menuIsOpen {
                background-color: #f3ece5;
                cursor: pointer;
            }

.button.negative:disabled {
            background-color: rgba(255, 255, 255, 0.2);
            color: rgba(75, 69, 61, 0.5);
        }

.button.primary {
        position: relative;
        background-color: #4b453d;
        color: #fff
    }

.button.primary:enabled::before {
                content: "";
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                transition: background-color 0.2s ease-out;
            }

.button.primary:enabled:hover::before {
                    background-color: rgba(243, 236, 229, 0.2);
                    cursor: pointer;
                }

.button.primary:enabled:focus::before {
                    background-color: rgba(243, 236, 229, 0.2);
                    cursor: pointer;
                }

.button.primary:enabled.menuIsOpen::before {
                    background-color: rgba(243, 236, 229, 0.2);
                    cursor: pointer;
                }

.button.primary:disabled {
            background-color: rgba(75, 69, 61, 0.2);
        }

.button > i {
        margin-right: 1.5rem;
        font-size: 1.4rem;
    }