fix(button): button group

ng-bootstrap · May 12, 2021 · d598cb4 · d598cb4
1 parent e5e8461
commit d598cb4
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 16 deletions.
diff --git a/demo/src/app/components/buttons/demos/checkbox/buttons-checkbox.html b/demo/src/app/components/buttons/demos/checkbox/buttons-checkbox.html
@@ -1,12 +1,12 @@
-<div class="btn-group btn-group-toggle">
+<div class="btn-group" role="group">
   <label class="btn-primary" ngbButtonLabel>
-    <input type="checkbox" ngbButton [(ngModel)]="model.left"> Left (pre-checked)
+    <input type="checkbox" class="btn-check" ngbButton [(ngModel)]="model.left"> Left (pre-checked)
   </label>
   <label class="btn-primary" ngbButtonLabel>
-    <input type="checkbox" ngbButton [(ngModel)]="model.middle"> Middle
+    <input type="checkbox" class="btn-check" ngbButton [(ngModel)]="model.middle"> Middle
   </label>
   <label class="btn-primary" ngbButtonLabel>
-    <input type="checkbox" ngbButton [(ngModel)]="model.right"> Right
+    <input type="checkbox" class="btn-check" ngbButton [(ngModel)]="model.right"> Right
   </label>
 </div>
 <hr>

diff --git a/demo/src/app/components/buttons/demos/checkboxreactive/buttons-checkboxreactive.html b/demo/src/app/components/buttons/demos/checkboxreactive/buttons-checkboxreactive.html
@@ -1,13 +1,13 @@
 <form [formGroup]="checkboxGroupForm">
-  <div class="btn-group btn-group-toggle">
+  <div class="btn-group" role="group">
     <label class="btn-primary" ngbButtonLabel>
-      <input type="checkbox" formControlName="left" ngbButton> Left (pre-checked)
+      <input type="checkbox" class="btn-check" formControlName="left" ngbButton> Left (pre-checked)
     </label>
     <label class="btn-primary" ngbButtonLabel>
-      <input type="checkbox" formControlName="middle" ngbButton> Middle
+      <input type="checkbox" class="btn-check" formControlName="middle" ngbButton> Middle
     </label>
     <label class="btn-primary" ngbButtonLabel>
-      <input type="checkbox" formControlName="right" ngbButton> Right
+      <input type="checkbox" class="btn-check" formControlName="right" ngbButton> Right
     </label>
   </div>
 </form>

diff --git a/demo/src/app/components/buttons/demos/radio/buttons-radio.html b/demo/src/app/components/buttons/demos/radio/buttons-radio.html
@@ -1,12 +1,12 @@
-<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" [(ngModel)]="model">
+<div class="btn-group" role="group" ngbRadioGroup name="radioBasic" [(ngModel)]="model">
   <label ngbButtonLabel class="btn-primary">
-    <input ngbButton type="radio" [value]="1"> Left (pre-checked)
+    <input ngbButton type="radio" class="btn-check" [value]="1"> Left (pre-checked)
   </label>
   <label ngbButtonLabel class="btn-primary">
-    <input ngbButton type="radio" value="middle"> Middle
+    <input ngbButton type="radio" class="btn-check" value="middle"> Middle
   </label>
   <label ngbButtonLabel class="btn-primary">
-    <input ngbButton type="radio" [value]="false"> Right
+    <input ngbButton type="radio" class="btn-check" [value]="false"> Right
   </label>
 </div>
 <hr>

diff --git a/demo/src/app/components/buttons/demos/radioreactive/buttons-radioreactive.html b/demo/src/app/components/buttons/demos/radioreactive/buttons-radioreactive.html
@@ -1,13 +1,13 @@
 <form [formGroup]="radioGroupForm">
-  <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="model">
+  <div class="btn-group" role="group" ngbRadioGroup name="radioBasic" formControlName="model">
     <label ngbButtonLabel class="btn-primary">
-      <input ngbButton type="radio" [value]="1"> Left (pre-checked)
+      <input ngbButton type="radio" class="btn-check" [value]="1"> Left (pre-checked)
     </label>
     <label ngbButtonLabel class="btn-primary">
-      <input ngbButton type="radio" value="middle"> Middle
+      <input ngbButton type="radio" class="btn-check" value="middle"> Middle
     </label>
     <label ngbButtonLabel class="btn-primary">
-      <input ngbButton type="radio" [value]="false"> Right
+      <input ngbButton type="radio" class="btn-check" [value]="false"> Right
     </label>
   </div>
 </form>