fix(title change): section title changed to reactive forms (#12668)

* fix(title change): section title changed to reactive forms

* fix(buttons margin): add margin to primary buttons

* fix(flex basis): add flex basis to columns

---------

Co-authored-by: Hristo <[email protected]>
Co-authored-by: Konstantin Dinev <[email protected]>

Author: 3 people

src/app/date-range/date-range.sample.html

@@ -118,7 +118,7 @@ <h5>Template-driven form</h5>
                 </form>
             </div>
             <div class="range-sample-column">
-                <h5>Template-driven form</h5>
+                <h5>Reactive form</h5>
                 <div class="radio-container">
                     <igx-radio *ngFor="let option of updateOnOptions" value="{{option}}" [(ngModel)]="updateOn"
                         (change)="updateOnChange($event)">

src/app/date-range/date-range.sample.scss

@@ -7,14 +7,13 @@ $range-sample-space: 16px;
 .range-sample-column {
     display: flex;
     flex-direction: column;
+    flex-basis: 50%;
     padding: $range-sample-space;
     border-right: 1px solid #ddd;
 
-    > * {
-        margin-bottom: 16px;
-
-        &:last-of-type {
-            margin-bottom: 0;
+    .date-picker-sample-buttons {
+        button {
+            margin: 0.5rem;
         }
     }