.modal-body flex: 1; background: #eae3d8;
// ======================== // 6. Inicialización completa // ======================== function init() buildDrivePdfList(); // llena sidebar con PDFs desde Drive (IDs) renderPosts(); // muestra los posts del blog con filtro "todos" initFilters(); // activa los filtros por categoría
.drive-note background: #f4efe7; border-radius: 20px; padding: 1rem; font-size: 0.8rem; text-align: center; color: #6b5a48; margin-top: 1rem;
.post-meta display: flex; gap: 1rem; font-size: 0.8rem; color: #7f6e5c; margin-bottom: 1rem; border-bottom: 1px dashed #ece2d6; padding-bottom: 0.6rem; Blog De Libros Pdf Google Drive
.post-title font-size: 1.6rem; font-weight: 700; margin-bottom: 0.75rem; line-height: 1.2;
.post-img width: 100%; height: 200px; object-fit: cover; background: #d9cdb6; display: flex; align-items: center; justify-content: center; font-size: 3rem; color: #6a4e2e;
init();
.post-card:hover transform: translateY(-4px); box-shadow: 0 18px 30px rgba(0,0,0,0.1);
/* sección de posts (entradas del blog) */ .posts-grid display: flex; flex-direction: column; gap: 2rem;
<!-- Sidebar con integración Google Drive PDF --> <aside class="drive-sidebar"> <div class="drive-header"> <i class="fab fa-google-drive"></i> <span>Biblioteca Drive</span> </div> <div class="drive-description"> <i class="fas fa-folder-open"></i> PDFs alojados en Google Drive — acceso directo y vista previa integrada. </div> <ul class="pdf-list" id="drivePdfList"> <!-- Lista de PDFs se genera desde JS (simulando enlace real de Google Drive) --> </ul> <div class="drive-note"> <i class="fas fa-cloud-upload-alt"></i> Todos los libros son de dominio público o con permiso de muestra educativa.<br> <strong>¡Haz clic en cualquier PDF para leerlo sin descargar!</strong> </div> </aside> </div> const pdfIframe = document.getElementById('pdfIframe')
// ======================== // 4. MODAL FUNCIONALIDAD (visor embebido Google Drive) // ======================== const modal = document.getElementById('pdfModal'); const pdfIframe = document.getElementById('pdfIframe'); const closeModalBtn = document.getElementById('closeModalBtn');
/* layout principal: 2 columnas (blog posts + sidebar con drive) */ .main-container max-width: 1400px; margin: 2rem auto; padding: 0 1.5rem; display: grid; grid-template-columns: 1fr 340px; gap: 2rem;
.pdf-item background: #fef9f2; margin-bottom: 0.8rem; border-radius: 60px; transition: all 0.2s; border: 1px solid #f0e7dc; margin: 2rem auto