{"id":16763,"date":"2019-03-05T11:47:44","date_gmt":"2019-03-05T11:47:44","guid":{"rendered":"https:\/\/webartdevelopers.com\/blog\/?p=16763"},"modified":"2021-09-25T07:11:57","modified_gmt":"2021-09-25T07:11:57","slug":"material-ui-popup","status":"publish","type":"post","link":"https:\/\/webartdevelopers.com\/blog\/material-ui-popup\/","title":{"rendered":"MATERIAL UI POPUP"},"content":{"rendered":"\n<h4 class=\"wp-block-heading\"><strong><u><em>Author:<\/em><\/u><\/strong><\/h4>\n\n\n\n<ul><li>Mikael Ainalem<\/li><li>November 27, 2018<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\"><strong><u><em>Made with:<\/em><\/u><\/strong><\/h4>\n\n\n\n<ul><li>HTML \/ CSS<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\"><strong><u><em>About the code:<\/em><\/u><\/strong><\/h4>\n\n\n\n<p>This is a nice and simple Modal created using HTML and CSS. Easing is not easy! However, with the right easing from the Material Design guidelines, you get punchy and snappy animations.<\/p>\n\n\n\n<p><strong><em>Compatible browsers:<\/em><\/strong> Chrome, Edge, Firefox, Opera, Safari<\/p>\n\n\n\n<p><strong><em>Responsive:<\/em><\/strong> Yes<\/p>\n\n\n\n<p><strong><em>Dependencies:<\/em><\/strong> &#8211;<\/p>\n\n\n<a href=\"https:\/\/codepen.io\/ainalem\/share\/zip\/RqYZNO\" class=\"su-button su-button-style-default\" style=\"color:#ffffff;background-color:#000000;border-color:#000000;border-radius:40px\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color:#ffffff;padding:0px 20px;font-size:16px;line-height:32px;border-color:#4d4d4d;border-radius:40px;text-shadow:none\"> Download<\/span><\/a>\n\n\n<a href=\"https:\/\/codepen.io\/ainalem\/pen\/RqYZNO\" class=\"su-button su-button-style-default\" style=\"color:#ffffff;background-color:#000000;border-color:#000000;border-radius:40px\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color:#ffffff;padding:0px 20px;font-size:16px;line-height:32px;border-color:#4d4d4d;border-radius:40px;text-shadow:none\"> Demo and Code<\/span><\/a>\n<!-- AddThis Advanced Settings generic via filter on the_content -->","protected":false},"excerpt":{"rendered":"Author: Mikael Ainalem November 27, 2018 Made with: HTML \/ CSS About the code: This is a nice and simple Modal created using HTML and CSS. Easing is not easy! However, with the right easing from the Material Design guidelines, you get punchy and snappy animations. Compatible browsers: Chrome, Edge, Firefox, Opera, Safari Responsive: Yes Dependencies: &#8211;<!-- AddThis Advanced Settings generic via filter on get_the_excerpt -->","protected":false},"author":1,"featured_media":16764,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2780],"tags":[20,2790,4887,4890],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts\/16763"}],"collection":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/comments?post=16763"}],"version-history":[{"count":2,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts\/16763\/revisions"}],"predecessor-version":[{"id":29257,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts\/16763\/revisions\/29257"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/media\/16764"}],"wp:attachment":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/media?parent=16763"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/categories?post=16763"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/tags?post=16763"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}