News & Announcements | The SEEALL Academy<\/title>\n <style>\n \/* Base Styles & Resets *\/\n body {\n margin: 0;\n padding: 0;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n background-color: #f8f9fa;\n color: #333;\n line-height: 1.6;\n }\n\n * {\n box-sizing: border-box;\n }\n\n \/* Page Header *\/\n .page-header {\n background: linear-gradient(135deg, #001528 0%, #005a9c 100%);\n padding: 4rem 2rem;\n text-align: center;\n border-bottom: 8px solid #F9B000;\n }\n\n .page-header h1 {\n color: #ffffff;\n font-size: 3rem;\n font-weight: 800;\n margin: 0 0 0.5rem 0;\n letter-spacing: -0.5px;\n text-shadow: 2px 2px 8px rgba(0,0,0,0.4);\n }\n\n .page-header p {\n color: #e6f0f7;\n font-size: 1.2rem;\n margin: 0 auto;\n max-width: 600px;\n }\n\n .accent-line {\n width: 60px;\n height: 6px;\n background-color: #F9B000;\n margin: 1.5rem auto 0 auto;\n border-radius: 3px;\n }\n\n \/* Main Container *\/\n .container {\n max-width: 1300px;\n margin: 0 auto;\n padding: 4rem 1.5rem;\n }\n\n \/* Loading State *\/\n .loading-state {\n text-align: center;\n padding: 4rem;\n color: #005a9c;\n font-size: 1.2rem;\n font-weight: 600;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 15px;\n }\n\n .spinner {\n width: 40px;\n height: 40px;\n border: 4px solid rgba(0, 90, 156, 0.2);\n border-left-color: #F9B000;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n }\n\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n\n \/* News Grid *\/\n .news-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 2.5rem;\n }\n\n \/* Individual News Card *\/\n .news-card {\n background: #ffffff;\n border-radius: 12px;\n overflow: hidden;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.05);\n display: flex;\n flex-direction: column;\n transition: transform 0.3s ease, box-shadow 0.3s ease;\n border-bottom: 5px solid transparent;\n }\n\n .news-card:hover {\n transform: translateY(-8px);\n box-shadow: 0 15px 35px rgba(0, 90, 156, 0.12);\n border-bottom-color: #F9B000;\n }\n\n \/* Card Content *\/\n .news-content {\n padding: 2.5rem;\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n .news-date {\n font-size: 0.85rem;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: #888;\n font-weight: 700;\n margin-bottom: 0.8rem;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n .news-date svg {\n color: #F9B000;\n }\n\n .news-title {\n margin: 0 0 1rem 0;\n font-size: 1.4rem;\n line-height: 1.3;\n }\n\n .news-title a {\n color: #005a9c;\n text-decoration: none;\n transition: color 0.2s ease;\n }\n\n .news-title a:hover {\n color: #F9B000;\n }\n\n .news-content-scroll {\n color: #555;\n font-size: 1rem;\n margin-bottom: 1.5rem;\n max-height: 300px; \/* Adjust this height to make the scroll area taller or shorter *\/\n overflow-y: auto;\n padding-right: 10px;\n }\n\n \/* Custom scrollbar for the news content *\/\n .news-content-scroll::-webkit-scrollbar {\n width: 6px;\n }\n .news-content-scroll::-webkit-scrollbar-track {\n background: #f8f9fa;\n border-radius: 4px;\n }\n .news-content-scroll::-webkit-scrollbar-thumb {\n background: #cbd5e1;\n border-radius: 4px;\n }\n .news-content-scroll::-webkit-scrollbar-thumb:hover {\n background: #94a3b8;\n }\n\n .news-content-scroll p {\n margin-top: 0;\n }\n \n \/* Ensures images inside the full post don't break the layout *\/\n .news-content-scroll img, \n .news-content-scroll figure {\n max-width: 100%;\n height: auto;\n margin: 10px 0;\n }\n\n \/* Fixes WordPress Embeds & Iframes so they do not collapse *\/\n .news-content-scroll iframe {\n width: 100%;\n min-height: 350px;\n border: none;\n border-radius: 8px;\n margin: 10px 0;\n background-color: #eee;\n }\n\n \/* WordPress specific embed wrappers *\/\n .news-content-scroll .wp-block-embed__wrapper {\n position: relative;\n width: 100%;\n margin: 10px 0;\n }\n\n .read-more {\n margin-top: auto;\n display: inline-flex;\n align-items: center;\n gap: 5px;\n font-size: 0.95rem;\n font-weight: 700;\n color: #005a9c;\n text-decoration: none;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n transition: color 0.2s ease;\n }\n\n .read-more:hover {\n color: #F9B000;\n }\n\n \/* No Results \/ Error *\/\n .error-message {\n grid-column: 1 \/ -1;\n text-align: center;\n padding: 3rem;\n background: #ffffff;\n border-radius: 12px;\n color: #555;\n font-size: 1.1rem;\n }\n\n \/* Responsive *\/\n @media (max-width: 900px) {\n .news-grid { grid-template-columns: 1fr; }\n }\n\n @media (max-width: 768px) {\n .page-header h1 { font-size: 2.2rem; }\n .container { padding: 3rem 1.2rem; }\n .news-grid { gap: 1.5rem; }\n .news-content { padding: 1.5rem; }\n }\n <\/style>\n<\/head>\n<body>\n\n \n <header class=\"page-header\">\n <h1>News & Announcements<\/h1>\n <p>Stay up to date with the latest events, updates, and community news from The SEEALL Academy.<\/p>\n <div class=\"accent-line\"><\/div>\n <\/header>\n\n <main class=\"container\">\n \n \n <div class=\"news-grid\" id=\"news-container\">\n \n <div class=\"loading-state\" id=\"loading-indicator\">\n <div class=\"spinner\"><\/div>\n Fetching the latest updates...\n <\/div>\n <\/div>\n\n <\/main>\n\n \n <script>\n document.addEventListener('DOMContentLoaded', async () => {\n const newsContainer = document.getElementById('news-container');\n \/\/ The base URL of your WordPress site\n const siteUrl = 'https:\/\/seeallacademy.com';\n \n try {\n \/\/ Fetch the latest 12 posts (no need for _embed since we aren't pulling images)\n const response = await fetch(`${siteUrl}\/wp-json\/wp\/v2\/posts?per_page=12`);\n \n if (!response.ok) {\n throw new Error('Network response was not ok');\n }\n \n const posts = await response.json();\n\n \/\/ Clear the loading spinner\n newsContainer.innerHTML = '';\n\n if (!posts || posts.length === 0) {\n newsContainer.innerHTML = `\n <div class=\"error-message\">\n <p>No recent news found. Please check back later!<\/p>\n <\/div>\n `;\n return;\n }\n\n \/\/ Loop through posts and build HTML\n let html = '';\n posts.forEach(post => {\n \/\/ Format Date\n const dateObj = new Date(post.date);\n const formattedDate = dateObj.toLocaleDateString('en-US', {\n year: 'numeric',\n month: 'long',\n day: 'numeric'\n });\n\n \/\/ Generate Card\n html += `\n <article class=\"news-card\">\n <div class=\"news-content\">\n <span class=\"news-date\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"><\/line><line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"><\/line><line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"><\/line><\/svg>\n ${formattedDate}\n <\/span>\n <h3 class=\"news-title\">\n <a href=\"${post.link}\">${post.title.rendered}<\/a>\n <\/h3>\n <div class=\"news-content-scroll\">\n ${post.content.rendered}\n <\/div>\n <a href=\"${post.link}\" class=\"read-more\" aria-label=\"Read more about ${post.title.rendered.replace(\/<[^>]*>?\/gm, '')}\">\n Go To Post Page →\n <\/a>\n <\/div>\n <\/article>\n `;\n });\n\n \/\/ Inject the generated cards into the grid\n newsContainer.innerHTML = html;\n\n } catch (error) {\n console.error('Error fetching WP news:', error);\n newsContainer.innerHTML = `\n <div class=\"error-message\">\n <p>We're having trouble loading the latest news right now. Please try refreshing the page later.<\/p>\n <\/div>\n `;\n }\n });\n <\/script>\n<\/body>\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>News & Announcements | The SEEALL Academy News & Announcements Stay up to date with the latest events, updates, and community news from The SEEALL <a href=\"https:\/\/seeallacademy.com\/?page_id=381\">…<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-381","page","type-page","status-publish","hentry","odd"],"_links":{"self":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/381","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/seeallacademy.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=381"}],"version-history":[{"count":0,"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/381\/revisions"}],"wp:attachment":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=381"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\n\n\n \n \n News & Announcements | The SEEALL Academy<\/title>\n <style>\n \/* Base Styles & Resets *\/\n body {\n margin: 0;\n padding: 0;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n background-color: #f8f9fa;\n color: #333;\n line-height: 1.6;\n }\n\n * {\n box-sizing: border-box;\n }\n\n \/* Page Header *\/\n .page-header {\n background: linear-gradient(135deg, #001528 0%, #005a9c 100%);\n padding: 4rem 2rem;\n text-align: center;\n border-bottom: 8px solid #F9B000;\n }\n\n .page-header h1 {\n color: #ffffff;\n font-size: 3rem;\n font-weight: 800;\n margin: 0 0 0.5rem 0;\n letter-spacing: -0.5px;\n text-shadow: 2px 2px 8px rgba(0,0,0,0.4);\n }\n\n .page-header p {\n color: #e6f0f7;\n font-size: 1.2rem;\n margin: 0 auto;\n max-width: 600px;\n }\n\n .accent-line {\n width: 60px;\n height: 6px;\n background-color: #F9B000;\n margin: 1.5rem auto 0 auto;\n border-radius: 3px;\n }\n\n \/* Main Container *\/\n .container {\n max-width: 1300px;\n margin: 0 auto;\n padding: 4rem 1.5rem;\n }\n\n \/* Loading State *\/\n .loading-state {\n text-align: center;\n padding: 4rem;\n color: #005a9c;\n font-size: 1.2rem;\n font-weight: 600;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 15px;\n }\n\n .spinner {\n width: 40px;\n height: 40px;\n border: 4px solid rgba(0, 90, 156, 0.2);\n border-left-color: #F9B000;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n }\n\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n\n \/* News Grid *\/\n .news-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 2.5rem;\n }\n\n \/* Individual News Card *\/\n .news-card {\n background: #ffffff;\n border-radius: 12px;\n overflow: hidden;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.05);\n display: flex;\n flex-direction: column;\n transition: transform 0.3s ease, box-shadow 0.3s ease;\n border-bottom: 5px solid transparent;\n }\n\n .news-card:hover {\n transform: translateY(-8px);\n box-shadow: 0 15px 35px rgba(0, 90, 156, 0.12);\n border-bottom-color: #F9B000;\n }\n\n \/* Card Content *\/\n .news-content {\n padding: 2.5rem;\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n\n .news-date {\n font-size: 0.85rem;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: #888;\n font-weight: 700;\n margin-bottom: 0.8rem;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n .news-date svg {\n color: #F9B000;\n }\n\n .news-title {\n margin: 0 0 1rem 0;\n font-size: 1.4rem;\n line-height: 1.3;\n }\n\n .news-title a {\n color: #005a9c;\n text-decoration: none;\n transition: color 0.2s ease;\n }\n\n .news-title a:hover {\n color: #F9B000;\n }\n\n .news-content-scroll {\n color: #555;\n font-size: 1rem;\n margin-bottom: 1.5rem;\n max-height: 300px; \/* Adjust this height to make the scroll area taller or shorter *\/\n overflow-y: auto;\n padding-right: 10px;\n }\n\n \/* Custom scrollbar for the news content *\/\n .news-content-scroll::-webkit-scrollbar {\n width: 6px;\n }\n .news-content-scroll::-webkit-scrollbar-track {\n background: #f8f9fa;\n border-radius: 4px;\n }\n .news-content-scroll::-webkit-scrollbar-thumb {\n background: #cbd5e1;\n border-radius: 4px;\n }\n .news-content-scroll::-webkit-scrollbar-thumb:hover {\n background: #94a3b8;\n }\n\n .news-content-scroll p {\n margin-top: 0;\n }\n \n \/* Ensures images inside the full post don't break the layout *\/\n .news-content-scroll img, \n .news-content-scroll figure {\n max-width: 100%;\n height: auto;\n margin: 10px 0;\n }\n\n \/* Fixes WordPress Embeds & Iframes so they do not collapse *\/\n .news-content-scroll iframe {\n width: 100%;\n min-height: 350px;\n border: none;\n border-radius: 8px;\n margin: 10px 0;\n background-color: #eee;\n }\n\n \/* WordPress specific embed wrappers *\/\n .news-content-scroll .wp-block-embed__wrapper {\n position: relative;\n width: 100%;\n margin: 10px 0;\n }\n\n .read-more {\n margin-top: auto;\n display: inline-flex;\n align-items: center;\n gap: 5px;\n font-size: 0.95rem;\n font-weight: 700;\n color: #005a9c;\n text-decoration: none;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n transition: color 0.2s ease;\n }\n\n .read-more:hover {\n color: #F9B000;\n }\n\n \/* No Results \/ Error *\/\n .error-message {\n grid-column: 1 \/ -1;\n text-align: center;\n padding: 3rem;\n background: #ffffff;\n border-radius: 12px;\n color: #555;\n font-size: 1.1rem;\n }\n\n \/* Responsive *\/\n @media (max-width: 900px) {\n .news-grid { grid-template-columns: 1fr; }\n }\n\n @media (max-width: 768px) {\n .page-header h1 { font-size: 2.2rem; }\n .container { padding: 3rem 1.2rem; }\n .news-grid { gap: 1.5rem; }\n .news-content { padding: 1.5rem; }\n }\n <\/style>\n<\/head>\n<body>\n\n \n <header class=\"page-header\">\n <h1>News & Announcements<\/h1>\n <p>Stay up to date with the latest events, updates, and community news from The SEEALL Academy.<\/p>\n <div class=\"accent-line\"><\/div>\n <\/header>\n\n <main class=\"container\">\n \n \n <div class=\"news-grid\" id=\"news-container\">\n \n <div class=\"loading-state\" id=\"loading-indicator\">\n <div class=\"spinner\"><\/div>\n Fetching the latest updates...\n <\/div>\n <\/div>\n\n <\/main>\n\n \n <script>\n document.addEventListener('DOMContentLoaded', async () => {\n const newsContainer = document.getElementById('news-container');\n \/\/ The base URL of your WordPress site\n const siteUrl = 'https:\/\/seeallacademy.com';\n \n try {\n \/\/ Fetch the latest 12 posts (no need for _embed since we aren't pulling images)\n const response = await fetch(`${siteUrl}\/wp-json\/wp\/v2\/posts?per_page=12`);\n \n if (!response.ok) {\n throw new Error('Network response was not ok');\n }\n \n const posts = await response.json();\n\n \/\/ Clear the loading spinner\n newsContainer.innerHTML = '';\n\n if (!posts || posts.length === 0) {\n newsContainer.innerHTML = `\n <div class=\"error-message\">\n <p>No recent news found. Please check back later!<\/p>\n <\/div>\n `;\n return;\n }\n\n \/\/ Loop through posts and build HTML\n let html = '';\n posts.forEach(post => {\n \/\/ Format Date\n const dateObj = new Date(post.date);\n const formattedDate = dateObj.toLocaleDateString('en-US', {\n year: 'numeric',\n month: 'long',\n day: 'numeric'\n });\n\n \/\/ Generate Card\n html += `\n <article class=\"news-card\">\n <div class=\"news-content\">\n <span class=\"news-date\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"><\/line><line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"><\/line><line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"><\/line><\/svg>\n ${formattedDate}\n <\/span>\n <h3 class=\"news-title\">\n <a href=\"${post.link}\">${post.title.rendered}<\/a>\n <\/h3>\n <div class=\"news-content-scroll\">\n ${post.content.rendered}\n <\/div>\n <a href=\"${post.link}\" class=\"read-more\" aria-label=\"Read more about ${post.title.rendered.replace(\/<[^>]*>?\/gm, '')}\">\n Go To Post Page →\n <\/a>\n <\/div>\n <\/article>\n `;\n });\n\n \/\/ Inject the generated cards into the grid\n newsContainer.innerHTML = html;\n\n } catch (error) {\n console.error('Error fetching WP news:', error);\n newsContainer.innerHTML = `\n <div class=\"error-message\">\n <p>We're having trouble loading the latest news right now. Please try refreshing the page later.<\/p>\n <\/div>\n `;\n }\n });\n <\/script>\n<\/body>\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>News & Announcements | The SEEALL Academy News & Announcements Stay up to date with the latest events, updates, and community news from The SEEALL <a href=\"https:\/\/seeallacademy.com\/?page_id=381\">…<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-381","page","type-page","status-publish","hentry","odd"],"_links":{"self":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/381","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/seeallacademy.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=381"}],"version-history":[{"count":0,"href":"https:\/\/seeallacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/381\/revisions"}],"wp:attachment":[{"href":"https:\/\/seeallacademy.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=381"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}