Bot\u00e3o \u00cdcone Toggle Portf\u00f3lio Animado<\/title>\r\n <style>\r\n \/* Estilo do Bot\u00e3o como \u00cdcone Puro *\/\r\n .btn-toggle {\r\n \/* Remove todo fundo, borda e texto *\/\r\n background: transparent;\r\n border: none;\r\n padding: 0;\r\n cursor: pointer;\r\n display: block; \/* Ocupa a largura necess\u00e1ria para o SVG *\/\r\n outline: none; \/* Remove o contorno padr\u00e3o de foco *\/\r\n }\r\n\r\n \/* Estilo do SVG (Seta e C\u00edrculo) *\/\r\n .seta {\r\n \/* Define o tamanho do \u00edcone *\/\r\n width: 32px;\r\n height: 32px;\r\n \/* Suaviza o movimento de rota\u00e7\u00e3o *\/\r\n transition: transform 0.3s ease; \r\n \/* Posi\u00e7\u00e3o padr\u00e3o (fechado): aponta para a direita, sem classe .aberto *\/\r\n transform: rotate(0deg); \r\n }\r\n\r\n \/* Estiliza\u00e7\u00e3o interna do SVG *\/\r\n .seta .circulo {\r\n fill: #808080; \/* C\u00edrculo cinza *\/\r\n }\r\n\r\n .seta .triangulo {\r\n fill: white; \/* Tri\u00e2ngulo branco *\/\r\n }\r\n\r\n \/* Quando o bot\u00e3o tiver a classe \"aberto\", o SVG gira 90 graus (aponta para baixo) *\/\r\n .btn-toggle.aberto .seta {\r\n transform: rotate(90deg);\r\n }\r\n\r\n \/* --- ESTRUTURA PARA ANIMA\u00c7\u00c3O DE DESLIZAMENTO (ACCORDION) --- *\/\r\n #bloco-rodrigo {\r\n display: grid !important;\r\n grid-template-rows: 1fr !important; \/* 1fr = Totalmente expandido *\/\r\n transition: grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;\r\n }\r\n\r\n #bloco-rodrigo.fechado {\r\n grid-template-rows: 0fr !important; \/* 0fr = Totalmente colapsado *\/\r\n \/*display: none !important;*\/\r\n }\r\n\r\n .portifolio-rodrigo {\r\n overflow: hidden !important; \/* Corta o conte\u00fado vis\u00edvel durante a anima\u00e7\u00e3o *\/\r\n }\r\n\r\n \/* Estilo do bloco de conte\u00fado *\/\r\n .portifolio-rodrigo {\r\n \/*margin-top: 15px;*\/\r\n \/*padding: 20px;*\/\r\n \/*background-color: #f8f9fa;*\/\r\n \/*border: 1px solid #dee2e6;*\/\r\n \/*border-radius: 5px;*\/\r\n \/*max-width: 500px;*\/\r\n opacity: 1;\r\n transition: opacity 0.3s ease;\r\n }\r\n\r\n \/* Transi\u00e7\u00e3o suave de opacidade ao fechar *\/\r\n #bloco-rodrigo.fechado .portifolio-rodrigo {\r\n opacity: 0 !important;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <button id=\"btn-toggle-rodrigo\" class=\"btn-toggle aberto\" onclick=\"togglePortifolio()\">\r\n \r\n <svg class=\"seta\" viewBox=\"0 0 100 100\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <circle class=\"circulo\" cx=\"50\" cy=\"50\" r=\"45\"\/>\r\n <polygon class=\"triangulo\" points=\"75,50 25,25 25,75\"\/>\r\n <\/svg>\r\n <\/button>\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n <script>\r\n function togglePortifolio() {\r\n const wrapper = document.getElementById('bloco-rodrigo');\r\n console.log(wrapper);\r\n const botao = document.getElementById('btn-toggle-rodrigo');\r\n\r\n \/\/ Alterna a anima\u00e7\u00e3o de abrir\/fechar o bloco (wrapper)\r\n wrapper.classList.toggle('fechado');\r\n \r\n \/\/ Alterna a rota\u00e7\u00e3o do \u00edcone de seta no bot\u00e3o\r\n botao.classList.toggle('aberto');\r\n }\r\n <\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<p class=\"e-954f80a-12ff870 e-paragraph-base\" data-interaction-id=\"954f80a\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum<\/p>\n\t\t<div class=\"elementor-element elementor-element-fc98b3f e-con e-atomic-element e-div-block-base g-6df6a49 \" data-id=\"fc98b3f\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"fc98b3f\" id=\"bloco-rodrigo\">\n <div class=\"elementor-element elementor-element-da36d1e e-con e-atomic-element e-div-block-base portifolio-rodrigo \" data-id=\"da36d1e\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"da36d1e\">\n \t\t\t<p class=\"e-e68d486-0b26c01 e-paragraph-base\" data-interaction-id=\"e68d486\"><a target=\"_blank\" href=\"https:\/\/nerdstickers.com.br\/seja-um-artista\/?srsltid=AfmBOorv7MV0H33LzFwW4gspxqPRgPFoaUQ67Mt_hpFtBPu2Hlcb2jMd\" id=\"e-mtoo5ln0-qgi1pg2\"><strong id=\"e-mtoo5ln0-ww20kkd\">Cole\u00e7\u00e3o Alongados<\/strong><\/a><\/p>\n\t\t\t\t<div class=\"elementor-element elementor-element-e45c1a8 elementor-widget elementor-widget-shortcode\" data-id=\"e45c1a8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><style type=\"text\/css\">\n#foogallery-gallery-1169.fg-simple_portfolio { justify-content: center; --fg-gutter: 5px; }\n#foogallery-gallery-1169.fg-simple_portfolio .fg-item { flex-basis: 250px; }<\/style>\n\t\t\t<div class=\"foogallery foogallery-container foogallery-simple_portfolio foogallery-lightbox-foogallery fg-simple_portfolio fg-ready fg-dark fg-border-thin fg-loading-default fg-loaded-swing-down fg-caption-always fg-hover-slide-down fg-hover-zoom2 fg-c-c fg-no-js fg-caption-always\" id=\"foogallery-gallery-1169\" data-foogallery=\"{"panel":{"buttons":{"download":false}},"item":{"showCaptionTitle":true,"showCaptionDescription":true},"lazy":true,"src":"src","srcset":"srcset","paging":{"type":"dots","size":20,"position":"bottom","scrollToTop":false,"output":""}}\" data-foogallery-lightbox=\"{"thumbs":"bottom","thumbsCaptions":false,"thumbsBestFit":false,"thumbsSmall":false,"thumbsCaptionsAlign":"default","info":"bottom","infoVisible":true,"infoOverlay":true,"infoAlign":"default","transition":"fade","hoverButtons":false,"fitMedia":false,"noScrollbars":true,"preserveButtonSpace":true,"buttons":{"fullscreen":true,"info":true,"thumbs":false,"download":false},"video":{"autoPlay":true}}\" style=\"--fg-title-line-clamp: 1; --fg-description-line-clamp: 1;\" >\n\t<div class=\"fg-item fg-type-image fg-loading\"><figure class=\"fg-item-inner\"><a href=\"https:\/\/www.emporiocarcara.com.br\/wp-content\/uploads\/2026\/08\/st.png\" target=\"_self\" data-caption-title=\"Caveiras amarelas\" data-caption-desc=\"XPTO aa x bb\" data-attachment-id=\"1063\" class=\"foogallery-thumb fg-thumb\" data-type=\"image\"><span class=\"fg-image-wrap\"><img loading=\"lazy\" src=\"https:\/\/www.emporiocarcara.com.br\/wp-content\/uploads\/cache\/2026\/08\/st\/2199735096.png\" alt=\"teste\" title=\"XPTO aa x bb\" class=\"bf-img skip-lazy fg-image\" height=\"200\" width=\"250\" decoding=\"async\" loading=\"lazy\"><\/span><span class=\"fg-image-overlay\"><\/span><\/a><figcaption class=\"fg-caption\"><div class=\"fg-caption-inner\"><div class=\"fg-caption-title\">Caveiras amarelas<\/div><div class=\"fg-caption-desc\">XPTO aa x bb<\/div><\/div><\/figcaption><\/figure><div class=\"fg-loader\"><\/div><\/div><div class=\"fg-item fg-type-image fg-loading\"><figure class=\"fg-item-inner\"><a href=\"https:\/\/www.emporiocarcara.com.br\/wp-content\/uploads\/2026\/08\/nuvem.png\" data-caption-title=\"Cabe\u00e7a nas Nuvens\" data-caption-desc=\"Omni aa x bb\" data-attachment-id=\"1053\" class=\"foogallery-thumb fg-thumb\" data-type=\"image\"><span class=\"fg-image-wrap\"><img loading=\"lazy\" src=\"https:\/\/www.emporiocarcara.com.br\/wp-content\/uploads\/cache\/2026\/08\/nuvem\/1639713242.png\" alt=\"nuvem\" title=\"Omni aa x bb\" class=\"bf-img skip-lazy fg-image\" height=\"200\" width=\"250\" decoding=\"async\" loading=\"lazy\"><\/span><span class=\"fg-image-overlay\"><\/span><\/a><figcaption class=\"fg-caption\"><div class=\"fg-caption-inner\"><div class=\"fg-caption-title\">Cabe\u00e7a nas Nuvens<\/div><div class=\"fg-caption-desc\">Omni aa x bb<\/div><\/div><\/figcaption><\/figure><div class=\"fg-loader\"><\/div><\/div><\/div>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<p class=\"e-96eb1ff-4fac7f1 e-paragraph-base\" data-interaction-id=\"96eb1ff\"><a target=\"_blank\" href=\"https:\/\/nerdstickers.com.br\/seja-um-artista\/?srsltid=AfmBOorv7MV0H33LzFwW4gspxqPRgPFoaUQ67Mt_hpFtBPu2Hlcb2jMd\" id=\"e-mtoo6ou7-u6jo5i3\"><strong id=\"e-mtoo6ou7-pn549p2\">Cole\u00e7\u00e3o Retratos<\/strong><\/a><\/p>\n\t\t\t\t<div class=\"elementor-element elementor-element-43d31f1 elementor-widget elementor-widget-shortcode\" data-id=\"43d31f1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><style type=\"text\/css\">\n#foogallery-gallery-1183.fg-simple_portfolio { justify-content: center; --fg-gutter: 5px; }\n#foogallery-gallery-1183.fg-simple_portfolio .fg-item { flex-basis: 250px; }<\/style>\n\t\t\t<div class=\"foogallery foogallery-container foogallery-simple_portfolio foogallery-lightbox-foogallery fg-simple_portfolio fg-ready fg-dark fg-border-thin fg-loading-default fg-loaded-swing-down fg-caption-always fg-hover-slide-down fg-hover-zoom2 fg-c-c fg-no-js fg-caption-always\" id=\"foogallery-gallery-1183\" data-foogallery=\"{"panel":{"buttons":{"download":false}},"item":{"showCaptionTitle":true,"showCaptionDescription":true},"lazy":true,"src":"src","srcset":"srcset","paging":{"type":"dots","size":20,"position":"bottom","scrollToTop":false,"output":""}}\" data-foogallery-lightbox=\"{"thumbs":"bottom","thumbsCaptions":false,"thumbsBestFit":false,"thumbsSmall":false,"thumbsCaptionsAlign":"default","info":"bottom","infoVisible":true,"infoOverlay":true,"infoAlign":"default","transition":"fade","hoverButtons":false,"fitMedia":false,"noScrollbars":true,"preserveButtonSpace":true,"buttons":{"fullscreen":true,"info":true,"thumbs":false,"download":false},"video":{"autoPlay":true}}\" style=\"--fg-title-line-clamp: 1; --fg-description-line-clamp: 1;\" >\n\t<div class=\"fg-item fg-type-image fg-loading\"><figure class=\"fg-item-inner\"><a href=\"https:\/\/www.emporiocarcara.com.br\/wp-content\/uploads\/2026\/08\/IMG-20260614-WA0025.jpg\" data-caption-title=\"Rodrigo\" data-caption-desc=\"Testando\" data-attachment-id=\"1080\" class=\"foogallery-thumb fg-thumb\" data-type=\"image\"><span class=\"fg-image-wrap\"><img loading=\"lazy\" src=\"https:\/\/www.emporiocarcara.com.br\/wp-content\/uploads\/cache\/2026\/08\/IMG-20260614-WA0025\/2342495492.jpg\" title=\"Testando\" class=\"bf-img skip-lazy fg-image\" height=\"200\" width=\"250\" decoding=\"async\" loading=\"lazy\"><\/span><span class=\"fg-image-overlay\"><\/span><\/a><figcaption class=\"fg-caption\"><div class=\"fg-caption-inner\"><div class=\"fg-caption-title\">Rodrigo<\/div><div class=\"fg-caption-desc\">Testando<\/div><\/div><\/figcaption><\/figure><div class=\"fg-loader\"><\/div><\/div><\/div>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Rodrigo Lisboa Bot\u00e3o \u00cdcone Toggle Portf\u00f3lio Animado Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore […]<\/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-1118","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=\/wp\/v2\/pages\/1118","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1118"}],"version-history":[{"count":144,"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=\/wp\/v2\/pages\/1118\/revisions"}],"predecessor-version":[{"id":1397,"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=\/wp\/v2\/pages\/1118\/revisions\/1397"}],"wp:attachment":[{"href":"https:\/\/www.emporiocarcara.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1118"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}