$darkred: rgb(71, 0, 0);

.sidenav {
    background-color: #000860;
    left: 0;
    width: 15%;
}

.item {
    display: block;
    overflow: hidden;
}

.content-container {
    background-color: #0789f4;
    right: 0;
    top: 0;
    height: 900px;
}

.container {
    background-color: $darkred;
    &:hover {
        background-color: adjust-hue($darkred, 90deg);
    }
    width: 100%;
    padding-top: 100%;
    position: relative;
    border: 1px red solid;
}

<div class="container">
        <div class="item">
          <mat-icon>home</mat-icon>
        </div>
    </div>