# 使用主题覆盖 border-radius 变量

**URL:** <https://meta.discourse.org/t/override-border-radius-variables-with-theme/246574>\
**Category:** UX\
**Created:** [2022 年11 月 23 日 18:51 UTC](https://meta.discourse.org/t/override-border-radius-variables-with-theme/246574 "2022-11-23T18:51:56Z")\
**Posts on this page:** 1\
**Showing post:** 8

<div class="post-metadata">

作者： ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
发布日期： [2022 年12 月 8 日 20:22 UTC](https://meta.discourse.org/t/override-border-radius-variables-with-theme/246574/8 "2022-12-08T20:22:39Z")

</div>

嗯，是的，我可以重现这个问题……有点奇怪。

我有一个[远程主题](https://github.com/awesomerobot/discourse-test-theme)，其中 `common.scss` 只包含：

```plaintext
:root {
  --d-border-radius: 100px;
}

```

这有效，我得到了圆形的按钮和其他元素：

 ![Screenshot 2022-12-08 at 2.55.19 PM](https://global.discourse-cdn.com/meta/original/4X/5/f/4/5f4bcfdaef6b40f825a75702c41d1d2d563fd078.png)

一旦我添加了一个包含 CSS 的_本地_主题组件，它就会中断。我创建了一个本地主题组件，其中 `common.scss` 只包含：

```scss
body {
  background: red;
}

```

我得到了红色的背景，但 `border-radius` 消失了：

 ![Screenshot 2022-12-08 at 2.57.06 PM](https://global.discourse-cdn.com/meta/original/4X/4/7/c/47c8c8cab617d2ca7d7b082bb21cb36b2c01f59d.png)

同样的[组件](https://github.com/awesomerobot/discourse-test-theme-component)远程工作正常。我同时获得了红色背景和圆角边框。

@david/@pmusaraj 这与远程和本地主题的编译顺序有关吗？

---

_[View the full topic](https://meta.discourse.org/t/override-border-radius-variables-with-theme/246574)._