{"id":1313,"date":"2023-06-15T13:28:46","date_gmt":"2023-06-15T04:28:46","guid":{"rendered":"https:\/\/smart-web.tokyo\/s2024\/?page_id=1313"},"modified":"2023-06-16T03:37:15","modified_gmt":"2023-06-15T18:37:15","slug":"s030","status":"publish","type":"page","link":"https:\/\/smart-web.tokyo\/s2024\/s030\/","title":{"rendered":"s030"},"content":{"rendered":"<div class=\"section one\">\n<h1>Hello world<\/h1>\n<p>Who doesn&#8217;t want a few more gentle calming waves in their life?<\/p>\n<p>This pen is using SVG to create wavy dividers between sections &#8211; the curve of the SVG alternates to opposite sides as you scroll down.<\/p>\n<\/p><\/div>\n<p>  <svg class=\"one\" viewBox=\"0 0 1443 328\" fill=\"none\" preserveAspectRatio=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n    <path d=\"M1443 200.5C1164.5-26.5 198 578 .5 200.5V0H1443v200.5z\" fill=\"var(--background)\" \/><\/svg><\/p>\n<div class=\"section two\">\n<h2>I&#8217;m a sub-heading<\/h2>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet quam vitae orci suscipit placerat. Quisque vel felis luctus libero rutrum congue quis vitae urna. Cras mollis quis erat ut sollicitudin. Nullam dignissim iaculis sem, at fermentum ligula accumsan malesuada. Pellentesque ut sapien ac libero blandit sagittis id a lacus. Proin eget lacinia tellus, a gravida dolor.<\/p>\n<p> Fusce pharetra ipsum vel elit sollicitudin luctus. Aenean venenatis est lacinia metus rhoncus varius. Nulla et mauris ac elit porta aliquet. Integer lacinia, diam fringilla pulvinar interdum, purus eros accumsan est, sit amet pretium tellus urna ut purus. Vivamus ac varius neque. Etiam sagittis finibus orci. Proin in volutpat neque. Vivamus maximus libero at nibh efficitur, sed luctus augue bibendum. Mauris justo arcu, molestie eget luctus a, elementum varius felis.<\/p>\n<\/p><\/div>\n<p>  <svg class=\"two\" viewBox=\"0 0 1440 328\" preserveAspectRatio=\"none\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n    <path d=\"M0 200.5c278.5-227 1245 377.5 1442.5 0V0H0v200.5z\" fill=\"var(--background)\" \/><\/svg><\/p>\n<div class=\"section three\">\n<h2>I&#8217;m a sub-heading too!<\/h2>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet quam vitae orci suscipit placerat. Quisque vel felis luctus libero rutrum congue quis vitae urna. Cras mollis quis erat ut sollicitudin. Nullam dignissim iaculis sem, at fermentum ligula accumsan malesuada. Pellentesque ut sapien ac libero blandit sagittis id a lacus. Proin eget lacinia tellus, a gravida dolor. <\/p>\n<p> Fusce pharetra ipsum vel elit sollicitudin luctus. Aenean venenatis est lacinia metus rhoncus varius. Nulla et mauris ac elit porta aliquet. Integer lacinia, diam fringilla pulvinar interdum, purus eros accumsan est, sit amet pretium tellus urna ut purus. Vivamus ac varius neque. Etiam sagittis finibus orci. Proin in volutpat neque. Vivamus maximus libero at nibh efficitur, sed luctus augue bibendum. Mauris justo arcu, molestie eget luctus a, elementum varius felis.<\/p>\n<\/p><\/div>\n<p>  <svg class=\"three\" viewBox=\"0 0 1443 328\" fill=\"none\" preserveAspectRatio=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n    <path d=\"M1443 200.5C1164.5-26.5 198 578 .5 200.5V0H1443v200.5z\" fill=\"var(--background)\" \/><\/svg><\/p>\n<div class=\"section four\">\n<h2>Hi again<\/h2>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet quam vitae orci suscipit placerat. Quisque vel felis luctus libero rutrum congue quis vitae urna. Cras mollis quis erat ut sollicitudin. Nullam dignissim iaculis sem, at fermentum ligula accumsan malesuada. Pellentesque ut sapien ac libero blandit sagittis id a lacus. Proin eget lacinia tellus, a gravida dolor. Fusce pharetra ipsum vel elit sollicitudin luctus. Aenean venenatis est lacinia metus rhoncus varius. Nulla et mauris ac elit porta aliquet. Integer lacinia, diam fringilla pulvinar interdum, purus eros accumsan est, sit amet pretium tellus urna ut purus. Vivamus ac varius neque. Etiam sagittis finibus orci. Proin in volutpat neque. Vivamus maximus libero at nibh efficitur, sed luctus augue bibendum. Mauris justo arcu, molestie eget luctus a, elementum varius felis.<\/p>\n<\/p><\/div>\n<p><iframe class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" title=\"SVG Wave Dividers\" src=\"https:\/\/codepen.io\/aitchiss\/embed\/preview\/eYZWqVa?default-tabs=html%2Cresult&#038;height=300&#038;host=https%3A%2F%2Fcodepen.io&#038;slug-hash=eYZWqVa#?secret=eWouXp4sGq\" data-secret=\"eWouXp4sGq\" scrolling=\"no\" frameborder=\"0\" height=\"300\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hello world Who doesn&#8217;t  &#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1313","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/pages\/1313","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/comments?post=1313"}],"version-history":[{"count":4,"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/pages\/1313\/revisions"}],"predecessor-version":[{"id":1317,"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/pages\/1313\/revisions\/1317"}],"wp:attachment":[{"href":"https:\/\/smart-web.tokyo\/s2024\/wp-json\/wp\/v2\/media?parent=1313"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}