feat(settings): update MCP server card layout and styling

- Adjusted the width of the CardContainer to dynamically calculate based on viewport width.
- Changed the layout of the McpServersList from grid to list, with a vertical orientation and updated styling for list items.

src/renderer/src/pages/settings/MCPSettings/McpServerCard.tsx

@@ -183,6 +183,7 @@ const CardContainer = styled.div<{ $isActive: boolean }>`
   margin-bottom: 5px;
   height: 125px;
   opacity: ${(props) => (props.$isActive ? 1 : 0.6)};
+  width: calc(100vw - var(--settings-width) - 40px);
 
   &:hover {
     opacity: 1;

src/renderer/src/pages/settings/MCPSettings/McpServersList.tsx

@@ -249,7 +249,9 @@ const McpServersList: FC = () => {
         items={filteredMcpServers}
         itemKey="id"
         onSortEnd={onSortEnd}
-        layout="grid"
+        layout="list"
+        horizontal={false}
+        listStyle={{ display: 'flex', flexDirection: 'column' }}
         gap="12px"
         restrictions={{ scrollableAncestor: true }}
         useDragOverlay