{"id":36,"date":"2024-06-26T21:25:27","date_gmt":"2024-06-27T02:25:27","guid":{"rendered":"https:\/\/decatur-parks.org.staging3.juiceboxint.com\/decatur-sac\/?page_id=36"},"modified":"2024-06-26T21:25:33","modified_gmt":"2024-06-27T02:25:33","slug":"style-guide","status":"publish","type":"page","link":"https:\/\/decatur-parks.org\/decatur-sac\/about-us\/style-guide\/","title":{"rendered":"Style Guide"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Heading 2<\/h2>\n\n\n\n<p class=\"has-intro-font-size wp-block-paragraph t-body\">This is an example of intro text. Morbi tristique senectus et netus et malesuada fames ac turpis. Tellus in hac habitasse platea dictumst. Non quam lacus suspendisse faucibus interdum posuere lorem ipsum.<\/p>\n\n\n\n<p class=\"has-normal-font-size wp-block-paragraph t-body\">Non quam lacus suspendisse faucibus interdum posuere lorem ipsum. Sodales neque sodales ut etiam sit amet. Sed viverra tellus in hac habitasse. Facilisis volutpat est velit egestas dui id ornare. Dolor purus non enim praesent elementum facilisis leo.<br><br>Et tortor consequat id porta nibh venenatis. Enim lobortis scelerisque fermentum dui faucibus in. Nunc pulvinar sapien et ligula. Mauris pharetra et ultrices neque. Nunc congue nisi vitae suscipit tellus. Platea dictumst quisque sagittis purus sit amet volutpat consequat mauris.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Heading 3<\/h3>\n\n\n\n<p class=\"wp-block-paragraph t-body\">Sed elementum tempus egestas sed sed risus pretium. Porttitor massa id neque aliquam vestibulum morbi blandit. Luctus venenatis lectus magna fringilla urna. <a href=\"#\">This is a text link.<\/a> Faucibus a pellentesque sit amet. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/5\/2024\/05\/iStock-1352089456-1.png\" alt=\"IStock 1352089456 1\" class=\"wp-image-54\"\/><figcaption class=\"wp-element-caption\">This is an example caption. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia.<\/figcaption><\/figure>\n\n\n\n<p class=\"has-small-font-size wp-block-paragraph t-body\">Non quam lacus suspendisse faucibus interdum posuere lorem ipsum. Sodales neque sodales ut etiam sit amet. Sed viverra tellus in hac habitasse.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">Heading 4<\/h4>\n\n\n\n<p class=\"wp-block-paragraph t-body\">Massa sapien faucibus et molestie ac. <a href=\"#\">This is a text link with hover<\/a>. Neque viverra justo nec ultrices dui sapien eget mi proin. Quis risus sed vulputate odio ut enim blandit volutpat.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"wp-block-paragraph t-body\">This is a block quote. Nulla pharetra diam sit amet nisl suscipit adipiscing. Augue mauris augue neque gravida.<\/p>\n<cite>Whitney Davis<\/cite><\/blockquote>\n\n\n\n<p class=\"wp-block-paragraph t-body\">Facilisis volutpat est velit egestas dui id ornare. Dolor purus non enim praesent elementum facilisis leo. Viverra vitae congue eu consequat ac felis. Sollicitudin ac orci phasellus egestas tellus rutrum tellus.<br><br>Et tortor consequat id porta nibh venenatis. Enim lobortis scelerisque fermentum dui faucibus in. Nunc pulvinar sapien et ligula. Mauris pharetra et ultrices neque. Nunc congue nisi vitae suscipit tellus. Platea dictumst quisque sagittis purus sit amet volutpat consequat mauris.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Heading 5<\/h5>\n\n\n\n<p class=\"is-style-callout-box wp-block-paragraph t-body\">This is a callout box. Egestas fringilla phasellus faucibus scelerisque eleifend. Arcu bibendum at varius vel. Natoque penatibus et magnis dis parturient montes nascetur ridiculus.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">Heading 6<\/h6>\n\n\n\n<p class=\"has-small-font-size wp-block-paragraph t-body\">This is small paragraph text. Habitant morbi tristique senectus et netus. Vel risus commodo viverra maecenas accumsan. Ultrices sagittis orci a scelerisque.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-1 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h5 class=\"wp-block-heading\">Bullet List<\/h5>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Egestas fringilla phasellus faucibus scelerisque eleifend<\/li>\n\n\n\n<li>Arcu bibendum at varius vel<\/li>\n\n\n\n<li><a href=\"#\">Mauris pharetra et ultrices neque<\/a><\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h5 class=\"wp-block-heading\">Numbered List<\/h5>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Egestas fringilla phasellus faucibus scelerisque eleifend<\/li>\n\n\n\n<li>Arcu bibendum at varius vel<\/li>\n\n\n\n<li><a href=\"#\">Mauris pharetra et ultrices neque<\/a><\/li>\n<\/ol>\n<\/div>\n<\/div>\n\n\n\n<h5 class=\"wp-block-heading\">Buttons &amp; Callout Link<\/h5>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\">Button Style 1<\/a><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button is-style-callout-link\"><a class=\"wp-block-button__link wp-element-button\">Callout Link Style<\/a><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button is-style-outline\"><a class=\"wp-block-button__link wp-element-button\">Button Style 2<\/a><\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th class=\"has-text-align-center\" data-align=\"center\">Header cell<\/th><th class=\"has-text-align-center\" data-align=\"center\">Header cell<\/th><th class=\"has-text-align-center\" data-align=\"center\">Header cell<\/th><th class=\"has-text-align-center\" data-align=\"center\">Header cell<\/th><\/tr><\/thead><tbody><tr><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><\/tr><tr><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><\/tr><tr><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><\/tr><tr><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><\/tr><tr><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><td class=\"has-text-align-center\" data-align=\"center\">Cell text<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<section class=\"accordion\">\n\t<div class=\"accordion__lists\">\n\t\t\t\t\t<div class=\"accordion__lists-item\">\n\t\t\t\t<div class=\"accordion__lists-item-head\">\n\t\t\t\t\t<p class=\"t-body\">\n\t\t\t\t\t\t<strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit?<\/strong>\n\t\t\t\t\t<\/p>\n\t\t\t\t\t<i class=\"fa-solid fa-angle-down\"><\/i>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"accordion__lists-item-main\">\n\t\t\t\t\t<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit?<\/p>\n<p>&nbsp;<\/p>\n\n\t\t\t\t\t\t\t\t\t\t<div class=\"wp-block-button is-style-outline\">\n\t\t\t\t\t\t<a class=\"wp-block-button__link wp-element-button\" href=\"#\">Learn More<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t<div class=\"accordion__lists-item\">\n\t\t\t\t<div class=\"accordion__lists-item-head\">\n\t\t\t\t\t<p class=\"t-body\">\n\t\t\t\t\t\t<strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit?<\/strong>\n\t\t\t\t\t<\/p>\n\t\t\t\t\t<i class=\"fa-solid fa-angle-down\"><\/i>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"accordion__lists-item-main\">\n\t\t\t\t\t<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit?<\/p>\n\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t<div class=\"accordion__lists-item\">\n\t\t\t\t<div class=\"accordion__lists-item-head\">\n\t\t\t\t\t<p class=\"t-body\">\n\t\t\t\t\t\t<strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit?<\/strong>\n\t\t\t\t\t<\/p>\n\t\t\t\t\t<i class=\"fa-solid fa-angle-down\"><\/i>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"accordion__lists-item-main\">\n\t\t\t\t\t<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit?<\/p>\n\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t<\/div>\n<\/section>\n\n\n\n\n\n<section class=\"photo-gallery\">\n\t<div class=\"row\">\n\t\t<div class=\"col-12\">\n\t\t\t<div class=\"photo-gallery__images\">\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-269-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-269-235x235-c-default.png\" alt=\"Image 269\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-270-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-270-235x235-c-default.png\" alt=\"Image 270\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/iStock-987789036-1-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/iStock-987789036-1-235x235-c-default.png\" alt=\"IStock 987789036 1\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-271-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-271-235x235-c-default.png\" alt=\"Image 271\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/32308955_l-1-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/32308955_l-1-235x235-c-default.png\" alt=\"32308955 l 1\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-268-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/image-268-235x235-c-default.png\" alt=\"Image 268\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/17699363_l-1-1-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/17699363_l-1-1-235x235-c-default.png\" alt=\"17699363 l 1 (1)\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"image-popup\" data-gall=\"gallery1\" href=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/Rectangle-937-1-760x0-c-default.png\">\n\t\t\t\t\t\t<figure class=\"photo-gallery__images-item\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/decatur-parks.org\/app\/uploads\/sites\/13\/2024\/06\/Rectangle-937-1-235x235-c-default.png\" alt=\"Rectangle 937 (1)\">\n\t\t\t\t\t\t\t<figcaption>This is an example caption. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t<div class=\"load-more\">\n\t\t\t\t\t<a href=\"#\">\n\t\t\t\t\t\t<span>Load more<\/span>\n\t\t\t\t\t\t<i class=\"fa-solid fa-plus\"><\/i>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t<\/div>\n<\/section>\n\n\n\n\n\n\n<section class=\"staff-contact\">\n\t<div class=\"row\">\n\t\t\t\t        \t\t\t<div class=\"col-md-6 col-sm-12 col-12\">\n    \t\t\t\t<div class=\"staff-contact__info\">\n    \t\t\t\t\t<h5 class=\"t-heading-5\">John Smith<\/h5>\n    \t\t\t\t\t<p class=\"is-style-small-text\">Marketing Director<\/p>\n    \t\t\t\t\t<p class=\"t-body\">555-555-5555 ext. 555<\/p>\n    \t\t\t\t\t                        <div class=\"btn-wrapper\">\n                            <a href=\"mailto:johnsmith@gmail.com\">\n                                <i class=\"fa-solid fa-paper-plane\"><\/i>\n                            <\/a>\n                        <\/div>\n                            \t\t\t\t<\/div>\n    \t\t\t<\/div>\n    \t\t    \t\t\n    \t   \t\t\t\t        \t\t\t<div class=\"col-md-6 col-sm-12 col-12\">\n    \t\t\t\t<div class=\"staff-contact__info\">\n    \t\t\t\t\t<h5 class=\"t-heading-5\">Jane Green<\/h5>\n    \t\t\t\t\t<p class=\"is-style-small-text\">Volunteer<\/p>\n    \t\t\t\t\t<p class=\"t-body\"><\/p>\n    \t\t\t\t\t                        <div class=\"btn-wrapper\">\n                            <a href=\"mailto:johnsmith@gmail.com\">\n                                <i class=\"fa-solid fa-paper-plane\"><\/i>\n                            <\/a>\n                        <\/div>\n                            \t\t\t\t<\/div>\n    \t\t\t<\/div>\n    \t\t    \t\t\n    \t   \t\t\t<\/div>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>Heading 2 This is an example of intro text. Morbi tristique senectus et netus et malesuada fames ac turpis. Tellus in hac habitasse platea dictumst. Non quam lacus suspendisse faucibus interdum posuere lorem ipsum. Non quam lacus suspendisse &#8230;<\/p>\n","protected":false},"author":1,"featured_media":22,"parent":34,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":"","_links_to":"","_links_to_target":""},"acf":{"banner_style":"is-style-3","alt_title":"","desc":""},"_links":{"self":[{"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/pages\/36"}],"collection":[{"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/comments?post=36"}],"version-history":[{"count":1,"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/pages\/36\/revisions"}],"predecessor-version":[{"id":37,"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/pages\/36\/revisions\/37"}],"up":[{"embeddable":true,"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/pages\/34"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/media\/22"}],"wp:attachment":[{"href":"https:\/\/decatur-parks.org\/decatur-sac\/wp-json\/wp\/v2\/media?parent=36"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}