chore: 🤖 polish card and example card usage

ui/desktop/app/components/card/index.hbs

@@ -24,4 +24,4 @@
       {{yield to='footer'}}
     </footer>
   {{/if}}
-</section>
+</section>

ui/desktop/app/templates/scopes/scope/projects/targets.hbs

@@ -30,9 +30,9 @@
               </Copyable>
             </p>
 
-            {{!-- <Rose::Separator />
+            {{! <Rose::Separator />
 
-            <h3>Credentials</h3>--}}
+            <h3>Credentials</h3>
 
             <Card @heading="Credentials" @icon='app-icons/credentials'>
               <:body>
@@ -56,7 +56,7 @@
                 </Rose::Table>
               </:body>
             </Card>
-
+            }}
           </:body>
           <:footer>
             <div>
@@ -83,4 +83,4 @@
   {{/each}}
 {{/each}}
 
-{{outlet}}
+{{outlet}}

ui/desktop/tests/integration/components/card-test.js

@@ -13,10 +13,10 @@ module('Integration | Component | card', function (hooks) {
 
   test('it renders with content', async function (assert) {
     await render(hbs`
-      <Card as |card|>
-        <card.header></card.header>
-        <card.body></card.body>
-        <card.footer></card.footer>
+      <Card>
+        <:header></:header>
+        <:body></:body>
+        <:footer></:footer>
       </Card>
     `);
 
@@ -30,11 +30,10 @@ module('Integration | Component | card', function (hooks) {
     await render(hbs`
       <Card
         @heading='This is a heading test'
-        @icon='key'
-      as |card|>
-        <card.header></card.header>
-        <card.body></card.body>
-        <card.footer></card.footer>
+        @icon='key'>
+        <:header></:header>
+        <:body></:body>
+        <:footer></:footer>
       </Card>
     `);