Sencha touch 在Sencha Touch 1.1中区分无线电场和复选框电场的外观

默认情况下，Sencha Touch 1.1提供显示复选标记（勾号）的

无线字段和
复选框字段。由于这种设计，没有直观的方式来区分它们


如何更改
无线字段的外观，使其看起来像传统的单选按钮？
我添加了自己的样式以更改复选框的外观

.x-field .x-input-radio:after, .x-field .x-input-radio:checked:after {
    content: "";
    position: absolute;
    width: 1.25em;
    height: 1.25em;
    top: 50%;
    left: auto;
    -webkit-transform: rotate(0deg) skew(0deg);
    -webkit-transform-origin: 50% 50%;
    -webkit-border-radius: 2em;
    right: 1.1em;
    border: .45em solid;
    margin-top: -0.75em;
}
.x-field .x-input-radio:checked:after {
    border-color: #06346a;
}
.x-field .x-input-radio:after {
    border-color: #dddddd;
}

链接：
我试过这个，它看起来基本相同。对于赏金，你能告诉我如何把它设计成一个普通的单选按钮吗？@TravisWebb-我花了一点时间试图做到这一点，但我不是CSS3最棒的，所以我坚持了上面的风格。很抱歉
.x-field .x-input-radio:after,
.x-field.x-item-disabled .x-input-radio:checked:after {
    content: "";
    position: absolute;
    width: 1.4em;
    height: 1.4em;
    top: 50%;
    left: auto;
    right: 1.1em;
    -webkit-mask-image: url();
    margin-top: -0.7em;
    border-radius: 15px;
}
.x-field .x-input-radio:checked:after {
    content: "";
    position: absolute;
    top: 50%;
    left: auto;
    right: 1.1em;
    -webkit-mask-image: url();
    margin-top: -0.7em;
    border: 5px solid #dddddd;
    border-radius: 15px;
}