Element-Ui組件 單選框（Radio） 修改點擊激活時的文本顏色，填充色和邊框色

官方組件顯示的效果：

 

 需要的效果：

 

 直接添加樣式：

/* 選中后的字體顏色 */
.el-radio__input.is-checked + .el-radio__label {
  color: #28d4c1 !important;
}
/* 選中后小圓點的顏色 */
.el-radio__input.is-checked .el-radio__inner {
  background: #28d4c1 !important;
  border-color: #28d4c1 !important;
}

這是我自己添加的邊框，沒有用官方的，官方的我暫時還有試過
效果圖：

 

 

<style lang="scss" scoped>
//修改單選的顏色
/deep/ {
  .el-radio {
    //添加邊框
    border: 1px solid rgb(207, 204, 204);
    //選中時邊框的顏色
    &.is-checked {
      border: 1px solid #28d4c1 !important;
    }
    //鼠標滑過改變字體和小圓圈邊框的樣式
    &:hover {
      border-color: #28d4c1 !important;
      color: #28d4c1 !important;
      //鼠標滑過時小圓點邊框顯示
      .el-radio__inner {
        border-color: #28d4c1;
      }
    }
    .el-radio__input {
      margin-bottom: px(5);
      //選中時的樣式
      &.is-checked {
        .el-radio__inner {
          //選中時小圓圈的的顏色
          background-color: #28d4c1;
          border-color: #28d4c1;
        }
        + .el-radio__label {
          //選中時字體的顏色
          color: #28d4c1 !important;
        }
      }
      .el-radio__inner {
        // 鼠標滑過小圓點時的樣式
        &:hover {
          border-color: #28d4c1;
        }
      }
    }
  }
}
</style>