Hướng dẫn Code nút Checkbox và Radio button đẹp cho XenForo

[thuyet951]

Hướng dẫn thay đổi nút checkbox và nút radio button trên giao diện mặc định của XenForo, sử dụng font icon Awesome.

Hướng dẫn cài đặt.
Bước 1: Cài đặt Font Awesome cho giao diện (nếu bạn đã cài đặt FontAwesome có thể bỏ qua bước này).

<script src="https://use.fontawesome.com/74697a2333.js"></script>

Bước 2: Áp dụng Cascading Style Sheets (CSS).
Các bạn mở template EXTRA.css sau đó sao chép và dán toàn bộ code dưới đây vào cuối cùng của template EXTRA.css

input[type=checkbox], input[type=radio] {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: 0;
  font-family: 'FontAwesome';
  font-size: 14px;
  line-height: 12px;
}
input[type=checkbox]:after, input[type=radio]:after {
  content: "\f10c";
  color: #01579b;
  display: block;
}

input[type=radio]:checked:after {
  content: "\f111";
  color: #01579b;
}

input[type=checkbox]:checked:after {
  content: "\f192";
  color: #01579b;
}

Xem thêm: http://thuthuatso.net/threads/xenfo...-checkbox-va-radio-button-dep-cho-xenforo.13/