{"id":2598,"date":"2026-06-16T13:11:29","date_gmt":"2026-06-16T13:11:29","guid":{"rendered":"https:\/\/app.digitalfreelancer.org\/?page_id=2598"},"modified":"2026-06-22T18:04:05","modified_gmt":"2026-06-22T18:04:05","slug":"dashboard-leitura","status":"publish","type":"page","link":"https:\/\/app.digitalfreelancer.org\/index.php\/dashboard-leitura\/","title":{"rendered":"Dashboard Leitura+"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2598\" class=\"elementor elementor-2598\">\n\t\t\t\t<div class=\"elementor-element elementor-element-78d0188 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"78d0188\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c5f0bdc elementor-widget elementor-widget-shortcode\" data-id=\"c5f0bdc\" 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\">        <div id=\"lr-1-tNKvWo\" class=\"lr-wrap\">\n                    <style>\n        #lr-1-tNKvWo {\n            --lr-bg: linear-gradient(135deg, #1f1f1f, #2c2c2c);\n            --lr-card-bg: #2b2b2b;\n            --lr-text: #ddd;\n            --lr-muted: #aaa;\n            --lr-border: #3a3a3a;\n            --lr-silver: #c0c0c0;\n            --lr-bordeaux: #b0003a;\n            all: initial;\n            * { box-sizing: border-box; }\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n            color: var(--lr-text);\n            background: var(--lr-bg);\n            display: block;\n            padding: 24px;\n            border-radius: 20px;\n            box-shadow: 0 10px 30px rgba(0,0,0,0.4);\n            animation: lrFadeIn 0.5s ease-in-out;\n            max-width: 1280px;\n            margin: 0 auto;\n        }\n\n        #lr-1-tNKvWo button, \n        #lr-1-tNKvWo input,\n        #lr-1-tNKvWo select, \n        #lr-1-tNKvWo textarea {\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n            font-size: 14px;\n            color: var(--lr-text);\n            outline: none;\n        }\n\n        @keyframes lrFadeIn {\n            from { opacity: 0; transform: translateY(10px); }\n            to { opacity: 1; transform: translateY(0); }\n        }\n\n        \/* HEADER *\/\n        #lr-1-tNKvWo .lr-header {\n            display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 12px;\n        }\n        #lr-1-tNKvWo .lr-header h2 { margin: 0; color: var(--lr-silver); font-size: 26px; }\n        #lr-1-tNKvWo .lr-header p { color: var(--lr-muted); margin: 4px 0 0 0; font-size: 14px; }\n\n        \/* STATS *\/\n        #lr-1-tNKvWo .lr-stats {\n            display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin: 20px 0;\n        }\n\n        \/* GRID & BOTTOM *\/\n        #lr-1-tNKvWo .lr-grid {\n            display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 15px;\n        }\n        #lr-1-tNKvWo .lr-bottom {\n            display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 15px; margin-top: 20px;\n        }\n\n        \/* CARD *\/\n        #lr-1-tNKvWo .lr-card {\n            background: var(--lr-card-bg); border: 1px solid var(--lr-border); border-radius: 14px;\n            padding: 18px; box-shadow: 0 4px 14px rgba(0,0,0,0.3); transition: 0.25s ease;\n            display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden;\n        }\n        #lr-1-tNKvWo .lr-card:hover {\n            transform: translateY(-4px); box-shadow: 0 14px 28px rgba(192,192,192,0.1); border-color: var(--lr-bordeaux);\n        }\n        #lr-1-tNKvWo .lr-card h3 {\n            margin-top: 0; color: var(--lr-silver); font-size: 16px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;\n        }\n\n        \/* STAT CARDS *\/\n        #lr-1-tNKvWo .lr-card.stat {\n            text-align: center; border-left: 3px solid var(--lr-silver); display: block;\n        }\n        #lr-1-tNKvWo .lr-card.stat h3 { font-size: 13px; color: var(--lr-muted); justify-content: center; margin-bottom: 6px; }\n        #lr-1-tNKvWo .lr-card.stat strong { color: var(--lr-bordeaux); font-size: 24px; }\n\n        \/* INPUTS *\/\n        #lr-1-tNKvWo input, \n        #lr-1-tNKvWo select {\n            width: 100%; margin: 6px 0; padding: 10px 12px; border-radius: 10px; border: 1px solid #444; background: #1f1f1f; color: var(--lr-text); transition: 0.2s;\n        }\n        #lr-1-tNKvWo input:focus, \n        #lr-1-tNKvWo select:focus {\n            border-color: var(--lr-bordeaux); box-shadow: 0 0 0 3px rgba(176,0,58,0.2);\n        }\n\n        \/* BUTTONS *\/\n        #lr-1-tNKvWo button {\n            width: 100%; margin-top: 8px; padding: 11px; border: none; border-radius: 10px;\n            background: linear-gradient(135deg, var(--lr-bordeaux), var(--lr-silver)); color: white; font-weight: bold; cursor: pointer; transition: 0.25s; text-align: center;\n        }\n        #lr-1-tNKvWo button:hover {\n            transform: scale(1.02); box-shadow: 0 10px 22px rgba(176,0,58,0.25); filter: brightness(1.05);\n        }\n        #lr-1-tNKvWo button.secondary { background: #444; color: #ddd; }\n        #lr-1-tNKvWo button.secondary:hover { background: #555; }\n        #lr-1-tNKvWo .lr-btn-small { padding: 4px 8px; font-size: 11px; width: auto; margin: 0; }\n\n        \/* BOOK ITEMS *\/\n        #lr-1-tNKvWo .lr-book-container { max-height: 220px; overflow-y: auto; padding-right: 4px; margin-bottom: 8px; }\n        #lr-1-tNKvWo .book {\n            padding: 10px; border-bottom: 1px solid #444; transition: 0.2s; display: flex; justify-content: space-between; align-items: center; background: #242424; border-radius: 8px; margin-bottom: 6px;\n        }\n        #lr-1-tNKvWo .book:hover { transform: translateX(4px); color: var(--lr-silver); }\n        #lr-1-tNKvWo .book-info { flex: 1; }\n        #lr-1-tNKvWo .book strong { display: block; font-size: 14px; }\n        #lr-1-tNKvWo .book small { color: var(--lr-muted); font-size: 12px; }\n        #lr-1-tNKvWo .lr-book-delete { background: transparent; border: none; color: #ff6b6b; cursor: pointer; font-size: 12px; padding: 2px 6px; width: auto; margin: 0; }\n        #lr-1-tNKvWo .lr-book-delete:hover { background: #4a2020; transform: none; }\n\n        \/* PROGRESS BAR *\/\n        #lr-1-tNKvWo .progress {\n            height: 6px; background: #444; border-radius: 10px; overflow: hidden; margin-top: 6px;\n        }\n        #lr-1-tNKvWo .fill {\n            height: 100%; background: var(--lr-bordeaux); transition: width 0.4s ease; border-radius: 10px;\n        }\n\n        \/* LIST *\/\n        #lr-1-tNKvWo ul { padding-left: 18px; margin: 0; }\n        #lr-1-tNKvWo ul li { padding: 5px 0; transition: 0.2s; font-size: 13.5px; display: flex; justify-content: space-between; align-items: center; }\n        #lr-1-tNKvWo ul li:hover { color: var(--lr-bordeaux); transform: translateX(3px); }\n\n        \/* RESPONSIVE *\/\n        @media(max-width: 900px){\n            #lr-1-tNKvWo .lr-stats,\n            #lr-1-tNKvWo .lr-grid,\n            #lr-1-tNKvWo .lr-bottom {\n                grid-template-columns: 1fr;\n            }\n        }\n        <\/style>\n                            <div class=\"lr-wrap-inner\">\n            <!-- HEADER -->\n            <div class=\"lr-header\">\n                <div>\n                    <h2>\ud83d\udcda Leitura+ Pro<\/h2>\n                    <p>Organiza livros, leitura atual e wishlist pessoal<\/p>\n                <\/div>\n                <button class=\"secondary lr-btn-small\" data-lr-reset>Restaurar Dados<\/button>\n            <\/div>\n\n            <!-- STATS -->\n            <div class=\"lr-stats\">\n                <div class=\"lr-card stat\">\n                    <h3>Lidos<\/h3>\n                    <strong data-stat=\"read\">18<\/strong>\n                <\/div>\n                <div class=\"lr-card stat\">\n                    <h3>A ler<\/h3>\n                    <strong data-stat=\"reading\">3<\/strong>\n                <\/div>\n                <div class=\"lr-card stat\">\n                    <h3>Wishlist<\/h3>\n                    <strong data-stat=\"wishlist\">12<\/strong>\n                <\/div>\n                <div class=\"lr-card stat\">\n                    <h3>P\u00e1ginas este m\u00eas<\/h3>\n                    <strong data-stat=\"pages\">1,240<\/strong>\n                <\/div>\n            <\/div>\n\n            <!-- GRID -->\n            <div class=\"lr-grid\">\n\n                <!-- ADD BOOK -->\n                <div class=\"lr-card\">\n                    <h3><span>\u2795 Adicionar Livro<\/span><\/h3>\n                    <div class=\"lr-field\">\n                        <input type=\"text\" data-book-title placeholder=\"T\u00edtulo do livro\">\n                    <\/div>\n                    <div class=\"lr-field\">\n                        <input type=\"text\" data-book-author placeholder=\"Autor\">\n                    <\/div>\n                    <div class=\"lr-field\">\n                        <select data-book-status>\n                            <option value=\"reading\">A Ler<\/option>\n                            <option value=\"read\">Lido<\/option>\n                            <option value=\"wishlist\">Wishlist<\/option>\n                        <\/select>\n                    <\/div>\n                    <button data-book-add>Guardar Livro<\/button>\n                <\/div>\n\n                <!-- CURRENT READING -->\n                <div class=\"lr-card large\">\n                    <h3><span>\ud83d\udcd6 Em Leitura<\/span><\/h3>\n                    <div class=\"lr-book-container\" data-lr-reading-list>\n                        <!-- Preenchido via JS -->\n                    <\/div>\n                <\/div>\n\n                <!-- WISHLIST -->\n                <div class=\"lr-card\">\n                    <h3><span>\ud83e\udde0 Wishlist<\/span><\/h3>\n                    <ul data-lr-wishlist-ul>\n                        <!-- Preenchido via JS -->\n                    <\/ul>\n                <\/div>\n\n            <\/div>\n\n            <!-- BOTTOM -->\n            <div class=\"lr-bottom\">\n                <div class=\"lr-card\">\n                    <h3>\ud83d\udcca Estat\u00edsticas<\/h3>\n                    <p style=\"font-size: 13.5px; color: var(--lr-muted); margin: 0;\">Leitura consistente ao longo dos meses com foco em desenvolvimento pessoal.<\/p>\n                <\/div>\n\n                <div class=\"lr-card\">\n                    <h3>\ud83c\udfc6 Conquistas<\/h3>\n                    <p style=\"font-size: 13.5px; color: var(--lr-muted); margin: 0;\">\ud83d\udd25 7 dias seguidos a ler sem interrup\u00e7\u00f5es.<\/p>\n                <\/div>\n\n                <div class=\"lr-card\">\n                    <h3>\ud83c\udfaf Objetivo Anual<\/h3>\n                    <p style=\"font-size: 13.5px; color: var(--lr-muted); margin: 0;\">Terminar 24 livros este ano (meta a 75% conclu\u00edda).<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n                            <script>\n        (function(){\n            var root = document.getElementById(\"lr-1-tNKvWo\");\n            if (!root) return;\n            var STORAGE_KEY = 'leitura_plus_data_v2_lr-1-tNKvWo';\n\n            var defaultBooks = [\n                { id: uid(), title: 'O Alquimista', author: 'Paulo Coelho', status: 'reading', progress: 50 },\n                { id: uid(), title: '1984', author: 'George Orwell', status: 'reading', progress: 70 },\n                { id: uid(), title: 'Clean Code', author: 'Robert Martin', status: 'reading', progress: 40 },\n                { id: uid(), title: 'Dom Casmurro', author: 'Machado de Assis', status: 'wishlist', progress: 0 },\n                { id: uid(), title: 'Sapiens', author: 'Yuval Noah Harari', status: 'wishlist', progress: 0 },\n                { id: uid(), title: 'Atomic Habits', author: 'James Clear', status: 'wishlist', progress: 0 },\n                { id: uid(), title: 'Deep Work', author: 'Cal Newport', status: 'wishlist', progress: 0 }\n            ];\n\n            function loadBooks(){\n                try {\n                    var raw = localStorage.getItem(STORAGE_KEY);\n                    if (raw) return JSON.parse(raw);\n                } catch(e) {}\n                return defaultBooks;\n            }\n\n            function saveBooks(){\n                localStorage.setItem(STORAGE_KEY, JSON.stringify(state.books));\n            }\n\n            function uid(){ return 'b' + Math.random().toString(36).slice(2,9); }\n\n            var state = {\n                books: loadBooks()\n            };\n\n            var els = {\n                readingList: root.querySelector('[data-lr-reading-list]'),\n                wishlistUl: root.querySelector('[data-lr-wishlist-ul]'),\n                inputTitle: root.querySelector('[data-book-title]'),\n                inputAuthor: root.querySelector('[data-book-author]'),\n                inputStatus: root.querySelector('[data-book-status]'),\n                btnAdd: root.querySelector('[data-book-add]'),\n                btnReset: root.querySelector('[data-lr-reset]'),\n                statRead: root.querySelector('[data-stat=\"read\"]'),\n                statReading: root.querySelector('[data-stat=\"reading\"]'),\n                statWishlist: root.querySelector('[data-stat=\"wishlist\"]')\n            };\n\n            function render(){\n                var books = state.books;\n                \n                var countRead = books.filter(function(b){ return b.status === 'read'; }).length + 18; \/\/ Mant\u00e9m a base est\u00e1tica visual + adicionados\n                var countReading = books.filter(function(b){ return b.status === 'reading'; }).length;\n                var countWishlist = books.filter(function(b){ return b.status === 'wishlist'; }).length;\n\n                els.statRead.textContent = countRead;\n                els.statReading.textContent = countReading;\n                els.statWishlist.textContent = countWishlist;\n\n                \/\/ Renderizar Em Leitura\n                var readingItems = books.filter(function(b){ return b.status === 'reading'; });\n                if (!readingItems.length){\n                    els.readingList.innerHTML = '<div style=\"text-align:center; padding:20px; color:#777; font-size:13px;\">Nenhum livro em leitura no momento.<\/div>';\n                } else {\n                    els.readingList.innerHTML = readingItems.map(function(b){\n                        return '' +\n                        '<div class=\"book\" data-id=\"' + b.id + '\">' +\n                            '<div class=\"book-info\">' +\n                                '<strong>' + escapeHtml(b.title) + '<\/strong>' +\n                                '<small>' + escapeHtml(b.author) + '<\/small>' +\n                                '<div class=\"progress\"><div class=\"fill\" style=\"width: ' + (b.progress || 50) + '%;\"><\/div><\/div>' +\n                            '<\/div>' +\n                            '<button class=\"lr-book-delete\" data-del=\"' + b.id + '\">Eliminar<\/button>' +\n                        '<\/div>';\n                    }).join('');\n                }\n\n                \/\/ Renderizar Wishlist\n                var wishlistItems = books.filter(function(b){ return b.status === 'wishlist'; });\n                if (!wishlistItems.length){\n                    els.wishlistUl.innerHTML = '<li style=\"color:#777; font-size:13px;\">Wishlist vazia.<\/li>';\n                } else {\n                    els.wishlistUl.innerHTML = wishlistItems.map(function(b){\n                        return '<li><span>\ud83d\udcd6 ' + escapeHtml(b.title) + ' <small style=\"color:#888;\">(' + escapeHtml(b.author) + ')<\/small><\/span> <button class=\"lr-book-delete\" data-del=\"' + b.id + '\">\u2715<\/button><\/li>';\n                    }).join('');\n                }\n\n                \/\/ Eventos de apagar\n                root.querySelectorAll('[data-del]').forEach(function(btn){\n                    btn.addEventListener('click', function(){\n                        var id = btn.getAttribute('data-del');\n                        state.books = state.books.filter(function(x){ return x.id !== id; });\n                        saveBooks();\n                        render();\n                    });\n                });\n            }\n\n            function addBook(){\n                var title = els.inputTitle.value.trim();\n                var author = els.inputAuthor.value.trim();\n                var status = els.inputStatus.value;\n\n                if (!title) {\n                    alert('Por favor, introduza o t\u00edtulo do livro.');\n                    return;\n                }\n\n                state.books.push({\n                    id: uid(),\n                    title: title,\n                    author: author || 'Desconhecido',\n                    status: status,\n                    progress: status === 'reading' ? 10 : 0\n                });\n\n                els.inputTitle.value = '';\n                els.inputAuthor.value = '';\n                saveBooks();\n                render();\n            }\n\n            function escapeHtml(str){\n                return (str || '').toString().replace(\/[&<>\"']\/g, function(m){\n                    return ({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'})[m];\n                });\n            }\n\n            els.btnAdd.addEventListener('click', addBook);\n            els.inputTitle.addEventListener('keypress', function(e){\n                if (e.key === 'Enter') addBook();\n            });\n\n            els.btnReset.addEventListener('click', function(){\n                if (confirm('Pretende restaurar os livros padr\u00e3o?')) {\n                    state.books = JSON.parse(JSON.stringify(defaultBooks));\n                    saveBooks();\n                    render();\n                }\n            });\n\n            render();\n        })();\n        <\/script>\n                <\/div>\n        <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-2598","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages\/2598","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/comments?post=2598"}],"version-history":[{"count":4,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages\/2598\/revisions"}],"predecessor-version":[{"id":2633,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages\/2598\/revisions\/2633"}],"wp:attachment":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/media?parent=2598"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}