Hola,
Intenté anular las nuevas variables de border-radius con un tema remoto, pero parece que las variables :root principales siempre tienen prioridad. Puedo anularlas si creo un componente de tema en administración. ¿Hay alguna forma de anularlas con un tema? ¿Qué me estoy perdiendo? 
¡Este pequeño cambio es muy útil, muchas gracias! 
Ok, funciona como se esperaba, ¡mi sitio de prueba me estaba tomando el pelo!
Uh, parece que no fue una broma 
Con el tema remoto, solo puedo anularlo si uso !important.
Si lo uso así 
$border-radius: 2em !important;
:root {
--d-button-border-radius: #{$border-radius};
--d-input-border-radius: #{$border-radius};
}
De lo contrario, si lo intento así
:root {
--d-button-border-radius: 2em;
--d-input-border-radius: 2em;
}
Entonces las variables :root principales tienen prioridad.
¿Qué me estoy perdiendo? 
¡Gracias!
Funciona cuando lo pruebo en un tema… la raíz principal es anulada por la raíz del tema, como se esperaba.
¿Puedes mostrar más información? ¿Dónde defines tu raíz? ¿Cómo se ve tu inspector?
Hola Charlie,
Gracias por revisar esto
Intenté agregarlo en scss/custom-variables.scss e importarlo a common.scss. Y también intenté agregarlo directamente a common.scss.
Me acabo de dar cuenta de que funciona si no hay ningún otro componente (creado en el administrador) asignado al tema. Si creo un componente en el administrador con algo de CSS en la sección común. Entonces no anula las variables raíz principales para mí.
Funciona si el tema no tiene componentes o si el componente Común / CSS está vacío.
Si creo un componente con algo de Común / CSS y lo activo en el tema.
Entonces no me funciona.
El d-default-border-radius y d-select-body-border-radius son personalizados.
¡Gracias por la ayuda!
Entiendo. Muy interesante. Gracias por los pasos claros.
Veré qué se me ocurre. Por el momento, soy escéptico de que haya una solución diferente a la !important que ya estás usando, pero será bueno saber cómo/por qué funciona así.
hmm sí, puedo reproducir esto… es un poco extraño.
Tengo un tema remoto y todo lo que common.scss contiene es:
:root {
--d-border-radius: 100px;
}
esto funciona y obtengo botones redondeados y otros elementos:
Una vez que agrego un componente de tema local que contiene CSS, se rompe. Creé un componente de tema local que solo contiene esto en common.scss:
body {
background: red;
}
Obtengo el fondo rojo, pero el border-radius ha desaparecido:
El mismo componente funciona bien de forma remota. Obtengo tanto el fondo rojo como los bordes redondeados.
@david/@pmusaraj ¿tiene esto algo que ver con el orden en que se compilan los temas remotos y locales?
Creo que tiene que ver con nuestra inyección mágica de variables.scss en cada archivo CSS del tema. Ahora, tenemos esto en variables.scss:
:root {
--topic-body-width: #{$topic-body-width};
--topic-body-width-padding: #{$topic-body-width-padding};
--topic-avatar-width: #{$topic-avatar-width};
--d-border-radius: initial;
--d-nav-pill-border-radius: var(--d-border-radius);
--d-button-border-radius: var(--d-border-radius);
--d-input-border-radius: var(--d-border-radius);
}
Y debido a que inyectamos ese archivo SCSS en cada archivo SCSS de tema y plugin, se repite una y otra vez:
La única forma de anularlo actualmente es agregar la anulación a la última hoja de estilo del tema, solo entonces se genera al final.
Creo que necesitamos mover esta declaración :root a algún lugar global fuera de variables.scss en el núcleo.
¡Ajá! Muchas gracias, nunca procesé realmente por qué se repiten y simplemente lo pasé por alto por completo.
He reubicado estos en otro archivo para que no se repitan y confirmé que resuelve el problema.
