Almindelig knap

PHOTO EMBED

Tue May 11 2021 11:50:46 GMT+0000 (UTC)

Saved by @distance #css

.knap {
    position: relative;
    width: 203px;
    height: 42px;
    padding: 11px;
    padding-left: 30px;
    padding-right: 54px;
    outline: none;
    cursor: pointer;
    font-weight: 700 !important;
    background-color: #AD8350;
    color: white !important;
    font-weight: 700;
    line-height: 42px !important;
    font-size: 16px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.29);
    border-radius: 5px;


    &:hover {
        color: white;
        background-color: #9B7547;

        &:before {
            margin-left: 5px;
            -moz-transition: 200ms all ease-in-out;
            -o-transition: 200ms all ease-in-out;
            -webkit-transition: 200ms all ease-in-out;
            transition: 200ms all ease-in-out;
        }
    }

    &:before {
        content: '\f178';
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        font-size: 16px;
        position: absolute;
        float: right;
        padding-left: 132px;
        z-index: 1;
        -moz-transition: 200ms all ease-in-out;
        -o-transition: 200ms all ease-in-out;
        -webkit-transition: 200ms all ease-in-out;
        transition: 200ms all ease-in-out;
    }

    &:focus {
        outline: none;
    }
}
content_copyCOPY

https://gyazo.com/3548e822d48109085854641310380ec2