From 5d6da1e52de5aa71d253fe8eabb0797781015306 Mon Sep 17 00:00:00 2001
From: dharini <dharini@hashicorp.com>
Date: Tue, 20 Jul 2021 16:11:57 -0700
Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=8E=B8=20add=20inline=20aligntmen?=
 =?UTF-8?q?t=20support=20to=20checkbox=20and=20radio?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 addons/rose/addon/components/rose/form/checkbox/index.hbs   | 2 +-
 .../rose/addon/components/rose/form/radio/group/index.hbs   | 2 ++
 .../rose/addon/components/rose/form/radio/radio/index.hbs   | 4 ++--
 .../rose/addon/styles/rose/components/form/_checkbox.scss   | 4 ++++
 addons/rose/addon/styles/rose/components/form/_radio.scss   | 6 ++++++
 5 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/addons/rose/addon/components/rose/form/checkbox/index.hbs b/addons/rose/addon/components/rose/form/checkbox/index.hbs
index a660c270d..e4a2c11d5 100644
--- a/addons/rose/addon/components/rose/form/checkbox/index.hbs
+++ b/addons/rose/addon/components/rose/form/checkbox/index.hbs
@@ -1,4 +1,4 @@
-<div class="rose-form-checkbox{{if @error " error"}}">
+<div class="rose-form-checkbox{{if @error " error"}} {{if @inline "inline"}}">
 
   <Input
     ...attributes
diff --git a/addons/rose/addon/components/rose/form/radio/group/index.hbs b/addons/rose/addon/components/rose/form/radio/group/index.hbs
index fc34bd1cc..a503c3bc9 100644
--- a/addons/rose/addon/components/rose/form/radio/group/index.hbs
+++ b/addons/rose/addon/components/rose/form/radio/group/index.hbs
@@ -1,3 +1,5 @@
+<div class="{{if @inline 'radio-group-inline'}}">
 {{yield (hash
   radio=(component 'rose/form/radio/radio' name=@name selectedValue=@selectedValue disabled=@disabled changed=@changed)
 )}}
+</div>
\ No newline at end of file
diff --git a/addons/rose/addon/components/rose/form/radio/radio/index.hbs b/addons/rose/addon/components/rose/form/radio/radio/index.hbs
index eb45384c6..86edfd524 100644
--- a/addons/rose/addon/components/rose/form/radio/radio/index.hbs
+++ b/addons/rose/addon/components/rose/form/radio/radio/index.hbs
@@ -1,8 +1,8 @@
-<div class="rose-form-radio{{if @error " error"}}">
+<div class="rose-form-radio{{if @error " error"}} {{if @inline "inline"}}">
 
   <RadioButton
     ...attributes
-    @radioClass="rose-form-radio-field"
+    @radioClass="rose-form-radio-field" 
     @radioId={{this.id}}
     type="radio"
     disabled={{@disabled}}
diff --git a/addons/rose/addon/styles/rose/components/form/_checkbox.scss b/addons/rose/addon/styles/rose/components/form/_checkbox.scss
index ec86a0367..6dd2c6802 100644
--- a/addons/rose/addon/styles/rose/components/form/_checkbox.scss
+++ b/addons/rose/addon/styles/rose/components/form/_checkbox.scss
@@ -2,6 +2,10 @@
 @use '../../utilities/type';
 
 .rose-form-checkbox {
+  &.inline {
+    display: inline-block;
+    margin-right: sizing.rems(s);
+  }
   @include type.type(m);
   position: relative;
   margin-bottom: sizing.rems(m);
diff --git a/addons/rose/addon/styles/rose/components/form/_radio.scss b/addons/rose/addon/styles/rose/components/form/_radio.scss
index 860c39ca5..723407017 100644
--- a/addons/rose/addon/styles/rose/components/form/_radio.scss
+++ b/addons/rose/addon/styles/rose/components/form/_radio.scss
@@ -21,6 +21,12 @@ $radio-svg: (
 );
 
 $data-svg-prefix: 'data:image/svg+xml;utf-8,';
+.radio-group-inline {
+  display: flex;
+  .rose-form-radio {
+    margin-right: sizing.rems(s);
+  }
+}
 
 .rose-form-radio {
   @include type.type(m);