[{"data":1,"prerenderedAt":67},["ShallowReactive",2],{"ghost-settings":3,"post-how-to-customize-post-styles-in-this-template":45},{"title":4,"description":5,"logo":6,"icon":6,"accent_color":7,"cover_image":8,"facebook":9,"twitter":10,"locale":11,"timezone":12,"codeinjection_head":6,"codeinjection_foot":6,"navigation":13,"secondary_navigation":20,"meta_title":24,"meta_description":5,"og_image":25,"og_title":26,"og_description":6,"twitter_image":27,"twitter_title":6,"twitter_description":28,"members_support_address":29,"members_enabled":30,"donations_enabled":30,"allow_self_signup":30,"members_invite_only":30,"members_signup_access":31,"paid_members_enabled":30,"firstpromoter_account":6,"portal_button_style":32,"portal_button_signup_text":33,"portal_button_icon":6,"portal_signup_terms_html":6,"portal_signup_checkbox_required":30,"portal_plans":34,"portal_default_plan":36,"portal_name":37,"portal_button":30,"comments_enabled":38,"recommendations_enabled":30,"outbound_link_tagging":37,"default_email_address":39,"support_email_address":39,"editor_default_email_recipients":40,"labs":41,"site_uuid":42,"lang":11,"url":43,"version":44},"Test nuxt ghost template","Mis movidas",null,"#FF1A75","https://static.ghost.org/v5.0.0/images/publication-cover.jpg","ghost","@sergioeclectico","es","Etc/UTC",[14,17],{"label":15,"url":16},"Home","/",{"label":18,"url":19},"About","/about/",[21],{"label":22,"url":23},"Sign up","#/portal/","Metadata title: la silla eclectica","http://ghost-blog1.vps2.eclectico.net/content/images/2025/10/twitter_iomg-1.webp","Facebook title","http://ghost-blog1.vps2.eclectico.net/content/images/2025/10/twitter_iomg.webp","Descripcion de la web para Twitter","noreply",false,"none","icon-and-text","Subscribe",[35],"free","yearly",true,"off","noreply@ghost-blog1.vps2.eclectico.net","visibility",{},"4593ef3d-a158-4d19-a515-2ceb153eb82f","http://ghost-blog1.vps2.eclectico.net/","5.130",{"slug":46,"id":47,"uuid":48,"title":49,"html":50,"comment_id":47,"feature_image":51,"featured":30,"visibility":52,"created_at":53,"updated_at":54,"published_at":54,"custom_excerpt":6,"codeinjection_head":6,"codeinjection_foot":6,"custom_template":6,"canonical_url":6,"authors":55,"tags":61,"primary_author":62,"primary_tag":6,"url":63,"excerpt":64,"reading_time":65,"access":37,"comments":30,"og_image":6,"og_title":6,"og_description":6,"twitter_image":6,"twitter_title":6,"twitter_description":6,"meta_title":6,"meta_description":6,"email_subject":6,"frontmatter":6,"feature_image_alt":6,"feature_image_caption":66},"how-to-customize-post-styles-in-this-template","68f24d1dcf780300010c5c76","8533a97d-93cb-496f-b3f0-aa3db05a8114","How to Customize Post Styles in This Template","\u003Chr>\u003Cp>\u003Cbr>Learn how to customize the look and feel of your blog posts by editing the Ghost CSS file - no complex setup required.\u003Cbr>One of the best features of this Nuxt + Ghost template is how easy it is to customize your post styles. Everything is centralized in a single CSS file!\u003C/p>\u003Ch2 id=\"where-to-find-the-styles\">Where to Find the Styles\u003C/h2>\u003Cp>All post styling lives in \u003Ccode>app/assets/css/ghost.css\u003C/code>. This file contains:\u003C/p>\u003Cul>\u003Cli>Typography (headings, paragraphs, links)\u003C/li>\u003Cli>Ghost card styles (galleries, toggles, callouts)\u003C/li>\u003Cli>CSS variables for colors\u003C/li>\u003Cli>Responsive design rules\u003C/li>\u003C/ul>\u003Ch2 id=\"quick-customization-examples\">Quick Customization Examples\u003C/h2>\u003Ch3 id=\"change-font-size\">Change Font Size\u003C/h3>\u003Cp>Find this in \u003Ccode>ghost.css\u003C/code>:\u003C/p>\u003Cpre>\u003Ccode class=\"language-css\">.ghost-post {\n  font-size: 1.8rem; /* Adjust this value */\n  line-height: 1.7;\n}\n\u003C/code>\u003C/pre>\u003Ch3 id=\"customize-your-brand-colors\">Customize Your Brand Colors\u003C/h3>\u003Cp>Update the CSS variables:\u003C/p>\u003Cpre>\u003Ccode class=\"language-css\">:root {\n  --ghost-accent-color: #15171a; /* Your brand color */\n  --color-primary-text: var(--color-darker-gray);\n}\n\u003C/code>\u003C/pre>\u003Ch3 id=\"modify-content-width\">Modify Content Width\u003C/h3>\u003Cp>The post content is wrapped with \u003Ccode>max-w-4xl\u003C/code> in \u003Ccode>app/pages/posts/[slug].vue\u003C/code>. Change this Tailwind class to adjust width:\u003C/p>\u003Cul>\u003Cli>\u003Ccode>max-w-2xl\u003C/code> - Narrower (672px)\u003C/li>\u003Cli>\u003Ccode>max-w-4xl\u003C/code> - Default (896px)\u003C/li>\u003Cli>\u003Ccode>max-w-5xl\u003C/code> - Wider (1024px)\u003C/li>\u003Cli>\u003Ccode>max-w-6xl\u003C/code> - Full width (1152px)\u003C/li>\u003C/ul>\u003Ch2 id=\"ghost-cards-support\">Ghost Cards Support\u003C/h2>\u003Cp>This template includes styling for Ghost's dynamic cards:\u003C/p>\u003Cul>\u003Cli>📸 Image cards and galleries\u003C/li>\u003Cli>📚 Bookmark cards\u003C/li>\u003Cli>💬 Callout cards\u003C/li>\u003Cli>🎯 Toggle cards (expandable content)\u003C/li>\u003Cli>🎥 Video and audio cards\u003C/li>\u003Cli>📎 File cards\u003C/li>\u003C/ul>\u003Cp>Each card type has its own section in \u003Ccode>ghost.css\u003C/code> for easy customization.\u003C/p>\u003Ch2 id=\"dark-mode\">Dark Mode\u003C/h2>\u003Cp>All styles automatically support dark mode! The template uses CSS variables that switch based on the user's preference.\u003C/p>\u003Cpre>\u003Ccode class=\"language-css\">.dark {\n  --color-primary-text: #fff;\n  --color-secondary-text: rgb(255 255 255 / 0.64);\n}\n\u003C/code>\u003C/pre>\u003Ch2 id=\"tips-for-customization\">Tips for Customization\u003C/h2>\u003Col>\u003Cli>\u003Cstrong>Use your browser's DevTools\u003C/strong> to inspect elements and see which classes are applied\u003C/li>\u003Cli>\u003Cstrong>Test in both light and dark modes\u003C/strong> to ensure readability\u003C/li>\u003Cli>\u003Cstrong>Keep mobile users in mind\u003C/strong> - the template is responsive by default\u003C/li>\u003Cli>\u003Cstrong>Backup your changes\u003C/strong> before major modifications\u003C/li>\u003C/ol>\u003Cp>That's it! With just one CSS file, you can completely transform the look of your blog posts. Happy customizing! 🎨\u003C/p>","https://images.unsplash.com/photo-1523437113738-bbd3cc89fb19?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTc3M3wwfDF8c2VhcmNofDF8fGNzc3xlbnwwfHx8fDE3NjA3MDk5OTB8MA&ixlib=rb-4.1.0&q=80&w=2000","public","2025-10-17T14:05:17.000+00:00","2025-10-17T14:06:41.000+00:00",[56],{"id":57,"name":58,"slug":59,"profile_image":6,"cover_image":6,"bio":6,"website":6,"location":6,"facebook":6,"twitter":6,"threads":6,"bluesky":6,"mastodon":6,"tiktok":6,"youtube":6,"instagram":6,"linkedin":6,"meta_title":6,"meta_description":6,"url":60},"1","Sergio","sergio","http://ghost-blog1.vps2.eclectico.net/author/sergio/",[],{"id":57,"name":58,"slug":59,"profile_image":6,"cover_image":6,"bio":6,"website":6,"location":6,"facebook":6,"twitter":6,"threads":6,"bluesky":6,"mastodon":6,"tiktok":6,"youtube":6,"instagram":6,"linkedin":6,"meta_title":6,"meta_description":6,"url":60},"http://ghost-blog1.vps2.eclectico.net/how-to-customize-post-styles-in-this-template/","\nLearn how to customize the look and feel of your blog posts by editing the Ghost CSS file - no complex setup required.\nOne of the best features of this Nuxt + Ghost template is how easy it is to customize your post styles. Everything is centralized in a single CSS file!\n\n\nWhere to Find the Styles\n\nAll post styling lives in app/assets/css/ghost.css. This file contains:\n\n * Typography (headings, paragraphs, links)\n * Ghost card styles (galleries, toggles, callouts)\n * CSS variables for colors\n * ",1,"\u003Cspan style=\"white-space: pre-wrap;\">Photo by \u003C/span>\u003Ca href=\"https://unsplash.com/@pankajpatel?utm_source=ghost&utm_medium=referral&utm_campaign=api-credit\">\u003Cspan style=\"white-space: pre-wrap;\">Pankaj Patel\u003C/span>\u003C/a>\u003Cspan style=\"white-space: pre-wrap;\"> / \u003C/span>\u003Ca href=\"https://unsplash.com/?utm_source=ghost&utm_medium=referral&utm_campaign=api-credit\">\u003Cspan style=\"white-space: pre-wrap;\">Unsplash\u003C/span>\u003C/a>",1761039193189]