.infosection .inner { height: 64px; } /* editable field status */ *[contenteditable] { box-shadow: inset 0 0 0 0px var(--foreground); } *[contenteditable="true"]:focus { box-shadow: inset 0 0 0 2px var(--accent); } *[contenteditable="true"] { background-color: var(--background); color: var(--foreground); padding: 8px; box-shadow: inset 0 0 0 2px var(--foreground); } .accountHeader .userInfo { margin-left: var(--spacing-medium); width: calc(100% - 128px - var(--spacing-medium)); } .accountHeader .userInfo .username { font-size: 2rem; } .accountHeader .userInfo .status { transition-duration: .3s; margin-top: var(--spacing-small); } .infoModule .iconWrapper { left: 50%; transform: translateX(-50%); } .infoModule .labelWrapper { top: calc(24px + var(--spacing-small)); } .infoModule .labelWrapper .label { top: 50%; transform: translateY(-50%); }