Skip to content

Commit

Permalink
Adjust demo page small toggles examples
Browse files Browse the repository at this point in the history
  • Loading branch information
@hisk
hisk committed Mar 28, 2018
1 parent 6282aaf commit 3fe228e
Show file tree
Hide file tree
Showing 2 changed files with 42 additions and 22 deletions.
32 changes: 21 additions & 11 deletions dist/shards-demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -373,7 +373,7 @@ <h5 class="mb-4 w-100">Custom Controls</h5>
</div>

<div class="row mb-5">
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-0">
<div class="custom-controls-example col-md-3 col-sm-3 col-xs-12 pl-0">
<h6 class="text-muted mb-2">Checkboxes</h6>
<fieldset>
<div class="custom-control custom-checkbox d-block my-2">
Expand Down Expand Up @@ -403,7 +403,7 @@ <h6 class="text-muted mb-2">Checkboxes</h6>
</div>
</fieldset>
</div>
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12">
<div class="custom-controls-example col-md-3 col-sm-3 col-xs-12">
<h6 class="text-muted mb-2">Radio Buttons</h6>
<fieldset>
<div class="custom-control custom-radio d-block my-2">
Expand Down Expand Up @@ -433,7 +433,7 @@ <h6 class="text-muted mb-2">Radio Buttons</h6>
</div>
</fieldset>
</div>
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-4">
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-5">
<h6 class="text-muted mb-1">Toggles</h6>
<fieldset>
<div class="custom-control custom-toggle d-block my-2">
Expand Down Expand Up @@ -463,28 +463,38 @@ <h6 class="text-muted mb-1">Toggles</h6>
</div>
</fieldset>
</div>
</div>

<div class="row mb-5">
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-0">
<h6 class="text-muted mb-1">Toggles Size Variation</h6>
<div class="custom-controls-example col-md-2 col-sm-2 col-xs-12 pl-3">
<h6 class="text-muted mb-1">Sizes</h6>

<fieldset>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle1sm" name="customToggle1sm" class="custom-control-input">
<label class="custom-control-label" for="customToggle1sm">Rockets Small</label>
<label class="custom-control-label" for="customToggle1sm">Rockets</label>
</div>
</fieldset>

<fieldset>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle2sm" name="customToggle2sm" class="custom-control-input" checked>
<label class="custom-control-label" for="customToggle2sm">Lasers Small</label>
<label class="custom-control-label" for="customToggle2sm">Lasers</label>
</div>
</fieldset>

<fieldset disabled>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle3" name="customToggle3" class="custom-control-input">
<label class="custom-control-label" for="customToggle3">HAL</label>
</div>
</fieldset>

<fieldset disabled>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle4" name="customToggle4" class="custom-control-input" checked>
<label class="custom-control-label" for="customToggle4">Ultron</label>
</div>
</fieldset>
</div>
</div>

<div class="row mb-5">
<div class="col-md-6 pl-0 custom-dropdown-example">
<h6 class="text-muted mb-3">Custom Dropdown</h6>
Expand Down
32 changes: 21 additions & 11 deletions src/extras/shards-demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -373,7 +373,7 @@ <h5 class="mb-4 w-100">Custom Controls</h5>
</div>

<div class="row mb-5">
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-0">
<div class="custom-controls-example col-md-3 col-sm-3 col-xs-12 pl-0">
<h6 class="text-muted mb-2">Checkboxes</h6>
<fieldset>
<div class="custom-control custom-checkbox d-block my-2">
Expand Down Expand Up @@ -403,7 +403,7 @@ <h6 class="text-muted mb-2">Checkboxes</h6>
</div>
</fieldset>
</div>
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12">
<div class="custom-controls-example col-md-3 col-sm-3 col-xs-12">
<h6 class="text-muted mb-2">Radio Buttons</h6>
<fieldset>
<div class="custom-control custom-radio d-block my-2">
Expand Down Expand Up @@ -433,7 +433,7 @@ <h6 class="text-muted mb-2">Radio Buttons</h6>
</div>
</fieldset>
</div>
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-4">
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-5">
<h6 class="text-muted mb-1">Toggles</h6>
<fieldset>
<div class="custom-control custom-toggle d-block my-2">
Expand Down Expand Up @@ -463,28 +463,38 @@ <h6 class="text-muted mb-1">Toggles</h6>
</div>
</fieldset>
</div>
</div>

<div class="row mb-5">
<div class="custom-controls-example col-md-4 col-sm-4 col-xs-12 pl-0">
<h6 class="text-muted mb-1">Toggles Size Variation</h6>
<div class="custom-controls-example col-md-2 col-sm-2 col-xs-12 pl-3">
<h6 class="text-muted mb-1">Sizes</h6>

<fieldset>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle1sm" name="customToggle1sm" class="custom-control-input">
<label class="custom-control-label" for="customToggle1sm">Rockets Small</label>
<label class="custom-control-label" for="customToggle1sm">Rockets</label>
</div>
</fieldset>

<fieldset>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle2sm" name="customToggle2sm" class="custom-control-input" checked>
<label class="custom-control-label" for="customToggle2sm">Lasers Small</label>
<label class="custom-control-label" for="customToggle2sm">Lasers</label>
</div>
</fieldset>

<fieldset disabled>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle3" name="customToggle3" class="custom-control-input">
<label class="custom-control-label" for="customToggle3">HAL</label>
</div>
</fieldset>

<fieldset disabled>
<div class="custom-control custom-toggle custom-toggle-sm d-block my-2">
<input type="checkbox" id="customToggle4" name="customToggle4" class="custom-control-input" checked>
<label class="custom-control-label" for="customToggle4">Ultron</label>
</div>
</fieldset>
</div>
</div>

<div class="row mb-5">
<div class="col-md-6 pl-0 custom-dropdown-example">
<h6 class="text-muted mb-3">Custom Dropdown</h6>
Expand Down

0 comments on commit 3fe228e

Please sign in to comment.