Skeleton

/* Custom Table of Contents (TOC) */ .toc-container { background: #f8f9fa; border-radius: 12px; border: 1px solid #e9ecef; padding: 20px; margin: 25px 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } .toc-title { display: flex; align-items: center; font-weight: 700; font-size: 1.1rem; color: #2d3436; margin-bottom: 12px; } .toc-title svg { margin-right: 10px; color: #0984e3; } .toc-container ul { list-style: none; padding: 0;

Materi Tutorial

• 1. Cara Install Template
• 2. Konfigurasi Widget
• 3. Setting Menu Navigasi

Cara Install Template

Langkah pertama adalah...

Live Preview Download Sekarang

margin: 0; } .toc-container ul li { margin-bottom: 8px; } .toc-container ul li a { color: #636e72; text-decoration: none; font-size: 0.95rem; transition: all 0.2s ease; display: block; padding: 5px 10px; border-radius: 6px; } .toc-container ul li a:hover { background: #0984e3; color: #ffffff; padding-left: 15px; } /* Custom Action Buttons */ .action-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin: 30px 0; } .btn-custom { display: flex; align-items: center; justify-content: center; padding: 12px 20px; border-radius: 8px; font-weight: 600; text-decoration: none; transition: all 0.3s transform; font-size: 0.9rem; } .btn-custom:active { transform: scale(0.95); } .btn-demo { background-color: #2d3436; color: #ffffff !important; } .btn-demo:hover { background-color: #000000; box-shadow: 0 4px 15px rgba(0,0,0,0.1); } .btn-download { background-color: #00b894; color: #ffffff !important; } .btn-download:hover { background-color: #009470; box-shadow: 0 4px 15px rgba(0,184,148,0.2); } /* Responsive Mobile */ @media (max-width: 480px) { .action-buttons { grid-template-columns: 1fr; } }