diff options
| author |   Israel Lavi <israel.lavi@intl.att.com> | 2018-08-07 11:36:58 +0300 |
|---|---|---|
| committer |   Israel Lavi <il0695@att.com> | 2018-08-07 11:48:04 +0300 |
| commit | 75dc1476d6d592c6c2c54f8d08d3047c90c8f9dc (patch) | |
| tree | b1412c3c7616b07852c941fd21fc9836f2d43e86 /components/radioGroup | |
| parent | 57a7853903df631a2031b5b57ce4d131364006f6 (diff) | |
Initial commit
Change-Id: I061d81a33aebadb83ba0e085e8e34339fed5ed53
Issue-ID: SDC-1609
Signed-off-by: Israel Lavi <il0695@att.com>
Diffstat (limited to 'components/radioGroup')
| -rw-r--r-- | components/radioGroup/_radioGroup.scss | 20 | ||||
| -rw-r--r-- | components/radioGroup/radio-group-disabled.html | 13 | ||||
| -rw-r--r-- | components/radioGroup/radio-group-no-title.html | 12 | ||||
| -rw-r--r-- | components/radioGroup/radio-group-value.html | 13 | ||||
| -rw-r--r-- | components/radioGroup/radio-group.html | 13 |
5 files changed, 71 insertions, 0 deletions
diff --git a/components/radioGroup/_radioGroup.scss b/components/radioGroup/_radioGroup.scss new file mode 100644 index 0000000..6b33a79 --- /dev/null +++ b/components/radioGroup/_radioGroup.scss @@ -0,0 +1,20 @@ +.sdc-radio-group { + .sdc-radio-group__radios { + display: flex; + } + .sdc-radio-group__legend { + @include body-2-emphasis; + display: inline-block; + margin-bottom: 5px; + } + .sdc-radio__label { + @include body-1; + margin-right: 20px; + } + .vertical{ + flex-direction: column; + .sdc-radio{ + margin-bottom: 15px; + } + } +} diff --git a/components/radioGroup/radio-group-disabled.html b/components/radioGroup/radio-group-disabled.html new file mode 100644 index 0000000..3cdedc0 --- /dev/null +++ b/components/radioGroup/radio-group-disabled.html @@ -0,0 +1,13 @@ +<div class='sdc-radio-group'> + <label class='sdc-radio-group__legend'>Group D</label> + <div class='sdc-radio-group__radios'> + <div class="sdc-radio"> + <input type="radio" name="grp4" class="sdc-radio__input" value="1" disabled> + <label class="sdc-radio__label">option 1</label> + </div> + <div class="sdc-radio"> + <input type="radio" name="grp4" class="sdc-radio__input" value="2" disabled> + <label class="sdc-radio__label">option 2</label> + </div> + </div> +</div> diff --git a/components/radioGroup/radio-group-no-title.html b/components/radioGroup/radio-group-no-title.html new file mode 100644 index 0000000..76217fe --- /dev/null +++ b/components/radioGroup/radio-group-no-title.html @@ -0,0 +1,12 @@ +<div class='sdc-radio-group'> + <div class='sdc-radio-group__radios'> + <div class="sdc-radio"> + <input type="radio" name="grp5" class="sdc-radio__input" value="1"> + <label class="sdc-radio__label">option 1</label> + </div> + <div class="sdc-radio"> + <input type="radio" name="grp5" class="sdc-radio__input" value="2"> + <label class="sdc-radio__label">option 2</label> + </div> + </div> +</div> diff --git a/components/radioGroup/radio-group-value.html b/components/radioGroup/radio-group-value.html new file mode 100644 index 0000000..ac604a6 --- /dev/null +++ b/components/radioGroup/radio-group-value.html @@ -0,0 +1,13 @@ +<div class='sdc-radio-group'> + <label class='sdc-radio-group__legend'>Group B</label> + <div class='sdc-radio-group__radios'> + <div class="sdc-radio"> + <input type="radio" name="grp2" checked class="sdc-radio__input" value="1"> + <label class="sdc-radio__label">option 1</label> + </div> + <div class="sdc-radio"> + <input type="radio" name="grp2" class="sdc-radio__input" value="2"> + <label class="sdc-radio__label">option 2</label> + </div> + </div> +</div> diff --git a/components/radioGroup/radio-group.html b/components/radioGroup/radio-group.html new file mode 100644 index 0000000..baa1444 --- /dev/null +++ b/components/radioGroup/radio-group.html @@ -0,0 +1,13 @@ +<div class='sdc-radio-group'> + <label class='sdc-radio-group__legend'>Group C</label> + <div class='sdc-radio-group__radios'> + <div class="sdc-radio"> + <input type="radio" name="grp3" class="sdc-radio__input" value="1"> + <label class="sdc-radio__label">option 1</label> + </div> + <div class="sdc-radio"> + <input type="radio" name="grp3" class="sdc-radio__input" value="2"> + <label class="sdc-radio__label">option 2</label> + </div> + </div> +</div> |