CSS 变量回退

这个 CSS 变量回退，说白了，其实就是当 CSS 变量值无效时而使用一个“安全值”来保证某个属性值还是可用的。

.message__bubble {
  max-width: calc(100% - var(--actions-width, 70px));
}

可能还会去考虑一下浏览器对 var() 的兼容性问题，那么就会再加上一个属性。不过现在的浏览器来看，好像普遍性不存在这个问题。

.message__bubble {
  max-width: 70px;
  max-width: var(--actions-width, 70px);
}