Files
terminal.css/index.js

79 lines
2.0 KiB
JavaScript
Raw Normal View History

2025-12-09 00:47:23 +07:00
/**
* terminal.css - Terminal CSS Component Library
* JavaScript Utilities
* Version: 3.0.0
*/
/**
* Toggle FAQ item
* @param {HTMLElement} element - The FAQ question element that was clicked
*/
function toggleFaq(element) {
const faqItem = element.parentElement;
const wasActive = faqItem.classList.contains('is-active');
// Close all FAQ items
document.querySelectorAll('.faq-item').forEach(item => {
item.classList.remove('is-active');
});
// Open clicked item if it wasn't active
if (!wasActive) {
faqItem.classList.add('is-active');
}
}
/**
* Show a toast notification
* @param {string} type - Toast type: 'primary', 'success', 'danger', 'warning', 'info'
* @param {string} title - Toast title
* @param {string} message - Toast message
* @param {number} duration - Duration in milliseconds (default: 5000)
*/
function showToast(type, title, message, duration = 5000) {
const container = document.getElementById('toastContainer');
// Create toast element
const toast = document.createElement('div');
toast.className = `toast is-${type}`;
// Icon mapping
const icons = {
primary: '▸',
success: '✓',
danger: '✕',
warning: '⚠',
info: ''
};
toast.innerHTML = `
<div class="toast-icon">${icons[type] || '▸'}</div>
<div class="toast-content">
<div class="toast-title">${title}</div>
<div class="toast-message">${message}</div>
</div>
<button class="toast-close" onclick="dismissToast(this)">×</button>
`;
container.appendChild(toast);
// Auto dismiss after duration
setTimeout(() => {
dismissToast(toast.querySelector('.toast-close'));
}, duration);
}
/**
* Dismiss a toast notification
* @param {HTMLElement} closeButton - The close button element that was clicked
*/
function dismissToast(closeButton) {
const toast = closeButton.closest('.toast');
toast.classList.add('is-dismissing');
// Remove from DOM after animation
setTimeout(() => {
toast.remove();
}, 300);
}