feat: add cards style layout for bookmarks widget

[vishalkadam47]

Adds a new style option to display bookmarks as visual cards in a responsive grid layout. Cards include icon, title, description and optional button text.

Changes

• Added style: cards option to bookmarks widget
• Implemented grid-based layout using CSS Grid
• Supports 32x32px icons with background highlighting
• Added support for descriptions with 2-line truncation
• Added optional button text display
• Maintains group organization and custom colors
• Responsive layout that adjusts columns based on viewport width

Bookmarks-config

- name: Bookmarks
  width: wide
  columns:
    - size: full
      widgets:
        - type: bookmarks
          style: cards
          groups:
            - title: Marketplace
              color: "43 70 60" # Orange-ish
              links:
                - title: Glance
                  description: A self-hosted dashboard that puts all your feeds in one place
                  url: https://railway.com/template/ZHBnkG?referralCode=vishify
                  icon: https://raw.githubusercontent.com/glanceapp/glance/refs/heads/main/internal/glance/static/app-icon.png
                  button-text: Deploy

                - title: Wish-Glance
                  description: Clone of Glance with GitHub Gist API and single volume support
                  url: https://railway.com/template/UGcNz8?referralCode=vishify
                  icon: https://raw.githubusercontent.com/glanceapp/glance/refs/heads/main/internal/glance/static/app-icon.png
                  button-text: Deploy

                - title: Buy Me A Coffee
                  description: Fund your creative work
                  url: https://www.buymeacoffee.com/invite/vishalkadam47
                  icon: https://media3.giphy.com/media/v1.Y2lkPTc5MGI3NjExbDJneGxsNWRkZGowY3I0bnEyY2ViNzhqZXB2cnh5aHE5MDh0bnozeCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9cw/TDQOtnWgsBx99cNoyH/giphy.gif
                  button-text: Join
                  
                - title: Playbook
                  description: Playbook is a modern creative file manager. Designers, sign up today and get 4TB storage!
                  url: https://www.playbook.com/sign-up?ref=continuum
                  icon: https://playbook-beta.imgix.net/759994d1-95f9-4873-b418-15741a69c797
                  button-text: Join Playbook
                  
                - title: DokPloy
                  description: Deploy Anywhere with Total Freedom and Ease.
                  url: https://dokploy.com/
                  icon: https://raw.githubusercontent.com/Dokploy/dokploy/refs/heads/canary/apps/dokploy/public/icon.svg
                  button-text: Try DokPloy

                - title: Vultr
                  description: Try Vultr for free with $300 free credit!
                  url: https://www.vultr.com/?ref=9670079-9J
                  icon: https://www.vultr.com/media/logo_ondark.svg
                  button-text: Join Vultr
                                
                - title: Puter
                  description: Puter is a privacy-first personal cloud that houses all your files, apps, and games in one private and secure place, accessible from anywhere at any time.
                  url: https://puter.com/?r=N1Z4845I
                  icon: https://raw.githubusercontent.com/HeyPuter/puter/3f0e990398be0dcbba5da4fe8dda0ad7f5bf405e/src/gui/src/images/logo.png
                  button-text: Try Puter

                - title: SpaceDrive
                  description: Spacedrive is an open source cross-platform file explorer, powered by a virtual distributed filesystem written in Rust.
                  url: https://railway.com/template/oZ13es?referralCode=vishify
                  icon: https://raw.githubusercontent.com/spacedriveapp/spacedrive/refs/heads/main/apps/landing/public/logo.png
                  button-text: Deploy
                  
                - title: Homarr
                  description: A simple, yet powerful dashboard for your server.
                  url: https://railway.com/template/_c4Kr9?referralCode=vishify
                  icon: https://raw.githubusercontent.com/ajnart/homarr/refs/heads/dev/public/imgs/logo/logo.svg
                  button-text: Deploy

                - title: Kitchen.co
                  description: Client Portal Software for Agencies. Kitchen.co is the complete client portal software that lets you do it all with your clients and team, stress-free. Change the way you work with clients.
                  url: https://kitchen.co?fpr=wish
                  icon: https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL-7u1C4Kms7iDM26-KaTBJ0I2nO2SAOrQGQ&s
                  button-text: Try Kitchen.co

                - title: Mava
                  description: Customer Support for Communities The ultimate customer support platform for community-driven companies. Support, respond, track and optimize support from one place, wherever your users are.
                  url: https://www.mava.app/?via=wish
                  icon: si:mega
                  button-text: Get Mava

        - type: bookmarks
          style: cards
          groups:
            - title: Quick Access
              color: "43 70 60" # Orange-ish
              links:
                - title: Gmail
                  url: https://mail.google.com
                  icon: si:gmail
                  description: "Check your inbox and stay connected"
                - title: Drive
                  url: https://drive.google.com
                  icon: si:googledrive
                  description: "Access your files and documents"
                - title: Photos
                  url: https://photos.google.com
                  icon: si:googlephotos
                  description: "Browse your photo library"
                - title: Maps
                  url: https://maps.google.com
                  icon: si:googlemaps
                  description: "Navigate and explore places"
                - title: GitHub
                  url: https://github.com
                  icon: si:github
                  description: "Where the world builds software"
                - title: VS Code
                  url: https://code.visualstudio.com
                  icon: si:visualstudiocode
                  description: "Code editing. Redefined."
                - title: GitLab
                  url: https://gitlab.com
                  icon: si:gitlab
                  description: "DevOps platform & Git repository"
                - title: Stack Overflow
                  url: https://stackoverflow.com
                  icon: si:stackoverflow
                  description: "Developer knowledge sharing"

        - type: bookmarks
          style: cards
          groups:
            - title: Design Tools
              color: "280 60 60"  # Purple-ish
              links:
                - title: Figma
                  url: https://www.figma.com
                  icon: si:figma
                  description: "Collaborative interface design tool"
                  button-text: "Design"
                - title: Adobe XD
                  url: https://www.adobe.com/products/xd.html
                  icon: si:adobexd
                  description: "UI/UX design solution"
                  button-text: "Create"
                - title: Sketch
                  url: https://www.sketch.com
                  icon: si:sketch
                  description: "Digital design toolkit"
                  button-text: "Design"
                - title: Photoshop
                  url: https://www.adobe.com/products/photoshop.html
                  icon: si:adobephotoshop
                  description: "Image editing software"
                  button-text: "Edit"
                - title: Illustrator
                  url: https://www.adobe.com/products/illustrator.html
                  icon: si:adobeillustrator
                  description: "Vector graphics editor"
                  button-text: "Create"
                - title: InVision
                  url: https://www.invisionapp.com
                  icon: si:invision
                  description: "Digital product design platform"
                  button-text: "Design"

    - size: full
      widgets:
        - type: bookmarks
          style: list
          groups:
            - title: Social Media
              color: "350 60 60" # Red-ish
              links:
                - title: Twitter
                  url: https://twitter.com
                  icon: si:twitter
                - title: LinkedIn
                  url: https://linkedin.com
                  icon: si:linkedin
                - title: Reddit
                  url: https://reddit.com
                  icon: si:reddit
                - title: Discord
                  url: https://discord.com
                  icon: si:discord

            - title: Entertainment
              color: "280 60 60" # Purple-ish
              links:
                - title: YouTube
                  url: https://youtube.com
                  icon: si:youtube
                - title: Spotify
                  url: https://open.spotify.com
                  icon: si:spotify
                - title: Netflix
                  url: https://netflix.com
                  icon: si:netflix
                - title: Twitch
                  url: https://twitch.tv
                  icon: si:twitch

        - type: bookmarks
          groups:
            - title: Productivity
              color: "160 50 60" # Green-ish
              links:
                - title: Notion
                  url: https://notion.so
                  icon: si:notion
                  description: "All-in-one workspace"
                  button-text: "Open"
                - title: Trello
                  url: https://trello.com
                  icon: si:trello
                  description: "Organize anything with boards"
                  button-text: "Boards"
                - title: Slack
                  url: https://slack.com
                  icon: si:slack
                  description: "Business communication"
                  button-text: "Chat"
                - title: Zoom
                  url: https://zoom.us
                  icon: si:zoom
                  description: "Video conferencing"
                  button-text: "Join"

            - title: News & Learning
              color: "43 50 60" # Yellow-ish
              links:
                - title: Medium
                  url: https://medium.com
                  icon: si:medium
                  description: "Where good ideas find you"
                  button-text: "Read"
                - title: Dev.to
                  url: https://dev.to
                  icon: si:devdotto
                  description: "Developer community"
                  button-text: "Explore"
                - title: Hashnode
                  url: https://hashnode.com
                  icon: si:hashnode
                  description: "Developer blogging platform"
                  button-text: "Blog"
                - title: freeCodeCamp
                  url: https://freecodecamp.org
                  icon: si:freecodecamp
                  description: "Learn to code for free"
                  button-text: "Learn"

        - type: bookmarks
          style: cards
          groups:
            - title: Documentation
              color: "43 70 60"  # Orange-ish
              links:
                - title: Docker Docs
                  url: https://docs.docker.com
                - title: Kubernetes Docs
                  url: https://kubernetes.io/docs
                - title: AWS Documentation
                  url: https://docs.aws.amazon.com
                - title: Azure Docs
                  url: https://docs.microsoft.com/azure
                - title: Google Cloud Docs
                  url: https://cloud.google.com/docs

        - type: bookmarks
          style: cards
          groups:
            - title: Version Control
              color: "190 50 60"  # Cyan-ish
              links:
                - title: GitHub
                  url: https://github.com
                  description: "World's leading software development platform"
                - title: GitLab
                  url: https://gitlab.com
                  description: "Complete DevOps platform"
                - title: Bitbucket
                  url: https://bitbucket.org
                  description: "Git solution for professional teams"
                - title: Git
                  url: https://git-scm.com/doc
                  description: "Official Git version control documentation"

        - type: bookmarks
          style: cards
          groups:
            - title: Popular Tools
              color: "230 60 60"  # Blue-ish
              links:
                - title: VS Code
                  url: https://code.visualstudio.com
                  icon: si:visualstudiocode
                - title: Sublime
                  url: https://www.sublimetext.com
                  icon: si:sublimetext
                - title: PyCharm
                  url: https://www.jetbrains.com/pycharm
                  icon: si:pycharm
                - title: IntelliJ IDEA
                  url: https://www.jetbrains.com/idea
                  icon: si:intellijidea
                - title: WebStorm
                  url: https://www.jetbrains.com/webstorm
                  icon: si:webstorm
                - title: Atom
                  url: https://atom.io
                  icon: si:atom
                - title: Vim
                  url: https://www.vim.org
                  icon: si:vim
                - title: Notepad++
                  url: https://notepad-plus-plus.org
                  icon: si:notepadplusplus

            - title: Cloud Services
              color: "160 50 60"  # Green-ish
              links:
                - title: AWS
                  url: https://aws.amazon.com
                  icon: si:amazonaws
                - title: Google Cloud
                  url: https://cloud.google.com
                  icon: si:googlecloud
                - title: Azure
                  url: https://azure.microsoft.com
                  icon: si:microsoftazure
                - title: DigitalOcean
                  url: https://www.digitalocean.com
                  icon: si:digitalocean
                - title: Heroku
                  url: https://www.heroku.com
                  icon: si:heroku
                - title: Vercel
                  url: https://vercel.com
                  icon: si:vercel
                - title: Netlify
                  url: https://www.netlify.com
                  icon: si:netlify
                - title: Cloudflare
                  url: https://www.cloudflare.com
                  icon: si:cloudflare

[0x00cl]

I guess this something similar to my PR (#600) I just wasn't sure what to do with the description so I just left it out.