diff --git a/changelog.md b/changelog.md
index 9b7998e..fc786cc 100644
--- a/changelog.md
+++ b/changelog.md
@@ -1,11 +1,11 @@
-# changelog v7.0.0beta (31 juillet 2017)
+# changelog v7.0.0beta (1er août 2017)
- architecture globale revisitée (vendor, config, library, components)
- normalize.css v7.0.0
- refonte complète des boutons, avec possibilités de variantes (primary, success, warning, etc.)
- ajout des badges (tags), avec possibilités de variantes (primary, success, warning, etc.)
- ajout des alertes, avec possibilités de variantes (primary, success, warning, etc.)
- ajout d'un bouton de navigation .button-burger
-- ajout des checkbox stylés
+- ajout des checkbox et radio stylés
- refonte des styles de formulaires
- autogrid object en Grid Layout
- regroupement des styles des tableaux
diff --git a/css/knacss-unminified.css b/css/knacss-unminified.css
index 97a4292..f14abcb 100644
--- a/css/knacss-unminified.css
+++ b/css/knacss-unminified.css
@@ -2140,7 +2140,7 @@ button:focus {
/* ==Checkbox */
/* ----------------------------- */
/* use .checkbox class on input type=checkbox */
-/* recommanded HTML : */
+/* recommanded HTML : */
.checkbox ~ label {
cursor: pointer;
}
diff --git a/sass/components/checkbox.scss b/sass/components/checkbox.scss
index f11f2b2..b8f3e62 100644
--- a/sass/components/checkbox.scss
+++ b/sass/components/checkbox.scss
@@ -2,7 +2,7 @@
/* ==Checkbox */
/* ----------------------------- */
/* use .checkbox class on input type=checkbox */
-/* recommanded HTML : */
+/* recommanded HTML : */
.checkbox {
@extend .visually-hidden;
diff --git a/sass/components/radio.scss b/sass/components/radio.scss
new file mode 100644
index 0000000..807fe4c
--- /dev/null
+++ b/sass/components/radio.scss
@@ -0,0 +1,34 @@
+/* ----------------------------- */
+/* ==Rdio */
+/* ----------------------------- */
+/* use .radio class on input type=radio */
+/* recommanded HTML : */
+
+.radio {
+ @extend .visually-hidden;
+
+ & ~ label {
+ cursor: pointer;
+
+ &:before {
+ content: "";
+ display: inline-block;
+ vertical-align: baseline;
+ transform: translateY(.2rem);
+ margin-right: .5rem;
+ width: 1.1em; height: 1.1em;
+ border: 0;
+ background: #fff;
+ border-radius: 50%;
+ box-shadow: 0 0 0 2px $color-forms inset;
+ transition: .25s background;
+ }
+ }
+ &:checked ~ label:before {
+ background-image: radial-gradient(circle at center, #fff 30%, transparent 38%);
+ background-color: $color-forms;
+ background-position: center;
+ background-repeat: no-repeat;
+ pointer-events: none;
+ }
+}
diff --git a/sass/knacss.scss b/sass/knacss.scss
index 4a0be47..37dc607 100644
--- a/sass/knacss.scss
+++ b/sass/knacss.scss
@@ -25,6 +25,7 @@
- Forms (forms consistency)
- Buttons (buttons consistency)
- Checkbox (checkbox styles)
+ - Radio (radio styles)
- Badges (badges consistency)
- Alerts (alerts consistency)
- Grillade (Grid System in Flexbox)
@@ -56,6 +57,7 @@
@import "components/forms.scss"; // forms consistency and styles
@import "components/buttons.scss"; // buttons styles
@import "components/checkbox.scss"; // checkbox styles
+@import "components/radio.scss"; // radio styles
@import "components/badges.scss"; // badges styles
@import "components/alerts.scss"; // alerts styles
@import "components/grillade.scss"; // grids