使用 css + sass 构建这个网格的最佳方法是什么？

.grid {
display: grid;
width: 92vw;
height: 92vh;
margin: 1vh auto;
grid-template-columns: 46vw 46vw;
grid-template-rows: 46vh 46vh;
grid-template-areas: 
    "textbox image"
    "image textbox";
}

.textbox {
border: 1px solid rgb(127, 127, 127);
padding: 6px;
}

.image {
background-image: url('http://placebear.com/800/400');
background-size: cover;
}

<div class="grid">
<div class="textbox" contenteditable="true">You can edit me - I am a textbox...</div>
<div class="image"></div>
<div class="image"></div>
<div class="textbox" contenteditable="true">I am also a textbox - you can edit me too...</div>
</div>