{"componentChunkName":"component---src-templates-angulardocs-js","path":"/docs/contrast/angular/components/card","result":{"data":{"site":{"siteMetadata":{"title":"Resources to help developers | Contrast | Devwares","docsLocation":""}},"mdx":{"fields":{"id":"3e9d93c9-edb4-5eac-a3b2-15c96297c2d1","title":"Card","slug":"/contrast/angular/components/card"},"body":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsxRuntime classic */\n\n/* @jsx mdx */\nvar _frontmatter = {\n \"title\": \"Card\",\n \"metaTitle\": \"Card Component for Contrast Bootstrap Angular\",\n \"metaDescription\": \"Angular Bootstrap card is a flexible and extensible content container\"\n};\nvar layoutProps = {\n _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n var components = _ref.components,\n props = _objectWithoutProperties(_ref, [\"components\"]);\n\n return mdx(MDXLayout, _extends({}, layoutProps, props, {\n components: components,\n mdxType: \"MDXLayout\"\n }), mdx(\"h1\", null, \"Card\"), mdx(\"p\", null, \"An Angular Bootstrap card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options.\\nCard components display content build of different elements with characteristic shadows, depth and hover effects.\"), mdx(\"h2\", null, \"Basic Examples\"), mdx(\"p\", null, \"Basic Card example.\\nCards are built with as little markup and styles as possible, but still manage to deliver a ton of control and customization.\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"507px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/d4fc17719d10bc41415c3db100e8923a/3ebb1/cardsbasic.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"114.67181467181466%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAXCAYAAAALHW+jAAAACXBIWXMAABJ0AAASdAHeZh94AAAEIklEQVQ4y62Ua0ybZRTHq6BbnC6tMK4FNy6lrOVSKJe2CJQWSkuR+0UGRAdO46aLshmWZWbRb/OTn+ZmolNCFLfJ9AOCJvsyozFxJsaYiF/MkHsHTDpKaQs/n5aWYpw6Ep83//c873nO+3vOc86bV4IYHq+XlRUXq65VXC4XzpWVwHxVzFdcQb9YdwV8qwGfKxi7+Z6LNfcaG+KS+IFjn41QoNBh01poFDJrzJTmWbBrrZTnVWHR2mgvrqemoBZjvo2ivGp0+Xbyci0UFNgoVFXw8pGTftQm8MrAZaSSWFL3KimUZWOQ5ZAnZIktpiQ6nydjCumQl2GNLaIoSkuqNBvZY1lCaqJlWUgjD9BZ0x0GfjR4ldjdqWjiCjAl6KiV6zmaYuRVhZXTmbUcT7fSL+xZVT3daRYqnyjHlFSGMsGAXMSrpDn0NBwWBw4CPx78lKhdaahiC6mWl1ImAjuSyzmjqOENpZ0L6gYGcpu5oGnldaWNwylmTiut6JNN6JJKSReZNtX3hDMcGrzGvt2ZZMaWoE00USA3o5FXYkuroya9nteyGjid08DR7Bbe1XUJcBPn1bU0J5dgjxPl2ZNBb/2zYeD1K19QJzfwdGY1nQftPJfdwHFtG4b9BuKlcuSPSJHv2kv0ozHiFGrO6VoZK2nmTGIOJ+Qa2mQHOdXSGwb+MnKdD3R1DFd2MFLdwTeN3fzc1UubWk2KTEa/OoV3ynPQx0STFR/Dpbomfj/Sw63iQm5o9Xyt1fHl88fwhYCjlz/HFKeiRVHMIWUJx3KreLPoKd4rbWXI0MJP7e3MvtTN97ZDDFvbuWhs5GyeaFparmieinZpAqcaO8IZfjjwCZEPxhEvU5IkU5EWraFQNKZTUc0rGWU8k5xOV+J++jN09KSbKRcdVuzTkvh4FnFRaiIiErHaO8PAS+8PIpE8TKRkj7APCEnuWxGShwLWbKwNA0dHxzDoDVSYjBiN5VRUVIh5RcBWmyqxm6uwmSuxCJlNpsCaKbhuNpvQ63X09Z3YBG6Ir3HDf/sfhp8jCcEmJia4efMHxsd/xem8G/Ctr68Hgv5NoRifzxcG+rW8vMzk5CQOx23ca2tbwJD8L2x/3r6Zf/wNuCJ+WQ6Hg6WlO0zPzDA/72Bmdo6p6WlhZ5kV87m5ebHpFJNTU8zOzeEVv71/BDqdTn67NSUAM0xMTnN7YSEA9me8IOYLi0ssLi4GoA6x2XxQofJsAUUpRfobeN1OlhdnuHtnTix7/SUWQZtHvddxQ757ZBioFuOTHq5+6+Lady6++tGN27Ozzm8BveubwHPDTg68+Ac5fU60J5eYXvAEG7Pxn53+C9AXBA7dcNL61gLdby/ywnlRs2Xv1re1owxDDz6vB6/HHZDPu7ZVu/tVqOOSUBbbE9nY8u1M/vEn6JxY/Rxx0FUAAAAASUVORK5CYII=')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/d4fc17719d10bc41415c3db100e8923a/3ebb1/cardsbasic.png\",\n \"srcSet\": [\"/static/d4fc17719d10bc41415c3db100e8923a/a2ead/cardsbasic.png 259w\", \"/static/d4fc17719d10bc41415c3db100e8923a/3ebb1/cardsbasic.png 507w\"],\n \"sizes\": \"(max-width: 507px) 100vw, 507px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n \\n \\n Basic\\n This is just a card text Get important notifications about you or activity you've missed\\n \\n \\n Button\\n \\n \\n\\n\")), mdx(\"h2\", null, \"Simple Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"481px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/ff0bddb6975d09b2924ffcd39b0d9711/d024a/cardsimple.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"149.80694980694983%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAACXBIWXMAABJ0AAASdAHeZh94AAAB40lEQVRIx81ViXKCMBD1//+vCoog5b6EKoeKsN2NknKWoNOZZmZJNOGRPd7bVV3XcL/foSzLjtF/S42wVrSYGlVVsUMixgHpxa8kgf1ehYOug7zdwk5RIDrGDJQOiQwOSI88y8B1Xfg0DLAsG1RNA8dxOeCcdQDJreJSQBCG4HseuGhZnj/AcK892gD9uQNIPy6XC6RpChne9na7PQ+Ou9sOwwCwWUy9RLdWVYzvQWcfHAvDJOCYS45tgyxLoCh7OJ1Ok4nqAP5WHqKJ6WSZAKftPrP/YxywX/Fl+ZhFgZrE/h1TkiR+MGSnwHojgSRvIYyi95ji+wFjh+N6jIIuzm8xJQwjRj8CzPJi0e1GmZIj3c7nM1oKRVFwGXvEEWBK5tpSxwGv1yvEcczteDxChDGktYmCoaD6kGAEQcj3yJp1gmo1AKTNvtFB27YQcAeadkDAgH+wf27AlCkVrhrFGanXUcWeZ0olXOSdpDQBb8//iCkYaEmSGVs+1htmlNGXmFLho8AapBZATKEWYBgmeMicl5hSVzUrZB9LwnUcsBE0zZ49pa5mbzaq2BQrSgQBU28h+eortzBgA6apGitgHYWBmpSou5NdzzJN1oxM02IfWDoGLrddWFJ/jdElhJmypKd8AwluNDCcVaAQAAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/ff0bddb6975d09b2924ffcd39b0d9711/d024a/cardsimple.png\",\n \"srcSet\": [\"/static/ff0bddb6975d09b2924ffcd39b0d9711/a2ead/cardsimple.png 259w\", \"/static/ff0bddb6975d09b2924ffcd39b0d9711/d024a/cardsimple.png 481w\"],\n \"sizes\": \"(max-width: 481px) 100vw, 481px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n Heading\\n Paragraph\\n
\\n \\n Button\\n \\n
\\n \\n\\n\\n \\n Heading\\n Paragraph\\n \\n Button\\n \\n \\n\\n\\n \\n Heading\\n Paragraph\\n \\n Button\\n \\n \\n\\n\")), mdx(\"h2\", null, \"Bordered Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"480px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/f2c25a3eb7938e3b4386bf1e961a9302/e85cb/cardbodered.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"159.84555984555985%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAgCAYAAAASYli2AAAACXBIWXMAABJ0AAASdAHeZh94AAACB0lEQVRIx61Wi3KiMBTl//9s221RtlWnD52pyhsdFVQEPZsTJxlEpUG9M0cSkxxu7hPrcDhgv98/BOSy+LNer7Farc6QpqkxuH+32x0Jm0St82kCi5vJ/P31Bbv7D52uA7vTxXA0kteokpqIJOTBxWIBPwgRJzMkSYJAjNtqpzUkYRTH8HwfvuchjOKzK1fnTRpbVfaiKCSUx9RBzsuyNDKBde2tar5cLtHv99Dr9TGZTMyu3CT5dgt3OsV4PEYym/3uFLLmeY7NZoOtOFwH1xgFBMeX9hA8T7Nowmsb20AT0hEkrUNpZgLup9MkoVK5ek3OmZJtQMW0lyWJIMvEQppmKIT6t4hOvc/PD/x5fsGL3cGrbeNdhEkp4+7QPlM4oGZZlknVOc7zXSsiFbc69WYixlzPhydSj/l8i5xoqBxzxPqs1jXVR67RByepRw3DMEQURRoxC4bnwnGOdh0Oh7IS1ffwHM2lCSlNYZJlR02Ujc/XMxkyOvXUn9dQP3wJfKFsAWRlyqjSdQ90pqhax2cVt3Q+TfgI0cVhXxbCgyM8Pf8VTaorvOrgrTc4qdAmQa0JOVgJozIE2Fvm87lsWKZd7yIhyVyRJcyW6dS92qSMCJUmytv1q7TSUJEFQQBH2K8/GIg2GrXuxyeE/IP5OP75geu6Mkjv8nI9bG79IpOEqnw96nPuP/8uzCVYmrUZAAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/f2c25a3eb7938e3b4386bf1e961a9302/e85cb/cardbodered.png\",\n \"srcSet\": [\"/static/f2c25a3eb7938e3b4386bf1e961a9302/a2ead/cardbodered.png 259w\", \"/static/f2c25a3eb7938e3b4386bf1e961a9302/e85cb/cardbodered.png 480w\"],\n \"sizes\": \"(max-width: 480px) 100vw, 480px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n Heading\\n Paragraph\\n
\\n \\n Button\\n \\n
\\n \\n\\n\\n \\n Heading\\n Paragraph\\n \\n Button\\n \\n \\n\\n\\n \\n Heading\\n Paragraph\\n \\n Button\\n \\n \\n\\n\")), mdx(\"h2\", null, \"Artwork Top Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"473px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/20f985e4f70989d210a08c2beb1e4a20/c7c3c/cardsartworktop.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"210.81081081081084%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAqCAYAAACz+XvQAAAACXBIWXMAABJ0AAASdAHeZh94AAAHcklEQVRIx7WWeWxU1xWHhyopsYEae/CMx7PZs3o8YHvsWWyP8YIXbIM3IF5LStq0apTS0jZSWxpBcCChTbAxRAQCVA0EUAQECKQS5Y9ErVoIW1FSp4CdKsIryHtA7Hw9b9xBgUZtSOhIvzn3vnfeueede3W+pxodHibgzMKlmU6e2UvQmI5Tl4rH6MNv8uI2pOM1BSi25BIwZ5NiDGDRe7EaszDpfej1GdgSMnFoUjiw7w+oRoeGSTdloJ9kZYY6hQKtF3+shyytj3J9kKDYfH02CxMKmStzv9ZPisaLJiYNbYwHjToVfWwa+kgHh/a+i2pwcJgksw9rlJvsOD/FukzqDEGeTpzFj2yl/NxRzvetJTzrnMvSpAoWybjQmEtWfA5uXRBtbAZWecYTlcw7ew+iGpIM3ZKyUQmoy6JEsigU+zNLESucc2hJrmCdq5KNM2rYkLZAgpZTYy7gV47ZlEjW0/V5ZBpmop/sYvfeQ+MBXQlBCeghQ5dHnrEQn76AXGMxDfYqmhwSKKORTb4mVmY0sT3QxCvTK2lzV/Fde6mUKJ0CndRxShKH3pZXHhkaocQ1m0BckJnmIgoSyyi1VzDHWUOepYTkOA/TY204YizYNG6qHUWsCTRwODCfX5oyaYxNZlF8BpmTrRzZJwGvjIyxvriJ9YFqXs+tZVtBPYfmfIed5Q3oY2KJiphIqfpb1MbFYIiMYMIjE/mxt5BjTzzD6ax8dllSeTM9nzVJfk4d+qMEHB2jraSOtsxyNuVWsb1oPodrGjlSU8/KYCE/dft4v7aMT5bU8rI/k+a8meyvqebEwkZO5GZy2OPhiN/PNoeLDw++O17DREMK2kkmrDEu3HJksmUHGy2ltHkbOZjdxIH8Mt4rK+N00SJ2BBeyxF3JrPiZpE7LwB7twhxlJXKChj27D4wHtJrTiZ1ixRjjFNlJUDtI1squx6fijTGQEBFB4mMRpEbF4ot14JZamtV29NEW4qNt6NVJTJpoZK9ybAYGBpk8SYNKpfra2rnjLanhlSus/s1qli9fxooVK2hubr5HLzav5CXRquYXWCl6QXS/T3PzCp577td89NGHqO7cucPD/IUCKlmePHWaEydP8ue//JVTp07S/vFZbty8xc2bN7+Ubty4EbKq27dvc+vWLcY++4yxsbG7dnBoCCV3ZcEvKyVOKEMlev/Fi/T39dHd08vA4NADv+rdgEqGykRJ9+rVq1y7do3r16+F7Pj4eshRkbJw+FpYyly5fk9AZTAkrzgwMHCPBiXT3t4e2tv/LvqYrq5uuTb4H36KlMBKrFBARZcvX2ZkZITR0dF7pCzU09MTkvKgUt/7fRQpb3g3YHiHFHu/wo6K/ptPWCoe8k91XVY4d66DDtE/z3fK+Dxnz54PjTvlmnKv89wnos5xhXw6OH9OsZ3i2xGynWKHh0dQ9Xf3MiN+Bs5prlAzyBLi2YWAKbp06eAeXHFCQGmgRSYBlCFAsnTnBK0Hc5yPeE06cdo0Egw+6fhJ/H7rTlS9XT04piVjmuKQdpRKoThmi2O+gKdaYFQgttiQw5OWYuYbZxKUebqQTyPE06kziBXqGcRf/5idnVsk4IULPSQKUx0xM8jRBULUazAGWWwp5Cf2MpYK7Z6xzeYXSXNZ7qriKeFIsSmPWYZc0qRvxmt82OKDpE5xsW3Lm6i6JKBF48EUnUJOfDaz9TmSVTZLhHrPC/XWCPU2JFexNWUeG9Me53nXHOYL9ZY5S6lILCZFqJctmcdFOtmsZNjd1UuiwD0h2otHl0/QUIRXP0ucSlhgr2aBUK81vZ7WjAaWehp5I2shr6bW8Nr0Kn7oKKVQ6lki9XYI6HcpNezv7qfIMkvwmUehrFhqK6fKWcm85HkEEwqwC9Vs0UZp83pMapv45LDKX8eRrFqWm7N4Qu7/QD5NsiIt7PvdLvkU6b/Ea/m1bMmZz/b8OvYUNfJe9ZPsntsg7V2NWki3QBfDU2YtlimT+Maj32SxN5+T31vMufwi3rGn8bbMNyf7+WDXHlTDfRdZFazkt4Ey2oJz2VxQw/5KQWlFHS15ZSxLDXK0oYKuZwX2wVzaios5UF3Dn+rreD8nwP40Dwe8PjYm2Di2fYeyy92op1pRC/VMUU4c6jR82iCPJ8zmZU89ezPr2ZVdxMGCQo7mf5ut/kaedlaQE5eDS46NeaoLXZSNCSo1m15/Q3ZZzqFeKBY31R4inlG+EMxSqyRNEj6dG/dULfETJ6IX2SdPJWWaRe45pZ5WKYlZZME4LYnIR/VsVY7Np59eEGJFPBTqrVu3QTZFWk9b21rWrHmFlpYWWltbx9Uybte3ruVVUZtorczXhu/fp9WrX+LMmTP/h26j/CnUO378OEePHuPY8RMc++C4UO8fIYcb0uZvfkEP/CKFGqzykDJQOnGoY/+7I4+IuEu9B8xQ6bR9ff10d/eEuDEkfS0c7CuBPpylAqswBcPXv1KGykMdHef5m+xSe3t7CFg8IOTDurvLSv36BPSXLl0KFfhrfdsowP48vcIA/zzQ/5cUf6Vk/wKOt/uimpdzMQAAAABJRU5ErkJggg==')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/20f985e4f70989d210a08c2beb1e4a20/c7c3c/cardsartworktop.png\",\n \"srcSet\": [\"/static/20f985e4f70989d210a08c2beb1e4a20/a2ead/cardsartworktop.png 259w\", \"/static/20f985e4f70989d210a08c2beb1e4a20/c7c3c/cardsartworktop.png 473w\"],\n \"sizes\": \"(max-width: 473px) 100vw, 473px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n \\n \\n Heading\\n Paragraph\\n
\\n \\n Button\\n \\n
\\n \\n\\n\\n \\n \\n \\n Heading\\n Paragraph\\n \\n Button\\n \\n \\n\\n\")), mdx(\"h2\", null, \"Artwork Middle Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"472px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/74c3ba80d7fe67900d4914dc55700a93/3c5de/cardsartworkmiddle.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"118.14671814671816%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAYCAYAAAD6S912AAAACXBIWXMAABJ0AAASdAHeZh94AAAEPklEQVQ4y62Va0xURxiGz5/+aGya9IfS2LQpjaJN/YFVCaaxQYXGUC1YpGpUQFEqIFWQi4brchEEbBGtl5aolWoVQa4Jq2JAs7UqtBC5K6zUhQJyrcsuu+fs8vScTVekpgnWTvJmvjMzeeebOTPPCFarFYvFgiRJU6S0vagUL0EJ/q1MTExMW/bEBOVjdHSEhw+7uP+gg7b2djo6OhkeHnlqOp2ijHtqqNfrefToER2dD9F1d9Op1cp1z7SznGKopGo0GhkcHGJoaJjBgQH0BqNtkNI3XVksfy/ZnrLFIiGazZhNZv57mUD4raGZXZFJBATHsS4klPC4OGKTMklIOUhSWhaqA1kkp0/WyXKttCfbdBBVShpr/QLYFB7LnfomBHVVHXPnf8SiOfNx8ZhFSOL7hEbtYFdMOnvj09izP4nd+xKJTlBiFeGyomJT8P5ShaOXCge37cxc4MYHq4JR39AgFF+7i+uKIBKi9hMYupiMk/M5VezKiVN5XLx8k8rqWkqqfqFQXcOlyhuUV90i95KGLzKusDpFzds7L7MuqZyM0z/R0NKIcLu9CcfPokj+3pOc8zNJ+2EGmUUzcPJbyYcBYWyNTyU3vwhNczdlmkbyCq7gn12Fa3oTn2TW45x8j7D8e/zc1sLjP/UIRrOVDapjLNmxkIrG2VQ2vIb/8QUIYUG8mpXILP9NOK9wZ/O2IPwD/Tha0oCq9A+cc/S8Hv+EeRn9nL+tpWvoMWOihKA3gbpOy/roHLbuCWOLiyNRMS5siQln6belOHp64bc9kM2bNrJsuQdna0XO3DHxTc0YPqceE5RdhnZwlB6jhEExHDWIPBiEuo5hVnuuxcHhTRzWuPNuZDDOXx9j9hovlrmvxH97CBt2p3O45gmJpT1EXtKRXdJFdk4+9dp+BiQrBkk+h7Ix2hEL5Rfz+Pg9R4LXebAnw4v18Qk4pubwhocLOyL22SYNPnKdiAIdX53rIKbwd1p+7aMor4D7o3r08ik0yFARRsbGOXrkMElBG5jntJhXtkUyN1PFwsQ45mwMxMPDjUPHz9HeLxFx7Cqp6j4OXNNx4mYv/c0D5Oeeo6SsmL4xA+NW+WAXXLzAEpelbPb1Zd7KAD4vvItP+l4+jfbhHddFCIJAxa02WnpFDpy9zo+aXtIvyKalA9Td7aX40BlWOb1FbXMLCreE6upq3NyW4+29FvfUXAIqqgn5Lpus3BSSEzLx9Q2UN11ELZ9DVeZJispNpKmM7Azpp6B6GM1VDaHrfahrvY9VMbTTQrngSiRJImY5GDOJiNLkvTabxpFEEYuojJXHiVab7HCzyPtntdPGLEOhs1NmYWsrWhldZpPpOcg+CwCYmNL/HL5EeWadTiebdtIt89BsFp8zm+QfU/Rsn83Q/hb8M6MXYaEd/0+J/X9KUF44hdgvK4PBYHstbUtWfsrLyiT/SMXrL8T7TFPP46HDAAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/74c3ba80d7fe67900d4914dc55700a93/3c5de/cardsartworkmiddle.png\",\n \"srcSet\": [\"/static/74c3ba80d7fe67900d4914dc55700a93/a2ead/cardsartworkmiddle.png 259w\", \"/static/74c3ba80d7fe67900d4914dc55700a93/3c5de/cardsartworkmiddle.png 472w\"],\n \"sizes\": \"(max-width: 472px) 100vw, 472px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n Heading\\n Paragraph\\n \\n \\n \\n \\n \\n \\n Button\\n \\n \\n\\n\\n \\n Heading\\n Paragraph\\n \\n \\n \\n \\n \\n \\n Button\\n \\n \\n\\n\")), mdx(\"i\", null), mdx(\"h2\", null, \"Widget Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"488px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/d8d117378835160ee4230de38d764177/bd48c/cardwidget.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"45.173745173745175%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAABJ0AAASdAHeZh94AAAA20lEQVQoz6WRDQ6CMAyFuf+JjB5AjcQ7GMN0yN+EgWyw57o444iiiUseLYV9e2sjYwyGYfhb4ziCWBG9UDK77HfzRZ4TEVlrjUuaIi8KVFWFPM9tFMiyDJynUEo/uJ8Pfjr0wLquIa5XBxRCQErpoJTT6R74TrSeDunRtS3iOMZ6s8Uu3ru4WK5c/gqaunytBw6NFWMM7HRGYa/NOUeSMOc2bOUPDgmolEJ3612vZNuhaSQOxwSNvXZpoUVZQWk9O7dgyiTqoxdt7vs+qPkNFKcKpvz5p/FtfU607ql8wUjGF9B5AAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/d8d117378835160ee4230de38d764177/bd48c/cardwidget.png\",\n \"srcSet\": [\"/static/d8d117378835160ee4230de38d764177/a2ead/cardwidget.png 259w\", \"/static/d8d117378835160ee4230de38d764177/bd48c/cardwidget.png 488w\"],\n \"sizes\": \"(max-width: 488px) 100vw, 488px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n Total Downloads\\n 1,057,891\\n Oct 1 - Dec 31,\\n Worldwide\\n \\n\\n\")), mdx(\"i\", null), mdx(\"h2\", null, \"Profile Display Card\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"503px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/976e82a0a3eb3d779b6e11c2e534dba2/a4078/cardprofiledisplay.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"125.86872586872589%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAZCAYAAAAxFw7TAAAACXBIWXMAABJ0AAASdAHeZh94AAAElElEQVQ4y4WUe1DUVRTHd7TRxiYVcXnssjwFdQN0X/ISURcEhVCK1EotER+hE0SIgMRI46StOWnRZI0x45g1/lNTTT7QEXMcc8ZxnEaeViZovJZd0AU02OXT/a2yiwh6Z76/cx/nfn7n97vnXBmi3b1nw9zRSbfFiqXTQoe5k67Oh/1OIauzb3VZs3NeWLPF2bcI22PrkVDIpEdZXil+kwKJCzSQ4K8nXKFBo5pHlL+BCD8d0QExLA1ZiE7YCFUUgUoDM1QxKBV6goNiUE1VU1JQ7gYWbClkssyL8OmRJMh1LJBrSfCex3JlPEafaFL84skOSiRNEcd8MQ721ODloUXuMQdfLw2e4wIpffcDNzA3pxjP8QFEK6NJVMSQ4RdLfrCRgrBllM9+mbzQFHap0ymZnc7q4CRS/BNIVCUQ7BNDsHI+sybNpiS31A3MyylhiniLXkSwVDjGC5sVZKQoLJW9AlIZmckxzUq+0q5i58wUtoYksWNWKjrVYuJV8SgnhPFebpkb+P7WMhHhTCIVizAoE9GrktD7p5AamkFySBqFEelsVKexLfI1DkWv4Yj2VT5Vp5Lma+AVxVwiJgRRPjzCQ0UmMhWxbIhIY7PYnK/NJN+wErVPOF6TvfCf+AIKIY8X5cz1iaRy4RpOxC5np284xQEGMieHUbF92KFc2FvBUUMqv6S8SdWyN/jj9SwurlpDcmgoUVOmUblIz6EEDbGecpaFhlC1bj0t61ZzU6/jcuwCfpuj5cKu3W7gR/llRE0NIX1GFJmh89kUmUS5Lp1v4lZyIr+Yn0zFnP5yH5c+LOZYQjr7YtLJU8exPiCCtwPUJD4vx5RX5AZu2VLAOJkc1fSXCJgWzixvPQZPHd9/cpirZ49zfPta9m9ay7mz31K5ez8aDz0zvLQoha/v9HBkMm9ythW7gevfekdMyhgvm+i0kvxVKurqarh2/HNOluXw9ea1XPj1Z/785xY+3t4uv3Gy55w2O2ubG3jw4GcYjUZWZKxwasmSJRTvKKS9rYWO65e4bCrih6Jculubud9no7BwO8nJyU7fDCGjcTEVFRUPgQ6Hg7FaX18Ptq5O6g9/zOk9pbSJF9xpbh7Tf3BwEJn0sNvtzoEEH5LUWls7OP97M98dOUfpxhJMFdXU1Dc51+zDfCUNMR4DPin4t62Xi1fN/HiygbobVlckI/UYcCgiqT98w9M+bWR/TKDLWdja2jrqGxq5KU62vqGB6zW1/PX3zVHBT41QWpRksYiLVKinpwertYv29g4sVqtzbbQ9YwLNZjNN4jQlQPPt29y5c1vczGZxyq20tbZwq6mJ7u7uZwOlNloa2R2D2Hr76b7Xj2OMfzkqcMiePHWKAwcO8IVIVpPJRHX1ebG7mf57VxjoucaA7Qr2B7fGjlAaDE1KLWtDNgpfX1d5ZW/cBL3HaL+eRdeNPDpqsrG1HH0EdDw7bWprazl75oyIrJqqqioaGxtxDNjotbVyv7edPmH/e3D3sd8iMUZN7LFKcWRaDj6COByDT1aKY0QZDQwM0N/f75I0djjsrnRyps2j1BlZrv8DO6f41qfTAwcAAAAASUVORK5CYII=')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/976e82a0a3eb3d779b6e11c2e534dba2/a4078/cardprofiledisplay.png\",\n \"srcSet\": [\"/static/976e82a0a3eb3d779b6e11c2e534dba2/a2ead/cardprofiledisplay.png 259w\", \"/static/976e82a0a3eb3d779b6e11c2e534dba2/a4078/cardprofiledisplay.png 503w\"],\n \"sizes\": \"(max-width: 503px) 100vw, 503px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n \\n
\\n \\n \\n
\\n \\n Sam Russo\\n Senior Software Developer\\n Detroit, USA\\n
\\n \\n Connect\\n \\n Send Message \\n
\\n \\n\\n\")), mdx(\"i\", null), mdx(\"h2\", null, \"Profile List Card\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"517px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/6820624b98447c05846a8f27e3f80696/fa2f5/cardprofilelist.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"93.05019305019306%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAACXBIWXMAABJ0AAASdAHeZh94AAAClUlEQVQ4y4VUPW/TQBjOwswfYOF3sDPAxMTOxkBZ+BpYaKUyICGBxEcZ+AgVSM1SVQgooKYItRINClVSEqUhtEmcxLGT2E7s2E58frizfYndJMpJr+7OPj3v87z33BtzXReO44DNLAghozXfs//zgp1jI8YBbdv2YjAYwLSs8X44jCSYFZzUCFCSJYiiCEVRUGuIkCQJDbrvKKp3cNogTIFL/DlQ5gEOKYt5g8snxA2CRP4PKSlPMv9RFwTsp9MwTROqrKLVaqPVbqNWq0Gg4ThkBMwZNw0V+U4Vcl9jdH2GnN3jpUWcP3sGuewBfot/UCofQWpKHmiTzg4ZAzquv76afIrYo4u4s/PKZ0mcMcNaIYe9xCrsfh9F/Rg904Bt2ROyw/NBu4wPR3sodAT60a9pjNcmMmg5LNOauGEfbXwh0RoOeQ39Ym6svsDbpQUI1QpUmrFaKUOoixO+dIObZeNheh3nEjexkv3k8+CSWa4va2/w/v4tVCgQ9K8wuhK6uuHVr9fTIxfCAZ9lPuLCxj28zn0LAMl0ye6Umrn+IuLBGZID21CpO9tJWjdCrSJQuXVq9AaKxb/oUaZhhjxRSjxEPL+FfelfkIQydALk3c/rWL52BW1VR75wCJFK1TSNvhgZuh6VzG2z8H0Fp55cwt3deNQ2LKGuyJArJe/96pSRRS1j0TfN6sfmaQwVS0e1J0OzDLjc2PwAs4jW9ZlohkHX3dHrCNdz1nrUHJzgDaaSm3hw+zqUbh/NTBbV4woMavKTzMKSb/x4idPPL2Px57uQ5ACwlP2FrUTcswrJ5qBKLXRUddL0IVab5TSWU2vYFjLjS5nWbcIQfoeZDOdktwkwYuEGyTsv4fOcYC3Lpi4ZBvVj4z90jav4qzjywAAAAABJRU5ErkJggg==')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/6820624b98447c05846a8f27e3f80696/fa2f5/cardprofilelist.png\",\n \"srcSet\": [\"/static/6820624b98447c05846a8f27e3f80696/a2ead/cardprofilelist.png 259w\", \"/static/6820624b98447c05846a8f27e3f80696/fa2f5/cardprofilelist.png 517w\"],\n \"sizes\": \"(max-width: 517px) 100vw, 517px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n Team Members\\n \\n \\n \\n \\n\\n
\\n Warren Briggs\\n

\\n \\n Online\\n

\\n
\\n\\n
\\n Add\\n
\\n \\n \\n \\n \\n\\n
\\n Lu Chen\\n

\\n \\n In a meeting\\n

\\n
\\n\\n
\\n Add\\n
\\n \\n \\n \\n \\n\\n
\\n Lilah Loselev\\n

\\n \\n \\n Not Available\\n

\\n
\\n\\n
\\n Add\\n
\\n \\n \\n \\n \\n\\n
\\n Danny\\n

\\n \\n \\n Offline\\n

\\n
\\n\\n
\\n Add\\n
\\n \\n \\n\\n\")), mdx(\"i\", null), mdx(\"h2\", null, \"Artwork Full Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"512px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/d3f0b8329a6948c46871f16f42c99aad/01e7c/cardartworkfull.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"107.72200772200773%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAWCAYAAADAQbwGAAAACXBIWXMAABJ0AAASdAHeZh94AAAEmElEQVQ4y7WUa0xbdRjGO2HrNno97WlpaUsBlXsLlNILlxHGpVzkMlSQyShXNzPdxiZkH4zOqEg2HcbBgpkao34wMSbGJXKbOLx+8RpMHIMxNxO/zQ8yXRR4fM4prPO7Nnnz/v+n5/zO877nff6KGzd+w6VLi1hcvMpYZlzBZcbC5WWGtF6OBNeLS1e55n1LP2Np+ToWr1zHwtI1XPvlV6yvr0P6KcZG34BiixlqXRridCmI0zqg0qdAK6bBkJANoyMXYkIORHsOzIkFMDHikwOwpu6CNb0CxrvLUdPyGFZXVyPAkZfPQbS4UVjWjIJgDYIltcj2lMFgSYfKmAqNORNaUwYE3mO050Ow5cPoDECwE+4MQmMLoHLP/ijwzNib0IlZ8BXXI98XImw3PIE6xNvzoI/PgkB1BlseHw5QnQ9iEnNKkPtCWJKLoLEWoPrBg1HgK2NvQbR54fHfhxyvFLVU54bOkgujzUMYFdkKIDqLICYGGX6CgyzfD0sKgRYvQs2PYnVtbaOH429DqU1nWbmIM2RTFUuzRlQJCQy7FwKVCXYf+xmQyzYlBviCAIEs2eJBaM+BqMLRV9/BdkMGqhrCqL+/D6nucqhM2TBs9EtwFBDo5d5LWAGhfogEmxhmlq+Oz0OoqS8KHD79GvqPv8DlKi/+hW+/n+ebA7Iiqeki1RgIlWCyMoLlfhJm4dfWxecj1NAbBQ69NI7q5l6CfsQ3381j/PV3oTS4sFWXAaWQxXBBqc+M7PUubNNlMmfzeibU5hxsUaWhpKItCnz/wyn4K1rR0nkEe3uPobKpB+UNXSyjB5WN3exPH6rqu1BZH2ZbuhldcoQae1Db/Ah214ZxaPA5rG1+FPyHP8ktioWFJZw/P4mZmTlMT1/E1PTHmJyaxcTkrJynZi4yf7KxnsOkdM+FTzEz+wWmZr/ExIXP8dlXX+PvzZJPnHgRCoUKW3ck4S6lFTHbzXJWqp3YKdyDOJGOMaRCzawxu9g3F3RWDr3DBz1nU+Moga+iHSsrNzeAz5yGxZGPuqZOFJc1obS8ia6phdGSIVtOJ7nFQk/LbuHXlvycXMjsp6cLITiLURQKY+XmHxHgs0NnoBLS4fJUIt1VitTsEri91RxuNwSri8MdcYwpqVB2iZhE2yXTKbSeBNTb/Sip67kD+PwoT5V8BHY9wMOhkbAaaOhtgWUZEjyRgbZJygh0RqxnpvVMG9bT23xU2BkFDp08C8UOHlucvW3aNKiNWTBS1W3rOWg9p4/DTetRjZF7UXILhzueSnV8WfG/Sh4+Cx0f7Og9is6+QeT466AyR6yn56EhW489lpVuQCPWo1JCtVYviiofjgKPPz2CkyPnbs/SD/M/EeSRLRexXpDl8tii9aRrIhWa2EdzcsR6hgQqrLgDOPjUKZTWtOOj6TnGRQw8eQqKuHsRyxMoVpuBWF0WYtXpiNGkcZ+FGK5jNbQi/99pdMnWc/vr8fvm2Lz3wQSqmruxb/8AOg4MoGnvQbR29aOt6yhaace27mNo7TjMeBwPhY+gNXxYzm2d/WjvfgIt+w5RxDD+vHXr/7HeP7yB0+PlFKFhAAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/d3f0b8329a6948c46871f16f42c99aad/01e7c/cardartworkfull.png\",\n \"srcSet\": [\"/static/d3f0b8329a6948c46871f16f42c99aad/a2ead/cardartworkfull.png 259w\", \"/static/d3f0b8329a6948c46871f16f42c99aad/01e7c/cardartworkfull.png 512w\"],\n \"sizes\": \"(max-width: 512px) 100vw, 512px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n Heading\\n Paragraph\\n \\n \\n \\n Button\\n \\n \\n\\n\\n \\n Heading\\n Paragraph\\n \\n \\n \\n Button\\n \\n \\n\\n\")), mdx(\"i\", null), mdx(\"h2\", null, \"Profile Cards\"), mdx(\"p\", null, mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"956px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/47eefc55922aa7af5ebd9ae1deb928d7/7b1dc/cardprofile1.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"64.47876447876449%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAANCAYAAACpUE5eAAAACXBIWXMAABJ0AAASdAHeZh94AAADgUlEQVQ4y02Ta0zbZRTG/99JHN8cmYmCCoGRgSRStrFOC7TlVgYUxmWlwABRLOsME524zekuuDnYQBrSFhgOWjfIGMiSEaYOkEvIFhMZFAGhMOYuaKCUgYTw89+aEE/y5D05ed7zPOe8eQX79CS3WpvpvdNOy1Uz5poqGgzVtFi+o+vnu/T9Ns7EzBzzs9O0tTSJvI4tXr2hilaryPvpLv0PJ7BNTiO03LCSEvcumtgIQv198fPyYsc2T17zehl5lJQMbSbmhnpud95CHbufQzGy/3jbvfB6aRs+O7YTFSlFm5dNdc23CCazibCQQHKSVXSaLnM25xBpu3ez09ub4KBAVKKQ0XCFZqsFSXAAuckJ/GCs3OIF+vgQtGsnyYlKKi6eQ6hvMOP3xquc1r+PPkVFgehKERRAangYEeESpLJwLN9bsIp43fsVvjhSiD5VRX5kOPJd/qj3SojYG4pM/g5GsxHBLDqM2B+Kteosx9LVlGUmoQ4JoEC2B7kkGInkLVo6O7BYmomQhnK9+hzHtRmczEoh9e0gdOIKFGEh7NsnocHajHDtWiPlp0v55fZ1ynI0lL+XxaksNUdS4tGX6NGVFGJqNNDe1saJT3V032zkwwNxlB1UUaqSkRO5h2xxfx8cPUxlzQWEvq4ORu/388/6Onb7LIt/LfD3s6c8mp3F+eIF07NTWG42MdzTTZUuGeNH6aQpoykXRT+JDkca6Ee2LoPMIjUVNV8jPOjuYOLBEK5YWXGytLSEY3nZDTbh6bMn1FnN/D7UQ0WRhnbDRS59eZLC9DRSY6LRJqooLikiQavizKVTCOMjIzyy290N10WXTlczh4PV1VV3zT43T/kVgztfdDhZWV3DsbTI3Pw8zxcWWBOncEVe8XFyiz9G6L93j6nxcf4fa2trW/mfT55TXHpmq+4ScglvbGywubm5xTuo1SFPzEX4dfg+ptpalNHRKJQKkpLEV05Ro4qPR6mU81nZ53x1vsJ9acxmY0ScyCaednGqmZkZxkUzy44lNId1JKizEIYHhrj8TSVajZbM9EwK8vJFFBATdwC5MhZNdj5Hj53A6VzG398fT09PfH19RfiJeBMPDw+ioiJRqbXIFEkIf0xO0dV5h4Hefnp+7GGwd4DBvkHqG29QW2fh/IUq8Ze0uh263IyOjjI2NuaGze34IY8fz9NkaaXuajP/Avp6vTm2zr80AAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/47eefc55922aa7af5ebd9ae1deb928d7/7b1dc/cardprofile1.png\",\n \"srcSet\": [\"/static/47eefc55922aa7af5ebd9ae1deb928d7/a2ead/cardprofile1.png 259w\", \"/static/47eefc55922aa7af5ebd9ae1deb928d7/6b9fd/cardprofile1.png 518w\", \"/static/47eefc55922aa7af5ebd9ae1deb928d7/7b1dc/cardprofile1.png 956w\"],\n \"sizes\": \"(max-width: 956px) 100vw, 956px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \"), \"\\n\", mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"1035px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/34bd3aff53805f78a8facc7c5e0a7ec6/bd9eb/cardprofile2.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"42.857142857142854%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAABJ0AAASdAHeZh94AAACZ0lEQVQoz22Q/y/UcRzHP/9FX37Lb6ZpCXHKSUQ0H7dwjSlfdr6k8uU4+Tbu0CrGzRzOHQ5RKRKxE9MvydZV6pdbW6k2d76t+UWb6vDo47PxU6/tvef7+X683+/Xcy+hrbGWKm0B1zPTqdAV0dFrY/79AjP2MUz3DVQU3CJPYlVlJXT29/F24RP2FyO03tNTln9DYhlUV5bSNTjI/LsPCBfPBFCemUrsCV+8Dh8iKMgPU6uRynIdsWcDKU9PIcrHh2MSCwnxp9NsQqfNRzynkFmEtzdeR48QHh5Ce1sLQtrlWOo0qVxTBiMG+hHk70uXrZsibSGapDhqJXY1TEF8kD+K0yd5MDhAdo6GnCsiVamJJCtOEXPKl2CJ9fT3Ilib9NzJzUSniiYrNoLExDgstk6amhuwSKxGSnFbjEATE06C1MA20IO5vZUhixFjSQH6NDWl0p3snAyGx0cQfq66+bG4yLfPTr5//YJrxYV9doLhjgaMeUlkiZfIVQZw3v84CZp4zLYW9mtra4tfm5t4trdl7/F4ENjdlc2fvx5ZdyU/MTPFx9evcMxMMj0xTldHB8+fPKb6bj31zY3yQ5fLxdLSEotSmD1dWV6WGvxGWF9fZ2+53W5ZV1ZX6ep/yv9qevYNN3V1TNntKJVKVCoVarWaeFEkMjISh8OBkJKcQlhYGKIYT2iokgtR0ZitfczNzVGs1aLX6zEYDOhrqiksLicrr1j+fG1t7SDI3n5jY0M+F0aHRxkbGePl5BTtZhv6+kYeDT3D6XRiNBqxWCxYrVbaTCY6rTa6ex8ezGtbmt2+7uzsyOP6B+wJ9QIKmKrUAAAAAElFTkSuQmCC')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/34bd3aff53805f78a8facc7c5e0a7ec6/e3189/cardprofile2.png\",\n \"srcSet\": [\"/static/34bd3aff53805f78a8facc7c5e0a7ec6/a2ead/cardprofile2.png 259w\", \"/static/34bd3aff53805f78a8facc7c5e0a7ec6/6b9fd/cardprofile2.png 518w\", \"/static/34bd3aff53805f78a8facc7c5e0a7ec6/e3189/cardprofile2.png 1035w\", \"/static/34bd3aff53805f78a8facc7c5e0a7ec6/bd9eb/cardprofile2.png 1442w\"],\n \"sizes\": \"(max-width: 1035px) 100vw, 1035px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \"), \"\\n\", mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"1035px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/4b4facb8492f84b3b523b49764985ba1/0f586/cardprofile3.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"44.78764478764479%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAABJ0AAASdAHeZh94AAAB5UlEQVQoz12Sz28SQRTH958x/Te4aTzhhZscOGDCpX8AxhgvHkxMTYnULJAmprUXRFtvWEmMbQxR08bdKqxsulR+CAK7s7/YXeDrvGloqC+ZfW/mvf3MvO+MFAQhTMsGc32YzBHx2GRgtosfrQucqBpUzcAZj7+pv3D6U8d8scCCj1Wbz+diTdLOf+PFq7eQt3dwcHiESvUTci8r+Fg/RWmvgkePn+DZVgnF3dfY3N5DgfsoigQkn88jlUqh1WqJ+Ww2g2S023h38Abr95K4ees2nm5sYH+/AuNcx8MH93FjbQ27zzfR//IZ6vev0BvKFTCXyyEWi10HRlEoJsfHR4jH7+DD4furNjRNgyzLMIw2er0/CMNLELVGUNu2MRwO4XqeWBMt04c08Xyf62bDcV0+h1hbGu3seT4i7pdakWeMceBfOI5zHUjmc2C318N4PIY/nYrklHvG+IUxC5ZlYTKZIAgCUdvpdNDv98UJR6MRTNO8BE55slwuo1arCQABqYisWCwhnU6j2+2KHHkC1ut1Lk8cd5NJkU8kEshkMqJGIh2y2SzkQkFAaLfBYMD1CqEoCqrVqjgJnY6ALpeEYtK30WhAUVU0m03oui42k1bf0lKbxX/vzOOiU5s06DJWc1S/+v8/nW+D+XIgiFoAAAAASUVORK5CYII=')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/4b4facb8492f84b3b523b49764985ba1/e3189/cardprofile3.png\",\n \"srcSet\": [\"/static/4b4facb8492f84b3b523b49764985ba1/a2ead/cardprofile3.png 259w\", \"/static/4b4facb8492f84b3b523b49764985ba1/6b9fd/cardprofile3.png 518w\", \"/static/4b4facb8492f84b3b523b49764985ba1/e3189/cardprofile3.png 1035w\", \"/static/4b4facb8492f84b3b523b49764985ba1/0f586/cardprofile3.png 1498w\"],\n \"sizes\": \"(max-width: 1035px) 100vw, 1035px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \"), \"\\n\", mdx(\"span\", _extends({\n parentName: \"p\"\n }, {\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"1035px\"\n }\n }), \"\\n \", mdx(\"a\", _extends({\n parentName: \"span\"\n }, {\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/074bb94d3767650ce2e9bb3ab699fd7a/a4f81/cardprofile4.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": \"noopener\"\n }), \"\\n \", mdx(\"span\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"45.94594594594595%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAABJ0AAASdAHeZh94AAAB5ElEQVQoz3WRTW9SURCG+UHqnhVbfgQLElm5YQEbCKEbQkslJi5KkPBhauuiCTbExKARFRNiiNQKLbEq2qSFQCOFe+FeKOXj8Z6Dl7DxTeZ8zcx7Zt6x9JQBP86bnDevuGj/4fdlm2+/LrjuDxC+a0UzbEi3r3LV7aEMNEwUi0XK5TKLxULexW45Oj1jeydFZPshTw9ypA9e8ij5nNLnr+wevuHxzhOyr96Rff2RnWeH5ItlmazpOjabDbvdznA4lG/z+RxLq3lJ7egTD+47uHP3Hnu7Gc5Ov9D4+Z0PxfdsBr1YrVaCGxsU3uY5Pq6skkulkqxSnEV1ssL5bCYDaicnbG5t0Wo15X32773dbuNyuXiRzS6JZlPmRuJ4PEYdDFDVAZqmr0gtYplMJiiqytBw9PsKt7dTGSBwczNB10dGW5rxiUhipZmIMeNWGrIGsyrTKT7SDa263S6KojAajaQvn8/j9XqJRCJEo1H8fj+5XE76LKKlYDBIIBAgFArh8/kIh8NGK+qyLWMXxKYJCO3i8TipVIp0Ok0sFqNQKCwJO50OmUyGZDIpLZFIsL+/R6/Xk8ROpxOPx4Pb7cbhcFCpVPgflkNZ02Ad0+mURqNBrVajXq9Lq1arsnVTHnMQ4mzq+hfEKncqefS3UwAAAABJRU5ErkJggg==')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n })), \"\\n \", mdx(\"img\", _extends({\n parentName: \"a\"\n }, {\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"image info\",\n \"title\": \"image info\",\n \"src\": \"/static/074bb94d3767650ce2e9bb3ab699fd7a/e3189/cardprofile4.png\",\n \"srcSet\": [\"/static/074bb94d3767650ce2e9bb3ab699fd7a/a2ead/cardprofile4.png 259w\", \"/static/074bb94d3767650ce2e9bb3ab699fd7a/6b9fd/cardprofile4.png 518w\", \"/static/074bb94d3767650ce2e9bb3ab699fd7a/e3189/cardprofile4.png 1035w\", \"/static/074bb94d3767650ce2e9bb3ab699fd7a/a4f81/cardprofile4.png 1508w\"],\n \"sizes\": \"(max-width: 1035px) 100vw, 1035px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n })), \"\\n \"), \"\\n \")), mdx(\"h6\", null, \"html\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-html\"\n }), \"\\n \\n Chukwudi Mezue\\n Product\\n Designer\\n \\n Enugu, Nigeria\\n \\n \\n \\n \\n \\n \\n Add User\\n \\n \\n\\n\\n \\n Chukwudi Mezue\\n Product\\n Designer\\n Enugu, Nigeria\\n \\n Send Message\\n \\n \\n\\n\\n
\\n\\n \\n Mac\\n Xenon\\n Product\\n Designer\\n Enugu,\\n Nigeria\\n \\n \\n \\n \\n \\n \\n Add User\\n \\n \\n\\n\\n \\n Mac\\n Xenon\\n Product\\n Designer\\n Enugu,\\n Nigeria\\n \\n Send Message\\n \\n \\n\\n\\n \\n Mac\\n Xenon\\n Product\\n Designer\\n Enugu,\\n Nigeria\\n \\n Send Message\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n\\n
\\n
\\n\\n \\n
\\n \\n
\\n \\n Chukwudi Mezue\\n Product Designer\\n Enugu, Nigeria\\n \\n Creating High Quality Resources and tools to Aid developers during the developement of\\n their projects\\n \\n
\\n Add User\\n Send Message \\n
\\n \\n\\n\\n \\n \\n \\n
\\n Chukwudi Mezue\\n Product Designer\\n
\\n \\n \\n \\n Creating High Quality Resources and tools to Aid developers during the developement of\\n their projects\\n \\n
\\n Add User\\n Send Message \\n
\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n\\n\\n
\\n \\n
\\n \\n Chukwudi Mezue\\n Product Designer\\n Enugu, Nigeria\\n \\n Creating High Quality Resources and tools to Aid developers during the developement of\\n their projects\\n \\n
\\n Send Message\\n Send Message \\n
\\n \\n\\n
\\n
\\n\\n \\n
\\n \\n
\\n \\n Chukwudi Mezue\\n Product Designer\\n Enugu, Nigeria\\n
\\n \\n
\\n \\n
\\n
\\n \\n
\\n
\\n \\n
\\n \\n
\\n
\\n Add User\\n Send Message \\n
\\n \\n\\n\\n \\n
\\n \\n
\\n \\n Chukwudi Mezue\\n Product Designer\\n Enugu, Nigeria\\n \\n Creating High Quality Resources and tools to Aid developers during the developement of\\n their projects\\n \\n
\\n Send Message\\n
\\n \\n\\n\\n
\\n \\n
\\n \\n Chukwudi Mezue\\n Product Designer\\n Enugu, Nigeria\\n \\n Creating High Quality Resources and tools to Aid developers during the developement of\\n their projects\\n \\n
\\n Send Message\\n Send Message \\n
\\n \\n\\n\")), mdx(\"h1\", null, \"API\"), mdx(\"p\", null, \"Here in this section you will find information about required modules and available inputs, outputs, methods and events of this component.\"), mdx(\"h2\", null, \"Contrast Card Bootstrap Modules used\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n parentName: \"pre\"\n }, {\n \"className\": \"language-typescript\"\n }), \"import {CardModule } from 'cdbangular';\\n\")), mdx(\"p\", null, \"API Reference: Contrast Card Inputs\"), mdx(\"p\", null, \"The table below shows the possible input of the Card component.\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"Name\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Type\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Default\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Description\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Example\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"class\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Adds custom classes\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"class=\\\"myClass\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"color\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Sets background color\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"color=\\\"dark\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"border\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Gives border\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"border=true\")))), mdx(\"p\", null, \"API Reference: Contrast Card Body Properties\"), mdx(\"p\", null, \"The table below shows the configuration options of the CDBCardBody component.\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"Name\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Type\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Default\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Description\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Example\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"class\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Adds custom classes\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"class=\\\"myClass\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"cascade\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Switches the CardBody to cascade style mode\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"cascade=true\")))), mdx(\"p\", null, \"API Reference: Contrast Card Image Properties\"), mdx(\"p\", null, \"The table below shows the configuration options of the CDBCardImage component.\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"Name\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Type\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Default\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Description\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Example\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"class\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Adds custom classes\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"class=\\\"myClass\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"cascade\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Switches the CardBody to cascade style mode\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"cascade=true\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"hover\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Switches on hover behaviour\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"hover=true\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"overlay\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"white-light\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Sets the color of hover overlay\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"overlay=\\\"white-light\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"src\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Source of the image\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"src=\\\"image_src\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"top\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Makes image fluid\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"top=true\")))), mdx(\"p\", null, \"API Reference: Contrast Card Text Properties\"), mdx(\"p\", null, \"The table below shows the configuration options of the CDBCardText component.\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"Name\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Type\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Default\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Description\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Example\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"class\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Adds custom classes\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"class=\\\"myClass\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"muted\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Mutes the text color\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"muted=true\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"small\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Uses html \", mdx(\"inlineCode\", {\n parentName: \"td\"\n }, \"small\"), \" as component's tag\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"small=true\")))), mdx(\"p\", null, \"API Reference: Contrast Card Title Properties\"), mdx(\"p\", null, \"The table below shows the configuration options of the CDBCardTitle component.\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"Name\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Type\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Default\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Description\"), mdx(\"th\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"Example\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"class\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"String\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n })), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Adds custom classes\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"class=\\\"myClass\\\"\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"left\"\n }), \"sub\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Boolean\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"false\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"center\"\n }), \"Styles title as subtitle\"), mdx(\"td\", _extends({\n parentName: \"tr\"\n }, {\n \"align\": \"right\"\n }), \"sub=true\")))));\n}\n;\nMDXContent.isMDXComponent = true;","tableOfContents":{"items":[{"url":"#card","title":"Card","items":[{"url":"#basic-examples","title":"Basic Examples","items":[{"items":[{"items":[{"items":[{"url":"#html","title":"html"}]}]}]}]},{"url":"#simple-cards","title":"Simple Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-1","title":"html"}]}]}]}]},{"url":"#bordered-cards","title":"Bordered Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-2","title":"html"}]}]}]}]},{"url":"#artwork-top-cards","title":"Artwork Top Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-3","title":"html"}]}]}]}]},{"url":"#artwork-middle-cards","title":"Artwork Middle Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-4","title":"html"}]}]}]}]},{"url":"#widget-cards","title":"Widget Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-5","title":"html"}]}]}]}]},{"url":"#profile-display-card","title":"Profile Display Card","items":[{"items":[{"items":[{"items":[{"url":"#html-6","title":"html"}]}]}]}]},{"url":"#profile-list-card","title":"Profile List Card","items":[{"items":[{"items":[{"items":[{"url":"#html-7","title":"html"}]}]}]}]},{"url":"#artwork-full-cards","title":"Artwork Full Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-8","title":"html"}]}]}]}]},{"url":"#profile-cards","title":"Profile Cards","items":[{"items":[{"items":[{"items":[{"url":"#html-9","title":"html"}]}]}]}]}]},{"url":"#api","title":"API","items":[{"url":"#contrast-card-bootstrap-modules-used","title":"Contrast Card Bootstrap Modules used"}]}]},"parent":{"__typename":"File","relativePath":"contrast/angular/components/card.md"},"frontmatter":{"metaTitle":"Card Component for Contrast Bootstrap Angular","metaDescription":"Angular Bootstrap card is a flexible and extensible content container"}},"allMdx":{"edges":[{"node":{"fields":{"slug":"/contrast/angular/Installation","title":"Installation"}}},{"node":{"fields":{"slug":"/contrast/angular/navigation","title":"Navigation"}}},{"node":{"fields":{"slug":"/contrast/angular/components","title":"Components"}}},{"node":{"fields":{"slug":"/contrast/angular/index","title":"Getting Started"}}},{"node":{"fields":{"slug":"/contrast/angular/table","title":"Table"}}},{"node":{"fields":{"slug":"/contrast/angular/sections","title":"Sections"}}},{"node":{"fields":{"slug":"/contrast/javascript/components","title":"Components"}}},{"node":{"fields":{"slug":"/contrast/angular/widgets","title":"Widgets"}}},{"node":{"fields":{"slug":"/contrast/javascript/navigation","title":"Navigation"}}},{"node":{"fields":{"slug":"/contrast/javascript/table","title":"Table"}}},{"node":{"fields":{"slug":"/contrast/javascript/sections","title":"Sections"}}},{"node":{"fields":{"slug":"/contrast/react/Installation","title":"Installation"}}},{"node":{"fields":{"slug":"/contrast/react/components","title":"Components"}}},{"node":{"fields":{"slug":"/contrast/react/index","title":"Getting Started"}}},{"node":{"fields":{"slug":"/contrast/angular/forms","title":"Forms"}}},{"node":{"fields":{"slug":"/contrast/react/sections","title":"Sections"}}},{"node":{"fields":{"slug":"/contrast/react/navigation","title":"Navigation"}}},{"node":{"fields":{"slug":"/contrast/react/chart","title":"Charts"}}},{"node":{"fields":{"slug":"/contrast/react/table","title":"Table"}}},{"node":{"fields":{"slug":"/contrast/angular/components/animations","title":"Animation"}}},{"node":{"fields":{"slug":"/contrast/angular/components/alert","title":"Alert"}}},{"node":{"fields":{"slug":"/contrast/react/custom_pages","title":"Custom Pages"}}},{"node":{"fields":{"slug":"/contrast/angular/components/autocomplete","title":"Autocomplete"}}},{"node":{"fields":{"slug":"/contrast/react/widgets","title":"Widgets"}}},{"node":{"fields":{"slug":"/contrast/angular/components/badge","title":"Badges"}}},{"node":{"fields":{"slug":"/contrast/angular/components/box","title":"Box"}}},{"node":{"fields":{"slug":"/contrast/angular/components/accordion","title":"Accordion"}}},{"node":{"fields":{"slug":"/contrast/angular/components/breadcrumb","title":"Breadcrumb"}}},{"node":{"fields":{"slug":"/contrast/angular/components/buttonGroup","title":"ButtonGroup"}}},{"node":{"fields":{"slug":"/contrast/angular/components/buttonToolbar","title":"ButtonToolbar"}}},{"node":{"fields":{"slug":"/contrast/angular/components/checkbox","title":"Checkbox"}}},{"node":{"fields":{"slug":"/contrast/angular/components/buttons","title":"Button"}}},{"node":{"fields":{"slug":"/contrast/angular/components/dropdown","title":"DropDown"}}},{"node":{"fields":{"slug":"/contrast/angular/components/collapse","title":"Collapse"}}},{"node":{"fields":{"slug":"/contrast/angular/components/icon","title":"Icon"}}},{"node":{"fields":{"slug":"/contrast/angular/components/iframe","title":"Iframe"}}},{"node":{"fields":{"slug":"/contrast/angular/components/inputgroup","title":"InputGroup"}}},{"node":{"fields":{"slug":"/contrast/angular/components/footer","title":"Footer"}}},{"node":{"fields":{"slug":"/contrast/angular/components/input","title":"Input"}}},{"node":{"fields":{"slug":"/contrast/angular/components/notification","title":"Notification"}}},{"node":{"fields":{"slug":"/contrast/angular/components/card","title":"Card"}}},{"node":{"fields":{"slug":"/contrast/angular/components/pane","title":"Pane"}}},{"node":{"fields":{"slug":"/contrast/angular/components/modal","title":"Modal"}}},{"node":{"fields":{"slug":"/contrast/angular/components/radio","title":"Radio"}}},{"node":{"fields":{"slug":"/contrast/angular/components/progress","title":"Progress"}}},{"node":{"fields":{"slug":"/contrast/angular/components/rating","title":"Rating"}}},{"node":{"fields":{"slug":"/contrast/angular/components/select","title":"Select"}}},{"node":{"fields":{"slug":"/contrast/angular/components/select2","title":"Select 2"}}},{"node":{"fields":{"slug":"/contrast/angular/components/slider","title":"Slider"}}},{"node":{"fields":{"slug":"/contrast/angular/components/spinner","title":"Spinner"}}},{"node":{"fields":{"slug":"/contrast/angular/components/multiselect","title":"Multiselect"}}},{"node":{"fields":{"slug":"/contrast/angular/components/switch","title":"Switch"}}},{"node":{"fields":{"slug":"/contrast/angular/components/panels","title":"Panel"}}},{"node":{"fields":{"slug":"/contrast/angular/components/stepper","title":"Stepper"}}},{"node":{"fields":{"slug":"/contrast/angular/navigation/pagination","title":"Pagination"}}},{"node":{"fields":{"slug":"/contrast/angular/navigation/sidebar","title":"Sidebar2"}}},{"node":{"fields":{"slug":"/contrast/angular/navigation/navbar","title":"Navbar"}}},{"node":{"fields":{"slug":"/contrast/angular/navigation/sidebar2","title":"Sidebar"}}},{"node":{"fields":{"slug":"/contrast/angular/navigation/tabs","title":"Tab"}}},{"node":{"fields":{"slug":"/contrast/angular/sections/timepicker","title":"TimePicker"}}},{"node":{"fields":{"slug":"/contrast/angular/table/datatables","title":"DataTable"}}},{"node":{"fields":{"slug":"/contrast/angular/table/fixed_datatables","title":"Fixed DataTable"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/accordion","title":"Accordion"}}},{"node":{"fields":{"slug":"/contrast/angular/table/table","title":"Table"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/alert","title":"Alert"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/animations","title":"Animation"}}},{"node":{"fields":{"slug":"/contrast/angular/table/editabletable","title":"EditableTable"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/autocomplete","title":"Autocomplete"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/badge","title":"Badges"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/breadcrumb","title":"Breadcrumb"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/box","title":"Box"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/buttonToolbar","title":"ButtonToolbar"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/buttonGroup","title":"ButtonGroup"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/buttons","title":"Button"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/checkbox","title":"Checkbox"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/carousel","title":"Carousel"}}},{"node":{"fields":{"slug":"/contrast/angular/components/mask","title":"Mask"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/collapse","title":"Collapse"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/datepicker","title":"DatePicker"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/datatables","title":"DataTable"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/dropdown","title":"DropDown"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/icon","title":"Icon"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/footer","title":"Footer"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/iframe","title":"Iframe"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/input","title":"Input"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/listgroup","title":"LIstGroup"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/forms","title":"Forms"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/mask","title":"Mask"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/card","title":"Card"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/multiselect","title":"Multiselect"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/modal","title":"Modal"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/inputgroup","title":"InputGroup"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/pane","title":"Pane"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/notification","title":"Notification"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/panels","title":"Panel"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/progress","title":"Progress"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/popover","title":"PopOver"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/radio","title":"Radio"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/rating","title":"Rating"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/select","title":"Select"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/spinner","title":"Spinner"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/slider","title":"Slider"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/select2","title":"Select 2"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/switch","title":"Switch"}}},{"node":{"fields":{"slug":"/contrast/angular/components/listgroup","title":"LIstGroup"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/stepper","title":"Stepper"}}},{"node":{"fields":{"slug":"/contrast/javascript/navigation/pagination","title":"Pagination"}}},{"node":{"fields":{"slug":"/contrast/javascript/navigation/navbar","title":"Navbar"}}},{"node":{"fields":{"slug":"/contrast/javascript/sections/timepicker","title":"TimePicker"}}},{"node":{"fields":{"slug":"/contrast/javascript/navigation/sidebar","title":"Sidebar2"}}},{"node":{"fields":{"slug":"/contrast/javascript/components/table","title":"Table"}}},{"node":{"fields":{"slug":"/contrast/javascript/navigation/tabs","title":"Tab"}}},{"node":{"fields":{"slug":"/contrast/react/components/alert","title":"React Alert"}}},{"node":{"fields":{"slug":"/contrast/react/components/accordion","title":"Accordion"}}},{"node":{"fields":{"slug":"/contrast/react/components/animations","title":"Animation"}}},{"node":{"fields":{"slug":"/contrast/react/components/autocomplete","title":"Autocomplete"}}},{"node":{"fields":{"slug":"/contrast/react/components/box","title":"Box"}}},{"node":{"fields":{"slug":"/contrast/react/components/badge","title":"Badges"}}},{"node":{"fields":{"slug":"/contrast/react/components/breadcrumb","title":"Breadcrumb"}}},{"node":{"fields":{"slug":"/contrast/react/components/buttonToolbar","title":"ButtonToolbar"}}},{"node":{"fields":{"slug":"/contrast/react/components/buttonGroup","title":"ButtonGroup"}}},{"node":{"fields":{"slug":"/contrast/react/components/carousel","title":"Carousel"}}},{"node":{"fields":{"slug":"/contrast/react/components/checkbox","title":"Checkbox"}}},{"node":{"fields":{"slug":"/contrast/react/components/buttons","title":"Button"}}},{"node":{"fields":{"slug":"/contrast/react/components/collapse","title":"Collapse"}}},{"node":{"fields":{"slug":"/contrast/react/components/icon","title":"Icon"}}},{"node":{"fields":{"slug":"/contrast/react/components/dropdown","title":"DropDown"}}},{"node":{"fields":{"slug":"/contrast/react/components/input","title":"Input"}}},{"node":{"fields":{"slug":"/contrast/react/components/inputgroup","title":"InputGroup"}}},{"node":{"fields":{"slug":"/contrast/react/components/iframe","title":"Iframe"}}},{"node":{"fields":{"slug":"/contrast/react/components/card","title":"Card"}}},{"node":{"fields":{"slug":"/contrast/react/components/footer","title":"Footer"}}},{"node":{"fields":{"slug":"/contrast/react/components/mask","title":"Mask"}}},{"node":{"fields":{"slug":"/contrast/react/components/multiselect","title":"Multiselect"}}},{"node":{"fields":{"slug":"/contrast/react/components/notification","title":"Notification"}}},{"node":{"fields":{"slug":"/contrast/react/components/listgroup","title":"LIstGroup"}}},{"node":{"fields":{"slug":"/contrast/react/components/pane","title":"Pane"}}},{"node":{"fields":{"slug":"/contrast/react/components/progress","title":"Progress"}}},{"node":{"fields":{"slug":"/contrast/react/components/rating","title":"Rating"}}},{"node":{"fields":{"slug":"/contrast/react/components/modal","title":"Modal"}}},{"node":{"fields":{"slug":"/contrast/react/components/select","title":"Select"}}},{"node":{"fields":{"slug":"/contrast/react/components/radio","title":"Radio"}}},{"node":{"fields":{"slug":"/contrast/react/components/slider","title":"Slider"}}},{"node":{"fields":{"slug":"/contrast/react/components/panels","title":"Panel"}}},{"node":{"fields":{"slug":"/contrast/react/components/select2","title":"Select 2"}}},{"node":{"fields":{"slug":"/contrast/react/components/smoothscroll","title":"SmoothScroll"}}},{"node":{"fields":{"slug":"/contrast/react/components/spinner","title":"Spinner"}}},{"node":{"fields":{"slug":"/contrast/react/components/switch","title":"Switch"}}},{"node":{"fields":{"slug":"/contrast/react/components/stepper","title":"Stepper"}}},{"node":{"fields":{"slug":"/contrast/react/navigation/navbar","title":"Navbar"}}},{"node":{"fields":{"slug":"/contrast/react/navigation/pagination","title":"Pagination"}}},{"node":{"fields":{"slug":"/contrast/react/navigation/sidebar","title":"Sidebar"}}},{"node":{"fields":{"slug":"/contrast/react/sections/fileuploader","title":"FileUploader"}}},{"node":{"fields":{"slug":"/contrast/react/sections/datepicker","title":"DatePicker"}}},{"node":{"fields":{"slug":"/contrast/react/sections/timepicker","title":"TimePicker"}}},{"node":{"fields":{"slug":"/contrast/react/table/editabletable","title":"EditableTable"}}},{"node":{"fields":{"slug":"/contrast/react/navigation/tabs","title":"Tab"}}},{"node":{"fields":{"slug":"/contrast/react/table/table","title":"Table"}}},{"node":{"fields":{"slug":"/contrast/react/forms","title":"Forms"}}},{"node":{"fields":{"slug":"/contrast/react/table/datatables","title":"DataTable"}}},{"node":{"fields":{"slug":"/bootstrap-5-major-changes","title":"Major changes to bootstrap 5"}}},{"node":{"fields":{"slug":"/bootstrap-5-navbar-using-contrast","title":"How To Create A Beautiful Navbar Using Bootstrap And Contrast"}}},{"node":{"fields":{"slug":"/using-bootstrap-in-react","title":"How to use Bootstrap in React Using a React Library"}}}]}},"pageContext":{"id":"3e9d93c9-edb4-5eac-a3b2-15c96297c2d1"}},"staticQueryHashes":["2619113677","2619113677","2619113677","2619113677","3706406642","3706406642","417421954","417421954"]}