List blog post tailwind CSS

listing blog post home page with tailwindcss

\r\n Finding best places to visit in California<\/a><\/h3>\r\n <div class=\"flex mt-4 gap-4 items-center\">\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z\" \/>\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\" \/>\r\n <\/svg>\r\n 35\r\n <\/span>\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"text-sky-400 w-4 h-4\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z\" \/>\r\n <\/svg>\r\n\r\n 20\r\n <\/span>\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 text-lime-500\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M7.5 8.25h9m-9 3H12m-9.75 1.51c0 1.6 1.123 2.994 2.707 3.227 1.129.166 2.27.293 3.423.379.35.026.67.21.865.501L12 21l2.755-4.133a1.14 1.14 0 0 1 .865-.501 48.172 48.172 0 0 0 3.423-.379c1.584-.233 2.707-1.626 2.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0 0 12 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018Z\" \/>\r\n <\/svg>\r\n\r\n\r\n 15\r\n <\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"bg-white w-1\/3 shadow rounded-lg overflow-hidden\">\r\n <img src=https://www.creative-tim.com/"https:////loremflickr.com//320//240?random=1\%22 class=\"object-cover h-52 w-full\" alt=\"\">\r\n <div class=\"p-6\">\r\n <span class=\"block text-slate-400 font-semibold text-sm\">16 Juillet 2016<\/span>\r\n <h3 class=\"mt-3 font-bold text-lg pb-4 border-b border-slate-300\">\r\n <a href=https://www.creative-tim.com/"https:////play.tailwindcss.com//TGny89rOkl?layout=horizontal\%22>\r\n Finding best places to visit in California<\/a><\/h3>\r\n <div class=\"flex mt-4 gap-4 items-center\">\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z\" \/>\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\" \/>\r\n <\/svg>\r\n 35\r\n <\/span>\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"text-sky-400 w-4 h-4\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z\" \/>\r\n <\/svg>\r\n\r\n 20\r\n <\/span>\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 text-lime-500\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M7.5 8.25h9m-9 3H12m-9.75 1.51c0 1.6 1.123 2.994 2.707 3.227 1.129.166 2.27.293 3.423.379.35.026.67.21.865.501L12 21l2.755-4.133a1.14 1.14 0 0 1 .865-.501 48.172 48.172 0 0 0 3.423-.379c1.584-.233 2.707-1.626 2.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0 0 12 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018Z\" \/>\r\n <\/svg>\r\n\r\n\r\n 15\r\n <\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"bg-white w-1\/3 shadow rounded-lg overflow-hidden\">\r\n <img src=https://www.creative-tim.com/"https:////loremflickr.com//320//240?random=1\%22 class=\"object-cover h-52 w-full\" alt=\"\">\r\n <div class=\"p-6\">\r\n <span class=\"block text-slate-400 font-semibold text-sm\">16 Juillet 2016<\/span>\r\n <h3 class=\"mt-3 font-bold text-lg pb-4 border-b border-slate-300\">\r\n <a href=https://www.creative-tim.com/"https:////play.tailwindcss.com//TGny89rOkl?layout=horizontal\%22>\r\n Finding best places to visit in California<\/a><\/h3>\r\n <div class=\"flex mt-4 gap-4 items-center\">\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z\" \/>\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\" \/>\r\n <\/svg>\r\n 35\r\n <\/span>\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"text-sky-400 w-4 h-4\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z\" \/>\r\n <\/svg>\r\n\r\n 20\r\n <\/span>\r\n <span class=\"flex gap-1 items-center text-sm\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 text-lime-500\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M7.5 8.25h9m-9 3H12m-9.75 1.51c0 1.6 1.123 2.994 2.707 3.227 1.129.166 2.27.293 3.423.379.35.026.67.21.865.501L12 21l2.755-4.133a1.14 1.14 0 0 1 .865-.501 48.172 48.172 0 0 0 3.423-.379c1.584-.233 2.707-1.626 2.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0 0 12 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018Z\" \/>\r\n <\/svg>\r\n\r\n\r\n 15\r\n <\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/div>","author_type":"App\\User","author_id":15993,"collection_id":null,"fork_id":null,"votes":0,"score":"0.0","visits":3493,"popularity":162,"slug":"list-blog-post-tailwindcss","approved":1,"created_at":"2024-01-31T00:00:00.000000Z","updated_at":"2024-09-19T02:29:13.000000Z","downloads":54,"code_views":997,"center":false,"notified":0,"premium":0,"tailwind_config":null,"type":"component","css":"https:\/\/cdn.tailwindcss.com","should_tweet":0,"media":[{"id":11299,"model_type":"App\\Component","model_id":6145,"collection_name":"preview","name":"temp37013","file_name":"temp37013.png","mime_type":"image\/png","disk":"public","size":295208,"manipulations":[],"custom_properties":[],"responsive_images":{"media_library_original":{"urls":["temp37013___media_library_original_1280_957.png","temp37013___media_library_original_1070_800.png","temp37013___media_library_original_895_669.png","temp37013___media_library_original_749_560.png","temp37013___media_library_original_627_469.png","temp37013___media_library_original_524_392.png","temp37013___media_library_original_439_328.png","temp37013___media_library_original_367_274.png","temp37013___media_library_original_307_230.png","temp37013___media_library_original_257_192.png"],"base64svg":"data:image\/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHg9IjAiCiB5PSIwIiB2aWV3Qm94PSIwIDAgMTI4MCA5NTciPgoJPGltYWdlIHdpZHRoPSIxMjgwIiBoZWlnaHQ9Ijk1NyIgeGxpbms6aHJlZj0iZGF0YTppbWFnZS9qcGVnO2Jhc2U2NCwvOWovNEFBUVNrWkpSZ0FCQVFFQVlBQmdBQUQvL2dBN1ExSkZRVlJQVWpvZ1oyUXRhbkJsWnlCMk1TNHdJQ2gxYzJsdVp5QkpTa2NnU2xCRlJ5QjJPREFwTENCeGRXRnNhWFI1SUQwZ09UQUsvOXNBUXdBREFnSURBZ0lEQXdNREJBTURCQVVJQlFVRUJBVUtCd2NHQ0F3S0RBd0xDZ3NMRFE0U0VBME9FUTRMQ3hBV0VCRVRGQlVWRlF3UEZ4Z1dGQmdTRkJVVS85c0FRd0VEQkFRRkJBVUpCUVVKRkEwTERSUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVLzhBQUVRZ0FHQUFnQXdFUkFBSVJBUU1SQWYvRUFCOEFBQUVGQVFFQkFRRUJBQUFBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUUFBSUJBd01DQkFNRkJRUUVBQUFCZlFFQ0F3QUVFUVVTSVRGQkJoTlJZUWNpY1JReWdaR2hDQ05Dc2NFVlV0SHdKRE5pY29JSkNoWVhHQmthSlNZbktDa3FORFUyTnpnNU9rTkVSVVpIU0VsS1UxUlZWbGRZV1ZwalpHVm1aMmhwYW5OMGRYWjNlSGw2ZzRTRmhvZUlpWXFTazVTVmxwZVltWnFpbzZTbHBxZW9xYXF5czdTMXRyZTR1YnJDdzhURnhzZkl5Y3JTMDlUVjF0ZlkyZHJoNHVQazVlYm42T25xOGZMejlQWDI5L2o1K3YvRUFCOEJBQU1CQVFFQkFRRUJBUUVBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUkFBSUJBZ1FFQXdRSEJRUUVBQUVDZHdBQkFnTVJCQVVoTVFZU1FWRUhZWEVUSWpLQkNCUkNrYUd4d1Frak0xTHdGV0p5MFFvV0pEVGhKZkVYR0JrYUppY29LU28xTmpjNE9UcERSRVZHUjBoSlNsTlVWVlpYV0ZsYVkyUmxabWRvYVdwemRIVjJkM2g1ZW9LRGhJV0doNGlKaXBLVGxKV1dsNWlabXFLanBLV21wNmlwcXJLenRMVzJ0N2k1dXNMRHhNWEd4OGpKeXRMVDFOWFcxOWpaMnVMajVPWG01K2pwNnZMejlQWDI5L2o1K3YvYUFBd0RBUUFDRVFNUkFEOEEvU0tTNWpUZ3VBZlFtdlNiUzNPQ3paajMydU5iTVFGRFk2YzFQTWl1VmhaYTYwN2dPb1FIdVRSeklYS3phamxWd01NRFZKcGhabmkzeEhsOFJKNGxqL3M4UDluOXVsZVBqWTFIOERQV3djcWErTkhHYWplK05aZFhpVVF5Q0VkL1d2TWpERWN1clBTYzhQemFJTlh2Zkd2MitCSW9aRmlIVmdLSXd4RnRXRXBZZStpUFQvaDdlNjY5eUk3K04vTHg5NDEzNEdOVlM5OW5CakhTYTl3OUxlemlrY002S3hIY2l2WWxCUzNQSWpQbEhTV2x2SmpNS2NlMVI3SkYrMVlTV2x2SW9CaFRqMm85a2c5cXg2eHhvb1ZFQy9RVmNZS0pFcHVSLzlrPSI+Cgk8L2ltYWdlPgo8L3N2Zz4="}},"order_column":2,"created_at":"2024-01-31T17:43:36.000000Z","updated_at":"2024-01-31T17:43:38.000000Z","conversions_disk":"public","uuid":"3d14d786-c5ca-4cb1-9a19-13937eb1dd7a","generated_conversions":{"thumb":true,"ogimage":true},"original_url":"https:\/\/tailwindcomponents.com\/storage\/11299\/temp37013.png","preview_url":""}],"author":{"id":15993,"name":"maxacrea","slug":"maxacrea","bio":null,"avatar":"https:\/\/www.gravatar.com\/avatar\/139033b97f665c652f24602e0bdfa9f7","header":null,"created_at":"2023-12-22T19:14:37.000000Z","updated_at":"2023-12-23T09:13:42.000000Z"},"tags":[{"id":4,"name":{"en":"Cards"},"description":"Check out our examples of beautifully designed cards that will help you display your content easily. Use our snippets to preview the code and spend less time re-inventing the wheel.","meta_description":"Check out our examples of beautifully designed cards that will help you display your content easily.","slug":{"en":"cards"},"type":null,"order_column":3,"created_at":"2019-07-04T08:20:17.000000Z","updated_at":"2022-08-01T16:06:24.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":6145,"tag_id":4}},{"id":59,"name":{"en":"List"},"description":"The Tailwind CSS List component is used to for display list of items or data. It can often be used for navigation or menus. See below our collection of List components that you can add directly to your Tailwind UI project.","meta_description":"Visit our Tailwind CSS List component examples that you can add to your web project to create awesome web apps.","slug":{"en":"list"},"type":null,"order_column":48,"created_at":"2023-10-05T07:47:36.000000Z","updated_at":"2023-10-05T07:47:36.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":6145,"tag_id":59}}],"fork":null,"favorites":[{"id":16134,"name":"ctrljames","slug":"ctrljames","bio":null,"avatar":"\/storage\/avatars\/lMpJLAqN28ZJJGQCY5AQ3u26YWS9brlZi2jRTXAV.jpg","header":"\/storage\/headers\/M9haOK3UGgaF25rhrulcTn76y9C6sOJuYQKq0MH6.jpg","created_at":"2024-01-01T06:41:07.000000Z","updated_at":"2024-01-22T15:16:15.000000Z","pivot":{"component_id":6145,"user_id":16134}},{"id":6940,"name":"123ApplePie","slug":"123applepie","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/73269263?v=4","header":null,"created_at":"2022-02-21T13:49:46.000000Z","updated_at":"2022-02-21T13:49:46.000000Z","pivot":{"component_id":6145,"user_id":6940}},{"id":16778,"name":"im_TusHaR_m","slug":"im-tushar-m","bio":null,"avatar":"https:\/\/pbs.twimg.com\/profile_images\/1740878726299316224\/623nr8kn_normal.jpg","header":null,"created_at":"2024-02-06T06:14:23.000000Z","updated_at":"2024-02-06T06:14:23.000000Z","pivot":{"component_id":6145,"user_id":16778}},{"id":17090,"name":"sergeiTreigo","slug":"sergeitreigo","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/154522856?v=4","header":null,"created_at":"2024-02-21T09:40:03.000000Z","updated_at":"2024-02-21T09:40:03.000000Z","pivot":{"component_id":6145,"user_id":17090}}]}" :edit="false"> Full screen Preview