Change table to card components

docs/components/connectors/introduction.md

@@ -53,6 +53,10 @@ New to connectors? Learn how to start using connectors in your processes and abo
   </a>
 </div>
 
+:::info
+Get started quickly by learning how to [integrate a Camunda connector](/guides/configuring-out-of-the-box-connector.md).
+:::
+
 ## Custom connectors
 
 Build and deploy your own connectors using connector templates and the connector SDK.

docs/components/connectors/out-of-the-box-connectors/available-connectors-overview.md

@@ -13,5 +13,3 @@ Get help with our library of prebuilt Camunda Connectors for SaaS and [Self-Mana
 :::tip
 Don't see the Connector you need? Build your own [custom Connector](/components/connectors/custom-built-connectors/build-connector.md), or explore the [Camunda MarketPlace](https://marketplace.camunda.com/) for more Connectors developed by Camunda, Partners, and the Community.
 :::
-=======
-Beginners to Connectors may want to get familiar with Connectors using a [guide to configuring out-of-the-box Connectors](/guides/configuring-out-of-the-box-connector.md).

docs/components/connectors/out-of-the-box-connectors/connectors-table.css

@@ -104,7 +104,6 @@ a.connector-card {
 }
 
 .connector-card img {
-  max-width: 40px;
   height: 40px;
   border: none;
   margin-bottom: 10px;
@@ -224,3 +223,8 @@ a.connector-small-link {
     padding: 40px 30px 20px 30px;
   }
 }
+
+.badge:nth-of-type(1) {
+  margin-left: 0;
+  margin-bottom: 5px;
+}