fix grouping of RadioGroup with meaningful title (#13838)

* fix grouping of RadioGroup with meaninful title

* apply fix from Phil

pkg/rancher-components/src/components/Form/Radio/RadioGroup.vue

@@ -199,12 +199,13 @@ export default defineComponent({
 </script>
 
 <template>
-  <div>
+  <fieldset>
     <!-- Label -->
     <div
       v-if="label || labelKey || tooltip || tooltipKey || $slots.label"
       class="radio-group label"
     >
+      <legend>
         <slot name="label">
           <h3>
             <t
@@ -226,6 +227,7 @@ export default defineComponent({
             />
           </h3>
         </slot>
+      </legend>
     </div>
 
     <!-- Group -->
@@ -266,7 +268,7 @@ export default defineComponent({
         </slot>
       </div>
     </div>
-  </div>
+  </fieldset>
 </template>
 
 <style lang='scss'>

shell/assets/styles/base/_basic.scss

@@ -144,3 +144,9 @@ HR.vertical {
 .force-wrap       { @include force-wrap }
 .bordered-section { @include bordered-section }
 .section-divider  { @include section-divider }
+
+fieldset {
+  border: 0;
+  padding: 0;
+  margin-inline: 0;
+}

shell/components/LandingPagePreference.vue

@@ -103,9 +103,6 @@ export default {
 
 <template>
   <div>
-    <p class="set-landing-leadin">
-      {{ t('landing.landingPrefs.body') }}
-    </p>
     <RadioGroup
       id="login-route"
       :value="afterLoginRoute"
@@ -113,6 +110,11 @@ export default {
       :options="routeRadioOptions"
       @update:value="updateLoginRoute"
     >
+      <template #label>
+        <p class="set-landing-leadin">
+          {{ t('landing.landingPrefs.body') }}
+        </p>
+      </template>
       <template #2="{option}">
         <div class="custom-page">
           <RadioButton